merge: land desktop tab bar height tuning

Bring the focused titlebar-density fix from the Codex worktree into local main. The patch only adjusts the desktop tab strip height baseline and its regression test, leaving existing local workspace edits untouched.

Constraint: Local main has unrelated uncommitted desktop settings/workspace edits that must be preserved
Rejected: Broad staging before merge | would mix unrelated local work into this landing
Confidence: high
Scope-risk: narrow
Directive: Keep this merge limited to the tab bar height patch; do not treat unrelated dirty files as part of this change
Tested: cd desktop && bunx vitest run src/components/layout/TabBar.test.tsx
Tested: bun run check:desktop
Not-tested: Push or PR creation; user asked for local main merge only
This commit is contained in:
程序员阿江(Relakkes) 2026-05-14 23:04:32 +08:00
commit 9ddaf29b4e
2 changed files with 33 additions and 5 deletions

View File

@ -256,6 +256,34 @@ describe('TabBar', () => {
expect(screen.getByTestId('tab-bar-drag-gutter')).toHaveAttribute('data-tauri-drag-region')
})
it('keeps the desktop tab strip at a roomier titlebar height', async () => {
const { TabBar } = await import('./TabBar')
const { useTabStore } = await import('../../stores/tabStore')
const { useChatStore } = await import('../../stores/chatStore')
useTabStore.setState({
tabs: [
{ sessionId: 'tab-1', title: 'Untitled Session', type: 'session', status: 'idle' },
],
activeTabId: 'tab-1',
})
useChatStore.setState({
sessions: {},
disconnectSession: vi.fn(),
} as Partial<ReturnType<typeof useChatStore.getState>>)
await act(async () => {
render(<TabBar />)
})
const tabBar = screen.getByTestId('tab-bar')
const tab = screen.getByText('Untitled Session').closest('.tab-bar-hit-area')
expect(tabBar).toHaveClass('min-h-11')
expect(tab).toHaveClass('min-h-11')
expect(screen.getByTestId('tab-bar-drag-gutter')).toHaveClass('min-h-11')
})
it('passes the active session workdir into the open-project control', async () => {
const { TabBar } = await import('./TabBar')
const { useTabStore } = await import('../../stores/tabStore')

View File

@ -294,11 +294,11 @@ export function TabBar() {
return (
<div
data-testid="tab-bar"
className="flex items-stretch bg-[var(--color-surface-container)] min-h-[37px] select-none border-b border-[var(--color-border)]"
className="flex min-h-11 items-stretch bg-[var(--color-surface-container)] select-none border-b border-[var(--color-border)]"
>
{canScrollLeft && (
<button onClick={() => scroll('left')} className="flex-shrink-0 w-7 h-[37px] flex items-center justify-center text-[var(--color-text-tertiary)] hover:text-[var(--color-text-primary)] hover:bg-[var(--color-surface-hover)]">
<button onClick={() => scroll('left')} className="flex h-11 w-7 flex-shrink-0 items-center justify-center text-[var(--color-text-tertiary)] hover:bg-[var(--color-surface-hover)] hover:text-[var(--color-text-primary)]">
<span className="material-symbols-outlined text-[16px]">chevron_left</span>
</button>
)}
@ -357,12 +357,12 @@ export function TabBar() {
data-testid="tab-bar-drag-gutter"
data-tauri-drag-region
aria-hidden="true"
className={`flex-shrink-0 min-h-[37px] ${showWindowControls ? 'w-3' : 'w-4'}`}
className={`min-h-11 flex-shrink-0 ${showWindowControls ? 'w-3' : 'w-4'}`}
/>
)}
{canScrollRight && (
<button onClick={() => scroll('right')} className="flex-shrink-0 w-7 h-[37px] flex items-center justify-center text-[var(--color-text-tertiary)] hover:text-[var(--color-text-primary)] hover:bg-[var(--color-surface-hover)]">
<button onClick={() => scroll('right')} className="flex h-11 w-7 flex-shrink-0 items-center justify-center text-[var(--color-text-tertiary)] hover:bg-[var(--color-surface-hover)] hover:text-[var(--color-text-primary)]">
<span className="material-symbols-outlined text-[16px]">chevron_right</span>
</button>
)}
@ -466,7 +466,7 @@ const TabItem = forwardRef<HTMLDivElement, {
onMouseDown={onMouseDown}
onContextMenu={onContextMenu}
className={`
tab-bar-hit-area group flex-shrink-0 flex items-center gap-1.5 px-3 min-h-[37px] relative
tab-bar-hit-area group relative flex min-h-11 flex-shrink-0 items-center gap-1.5 px-3
${isDragging ? 'z-20 cursor-grabbing' : 'cursor-grab'}
transition-[background-color,box-shadow,opacity,transform] duration-150 ease-out
${isActive