// vscode extension in daily use

Fulltrace Dashboard

Watch and run all of Fulltrace from inside the editor

The window onto Fulltrace, built into my code editor: a VSCode extension that shows everything the system is doing without leaving it. A sidebar tree gives status at a glance; a seven-tab panel goes deeper, headlined by Studio. I pick a job, see the price before it runs, approve the spend, and watch it work live through to the finished report.

07 dashboard tabs 07 studio views 03 clients tracked 0 runtime dependencies
the_tour [01]

The Dashboard, Toured

Five tours of the dashboard, walked live and played end to end: the sidebar rail, the seven tabs, a workflow taken from the catalogue through to what it cost, a finished run opened up to its per-stage verdicts, and the findings report where a fix is either offered or refused. Hover to hold a step, or drive with the dots.


Demos
The Fulltrace sidebar, toured in five steps. One, STATUS: gateway health, uptime, memory and process controls. Two, Open Dashboard opens the workspace and fills the main area with the workflow catalogue. Three, USAGE: Claude, Codex and OpenRouter budget windows with reset timers. Four, TOOL USE: session and all-time counters and a per-model token breakdown. Five, MCP SERVER: Context, Commands, Memory and Hooks as live resource trees.
1 · Runtime health The status rail: online state and uptime, memory, restarts and uptime percentage, with start, restart and stop. Open Dashboard opens the workspace.
2 · Open the workspace Open Dashboard launches the full panel: Studio and its five views, live and ready to drive. The main area fills in with the workflow catalogue.
3 · Budget windows Live usage against every limit at once: Claude's 5h and 7d windows, Codex's 30d window, and the OpenRouter credit balance, each with its reset time. A run is never launched into an exhausted quota.
4 · Session telemetry Session and all-time counters (requests, context reads, commands, tokens), plus a per-model token breakdown, so spend is attributable model by model.
5 · MCP surface The extension's own MCP server, exposing Context, Commands, Memory and Hooks as live resource trees the assistants read from and write to.
  1. 1Runtime health. Online state, uptime, memory and restarts, with start, restart and stop controls.
  2. 2Open the workspace. Open Dashboard opens the full panel and fills the main area with the workflow catalogue.
  3. 3Budget windows. Live usage against Claude's 5h and 7d windows, Codex's 30d window, and OpenRouter credits, each with its reset timer.
  4. 4Session telemetry. Session and all-time counters, plus a per-model token breakdown for attributable spend.
  5. 5MCP surface. The extension's own MCP server: Context, Commands, Memory and Hooks as live resource trees.
studio [02]

One Hub for the Whole Run Lifecycle

Studio consolidates workflows, runs, signals, projects, audits, models, and agents into one screen organised around the life of a run. I choose the work, check the price, confirm the spend, and watch it happen live through to the result, without touching a terminal. Watching is always read-only; anything that acts, launching a run, editing a workflow's saved default models, warming or evicting a local model, running or removing a sub-agent, recording a disposition against a finding, is a deliberate, confirmed press, and every one of those acts is ledgered.

