The GUI

Groove ships a full browser-based interface served by the daemon. No Electron, no desktop app — just open your browser.

http://localhost:31415

The GUI connects to the daemon over WebSocket and stays in sync in real-time. Every agent spawn, rotation, approval, and status change appears instantly.

Agent Tree

The main view is a React Flow graph showing every agent as a node connected to the GROOVE root by smooth Bezier spline curves — the visual signature of the product.

• Click any node to select it and open the Agent Panel
• Rounded nodes show agent name, role badge (color-coded), status dot, and live metrics
• Circular ports connect nodes with animated spline edges that flow while agents are running
• Completed agents stay visible until you remove them — same card style, no dimming
• Drag nodes to rearrange the layout

Spawn Panel

Click the Spawn Agent button to open the Spawn Panel:

• Role presets — Backend, Frontend, Fullstack, Planner, Testing, DevOps, Docs
• Provider selector — picks from installed providers (Claude Code, Codex, Gemini CLI, Aider, Ollama)
• Model selector — dynamically updates based on selected provider. Use auto for intelligent routing.
• Permission level — Auto (AI PM reviews risky ops) or Full Send (no reviews, max speed)
• Inline API key entry — set a key for providers that need one, right from the panel

Start with a Planner

Spawn a planner first, describe your project, and it will recommend the full team. A Launch Team button appears when it finishes — one click to spawn all recommended agents with proper roles, scopes, and prompts.

Agent Panel

Selecting an agent opens the detail panel (right sidebar, 45% width) with three tabs:

Chat

Send instructions to a running agent or query it without interrupting its work.

• Instruct — sends a message and rotates the agent with your instruction appended
• Query — prefix with ? for a read-only question that doesn't disrupt the agent's session
• Continue — send a message to a completed agent to resume the conversation with full context
• Launch Team — appears when a planner completes, one-click to spawn the recommended team

Chat renders markdown cleanly — bold, code, headers, lists all display properly.

Stats

Live telemetry for the selected agent:

• Token heartbeat chart (canvas-rendered)
• Activity sparkline showing recent event density
• Burn rate (tokens per minute)
• Context gauge — visual indicator of context window usage

Actions

• Rotate — trigger an immediate context rotation with handoff
• Stop — gracefully stop the agent
• Delete — remove from registry
• Clone — spawn a new agent with the same configuration
• Change model — hot-swap the underlying model (supported providers only)
• Modify prompt — update the agent's system instructions

Command Center

The Stats tab shows a full-screen analytics dashboard:

• Gauge charts — semicircle arcs for Efficiency %, Average Context, Agents, Rotations
• Live telemetry chart — full-width area chart with per-agent token lines over time
• Agent fleet — cards with status dots, role badges, token counts, context gauges
• Savings breakdown — rotation, conflict prevention, cold-start savings
• Model routing — tier distribution with cost-per-tier labels
• Adaptive thresholds — per-provider/role threshold bars with convergence status
• Journalist feed — live AI synthesis summary, cycle count, status

PM Review Log

The Approvals tab shows the full audit trail of AI Project Manager decisions:

• Every review request with the agent that triggered it
• The PM's verdict (approved or rejected) and its reasoning
• Stats: total reviews, approved, rejected, average review time

Works Everywhere

The GUI is a standard web app. It works in Chrome, Firefox, Safari, and Edge on any OS. The layout is responsive — usable on tablets and narrower screens.