fix(web): show toolbar and status bar when no workspace selected

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
tao.chen
2026-07-03 16:00:58 +08:00
co-authored by Claude
parent 61e5ede650
commit 60524bad0e
2 changed files with 45 additions and 46 deletions
+45 -35
View File
@@ -19,7 +19,7 @@ import {
} from "@/lib/api/process";
interface WorkspaceShellProps {
workspaceId: string;
workspaceId: string | null;
}
export function WorkspaceShell({ workspaceId }: WorkspaceShellProps) {
@@ -75,7 +75,7 @@ export function WorkspaceShell({ workspaceId }: WorkspaceShellProps) {
variant="ghost"
size="sm"
className="h-7 px-2 text-xs"
onClick={() => start.mutate(workspaceId)}
onClick={() => workspaceId && start.mutate(workspaceId)}
disabled={!workspaceId || statusUnknown || isRunning || start.isPending}
>
<Play className="size-4" aria-hidden="true" />
@@ -84,7 +84,7 @@ export function WorkspaceShell({ workspaceId }: WorkspaceShellProps) {
variant="ghost"
size="sm"
className="h-7 px-2 text-xs"
onClick={() => stop.mutate(workspaceId)}
onClick={() => workspaceId && stop.mutate(workspaceId)}
disabled={!workspaceId || statusUnknown || !isRunning || stop.isPending}
>
<Square className="size-4" aria-hidden="true" />
@@ -93,7 +93,7 @@ export function WorkspaceShell({ workspaceId }: WorkspaceShellProps) {
variant="ghost"
size="sm"
className="h-7 px-2 text-xs"
onClick={() => restart.mutate(workspaceId)}
onClick={() => workspaceId && restart.mutate(workspaceId)}
disabled={!workspaceId || statusUnknown || !isRunning || restart.isPending}
>
<RotateCw
@@ -110,39 +110,49 @@ export function WorkspaceShell({ workspaceId }: WorkspaceShellProps) {
</header>
{/* Main layout */}
<div className="flex min-h-0 flex-1">
<PanelGroup direction="horizontal" className="flex-1">
{/* Sidebar */}
{!sidebarCollapsed && (
<>
<Panel defaultSize={18} minSize={12} maxSize={30}>
<FileExplorerPanel workspaceId={workspaceId} />
</Panel>
<PanelResizeHandle className="w-1 bg-border transition-colors hover:bg-accent" />
</>
)}
{workspaceId ? (
<div className="flex min-h-0 flex-1">
<PanelGroup direction="horizontal" className="flex-1">
{/* Sidebar */}
{!sidebarCollapsed && (
<>
<Panel defaultSize={18} minSize={12} maxSize={30}>
<FileExplorerPanel workspaceId={workspaceId} />
</Panel>
<PanelResizeHandle className="w-1 bg-border transition-colors hover:bg-accent" />
</>
)}
{/* Main content area */}
<Panel>
<PanelGroup direction="vertical">
{/* Editor */}
<Panel>
<EditorPanel workspaceId={workspaceId} path={activeFilePath || null} />
</Panel>
{/* Main content area */}
<Panel>
<PanelGroup direction="vertical">
{/* Editor */}
<Panel>
<EditorPanel workspaceId={workspaceId} path={activeFilePath || null} />
</Panel>
{/* Terminal panel */}
{terminalVisible && (
<>
<PanelResizeHandle className="h-1 bg-border transition-colors hover:bg-accent" />
<Panel defaultSize={30} minSize={10} maxSize={70}>
<TerminalPanel workspaceId={workspaceId} />
</Panel>
</>
)}
</PanelGroup>
</Panel>
</PanelGroup>
</div>
{/* Terminal panel */}
{terminalVisible && (
<>
<PanelResizeHandle className="h-1 bg-border transition-colors hover:bg-accent" />
<Panel defaultSize={30} minSize={10} maxSize={70}>
<TerminalPanel workspaceId={workspaceId} />
</Panel>
</>
)}
</PanelGroup>
</Panel>
</PanelGroup>
</div>
) : (
<main className="flex min-h-0 flex-1 items-center justify-center bg-background text-foreground">
<div className="text-center text-sm text-muted-foreground">
<p className="font-medium">No workspace selected</p>
<p className="mt-1">Select or create a workspace to get started.</p>
<p className="mt-1 text-xs">Use the workspace selector in the toolbar to choose one.</p>
</div>
</main>
)}
{/* Status bar */}
<StatusBar activeFilePath={activeFilePath} workspaceId={workspaceId} />
-11
View File
@@ -12,16 +12,5 @@ export function WorkspacePage() {
useWorkspaces();
useFileList(currentWorkspaceId ?? null, ".");
if (!currentWorkspaceId) {
return (
<main className="flex h-full w-full items-center justify-center bg-background text-foreground">
<div className="text-center text-sm text-muted-foreground">
<p className="font-medium">No workspace selected</p>
<p className="mt-1">Select or create a workspace to get started.</p>
</div>
</main>
);
}
return <WorkspaceShell workspaceId={currentWorkspaceId} />;
}