flowchart LR
    D["Discover
workflow catalogue"] --> C["Configure
choose options
and targets"] C --> E["Estimate
cost priced from
run history"] E --> L["Launch
explicit spend
confirmation"] L --> O["Observe
live runs +
graph view"] O --> U["Understand
results and
findings"] %% Blueprint tokens as literal hex (Mermaid cannot parse CSS vars or color-mix) classDef step fill:#62d99a1f,stroke:#62d99a,stroke-width:1.5px; classDef spend fill:#e0be621f,stroke:#e0be62,stroke-width:1.5px; class D,C,E,O,U step; class L spend;
Live without a reload

The screen updates itself every 4 seconds while a job runs, advancing node statuses and moving finished runs from Active to Completed. An idle tick never redraws the page or closes something I have open.

Outcomes, not just statuses

Graph nodes badge whether their newest stage was approved or rejected, not just whether it ran. Finished runs carry their cost, tokens, and models, and by-model donut charts break spend down per model for a workflow or a single run.

Drill through to the evidence

Clicking any fan-out node opens its detail: the findings report it produced, a clear passed-or-failed verdict, the models and tokens each stage used, and a jump straight into the Audits view with that target already selected.

Projects, read-only by design

The newest pill draws one card per product with its code targets underneath, derived fresh on every read from the committed registries and the run history. Readiness is a counted checklist (present, absent, or not applicable), never a score, and the only button is Refresh: changing a project stays a hand-reviewed git edit.

Enrolment that only proposes

Enrol a project starts from a repository folder and an AI tool of my choice. The runner composes a fenced interview prompt and hands it to that tool on my own account, so Fulltrace spends nothing and writes nothing. What comes back is a proposal: the registry entry still lands as a reviewed edit plus a restart.

Signals, descriptive only

The Signals pill mines the run ledgers into per-workflow signal: verifier verdicts, decision rates, what the evidence actually supports. Deterministic and display-only, with no model anywhere in it. Every number states its denominator and whose opinion it aggregates, my code decisions are never blended with my website rejections, and a store that has never been written says so instead of borrowing "not built yet". It informs what I pick next; it changes nothing on its own.

apply [03]

Approving a Fix, Without Trusting It

The audit does not just find problems, it offers to fix them, and this is the one place in Fulltrace where an AI can actually change my code. So it is the part I was most careful with. The flow is four steps: review, dry-run, approve, apply, and what makes it safe is what sits between them. I see the exact change first, the project's own build has to accept it before I am even asked, and what I approve is that one specific change, not a standing permission.


architecture [04]

Single Poller, Two Surfaces

One StatusPoller polls the gateway's GET /status every 4 seconds and scans the filesystem for skills, commands, memory files, and agents. The sidebar and the full panel both read from that same poller, so the two surfaces never drift out of sync with each other.

Sidebar TreeView

Always visible in the VSCode activity bar. Shows server status, uptime, last memory sync time, and the portfolio file list, and opens any portfolio file straight into the editor. No interaction needed to keep it current: the poller drives updates automatically.

WebviewPanel

Opens on demand from the activity bar or command palette into the full seven-tab interface. It is a passive consumer of the same poller state, so opening it triggers no extra requests. The layout fills the editor window and scrolls within the active tab only; the status card and tab nav stay fixed.

status_poller_scanwhat one poller reads, every 4s
StatusPoller (4s interval)
├── polls GET /status ──▶ server metrics, token counts, logs
├── scans ~/.claude/commands/ ──▶ skills list
├── scans ~/.claude/projects/*/memory/ ──▶ memory entries
├── scans ~/.codex/memories/ ──▶ Codex memory entries
└── scans ~/.claude/agents/ ──▶ agents list
├── DashboardTreeProvider (sidebar) ── always visible
└── DashboardPanel (webview) ── on demand
technical [05]

Implementation Notes

01
Zero runtime dependencies

The extension runs on only the VSCode extension API, Node's own built-ins (http, child_process, fs), and the TypeScript compiler at dev time only. No npm packages ship at runtime, no bundler: just a VSIX installed via code.cmd --install-extension.

02
Theme-aware, colour-coded UI

Every colour is a var(--vscode-*) theme token, not a hardcoded hex value, so the webview matches whatever theme the editor is in automatically, and a nonce-based CSP keeps it from running injected script. Each AI client also gets its own distinct, consistent colour across every tab and badge, so a client is recognisable at a glance.

configuration [06]

Settings

Every part of the connection is configurable under agentOsDashboard.* in VSCode settings: which host and port the gateway listens on, how often it polls, and which pm2 process the Start/Stop/Restart controls drive. Those controls call pm2 with no shell and a process-name allowlist regex, so the configured name can never break out into an arbitrary command.

dashboard_settingsevery agentOsDashboard.* key
Server connection
host: MCP server host (default: 127.0.0.1)
port: MCP server port (default: 3000)
statusPath: status endpoint path (default: /status)
pollInterval: poll frequency in ms (default: 4000)
pm2 integration
pm2ProcessName: pm2 process to control (default: agentOS-portfolio)
Start/Stop/Restart buttons in the Status tab drive pm2 via child_process.spawn with no shell, plus a process-name allowlist regex, so the configured name cannot break out into arbitrary commands