Real-time control plane for Claude Code.
A local-first dashboard that tracks every Claude Code session, agent, and tool call as it happens - and now spawns new ones for you. Sessions, kanban, analytics, workflows, MCP, plugin marketplace, and a 12-tab Config Explorer for everything Claude Code knows about.
Why local-first?
Your Claude Code data stays where it belongs - on your machine. No accounts to sign up for, no cloud service to trust, no telemetry quietly leaking back. Just a fast dashboard that watches what's already happening on your laptop.
Zero telemetry
No accounts, no analytics, no third-party calls. The MCP server binds to localhost. Web Push needs your explicit opt-in. What you do here stays here.
Instant feedback
Hooks fire to the local server in milliseconds. WebSocket push updates the UI before you've taken your finger off the keyboard. No polling, no spinners.
Yours forever
Everything's a SQLite file in ~/.dashboard/ and JSONL transcripts in
~/.claude/. Backup with cp, sync with whatever you already
use, take it offline.
Hooks-native
Built around Claude Code's own hook system. The dashboard never wraps, proxies, or monkey-patches your CLI. Your normal workflow continues even if the dashboard is down - hooks always exit zero.
Everything you need, on your machine.
Hooks-driven session capture, deep analytics, in-browser Claude spawning, full configuration inspector, and a typed local MCP server with 25 tools.
Real-time dashboard
Six-tile overview, live agent cards with collapsible subagent hierarchy, recent activity feed, and a composite Health tab - all updated via WebSocket push, no polling.
Run Claude in-browser
Spawn claude subprocesses with a chat-style streaming UI. Conversation
or one-shot mode. Resume any past session in one click. Slash + @-file
autocomplete, live token meter, thinking-effort dial, and model picker.
Claude Config Explorer
12 tabs covering skills, subagents, slash commands, output styles, plugins, marketplaces, MCP servers, hooks, settings, memory, keybindings, statusline. Edit text-file artifacts with timestamped backups.
Workflows visualization
D3-powered orchestration DAG, tool execution Sankey, collaboration network, error propagation map, concurrency timeline, complexity scatter, compaction impact - 11 datasets with rich i18n tooltips.
Rules-based alerts
Server-side alerting on the live event stream - error bursts, stuck agents, idle sessions, and token thresholds - with per-(rule, session, agent) cooldown dedup. Fired alerts surface in a live feed with acknowledge / acknowledge-all and link back to the session that triggered them.
Universal webhooks
Fan fired alerts out to 14 first-class providers - Slack, Discord, Teams, Google Chat, Mattermost, Rocket.Chat, Telegram, PagerDuty, Opsgenie, Splunk On-Call, Zapier, Make, n8n, Pipedream - plus any generic endpoint. Per-platform payloads, optional HMAC-SHA256 signing, a one-click test probe, and a recorded delivery log.
Cost & token tracking
Per-model cost estimation with configurable pricing rules, compaction-aware token accounting that preserves totals across context compressions, and a memory-bounded LRU JSONL extractor whose per-entry arrays are tail-capped so a multi-day session cannot leak the cache.
Local MCP server
25 typed tools across 6 domains. Three transport modes (stdio, HTTP+SSE, interactive REPL). Strict input schemas, retry/backoff, localhost-only API enforcement, and tiered safety gates.
Hooks-driven capture
Auto-installs into ~/.claude/settings.json. SessionStart, PreToolUse,
PostToolUse, Stop, SubagentStop, Notification - every event lands in SQLite within
milliseconds.
Plugin marketplace
Official plugin marketplace with 5 plugins: ccam-analytics, ccam-productivity, ccam-devtools, ccam-insights, ccam-dashboard. 18 skills, 4 agents, 3 CLI tools, 2 hook configs.
Multi-language UI
English, Chinese, and Vietnamese - coverage extends end-to-end through every chart tooltip, Settings flow, Workflow narrative, Config Explorer tab, and Run page.
Kanban board
Agents and sessions in toggleable views. Working / Waiting / Completed / Error / Abandoned columns with card cost, model, and current tool at a glance. WebSocket-scoped updates avoid unnecessary refetches.
Swagger API docs
Full OpenAPI 3.0 spec with interactive Swagger UI. Try-it-out controls for every endpoint, request/response schemas, and collapsible endpoint groups - all served locally alongside the dashboard.
VS Code extension
Full dashboard sidebar inside VS Code. Monitor active sessions, view agents, and track tool calls without leaving your editor. Ships as a VSIX with zero external dependencies.
Desktop app (macOS & Windows)
The whole dashboard as a native desktop app - a macOS .app and a Windows
.exe, built with Electron 35. It embeds the Express server in-process,
lives in the menu-bar / notification-area (tray) with a live status snapshot dropdown,
auto-starts at login, and installs Claude Code hooks on first boot - zero-setup
monitoring. Runs alongside npm run dev with hooks fanning out to both
dashboards in parallel.
Live activity feed
A real-time streaming event log with pause/resume buffering, multi-dimension filters, color-coded entries by event type, expandable hook payloads, and per-row session navigation. WebSocket-scoped updates so off-screen events never cost a refetch.
History import & backfill
Rescan ~/.claude/projects/, point at any directory, or drag-drop a
.tar.gz archive of transcripts. Imports are idempotent
— per-event-type high-water marks dedupe re-runs — with WebSocket progress, archive
extraction limits, and full subagent JSONL parsing.
Cross-surface notifications
Configurable per event type (new session, error, completion, subagent spawn). The web dashboard uses Web Push (VAPID); the macOS app fires native macOS toasts directly from the embedded server, side-stepping Web Push (which has no FCM credentials inside Electron). Both surfaces stay live when running together.
Tabby, your companion
A cute SVG cat pinned to the corner of every page who reacts to the
live session stream with 8 moods, cursor-tracking eyes, and playful
quips on notable events. Open her panel with a click or ⌘B
for live status, quick actions, and an Ask box that answers status
questions or spawns a real Claude session — no backend or API key.
Keyboard-friendly, honors reduced motion, and toggleable in Settings.
Conversation replay
Full transcript replay for any session - user prompts, assistant turns, tool calls, and thinking blocks rendered inline with syntax highlighting. Step through the session timeline and expand any event to inspect its raw hook payload.
One-click self-update
Checks the upstream git remote for new releases, then updates in place - pull, reinstall, rebuild, and restart from a single action. Both the dev server and the desktop app surface an update badge the moment you fall behind.
Local-first & private
Everything runs on your machine: SQLite on disk, localhost-only APIs, and zero telemetry. No account, no cloud, no data leaves your laptop - your Claude Code history stays entirely yours.
See it for yourself.
Every page of the dashboard, from real-time monitoring to config editing, API docs, and even the VS Code extension. Click any screenshot to expand.
How the data flows.
A tight pipeline from CLI hooks to your browser. Everything's local - SQLite, your home dir, your machine. No accounts, no cloud, zero telemetry.
Claude Code fires a hook
Auto-installed entries in ~/.claude/settings.json trigger
scripts/hook-handler.js on every SessionStart, PreToolUse, PostToolUse,
Stop, SubagentStop, and Notification.
Hook handler POSTs
Stdin payload is parsed and POSTed to http://127.0.0.1:4820/api/hooks/event.
Always exits zero - Claude Code never blocks on the dashboard being unreachable.
Server ingests & persists
Single SQLite transaction per event. Auto-creates sessions and agents. Extracts token usage, tool calls, compactions, API errors, and turn durations from JSONL transcripts via a stat-cached reader.
WebSocket push
session_*, agent_*, and new_event frames stream
to every connected client. The React UI updates without polling. New
run_stream / run_status frames power the Run page.
Who actually uses this.
Originally a tool for one person to keep track of one developer's Claude Code use. Turned out it's useful for anyone who ships AI-assisted code - solo or in a team.
Watch what your CLI is doing
See every session, every tool call, every token spent - in real time. Cost tracking, compaction-aware accounting, kanban view of in-flight work.
Monitor team-wide CC usage
Deploy to Kubernetes with Helm, point hook handlers at the central instance, get Prometheus metrics + Grafana dashboards. Aggregate cost by project / model / user.
Inspect & debug your plugin
Config Explorer shows exactly what your plugin contributes, how its hooks fire, and how its skills/agents are structured. Marketplace tab walks you through publishing.
Run Claude from the browser
Spawn one-shot or multi-turn sessions, resume any past conversation, manage runs
from a single page. Slash + @-file autocomplete, live token meter, effort
dial, model picker, and permission mode all per-spawn.
Optimize your AI spend
Per-model pricing rules, daily / weekly / monthly cost trends, token-by-token analytics, compaction baselines so you know exactly what each session costs - even after a long thread compresses.
Study agentic workflows
D3 orchestration DAG, Sankey of tool transitions, collaboration network of subagent calls, error-propagation map - the workflow page is purpose-built for understanding how multi-agent CC sessions actually behave.
Keep the squad aligned
See who's running what, which sessions are active across the team, and how many tokens each project consumes. Kanban board and activity feed keep standups honest.
Monitor without leaving the editor
Use the VS Code extension sidebar to watch sessions and tool calls while you code. No browser tab needed - everything docks into VS Code as a side panel.
Up and running in 60 seconds.
Local-first by design. Clone, install, run - your Claude Code sessions start showing
up immediately because the dashboard auto-installs its hooks into your existing
~/.claude/settings.json.
Run it from your browser.
Four commands.
No accounts, no cloud, no telemetry. Everything stays on your machine. Existing
sessions in ~/.claude/projects import on first start.
# Clone & install $git clone https://github.com/hoangsonww/Claude-Code-Agent-Monitor $cd Claude-Code-Agent-Monitor $npm run setup # Install the hooks $npm run install-hooks # Start the dashboard (server + Vite) $npm run dev # Then open →http://localhost:4820
Install it once, forget the terminal.
Prefer not to keep a terminal open? The dashboard also ships as a native desktop app -
a macOS .app and a Windows .exe - an Electron 35 shell that
embeds the same Express server in-process and renders the built React client in a
native window. Same dashboard, native OS lifecycle (macOS & Windows) on top.
Native, tray-first
A menu-bar / notification-area (tray) icon with a single-click dropdown showing a live status snapshot (sessions, agents, events today), a native application menu, single-instance lock, and window-close-hides-but-server-keeps-running. ⌘Q / Ctrl+Q opens a confirmation dialog (press it again to skip it). macOS shows a tinted template glyph in the menu bar; Windows uses a colored icon in the notification area.
Auto-start at login
Toggle Open at Login from the tray menu. On macOS it registers through the
native SMAppService API (visible under System Settings → General
→ Login Items); on Windows it writes a per-user
HKCU\…\Run entry (visible under Task Manager → Startup) - so
the dashboard is always running when you sit down.
Zero-setup, durable data
On first boot the app installs Claude Code hooks and starts background services
automatically - an install-only user gets monitoring with essentially no manual
setup. Your SQLite database lives in a per-user data dir outside the app
bundle, so it survives reinstalls and updates. The app also recovers your login-shell
PATH at startup, so Run Claude can find and launch the
claude CLI.
Coexists with the web dashboard
Run the desktop app and npm run dev at the same time and both stay
real-time. Every running dashboard appends its {port, pid, startedAt}
entry to ~/.claude/.agent-dashboard.json on startup; the hook handler
fans each hook out to every live entry in parallel, so both UIs receive the same
events and both their SQLite stores stay in sync. Stale entries self-evict via a
PID liveness check on read.
From download to running in under a minute.
The builds are unsigned / ad-hoc signed by default, so the first launch trips one OS warning - macOS Gatekeeper ("Apple could not verify…") or Windows SmartScreen ("Windows protected your PC"). Clear it once and everything after that is normal native OS lifecycle.
Download the right asset
Open the latest
release. macOS: grab
ClaudeCodeMonitor-<version>-arm64.dmg for Apple Silicon (M1 / M2 /
M3 / M4) or -x64.dmg for Intel Macs (Apple menu → About This
Mac - anything labelled "Apple" silicon is arm64).
Windows: grab
ClaudeCodeMonitor-Setup-<version>-x64.exe (NSIS installer) or
ClaudeCodeMonitor-<version>-x64-portable.exe (no-install portable).
Install or run it
macOS: double-click the DMG to mount it, then drag
Claude Code Monitor.app onto the Applications shortcut
beside it and eject the DMG once the copy is done. Windows: run the
*-Setup-*.exe - it installs per-user (no administrator
elevation) and adds Start-menu / desktop shortcuts - or just run the
*-portable.exe to launch without installing.
Clear the first-launch warning
macOS: the build is ad-hoc signed (not notarized), so Gatekeeper
shows "Apple could not verify…" - clear the quarantine once in Terminal with
xattr -cr "/Applications/Claude Code Monitor.app" (or
System Settings → Privacy & Security → Open Anyway).
Windows: the build is unsigned, so SmartScreen may show
"Windows protected your PC" - click More info → Run anyway.
One-time step per install.
Launch & toggle auto-start
Open Claude Code Monitor (Applications / Spotlight on macOS, the
Start menu / desktop shortcut on Windows). The tray icon appears within a second;
click it → Open at Login and the app will start at every login from now
on - managed through System Settings → General → Login Items on
macOS, or a per-user HKCU\…\Run entry (Task Manager →
Startup) on Windows.
Get it in two ways.
Download a pre-built installer - no build required. Hit the
button below to land on the latest GitHub Release. macOS:
grab the matching arch DMG -
ClaudeCodeMonitor-<version>-arm64.dmg for Apple Silicon
or -x64.dmg for Intel - and drag the app into
/Applications. Windows: grab
ClaudeCodeMonitor-Setup-<version>-x64.exe (NSIS installer) or
ClaudeCodeMonitor-<version>-x64-portable.exe (no-install) and run
it. The link always redirects to the current release because CI publishes a new
vX.Y.Z automatically every time the version in
package.json is bumped on master, attaching both
the macOS DMGs and the Windows .exes. Releases are public - no GitHub
sign-in required.
Want a per-commit build from CI instead of waiting for a
release? The 🍎 macOS Desktop (DMG) job uploads a
ClaudeCodeMonitor-dmg artifact and the 🪟 Windows Desktop
(EXE) job uploads a ClaudeCodeMonitor-win artifact on every
green run - useful for testing master before it's tagged. Or
build it yourself on the host OS: a single-arch macOS build
(desktop:dmg:arm64 or desktop:dmg:x64) finishes
in about a minute, while desktop:dmg produces both DMGs in
one go; on Windows, desktop:win builds the installer and
desktop:win:portable the portable .exe. Each macOS DMG is
roughly 125 MB, about 250 MB installed.
# Build the desktop app locally (run on the host OS) $npm run setup $npm run build # desktop:install preflights the native better-sqlite3 build and, on # failure, prints copy-pasteable setup help (incl. a no-toolchain alternative) $npm run desktop:install # macOS - fast, one architecture (recommended for your own Mac) $npm run desktop:dmg:arm64 # Apple Silicon $npm run desktop:dmg:x64 # Intel # macOS - both arches, two separate DMGs (what the release ships) $npm run desktop:dmg # Windows - run these on Windows $npm run desktop:win # NSIS installer .exe $npm run desktop:win:portable # no-install portable .exe # macOS: open the DMG, drag the app to Applications, then # clear the Gatekeeper quarantine on first launch: $xattr -cr "/Applications/Claude Code Monitor.app"
A purpose-built page for every job.
Each route is its own focused workspace - kanban for at-a-glance status, sessions for drill-down, analytics for trends, run for live spawning. They all sit on the same hook-driven event store, so what you see anywhere is the same source of truth.
/
Live overview of every active session, agent, and tool call across all projects.
/kanban
Drag-free swim lanes by agent status - waiting, working, completed, error, abandoned.
/sessions
Searchable, filterable list of every session with token, cost, and status facets.
/sessions/:id
Full conversation transcript, agent tree, tool calls, errors, and per-turn token cost.
/activity
Real-time event log with grouping, multi-dimension filters, and pause / resume.
/analytics
Cost trends, model mix, tool usage, error rates, productivity heatmaps - 11 datasets.
/workflows
D3-rendered subagent DAGs, propagation maps, and complexity bubbles per session.
/cc-config
12-tab inspector for skills, subagents, plugins, MCP, hooks, settings, memory, and more.
/run
Spawn, resume, attach, and stream Claude subprocesses straight from the browser with full config control.
/settings
Pricing rules, hook installer, notification setup, theme, language, and data tools.
A focused stack.
Boring, battle-tested foundations. No SaaS, no databases-as-a-service, no authentication providers. Just your machine + the tools that actually matter.
Frequently asked questions.
Quick answers to the things people ask most. The wiki has the full picture.
Does this send any data to the cloud?
No. The dashboard is a 100% local-first Node.js + React app that reads your existing
~/.claude/ directory and writes to a local SQLite file. There is zero
telemetry, zero analytics, no third-party calls. The MCP server is bound to
localhost. Web Push notifications use VAPID and only push to subscribers who
explicitly opted in via your own browser.
How does it integrate with Claude Code?
Claude Code's native hook system. npm run setup installs hook entries
into ~/.claude/settings.json that POST every SessionStart, PreToolUse,
PostToolUse, Stop, SubagentStop, and Notification event to the local server. Hooks
always exit zero so they never block your CLI; if the dashboard is down, your
workflow is unaffected and events resume capture as soon as it's back.
Will running Claude from the dashboard cost extra tokens?
The Run page spawns real claude processes - they consume your normal
Claude Code quota / API tokens, the same as if you ran them in your terminal. The
dashboard adds no overhead. The cost-tracking analytics show you exactly what each
run consumes, by model, with compaction-aware accounting.
Can I resume any session, even ones I didn't start in the dashboard?
Yes. The Run page's "Resume existing session" picker lets you select any session
from your full history (everything that's ever lived in
~/.claude/projects/), spawn claude --resume <id> with
the original cwd, and continue the conversation from where it left off - directly
in your browser.
Does the Run page have feature parity with the terminal TUI?
Most of what matters, with the limits the stream-json interface forces on us. We
support slash-command autocomplete (user / project / plugin commands expanded
client-side, plus built-in CLI commands flagged "CLI only - won't run from here"),
@-file references with debounced cwd-scoped fuzzy search, a live
context-window / token meter showing input + output + cache-read with cost, a
thinking-effort field wired to --effort, multi-turn conversation,
session resume, real character-by-character streaming, and full hook capture. What
doesn't carry over is the TUI itself - in-place tool approval prompts,
interactive /login / /init, the keybinding overlay - those
are CLI-only. There's a collapsible limitations banner on the Run page that spells
out exactly which is which, and any session can be popped open in your terminal
with claude --resume <id>.
Is it safe to edit my skills / agents from the Config Explorer?
Yes. Every mutation creates a timestamped backup in
<CLAUDE_HOME>/cc-config-backups/<type>/ before writing. Backups land
outside the directories Claude Code scans, so a deleted skill cannot resurface as a
backup-named one. Writes are atomic via temp file + rename. Plugins, MCP servers,
hooks-in-settings, and live settings.json files are intentionally
read-only because they have concurrent-write races with the running CLI.
Is there a desktop app, and how is it different from running the server?
Yes - a native desktop app built with Electron 35, on both macOS (a .app
shipped as a .dmg) and Windows (an NSIS installer .exe plus a
no-install portable .exe). It embeds the same
Express server in-process and renders the built React client in a native window,
so it is the same dashboard with native OS lifecycle (macOS & Windows) on top: a
menu-bar / notification-area (tray) icon, a native app menu, auto-start at login, a
single-instance lock, and
window-close-hides-but-server-keeps-running. It also installs Claude Code hooks
and starts background services on first boot, so you get monitoring with
essentially zero manual setup. Get it from the
latest release,
from the ClaudeCodeMonitor-dmg / ClaudeCodeMonitor-win CI
artifacts, or by building locally with
npm run desktop:dmg:arm64 / :x64 on macOS or
npm run desktop:win / desktop:win:portable on Windows. The
builds are unsigned / ad-hoc signed by default, so clear the first-launch warning -
Gatekeeper on macOS (xattr -cr "/Applications/Claude Code Monitor.app") or
SmartScreen on Windows (More info → Run anyway). Your SQLite
database lives in a per-user data dir (~/Library/Application Support/Claude Code Monitor/data/
on macOS, %APPDATA%\Claude Code Monitor\data\ on Windows) outside the
app bundle, so it survives reinstalls and updates, and the
app recovers your shell PATH at startup so Run Claude can
launch the claude CLI. See the
desktop app guide.
What about scaling / multi-user?
The default deployment mode is single-user, localhost-bound. For team setups we ship Docker / Podman compose files, Kubernetes manifests with Kustomize, Terraform modules for AWS/GCP/Azure/OCI, Helm charts, and Prometheus/Grafana observability - see the deployment guide.
Take Claude Code from black box to glass box.
See every session, agent, and tool call as it happens. Spawn and resume Claude from your browser. Inspect every plugin, skill, hook, and setting in 12 tabs. All on your machine - no telemetry, no signup, no cloud.