feat: refine VS Code session UI

This commit is contained in:
Bohdan Triapitsyn
2026-05-28 01:13:03 +03:00
parent 4c7426304f
commit 32ab46c567
4 changed files with 36 additions and 31 deletions
@@ -1010,7 +1010,7 @@ export const SessionSidebar: React.FC<SessionSidebarProps> = ({
});
const sectionsForSidebarRender = React.useMemo(() => {
if (!isVSCode || hasSessionSearchQuery || recentSessionIds.size === 0) {
if (isVSCode || hasSessionSearchQuery || recentSessionIds.size === 0) {
return sectionsForRender;
}
@@ -1355,7 +1355,7 @@ export const SessionSidebar: React.FC<SessionSidebarProps> = ({
],
);
const topContent = showRecentSection && !hasSessionSearchQuery ? (
const topContent = showRecentSection && !isVSCode && !hasSessionSearchQuery ? (
<SidebarActivitySections
sections={activitySections}
renderSessionNode={renderSessionNode}
@@ -1552,7 +1552,7 @@ export const SessionSidebar: React.FC<SessionSidebarProps> = ({
>
<SidebarHeader
hideDirectoryControls={hideDirectoryControls}
mobileVariant={mobileVariant}
showRecentControls={!isVSCode}
handleOpenDirectoryDialog={handleOpenDirectoryDialog}
openNewSessionDraft={handleOpenNewSessionDraftFromHeader}
canOpenMultiRun={projects.length > 0}
@@ -15,7 +15,7 @@ import { useI18n } from '@/lib/i18n';
type Props = {
hideDirectoryControls: boolean;
mobileVariant: boolean;
showRecentControls: boolean;
handleOpenDirectoryDialog: () => void;
openNewSessionDraft: () => void;
canOpenMultiRun: boolean;
@@ -40,7 +40,7 @@ export function SidebarHeader(props: Props): React.ReactNode {
const { t } = useI18n();
const {
hideDirectoryControls,
mobileVariant,
showRecentControls,
handleOpenDirectoryDialog,
openNewSessionDraft,
canOpenMultiRun,
@@ -89,21 +89,19 @@ export function SidebarHeader(props: Props): React.ReactNode {
<TooltipContent side="bottom" sideOffset={4}><p>{t('sessions.sidebar.header.actions.addProject')}</p></TooltipContent>
</Tooltip>
{mobileVariant ? (
<Tooltip>
<TooltipTrigger asChild>
<button
type="button"
onClick={openNewSessionDraft}
className={headerActionButtonClass}
aria-label={t('sessions.sidebar.header.actions.newSession')}
>
<Icon name="chat-new" className={headerActionIconClass} />
</button>
</TooltipTrigger>
<TooltipContent side="bottom" sideOffset={4}><p>{t('sessions.sidebar.header.actions.newSession')}</p></TooltipContent>
</Tooltip>
) : null}
<Tooltip>
<TooltipTrigger asChild>
<button
type="button"
onClick={openNewSessionDraft}
className={headerActionButtonClass}
aria-label={t('sessions.sidebar.header.actions.newSession')}
>
<Icon name="chat-new" className={headerActionIconClass} />
</button>
</TooltipTrigger>
<TooltipContent side="bottom" sideOffset={4}><p>{t('sessions.sidebar.header.actions.newSession')}</p></TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
@@ -202,14 +200,18 @@ export function SidebarHeader(props: Props): React.ReactNode {
<span>{t('sessions.sidebar.header.displayMode.minimal')}</span>
{displayMode === 'minimal' ? <Icon name="check" className="h-4 w-4 text-primary" /> : null}
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem
onClick={toggleRecentSection}
className="flex items-center justify-between"
>
<span>{t('sessions.sidebar.header.displayMode.showRecent')}</span>
{showRecentSection ? <Icon name="check" className="h-4 w-4 text-primary" /> : null}
</DropdownMenuItem>
{showRecentControls ? (
<>
<DropdownMenuSeparator />
<DropdownMenuItem
onClick={toggleRecentSection}
className="flex items-center justify-between"
>
<span>{t('sessions.sidebar.header.displayMode.showRecent')}</span>
{showRecentSection ? <Icon name="check" className="h-4 w-4 text-primary" /> : null}
</DropdownMenuItem>
</>
) : null}
<DropdownMenuSeparator />
<DropdownMenuItem onClick={collapseAllProjects} className="flex items-center gap-2">
<Icon name="contract-up-down" className="h-4 w-4" />