feat: wire file explorer to real backend API

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

web/src/components/layout/WorkspaceShell.tsx

@@ -8,23 +8,33 @@ import { TerminalPanel } from "@/components/terminal/TerminalPanel";
 import { FileExplorerPanel } from "@/components/workspace/FileExplorerPanel";
 import { StatusBar } from "@/components/workspace/StatusBar";
 import { WorkspaceSelector } from "@/components/workspace/WorkspaceSelector";
+import { inferLanguage } from "@/lib/api/files";
 import { useWorkspaceUiStore } from "@/lib/store/workspace-ui-store";
-import {
-  findFileByPath,
-  type MockFileNode,
-} from "@/pages/workspace/mock-data";
+import type { MockFileNode } from "@/pages/workspace/mock-data";
 
 interface WorkspaceShellProps {
-  files: MockFileNode[];
+  workspaceId: string;
 }
 
-export function WorkspaceShell({ files }: WorkspaceShellProps) {
+function fileNodeFromPath(path: string): MockFileNode {
+  const name = path.split("/").pop() ?? path;
+  return {
+    name,
+    path,
+    kind: "file",
+    language: inferLanguage(name),
+  };
+}
+
+export function WorkspaceShell({ workspaceId }: WorkspaceShellProps) {
   const activeFilePath = useWorkspaceUiStore((s) => s.activeFilePath);
   const sidebarCollapsed = useWorkspaceUiStore((s) => s.sidebarCollapsed);
   const terminalVisible = useWorkspaceUiStore((s) => s.terminalVisible);
   const toggleSidebar = useWorkspaceUiStore((s) => s.toggleSidebar);
   const toggleTerminal = useWorkspaceUiStore((s) => s.toggleTerminal);
-  const activeFile = findFileByPath(files, activeFilePath);
+  const activeFile = activeFilePath
+    ? fileNodeFromPath(activeFilePath)
+    : undefined;
 
   return (
     <div className="flex h-full w-full flex-col bg-background text-foreground">
@@ -65,7 +75,7 @@ export function WorkspaceShell({ files }: WorkspaceShellProps) {
           {!sidebarCollapsed && (
             <>
               <Panel defaultSize={18} minSize={12} maxSize={30}>
-                <FileExplorerPanel files={files} />
+                <FileExplorerPanel workspaceId={workspaceId} />
               </Panel>
               <PanelResizeHandle className="w-1 bg-border transition-colors hover:bg-accent" />
             </>