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

Co-Authored-By: Claude <noreply@anthropic.com>

web/src/components/layout/WorkspaceShell.tsx

@@ -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,6 +110,7 @@ export function WorkspaceShell({ workspaceId }: WorkspaceShellProps) {
       </header>
 
       {/* Main layout */}
+      {workspaceId ? (
         <div className="flex min-h-0 flex-1">
           <PanelGroup direction="horizontal" className="flex-1">
             {/* Sidebar */}
@@ -143,6 +144,15 @@ export function WorkspaceShell({ workspaceId }: WorkspaceShellProps) {
             </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} />

web/src/pages/workspace/WorkspacePage.tsx

@@ -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} />;
 }