tao.chen
7b40b23d33
Frontend wiring for the new multi-shell backend. The bottom panel's
Terminal tab now has a tab strip: one tab per shell (showing
shellId[:8] + an X to close), plus a + button to spawn a new shell.
Tab state lives in workspace-ui-store (shellsByWorkspace +
activeShellIdByWorkspace). Auto-start creates the first shell if the
list is empty.
- web/src/lib/api/process.ts:
- useShellStart returns ShellInfo on 201
- useShellStop / useShellRestart take {shellId}
- useShellStatus(workspaceId, shellId) requires both
- useShellWebSocket(workspaceId, shellId, enabled) refactored:
shellId change closes the current socket intentionally and opens
a new one with ?shellId= appended
- useShellResize takes {shellId, cols, rows}
- new useShellList(workspaceId)
- web/src/lib/store/workspace-ui-store.ts: shellsByWorkspace +
activeShellIdByWorkspace maps + setters (addShellToWorkspace,
removeShellFromWorkspace, setActiveShell, setShellsForWorkspace)
- web/src/components/terminal/TerminalPanel.tsx: requires shellId
prop; clears/resets terminal on shellId change (in addition to
workspaceId); welcome banner shows
'[connected to <workspaceId>/<shortShellId>]'
- web/src/components/layout/WorkspaceShell.tsx: new TerminalTabs
component:
- lists shells as tabs, + to add, x to close
- useShellList hydrates the store on mount
- auto-start guard via useRef so we don't double-fire
- close-pending tracked per shellId via Set
- renders the active <TerminalPanel workspaceId shellId>
Diff: 4 files. pnpm lint + pnpm build clean.
Conversation: B975103F-4528-493E-8F8A-91D20506631D
codespace-web
Frontend IDE shell for the codespace Go backend.
Scope
This package is the codespace web IDE. It connects to the Go backend:
the file explorer and editor call the file APIs, the toolbar drives the
process start/stop/restart endpoints, and the terminal streams the
running OpenCode process over the WebSocket endpoint
/api/workspaces/:id/process/ws.
Commands
| Command | Purpose |
|---|---|
pnpm install |
Install dependencies |
pnpm dev |
Start the Vite dev server (proxies /api and /healthz to http://localhost:8080) |
pnpm lint |
Run ESLint |
pnpm build |
Type-check and build for production |
Stack
- Vite + React 19 + TypeScript
- Tailwind CSS v4
- react-router v7
- Zustand for local UI state
- TanStack Query for API state
@monaco-editor/reacteditor wrapper@xterm/xterm+@xterm/addon-fitterminal wrapperreact-resizable-panelsfor layout splitslucide-reactfor icons
Non-goals
- Authentication
- i18n
- Tests (no test framework until business logic is added)