Command Center
The Command Center is the IDE-like workspace for each project. It brings together the chat interface, file browser, terminal, preview, and git tools in a single view.
Layout#
The Command Center uses a multi-panel layout:
| Panel | Position | Content |
|---|---|---|
| Left sidebar | Left | Tabbed navigation: Files, History, Search, Services |
| Center | Center | Active execution chat view |
| Right panel | Right | Preview iframe, file viewer |
| Bottom panel | Bottom | Server logs from preview container |
Left Sidebar Tabs#
Files#
Tree view of the project workspace directory. Browse, open, and view files. See File Browser for details.
History#
List of past executions for this project, ordered by most recent. Click any execution to view its full conversation and tool calls.
Search#
Search across project files and execution history. Quickly find files, code patterns, or past conversations.
Services#
Manage provisioned services (PostgreSQL, Redis) for this project. View service status, credentials, and health. See Project Services.
Center Panel#
The execution chat interface showing:
- Prompt input — Type instructions for the agent at the bottom
- Message stream — Real-time display of agent responses, tool calls, and diffs
- Turn dividers — Visual separation between user messages and agent responses
- Progress stepper — Shows execution state (Queued, Running, Completed/Failed)
- Cost tracking — Token counts and USD cost estimates per turn
See Executions for full details on the execution lifecycle.
Right Panel#
Preview#
Live preview of the project running in a Docker container. Start, stop, and share previews. See Preview.
File View#
Click any file in the Files tab or from a tool call in the execution to view its contents in the right panel with syntax highlighting.
Bottom Panel#
Streams stdout and stderr from the preview container in real-time via WebSocket. Useful for debugging build errors, watching server logs, and monitoring application output.
Real-Time Updates#
The Command Center maintains several WebSocket connections:
- Execution WebSocket — Streams agent messages and status updates
- Project WebSocket — Watches for git status and file changes
- Preview Logs WebSocket — Streams container output
- Presence WebSocket — Shows which team members are viewing the same project
A connection status banner indicates if the WebSocket connection is active.