@jeet427/claude-sessions-dashboard 1.0.2

package/bin/cli.js

@@ -0,0 +1,96 @@
+#!/usr/bin/env node
+
+const { createServer } = require('../src/server');
+
+if (process.argv.includes('--digest')) {
+  const { analyzeAllSessions } = require('../src/analyzer');
+  const data = analyzeAllSessions();
+
+  // Filter to last 7 days
+  const cutoff = new Date(Date.now() - 7 * 24 * 60 * 60 * 1000).toISOString().slice(0, 10);
+  const weekSessions = data.sessionDetails.filter(s => s.startTime && s.startTime.slice(0, 10) >= cutoff);
+  const weekCost = weekSessions.reduce((s, x) => s + x.cost, 0);
+  const weekMessages = weekSessions.reduce((s, x) => s + x.humanMessages + x.assistantMessages, 0);
+  const weekTools = weekSessions.reduce((s, x) => s + x.toolCalls, 0);
+  const anomalies = weekSessions.filter(s => s.isAnomaly).length;
+
+  // Top model this week
+  const modelCounts = {};
+  weekSessions.forEach(s => Object.entries(s.models || {}).forEach(([m, c]) => { modelCounts[m] = (modelCounts[m] || 0) + c; }));
+  const topModel = Object.entries(modelCounts).sort((a, b) => b[1] - a[1])[0];
+
+  // Top project this week
+  const projCosts = {};
+  weekSessions.forEach(s => { projCosts[s.projectName] = (projCosts[s.projectName] || 0) + s.cost; });
+  const topProject = Object.entries(projCosts).sort((a, b) => b[1] - a[1])[0];
+
+  const line = '═'.repeat(45);
+  const monday = new Date(Date.now() - 7 * 24 * 60 * 60 * 1000);
+  const today = new Date();
+  const dateRange = monday.toLocaleDateString('en-US', { month: 'short', day: 'numeric' }) + ' – ' + today.toLocaleDateString('en-US', { month: 'short', day: 'numeric' });
+
+  // Cache hit rate for week
+  const weekCacheRead = weekSessions.reduce((s, x) => s + (x.cacheReadTokens || 0), 0);
+  const weekCacheWrite = weekSessions.reduce((s, x) => s + (x.cacheWriteTokens || 0), 0);
+  const weekCacheHit = (weekCacheRead + weekCacheWrite) > 0
+    ? ((weekCacheRead / (weekCacheRead + weekCacheWrite)) * 100).toFixed(1) + '%'
+    : '—';
+
+  console.log('\n' + line);
+  console.log('  Claude Sessions — Weekly Digest');
+  console.log('  Week of ' + dateRange);
+  console.log(line);
+  console.log('  Sessions this week:    ' + weekSessions.length);
+  console.log('  Total cost this week:  $' + weekCost.toFixed(2));
+  console.log('  Avg cost/session:      $' + (weekSessions.length > 0 ? (weekCost / weekSessions.length).toFixed(2) : '0.00'));
+  console.log('  Total messages:        ' + weekMessages);
+  console.log('  Total tool calls:      ' + weekTools);
+  console.log('  Cache hit rate:        ' + weekCacheHit);
+  console.log('  Top model:             ' + (topModel ? topModel[0] + ' (' + topModel[1] + ' responses)' : '—'));
+  console.log('  Most used tool:        ' + (data.toolUsage[0] ? data.toolUsage[0].name + ' (' + data.toolUsage[0].count + ' calls)' : '—'));
+  console.log('  Top project:           ' + (topProject ? topProject[0] + ' ($' + topProject[1].toFixed(2) + ')' : '—'));
+  console.log('  Anomalous sessions:    ' + anomalies + (anomalies > 0 ? ' ⚠ (cost > 3× avg)' : ''));
+  console.log(line + '\n');
+
+  process.exit(0);
+}
+
+const args = process.argv.slice(2);
+const portFlag = args.indexOf('--port');
+const port = portFlag !== -1 && args[portFlag + 1] ? parseInt(args[portFlag + 1], 10) : 3141;
+const noBrowser = args.includes('--no-browser');
+const budgetFlag = args.indexOf('--daily-budget');
+const dailyBudget = budgetFlag !== -1 && args[budgetFlag + 1] ? parseFloat(args[budgetFlag + 1]) : null;
+
+async function main() {
+  console.log('\n  Claude Sessions Dashboard');
+  console.log('  ─────────────────────────\n');
+
+  try {
+    const { server, port: actualPort } = await createServer(port, { dailyBudget });
+    const url = `http://localhost:${actualPort}`;
+
+    console.log(`  Dashboard running at: ${url}`);
+    console.log('  Press Ctrl+C to stop\n');
+
+    if (!noBrowser) {
+      try {
+        const open = (await import('open')).default;
+        await open(url);
+      } catch {
+        console.log(`  Could not open browser automatically. Visit: ${url}\n`);
+      }
+    }
+
+    process.on('SIGINT', () => {
+      console.log('\n  Shutting down...');
+      server.close();
+      process.exit(0);
+    });
+  } catch (err) {
+    console.error('  Failed to start:', err.message);
+    process.exit(1);
+  }
+}
+
+main();

