Brings in upstream changes: - Session analysis reports (overview, cost, tokens, tools, git, quality) - Unified cost calculation with LiteLLM pricing data - Custom title bar for Linux with native toggle - Auto-expand AI response groups setting - MoreMenu toolbar component - Various fixes (window drag, Ctrl+R, notification guard) All merge conflicts resolved preserving both fork features (team management, agent language, fullscreen, diff view) and upstream additions.
57 lines
1.9 KiB
TypeScript
57 lines
1.9 KiB
TypeScript
/**
|
|
* TabbedLayout - Main layout with project-centric sidebar and multi-pane tabbed content.
|
|
*
|
|
* Layout structure:
|
|
* - Sidebar (280px): Project dropdown + date-grouped sessions
|
|
* - Main content: PaneContainer with one or more panes, each with TabBar + content
|
|
*/
|
|
|
|
import { isElectronMode } from '@renderer/api';
|
|
import { getTrafficLightPaddingForZoom } from '@renderer/constants/layout';
|
|
import { useFullScreen } from '@renderer/hooks/useFullScreen';
|
|
import { useKeyboardShortcuts } from '@renderer/hooks/useKeyboardShortcuts';
|
|
import { useZoomFactor } from '@renderer/hooks/useZoomFactor';
|
|
|
|
import { UpdateBanner } from '../common/UpdateBanner';
|
|
import { UpdateDialog } from '../common/UpdateDialog';
|
|
import { WorkspaceIndicator } from '../common/WorkspaceIndicator';
|
|
import { CommandPalette } from '../search/CommandPalette';
|
|
|
|
import { CustomTitleBar } from './CustomTitleBar';
|
|
import { PaneContainer } from './PaneContainer';
|
|
import { Sidebar } from './Sidebar';
|
|
|
|
export const TabbedLayout = (): React.JSX.Element => {
|
|
useKeyboardShortcuts();
|
|
const zoomFactor = useZoomFactor();
|
|
const isFullScreen = useFullScreen();
|
|
const trafficLightPadding = !isElectronMode()
|
|
? 0
|
|
: isFullScreen
|
|
? 8
|
|
: getTrafficLightPaddingForZoom(zoomFactor);
|
|
|
|
return (
|
|
<div
|
|
className="flex h-screen flex-col bg-claude-dark-bg text-claude-dark-text"
|
|
style={
|
|
{ '--macos-traffic-light-padding-left': `${trafficLightPadding}px` } as React.CSSProperties
|
|
}
|
|
>
|
|
<CustomTitleBar />
|
|
<UpdateBanner />
|
|
<div className="flex flex-1 overflow-hidden">
|
|
{/* Command Palette (Cmd+K) */}
|
|
<CommandPalette />
|
|
|
|
{/* Sidebar - Project dropdown + Sessions (280px) */}
|
|
<Sidebar />
|
|
|
|
{/* Multi-pane content area */}
|
|
<PaneContainer />
|
|
</div>
|
|
<UpdateDialog />
|
|
<WorkspaceIndicator />
|
|
</div>
|
|
);
|
|
};
|