Claude Watchboard

Visualize your Claude Code session history directly in VS Code — context usage, tool stats, cost tracking, and conversation timeline.

Features

Session Timeline

• Sessions grouped by date or git branch (toggle with one click)
• Quick stats bar showing total cost, today's spend, and session count
• Search/filter sessions by prompt or branch name

Session Detail

• Context Usage — visual bar showing token consumption vs 200K limit
• Activity Grid — read/write/bash/error counts at a glance
• Tool Distribution — sorted bar chart of all tools used (expandable)
• Cost Estimate — input/output token cost breakdown
• Files Touched — list of modified files with directory paths
• Conversation History — full turn-by-turn timeline with tool tags, duration, and token counts

Additional

• Turn Duration — per-turn execution time from Claude's internal timing
• Error Tracking — tool errors extracted and counted
• Copy Summary — one-click markdown summary to clipboard
• Status Bar — always-visible cost and session count

Getting Started

1. Install the extension
2. Open a workspace that has Claude Code session history (~/.claude/projects/)
3. Click the Claude Watchboard icon in the activity bar
4. Click any session card to see full details

Requirements

• VS Code 1.85.0+
• Claude Code session data in ~/.claude/projects/

Data Source

This extension reads local JSONL files only. No API calls, no network requests. All data comes from:

~/.claude/projects/{encoded-workspace-path}/sessions-index.json
~/.claude/projects/{encoded-workspace-path}/{session-id}.jsonl

License

MIT