package/package.json

@@ -0,0 +1,29 @@
+{
+  "name": "@jeet427/claude-sessions-dashboard",
+  "version": "1.0.2",
+  "description": "A modern dashboard for Claude Code session analytics — tokens, costs, tools, models, and usage patterns",
+  "bin": {
+    "claude-dashboard": "./bin/cli.js"
+  },
+  "main": "src/server.js",
+  "scripts": {
+    "start": "node bin/cli.js",
+    "dev": "node bin/cli.js --port 3141"
+  },
+  "keywords": [
+    "claude",
+    "claude-code",
+    "dashboard",
+    "analytics",
+    "sessions"
+  ],
+  "author": "Jitendra Mathur",
+  "license": "MIT",
+  "dependencies": {
+    "express": "^4.21.0",
+    "open": "^10.1.0"
+  },
+  "engines": {
+    "node": ">=18.0.0"
+  }
+}

package/public/css/theme.css

@@ -0,0 +1,35 @@
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');
+body { font-family: 'Inter', sans-serif; }
+.mono { font-family: 'JetBrains Mono', monospace; }
+.glass { background: rgba(30, 30, 53, 0.8); backdrop-filter: blur(12px); }
+.glow { box-shadow: 0 0 20px rgba(232, 130, 90, 0.15); }
+.fade-in { animation: fadeIn 0.4s ease-out; }
+@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
+::-webkit-scrollbar { width: 6px; height: 6px; }
+::-webkit-scrollbar-track { background: #0f0f1a; }
+::-webkit-scrollbar-thumb { background: #2a2a45; border-radius: 3px; }
+::-webkit-scrollbar-thumb:hover { background: #3a3a55; }
+/* Hide native details disclosure triangle */
+details > summary { list-style: none; }
+details > summary::-webkit-details-marker { display: none; }
+.tab-active { border-bottom: 2px solid #E8825A; color: #E8825A; }
+.tab-inactive { border-bottom: 2px solid transparent; color: #8888aa; }
+.tab-inactive:hover { color: #bbbbdd; }
+.session-row:hover { background: rgba(42,42,69,0.4); cursor: pointer; }
+#session-modal { display: none; }
+#session-modal.open { display: flex; }
+#shortcuts-overlay { display: none; }
+#shortcuts-overlay.visible { display: block; }
+/* ── Light Mode ─────────────────────── */
+html.light-mode body { background: #f5f5f5; color: #1a1a2e; }
+html.light-mode .bg-claude-darker { background: #f0f0f5 !important; }
+html.light-mode .bg-claude-card, html.light-mode .glass { background: #ffffff !important; border-color: #e0e0f0 !important; }
+html.light-mode .text-white { color: #1a1a2e !important; }
+html.light-mode .text-gray-200 { color: #2a2a3e !important; }
+html.light-mode .text-gray-300 { color: #3a3a4e !important; }
+html.light-mode .text-gray-400 { color: #4a4a5e !important; }
+html.light-mode .border-claude-border { border-color: #d0d0e8 !important; }
+html.light-mode .bg-\[#16213e\], html.light-mode .bg-\[#1e1e35\], html.light-mode .bg-\[#0f0f1a\], html.light-mode .bg-\[#0d0d1a\] { background: #f8f8ff !important; }
+html.light-mode .text-claude-muted { color: #5a5a7a !important; }
+html.light-mode #modal-conv-messages .flex.justify-start > div > div { background: #eef0ff !important; border-color: #d0d0f0 !important; }
+html.light-mode #modal-conv-messages .flex.justify-end > div > div { background: #e0e0f5 !important; }