- Added process registration and health tracking capabilities in TeamDataService, allowing teams to monitor and manage background processes effectively. - Introduced new CLI commands for registering, unregistering, and listing processes, enhancing the command-line tool's functionality. - Implemented periodic health checks for registered processes, automatically updating their status and notifying the UI of changes. - Enhanced the FileWatcher to emit team change events for process updates, ensuring real-time synchronization with the UI. - Updated the team detail view to display active CLI processes, improving visibility into team operations. - Added documentation for new process management protocols and CLI commands to assist users in managing background processes.
59 lines
2 KiB
TypeScript
59 lines
2 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 { GlobalTaskDetailDialog } from '../team/dialogs/GlobalTaskDetailDialog';
|
|
|
|
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>
|
|
<GlobalTaskDetailDialog />
|
|
<UpdateDialog />
|
|
<WorkspaceIndicator />
|
|
</div>
|
|
);
|
|
};
|