Claude Code View

A live dashboard for visualizing your Claude Code setup across all your projects. Scans your directories for skills, agents, hooks, MCP servers, rules, memory, and more — then serves a real-time dashboard in your browser.

Zero dependencies. Python 3.9+ stdlib only. No pip install, no npm, no build step.

Quick Start

git clone https://github.com/rajnavakoti/claude-code-view.git
cd claude-code-view

# Create your config
cp config.example.json config.json
# Edit config.json — point "path" at your project directory

# Run
python3 claude_code_view.py

Dashboard opens at http://localhost:7878 and auto-refreshes every 30 seconds.

What You Get

Folder Tabs

Point it at any number of directories. Each becomes a tab showing all Claude Code projects found inside:

• Project cards with expandable entity sections
• Entity distribution heatmap and pie chart
• AI code percentage badges (from git history)
• Cross-reference linking (skills <-> agents)
• Click-through detail panel for any entity

Analytics Tab

• Daily activity sparklines (messages + tool calls per day)
• Model usage donut chart with cost breakdown
• AI code leaderboard across all projects
• Token breakdown (input / output / cache read / cache write)
• Session intensity by day of week
• Most configured projects ranking

Local Models Tab

Shows all your Ollama models with architecture, parameters, quantization, context length, and capabilities.

Usage Stats

Token usage, estimated cost, CO2 estimate, and per-model breakdown from your Claude Code session history.

Config

Edit config.json to define your project folders:

{
  "folders": [
    {"path": "~/projects", "name": "My Projects", "depth": 1},
    {"path": "~/work", "name": "Work", "depth": 2}
  ],
  "port": 7878,
  "refresh_seconds": 30
}

Field	Description
path	Directory to scan for Claude Code projects
name	Tab label in the dashboard
depth	How many directory levels deep to scan (1 = immediate children)
port	HTTP server port
refresh_seconds	How often the browser polls for fresh data

CLI Reference

# Default: reads config.json, starts live server
python3 claude_code_view.py

# Override config via CLI
python3 claude_code_view.py --folders ~/a ~/b --names Personal Work --depth 2

# Static HTML (no server, one-shot snapshot)
python3 claude_code_view.py --static -o snapshot.html

# Custom port and refresh
python3 claude_code_view.py --port 8080 --refresh 60

Flag	Default	Description
--folders PATH...	from config.json	Project directories
--names NAME...	directory names	Tab labels
--depth N	1	Scan depth
--port N	7878	Server port
--refresh N	30	Refresh interval (seconds)
--static	off	Generate static HTML file
-o FILE	claude-code-view.html	Static output path
--no-open	off	Don't open browser

Terminal Widget

Compact rotating display for a tmux pane or small terminal:

python3 live_dashboard.py

Cycles through 5 screens every 10 seconds: overview stats, token burn sparkline, AI code leaderboard, model usage breakdown, and coding hours heatmap. Refreshes data every 5 minutes.

What Gets Scanned

Entity	Location
Skills	.claude/skills/*/SKILL.md
Agents	.claude/agents/*.md
Commands	.claude/commands/*.md
Hooks	.claude/settings.json
MCP Servers	.mcp.json
Memory	CLAUDE.md, .claude/CLAUDE.md, CLAUDE.local.md
Rules	.claude/rules/**/*.md
Auto Memory	~/.claude/projects/<hash>/memory/
Plugins	*/.claude-plugin/plugin.json
Permissions	.claude/settings.json
Settings	.claude/settings.json, settings.local.json
User MCP	~/.claude.json
Ollama Models	ollama list + ollama show
Git AI Stats	git log (detects AI co-authored commits)
Usage Stats	~/.claude/stats-cache.json

Project Structure

claude_code_view.py    # Entry point: CLI, config, HTTP server
scanners.py            # Data layer: all scanning functions
dashboard.html         # UI layer: served by the HTTP server, fetches /data
live_dashboard.py      # Terminal widget for tmux panes
config.json            # Your config (gitignored, never committed)
config.example.json    # Example config shipped with the repo

Data and UI are fully separated. The HTML template contains zero project data — everything is fetched from the /data endpoint at runtime. Your config.json is gitignored, so no personal paths ever enter the repo.

Requirements

• Python 3.9+
• No pip packages needed
• Ollama (optional, for Local Models tab)
• A browser

Design

Neo-brutalist dark theme with muted accent colors. Heavy borders, no rounded corners, pattern-filled charts. Light mode available via toggle. All colors use CSS custom properties.

License

MIT