claude-dashboard-local 1.0.0

package/README.md

@@ -0,0 +1,175 @@
+<!-- Banner -->
+<p align="center">
+  <img src=".github/banner.svg" alt="claude-inspector" width="100%">
+</p>
+
+<!-- Badge row -->
+<p align="center">
+  <a href="LICENSE"><img src="https://img.shields.io/badge/license-AGPL--3.0-blue.svg?style=flat-square" alt="License"></a>
+  <img src="https://img.shields.io/badge/Next.js-16-black.svg?style=flat-square&logo=next.js" alt="Next.js 16">
+  <img src="https://img.shields.io/badge/Three.js-3D-049ef4.svg?style=flat-square&logo=three.js" alt="Three.js">
+  <img src="https://img.shields.io/badge/TypeScript-5-3178c6.svg?style=flat-square&logo=typescript&logoColor=white" alt="TypeScript">
+  <img src="https://img.shields.io/badge/Tailwind-4-06b6d4.svg?style=flat-square&logo=tailwindcss&logoColor=white" alt="Tailwind">
+  <a href="https://github.com/hummusonrails/claude-code-inspector/issues"><img src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square" alt="PRs Welcome"></a>
+</p>
+
+<!-- One-liner + nav -->
+<p align="center">
+  <strong>A local dashboard that reads your ~/.claude data and visualizes every project, session, token, and dollar.</strong>
+  <br>
+  <a href="#quick-start">Quick Start</a> · <a href="#usage">Usage</a> · <a href="https://github.com/hummusonrails/claude-code-inspector/issues">Report a Bug</a>
+</p>
+
+<br>
+
+<p align="center">
+  <img src="docs/screenshots/terrain.png" alt="3D terrain visualization" width="100%" style="border-radius: 8px;">
+</p>
+
+<br>
+
+## What it does
+
+- **Visualize** all your Claude Code projects as an interactive 3D terrain — peaks represent token usage over time
+- **Inspect** any session to see first prompt, last prompt, model, message count, and full token breakdown
+- **Estimate** your API-equivalent cost and compare it against your actual plan — see exactly how much value your subscription delivers
+- **Analyze** usage patterns with 8 analytics sections: cost breakdown, model distribution, daily trends, activity heatmap, context utilization, cache efficiency, session durations, and project rankings
+- **Drill down** into any metric with detail modals showing per-project tables, time series, scatter plots, and actionable insights
+- **Run locally** — your data never leaves your machine, reads directly from `~/.claude`
+
+## Quick Start
+
+```bash
+git clone https://github.com/hummusonrails/claude-code-inspector.git
+cd claude-inspector
+npm install
+npm run build
+npx next start -p 3001
+```
+
+Open [http://localhost:3001](http://localhost:3001) in your browser.
+
+> Requires Node.js 18+ and an existing `~/.claude` directory from Claude Code usage.
+
+## Stack
+
+| Layer | Tool | Notes |
+|:------|:-----|:------|
+| Framework | Next.js 16 (App Router) | Server-side API routes read `~/.claude` data |
+| 3D visualization | Three.js | Terrain mesh, bloom post-processing, raycasted interaction |
+| Styling | Tailwind CSS 4 | Dark glassmorphism theme with cyan accents |
+| Charts | Pure SVG | No chart library — all visualizations are hand-rolled SVG |
+| Language | TypeScript 5 | Strict mode, full type coverage |
+| Data | `~/.claude/projects/` | JSONL session files streamed line-by-line |
+
+<details>
+<summary><strong>Prerequisites</strong></summary>
+
+- [Node.js 18+](https://nodejs.org)
+- [Claude Code CLI](https://docs.anthropic.com/en/docs/claude-code) installed and used at least once (creates `~/.claude`)
+- A modern browser with WebGL support (for the 3D terrain)
+
+</details>
+
+## Usage
+
+### 3D terrain view
+
+The default view renders all your projects as a 3D terrain landscape. Each ridge represents a project, and peaks correspond to high token usage sessions. Click any glowing data point to open a detail modal.
+
+- **Orbit** — click and drag to rotate
+- **Zoom** — scroll wheel
+- **Pan** — right-click drag
+- **Click data points** — opens session detail modal with full token breakdown
+
+### Project detail view
+
+Click any project in the sidebar to see:
+
+- Session list with model badges, sparklines, and expandable token breakdowns
+- First and last prompts for each session
+- "View Full Details" button opens a tabbed modal with overview, prompts, token usage donut chart, and context timeline
+
+### Analytics view
+
+Click "Analytics" in the sidebar. Eight sections, each clickable for drill-down detail:
+
+| Section | What it answers |
+|:--------|:----------------|
+| Cost & Value Analysis | How much am I spending vs my plan? |
+| Model Usage Breakdown | Which models do I use most? |
+| Daily Activity Trend | Is my usage growing or shrinking? |
+| Context Window Utilization | Am I hitting context limits? |
+| Activity Heatmap | When do I code with Claude? |
+| Cache Efficiency | How much is caching saving me? |
+| Session Duration Distribution | How long are my sessions? |
+| Top Projects | Which projects cost the most? |
+
+Select your Claude plan (Pro, Max 5x, Max 20x, Teams, or API) to see your value multiplier — how many dollars of API-equivalent value you get per dollar of subscription.
+
+<details>
+<summary><strong>Analytics screenshot</strong></summary>
+<br>
+<p align="center">
+  <img src="docs/screenshots/analytics.png" alt="Analytics dashboard with cost analysis and model breakdown" width="100%" style="border-radius: 8px;">
+</p>
+</details>
+
+### Activating Analytics Pro
+
+1. [Purchase a license key](https://yalladevrel.lemonsqueezy.com/checkout/buy/62004d70-13c5-4fd2-849e-66adf2215509) ($14.99, includes 1 year + 2 activations)
+2. Open Claude Code Inspector in your browser
+3. Click **Analytics** in the sidebar
+4. Click **Already have a key? Click to activate**
+5. Paste your license key and click **Activate**
+
+Your key is saved locally and persists across sessions. The 3D terrain view, project inspection, and session modals are always free.
+
+## Project structure
+
+```
+src/
+├── app/
+│   ├── api/
+│   │   ├── projects/
+│   │   │   ├── route.ts              # list all projects
+│   │   │   └── [id]/
+│   │   │       ├── route.ts          # project detail
+│   │   │       └── sessions/
+│   │   │           └── [sessionId]/
+│   │   │               └── route.ts  # session detail
+│   │   └── stats/
+│   │       └── route.ts              # global stats
+│   ├── layout.tsx
+│   ├── page.tsx                      # main app shell
+│   └── globals.css
+├── components/
+│   ├── ContextModal.tsx              # session detail modal with tabs
+│   ├── ProjectDetail.tsx             # project view with expandable sessions
+│   ├── Sidebar.tsx                   # project list + view switcher
+│   ├── Sparkline.tsx                 # inline SVG sparkline
+│   ├── StatsBar.tsx                  # top-level stats row
+│   └── TerrainVisualization.tsx      # three.js 3D terrain
+└── lib/
+    └── claude-data.ts                # reads and parses ~/.claude data
+```
+
+## How it reads your data
+
+The app reads directly from `~/.claude/projects/` on your filesystem. Each project directory contains JSONL session files that are streamed line-by-line for efficiency. No data is sent anywhere — everything stays local.
+
+Token pricing estimates use current published API rates:
+
+| Model | Input | Output | Cache read | Cache write |
+|:------|:------|:-------|:-----------|:------------|
+| Opus 4.6 / 4.5 | $5/MTok | $25/MTok | $0.50/MTok | $6.25/MTok |
+| Sonnet 4.6 / 4.5 / 4 | $3/MTok | $15/MTok | $0.30/MTok | $3.75/MTok |
+| Haiku 4.5 | $1/MTok | $5/MTok | $0.10/MTok | $1.25/MTok |
+
+## Contributing
+
+Contributions are welcome. Open an [issue](https://github.com/hummusonrails/claude-code-inspector/issues) or submit a PR.
+
+## License
+
+This project is licensed under the [GNU Affero General Public License v3.0](LICENSE). If you deploy this as a service, you must make your source code available to users.

package/bin/cli.js

@@ -0,0 +1,142 @@
+#!/usr/bin/env node
+
+const { execSync, spawn } = require('child_process');
+const path = require('path');
+const fs = require('fs');
+const net = require('net');
+
+const ROOT = path.resolve(__dirname, '..');
+const DEFAULT_PORT = 3001;
+
+// parse cli args
+const args = process.argv.slice(2);
+let port = DEFAULT_PORT;
+let openBrowser = true;
+
+for (let i = 0; i < args.length; i++) {
+  if ((args[i] === '-p' || args[i] === '--port') && args[i + 1]) {
+    port = parseInt(args[i + 1], 10);
+    i++;
+  }
+  if (args[i] === '--no-open') {
+    openBrowser = false;
+  }
+  if (args[i] === '-h' || args[i] === '--help') {
+    console.log(`
+  claude-dashboard-local
+
+  a local dashboard for visualizing your claude code usage
+
+  usage:
+    cci [options]
+    npx claude-dashboard-local [options]
+
+  options:
+    -p, --port <number>  port to run on (default: ${DEFAULT_PORT})
+    --no-open            don't open browser automatically
+    -h, --help           show this help
+
+  the app reads data from ~/.claude — your data never leaves your machine
+`);
+    process.exit(0);
+  }
+}
+
+// check if ~/.claude exists
+const claudeDir = path.join(require('os').homedir(), '.claude');
+if (!fs.existsSync(claudeDir)) {
+  console.error('\n  ~/.claude directory not found');
+  console.error('  install and use claude code first: https://docs.anthropic.com/en/docs/claude-code\n');
+  process.exit(1);
+}
+
+// check if build exists, build if not
+const standaloneServer = path.join(ROOT, '.next', 'standalone', 'server.js');
+const nextDir = path.join(ROOT, '.next');
+
+if (!fs.existsSync(standaloneServer)) {
+  if (!fs.existsSync(nextDir)) {
+    console.log('  building claude code inspector (first run only)...\n');
+    try {
+      execSync('npm run build', { cwd: ROOT, stdio: 'inherit' });
+    } catch {
+      console.error('\n  build failed — make sure node 18+ is installed\n');
+      process.exit(1);
+    }
+  }
+}
+
+// find an available port
+function isPortAvailable(p) {
+  return new Promise((resolve) => {
+    const server = net.createServer();
+    server.once('error', () => resolve(false));
+    server.once('listening', () => {
+      server.close();
+      resolve(true);
+    });
+    server.listen(p);
+  });
+}
+
+async function findPort(startPort) {
+  let p = startPort;
+  while (p < startPort + 20) {
+    if (await isPortAvailable(p)) return p;
+    p++;
+  }
+  return startPort;
+}
+
+async function main() {
+  const actualPort = await findPort(port);
+  if (actualPort !== port) {
+    console.log(`  port ${port} in use, using ${actualPort}`);
+  }
+
+  const url = `http://localhost:${actualPort}`;
+  console.log(`\n  claude code inspector`);
+  console.log(`  ${url}\n`);
+
+  // start the server
+  let serverProcess;
+
+  if (fs.existsSync(standaloneServer)) {
+    // use standalone output
+    serverProcess = spawn('node', [standaloneServer], {
+      cwd: path.join(ROOT, '.next', 'standalone'),
+      env: { ...process.env, PORT: String(actualPort), HOSTNAME: '0.0.0.0' },
+      stdio: 'inherit',
+    });
+  } else {
+    // fallback to next start
+    serverProcess = spawn('npx', ['next', 'start', '-p', String(actualPort)], {
+      cwd: ROOT,
+      stdio: 'inherit',
+    });
+  }
+
+  // open browser
+  if (openBrowser) {
+    setTimeout(() => {
+      const platform = process.platform;
+      try {
+        if (platform === 'darwin') execSync(`open ${url}`);
+        else if (platform === 'linux') execSync(`xdg-open ${url}`);
+        else if (platform === 'win32') execSync(`start ${url}`);
+      } catch {
+        // browser open failed silently
+      }
+    }, 1500);
+  }
+
+  // handle shutdown
+  const shutdown = () => {
+    serverProcess.kill();
+    process.exit(0);
+  };
+  process.on('SIGINT', shutdown);
+  process.on('SIGTERM', shutdown);
+}
+
+main();

package/next.config.ts

@@ -0,0 +1,8 @@
+import type { NextConfig } from "next";
+
+const nextConfig: NextConfig = {
+  output: "standalone",
+  transpilePackages: ["@hummusonrails/cci-pro"],
+};
+
+export default nextConfig;

package/package.json

@@ -0,0 +1,74 @@
+{
+  "name": "claude-dashboard-local",
+  "version": "1.0.0",
+  "description": "A local dashboard that visualizes your Claude Code usage, costs, and patterns",
+  "license": "AGPL-3.0",
+  "private": false,
+  "bin": {
+    "claude-dashboard-local": "bin/cli.js",
+    "cci": "bin/cli.js"
+  },
+  "files": [
+    "bin/",
+    "src/",
+    "public/",
+    ".next/standalone/",
+    ".next/static/",
+    "next.config.ts",
+    "tsconfig.json",
+    "postcss.config.mjs",
+    "package.json",
+    "LICENSE",
+    "README.md"
+  ],
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "build:pro": "mkdir -p node_modules/@hummusonrails/cci-pro && cp -r ../cci-pro/src ../cci-pro/package.json node_modules/@hummusonrails/cci-pro/ && cp src/pro-loader.pro.ts src/pro-loader.ts && next build && cp src/pro-loader.null.ts src/pro-loader.ts",
+    "start": "next start",
+    "lint": "eslint",
+    "prepublishOnly": "npm run build"
+  },
+  "engines": {
+    "node": ">=18.0.0"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/hummusonrails/claude-code-inspector.git"
+  },
+  "keywords": [
+    "claude",
+    "claude-code",
+    "anthropic",
+    "dashboard",
+    "analytics",
+    "token-usage",
+    "developer-tools",
+    "visualization",
+    "3d"
+  ],
+  "author": "Ben Greenberg",
+  "homepage": "https://github.com/hummusonrails/claude-code-inspector",
+  "bugs": {
+    "url": "https://github.com/hummusonrails/claude-code-inspector/issues"
+  },
+  "dependencies": {
+    "@types/d3": "^7.4.3",
+    "@types/three": "^0.183.1",
+    "d3": "^7.9.0",
+    "next": "16.2.1",
+    "react": "19.2.4",
+    "react-dom": "19.2.4",
+    "three": "^0.183.2"
+  },
+  "devDependencies": {
+    "@tailwindcss/postcss": "^4",
+    "@types/node": "^20",
+    "@types/react": "^19",
+    "@types/react-dom": "^19",
+    "eslint": "^9",
+    "eslint-config-next": "16.2.1",
+    "tailwindcss": "^4",
+    "typescript": "^5"
+  }
+}

package/postcss.config.mjs

@@ -0,0 +1,7 @@
+const config = {
+  plugins: {
+    "@tailwindcss/postcss": {},
+  },
+};
+
+export default config;

package/public/file.svg

@@ -0,0 +1 @@
+<svg fill="none" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M14.5 13.5V5.41a1 1 0 0 0-.3-.7L9.8.29A1 1 0 0 0 9.08 0H1.5v13.5A2.5 2.5 0 0 0 4 16h8a2.5 2.5 0 0 0 2.5-2.5m-1.5 0v-7H8v-5H3v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1M9.5 5V2.12L12.38 5zM5.13 5h-.62v1.25h2.12V5zm-.62 3h7.12v1.25H4.5zm.62 3h-.62v1.25h7.12V11z" clip-rule="evenodd" fill="#666" fill-rule="evenodd"/></svg>

package/public/globe.svg

@@ -0,0 +1 @@
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M10.27 14.1a6.5 6.5 0 0 0 3.67-3.45q-1.24.21-2.7.34-.31 1.83-.97 3.1M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m.48-1.52a7 7 0 0 1-.96 0H7.5a4 4 0 0 1-.84-1.32q-.38-.89-.63-2.08a40 40 0 0 0 3.92 0q-.25 1.2-.63 2.08a4 4 0 0 1-.84 1.31zm2.94-4.76q1.66-.15 2.95-.43a7 7 0 0 0 0-2.58q-1.3-.27-2.95-.43a18 18 0 0 1 0 3.44m-1.27-3.54a17 17 0 0 1 0 3.64 39 39 0 0 1-4.3 0 17 17 0 0 1 0-3.64 39 39 0 0 1 4.3 0m1.1-1.17q1.45.13 2.69.34a6.5 6.5 0 0 0-3.67-3.44q.65 1.26.98 3.1M8.48 1.5l.01.02q.41.37.84 1.31.38.89.63 2.08a40 40 0 0 0-3.92 0q.25-1.2.63-2.08a4 4 0 0 1 .85-1.32 7 7 0 0 1 .96 0m-2.75.4a6.5 6.5 0 0 0-3.67 3.44 29 29 0 0 1 2.7-.34q.31-1.83.97-3.1M4.58 6.28q-1.66.16-2.95.43a7 7 0 0 0 0 2.58q1.3.27 2.95.43a18 18 0 0 1 0-3.44m.17 4.71q-1.45-.12-2.69-.34a6.5 6.5 0 0 0 3.67 3.44q-.65-1.27-.98-3.1" fill="#666"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h16v16H0z"/></clipPath></defs></svg>

package/public/next.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>

package/public/vercel.svg

@@ -0,0 +1 @@
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1155 1000"><path d="m577.3 0 577.4 1000H0z" fill="#fff"/></svg>

package/public/window.svg

@@ -0,0 +1 @@
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 2.5h13v10a1 1 0 0 1-1 1h-11a1 1 0 0 1-1-1zM0 1h16v11.5a2.5 2.5 0 0 1-2.5 2.5h-11A2.5 2.5 0 0 1 0 12.5zm3.75 4.5a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5M7 4.75a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0m1.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5" fill="#666"/></svg>

package/src/app/api/license/validate/route.ts

@@ -0,0 +1,97 @@
+import { NextResponse } from "next/server";
+
+export const dynamic = "force-dynamic";
+
+// lemonsqueezy license validation endpoint
+// this is a public api that does not require authentication
+const LS_VALIDATE_URL = "https://api.lemonsqueezy.com/v1/licenses/validate";
+const LS_ACTIVATE_URL = "https://api.lemonsqueezy.com/v1/licenses/activate";
+
+interface LicenseResponse {
+  valid: boolean;
+  error: string | null;
+  license_key: {
+    id: number;
+    status: string;
+    key: string;
+    activation_limit: number;
+    activation_usage: number;
+    created_at: string;
+    expires_at: string | null;
+  } | null;
+  instance: {
+    id: string;
+    name: string;
+    created_at: string;
+  } | null;
+  meta: {
+    store_id: number;
+    order_id: number;
+    product_id: number;
+    product_name: string;
+    variant_id: number;
+    variant_name: string;
+    customer_id: number;
+    customer_name: string;
+    customer_email: string;
+  } | null;
+}
+
+// validate or activate a license key
+export async function POST(request: Request) {
+  try {
+    const body = await request.json();
+    const { license_key, instance_id, action } = body as {
+      license_key?: string;
+      instance_id?: string;
+      action?: "validate" | "activate";
+    };
+
+    if (!license_key) {
+      return NextResponse.json(
+        { valid: false, error: "license key is required" },
+        { status: 400 }
+      );
+    }
+
+    const url = action === "activate" ? LS_ACTIVATE_URL : LS_VALIDATE_URL;
+
+    // build form data for lemonsqueezy
+    const formData = new URLSearchParams();
+    formData.append("license_key", license_key);
+
+    if (action === "activate") {
+      formData.append("instance_name", "Claude Code Inspector");
+    } else if (instance_id) {
+      formData.append("instance_id", instance_id);
+    }
+
+    const response = await fetch(url, {
+      method: "POST",
+      headers: {
+        Accept: "application/json",
+        "Content-Type": "application/x-www-form-urlencoded",
+      },
+      body: formData.toString(),
+    });
+
+    const data: LicenseResponse = await response.json();
+
+    // return a simplified response to the client
+    return NextResponse.json({
+      valid: data.valid === true,
+      error: data.error,
+      status: data.license_key?.status || null,
+      activation_usage: data.license_key?.activation_usage || 0,
+      activation_limit: data.license_key?.activation_limit || 0,
+      instance_id: data.instance?.id || null,
+      customer_name: data.meta?.customer_name || null,
+      product_name: data.meta?.product_name || null,
+    });
+  } catch {
+    return NextResponse.json(
+      { valid: false, error: "failed to validate license" },
+      { status: 500 }
+    );
+  }
+}

package/src/app/api/projects/[id]/route.ts

@@ -0,0 +1,21 @@
+import { NextResponse } from "next/server";
+import { getProjectDetail } from "@/lib/claude-data";
+
+export const dynamic = "force-dynamic";
+
+export async function GET(
+  _request: Request,
+  { params }: { params: Promise<{ id: string }> }
+) {
+  try {
+    const { id } = await params;
+    const projectId = decodeURIComponent(id);
+    const project = await getProjectDetail(projectId);
+    return NextResponse.json(project);
+  } catch (error) {
+    const message =
+      error instanceof Error ? error.message : "Unknown error reading project";
+    const status = message.includes("not found") ? 404 : 500;
+    return NextResponse.json({ error: message }, { status });
+  }
+}

package/src/app/api/projects/[id]/sessions/[sessionId]/route.ts

@@ -0,0 +1,22 @@
+import { NextResponse } from "next/server";
+import { getSessionDetail } from "@/lib/claude-data";
+
+export const dynamic = "force-dynamic";
+
+export async function GET(
+  _request: Request,
+  { params }: { params: Promise<{ id: string; sessionId: string }> }
+) {
+  try {
+    const { id, sessionId } = await params;
+    const projectId = decodeURIComponent(id);
+    const decodedSessionId = decodeURIComponent(sessionId);
+    const session = await getSessionDetail(projectId, decodedSessionId);
+    return NextResponse.json(session);
+  } catch (error) {
+    const message =
+      error instanceof Error ? error.message : "Unknown error reading session";
+    const status = message.includes("not found") ? 404 : 500;
+    return NextResponse.json({ error: message }, { status });
+  }
+}

package/src/app/api/projects/route.ts

@@ -0,0 +1,25 @@
+import { NextResponse } from "next/server";
+import { getProjects } from "@/lib/claude-data";
+
+export const dynamic = "force-dynamic";
+
+export async function GET() {
+  try {
+    const projects = await getProjects();
+
+    // omit snapshots from list view for performance
+    const summaries = projects.map((p) => ({
+      ...p,
+      sessions: p.sessions.map((s) => ({
+        ...s,
+        contextWindowSnapshots: [],
+      })),
+    }));
+
+    return NextResponse.json({ projects: summaries });
+  } catch (error) {
+    const message =
+      error instanceof Error ? error.message : "Unknown error reading projects";
+    return NextResponse.json({ error: message }, { status: 500 });
+  }
+}

package/src/app/api/stats/route.ts

@@ -0,0 +1,15 @@
+import { NextResponse } from "next/server";
+import { getGlobalStats } from "@/lib/claude-data";
+
+export const dynamic = "force-dynamic";
+
+export async function GET() {
+  try {
+    const stats = await getGlobalStats();
+    return NextResponse.json({ stats });
+  } catch (error) {
+    const message =
+      error instanceof Error ? error.message : "Unknown error reading stats";
+    return NextResponse.json({ error: message }, { status: 500 });
+  }
+}