claude-code-hud 0.2.0

package/scripts/lib/token-reader.mjs

@@ -0,0 +1,212 @@
+/**
+ * Reads token usage from ~/.claude/projects/ JSONL session files.
+ * No external dependencies — pure Node.js.
+ */
+import fs from 'fs';
+import path from 'path';
+import os from 'os';
+
+const CONTEXT_WINDOWS = {
+  'claude-opus-4': 200000,
+  'claude-sonnet-4': 200000,
+  'claude-haiku-4': 200000,
+  'claude-3-5-sonnet': 200000,
+  'claude-3-5-haiku': 200000,
+  'claude-3-opus': 200000,
+};
+
+const PRICING = {
+  opus:   { input: 15.0,  output: 75.0,  cacheRead: 1.5,  cacheWrite: 18.75 },
+  sonnet: { input: 3.0,   output: 15.0,  cacheRead: 0.3,  cacheWrite: 3.75  },
+  haiku:  { input: 0.8,   output: 4.0,   cacheRead: 0.08, cacheWrite: 1.0   },
+};
+
+function getPricing(model) {
+  if (model.includes('opus'))   return PRICING.opus;
+  if (model.includes('haiku'))  return PRICING.haiku;
+  return PRICING.sonnet;
+}
+
+function getContextWindow(model) {
+  for (const [key, val] of Object.entries(CONTEXT_WINDOWS)) {
+    if (model.includes(key)) return val;
+  }
+  return 200000;
+}
+
+/** Find the most recently modified .jsonl session file */
+function findLatestSession() {
+  const projectsDir = path.join(os.homedir(), '.claude', 'projects');
+  if (!fs.existsSync(projectsDir)) return null;
+
+  let latest = null;
+  let latestMtime = 0;
+
+  const projects = fs.readdirSync(projectsDir);
+  for (const proj of projects) {
+    const projDir = path.join(projectsDir, proj);
+
+    // Claude Code stores sessions as UUID.jsonl directly in the project dir
+    let files = [];
+    try {
+      files = fs.readdirSync(projDir).filter(f => f.endsWith('.jsonl') && !f.includes('/'));
+    } catch { continue; }
+
+    for (const file of files) {
+      const fullPath = path.join(projDir, file);
+      try {
+        const stat = fs.statSync(fullPath);
+        if (stat.mtimeMs > latestMtime) {
+          latestMtime = stat.mtimeMs;
+          latest = fullPath;
+        }
+      } catch {}
+    }
+  }
+  return latest;
+}
+
+/** Collect all JSONL lines across all sessions with their timestamps */
+function readAllLines() {
+  const projectsDir = path.join(os.homedir(), '.claude', 'projects');
+  if (!fs.existsSync(projectsDir)) return [];
+  const result = [];
+  for (const proj of fs.readdirSync(projectsDir)) {
+    const projDir = path.join(projectsDir, proj);
+    let files = [];
+    try { files = fs.readdirSync(projDir).filter(f => f.endsWith('.jsonl')); } catch { continue; }
+    for (const file of files) {
+      const fullPath = path.join(projDir, file);
+      const fileMtime = fs.statSync(fullPath).mtimeMs;
+      try {
+        const lines = fs.readFileSync(fullPath, 'utf8').split('\n').filter(Boolean);
+        for (const line of lines) {
+          try {
+            const obj = JSON.parse(line);
+            if (!obj.message?.usage) continue;
+            const ts = obj.timestamp ? new Date(obj.timestamp).getTime() : fileMtime;
+            result.push({ ts, usage: obj.message.usage, model: obj.message.model || 'claude-sonnet-4' });
+          } catch {}
+        }
+      } catch {}
+    }
+  }
+  return result;
+}
+
+export function readTokenHistory() {
+  const allLines = readAllLines();
+  const now = Date.now();
+  const h5  = now - 5  * 60 * 60 * 1000;
+  const wk  = now - 7  * 24 * 60 * 60 * 1000;
+  const h12 = now - 12 * 60 * 60 * 1000;
+
+  const empty = () => ({ inputTokens: 0, outputTokens: 0, cacheReadTokens: 0, cacheWriteTokens: 0, cost: { input: 0, output: 0, cacheRead: 0, cacheWrite: 0, total: 0 } });
+  const acc5h = empty(), accWk = empty();
+
+  // 12 hourly buckets (index 0 = oldest, 11 = most recent)
+  const buckets = Array(12).fill(0);
+
+  for (const { ts, usage, model } of allLines) {
+    const pricing = getPricing(model);
+    const M = 1_000_000;
+    const inp = usage.input_tokens || 0;
+    const out = usage.output_tokens || 0;
+    const cr  = usage.cache_read_input_tokens || 0;
+    const cw  = usage.cache_creation_input_tokens || 0;
+
+    const addTo = (acc) => {
+      acc.inputTokens      += inp;
+      acc.outputTokens     += out;
+      acc.cacheReadTokens  += cr;
+      acc.cacheWriteTokens += cw;
+      acc.cost.input      += (inp / M) * pricing.input;
+      acc.cost.output     += (out / M) * pricing.output;
+      acc.cost.cacheRead  += (cr  / M) * pricing.cacheRead;
+      acc.cost.cacheWrite += (cw  / M) * pricing.cacheWrite;
+    };
+
+    if (ts >= wk) { addTo(accWk); }
+    if (ts >= h5) { addTo(acc5h); }
+
+    if (ts >= h12) {
+      const hoursAgo = (now - ts) / (60 * 60 * 1000);
+      const idx = Math.min(11, Math.floor(12 - hoursAgo));
+      if (idx >= 0) buckets[idx] += out;
+    }
+  }
+
+  [acc5h, accWk].forEach(acc => {
+    acc.cost.total = acc.cost.input + acc.cost.output + acc.cost.cacheRead + acc.cost.cacheWrite;
+  });
+
+  return { last5h: acc5h, lastWeek: accWk, hourlyBuckets: buckets };
+}
+
+export function readTokenUsage() {
+  const sessionFile = findLatestSession();
+  if (!sessionFile) {
+    return empty();
+  }
+
+  let model = 'claude-sonnet-4';
+  // For cost: sum all turns' output + input (billed per turn)
+  let totalOutputTokens = 0;
+  let totalInputTokens = 0;
+  let totalCacheReadTokens = 0;
+  let totalCacheWriteTokens = 0;
+  // For context window: use the LAST turn's snapshot (what's in context right now)
+  let lastUsage = null;
+
+  const lines = fs.readFileSync(sessionFile, 'utf8').split('\n').filter(Boolean);
+  for (const line of lines) {
+    try {
+      const obj = JSON.parse(line);
+      if (obj.message?.model) model = obj.message.model;
+
+      const usage = obj.message?.usage;
+      if (!usage) continue;
+
+      // Accumulate output tokens (main cost driver, each turn is new output)
+      totalOutputTokens     += usage.output_tokens || 0;
+      totalInputTokens      += usage.input_tokens  || 0;
+      totalCacheReadTokens  += usage.cache_read_input_tokens || 0;
+      totalCacheWriteTokens += usage.cache_creation_input_tokens || 0;
+      lastUsage = usage;
+    } catch {}
+  }
+
+  if (!lastUsage) return empty();
+
+  // Context window = what's currently loaded (last turn's input side)
+  const ctxInput    = lastUsage.input_tokens || 0;
+  const ctxCacheR   = lastUsage.cache_read_input_tokens || 0;
+  const ctxCacheW   = lastUsage.cache_creation_input_tokens || 0;
+  const contextUsed = ctxInput + ctxCacheR + ctxCacheW;
+
+  const contextWindow = getContextWindow(model);
+  const pricing = getPricing(model);
+  const M = 1_000_000;
+  const cost = {
+    input:      (totalInputTokens      / M) * pricing.input,
+    output:     (totalOutputTokens     / M) * pricing.output,
+    cacheRead:  (totalCacheReadTokens  / M) * pricing.cacheRead,
+    cacheWrite: (totalCacheWriteTokens / M) * pricing.cacheWrite,
+  };
+  cost.total = cost.input + cost.output + cost.cacheRead + cost.cacheWrite;
+
+  return {
+    inputTokens:      totalInputTokens,
+    outputTokens:     totalOutputTokens,
+    cacheReadTokens:  totalCacheReadTokens,
+    cacheWriteTokens: totalCacheWriteTokens,
+    totalTokens:      contextUsed,   // context window usage = current ctx size
+    contextWindow,
+    model,
+    cost,
+  };
+}
+
+function empty() {
+  return { inputTokens: 0, outputTokens: 0, cacheReadTokens: 0, cacheWriteTokens: 0, totalTokens: 0, contextWindow: 200000, model: 'unknown', cost: { input: 0, output: 0, cacheRead: 0, cacheWrite: 0, total: 0 } };
+}

package/scripts/lib/usage-api.mjs

@@ -0,0 +1,141 @@
+/**
+ * Anthropic OAuth usage API
+ * Replicates OMC's approach: Keychain → ~/.claude/.credentials.json → API call
+ * Endpoint: api.anthropic.com/api/oauth/usage
+ * Response: { five_hour: { utilization, resets_at }, seven_day: { utilization, resets_at } }
+ */
+import { existsSync, readFileSync, writeFileSync, mkdirSync } from 'fs';
+import { homedir } from 'os';
+import { join, dirname } from 'path';
+import { execSync } from 'child_process';
+import https from 'https';
+
+const CACHE_TTL_OK  = 5 * 60 * 1000;  // 5 minutes for success
+const CACHE_TTL_ERR = 30 * 1000;       // 30s for failure
+const CACHE_PATH = join(homedir(), '.claude', '.hud-usage-cache.json');
+
+function readCache() {
+  try {
+    if (!existsSync(CACHE_PATH)) return null;
+    const c = JSON.parse(readFileSync(CACHE_PATH, 'utf-8'));
+    // Re-hydrate Date objects from ISO strings
+    if (c.data) {
+      if (c.data.fiveHourResetsAt) c.data.fiveHourResetsAt = new Date(c.data.fiveHourResetsAt);
+      if (c.data.weeklyResetsAt)   c.data.weeklyResetsAt   = new Date(c.data.weeklyResetsAt);
+    }
+    return c;
+  } catch { return null; }
+}
+
+function writeCache(data, error = false) {
+  try {
+    writeFileSync(CACHE_PATH, JSON.stringify({ ts: Date.now(), data, error }));
+  } catch {}
+}
+
+function isCacheValid(c) {
+  const ttl = c.error ? CACHE_TTL_ERR : CACHE_TTL_OK;
+  return Date.now() - c.ts < ttl;
+}
+
+function getCredentials() {
+  // macOS Keychain first
+  if (process.platform === 'darwin') {
+    try {
+      const raw = execSync(
+        '/usr/bin/security find-generic-password -s "Claude Code-credentials" -w 2>/dev/null',
+        { encoding: 'utf-8', timeout: 2000 }
+      ).trim();
+      if (raw) {
+        const parsed = JSON.parse(raw);
+        const creds = parsed.claudeAiOauth || parsed;
+        if (creds.accessToken) return creds;
+      }
+    } catch {}
+  }
+  // Fallback to file
+  try {
+    const credPath = join(homedir(), '.claude', '.credentials.json');
+    if (existsSync(credPath)) {
+      const parsed = JSON.parse(readFileSync(credPath, 'utf-8'));
+      const creds = parsed.claudeAiOauth || parsed;
+      if (creds.accessToken) return creds;
+    }
+  } catch {}
+  return null;
+}
+
+function fetchUsage(accessToken) {
+  return new Promise(resolve => {
+    const req = https.request({
+      hostname: 'api.anthropic.com',
+      path: '/api/oauth/usage',
+      method: 'GET',
+      headers: {
+        'Authorization': `Bearer ${accessToken}`,
+        'anthropic-beta': 'oauth-2025-04-20',
+        'Content-Type': 'application/json',
+      },
+      timeout: 8000,
+    }, res => {
+      let data = '';
+      res.on('data', chunk => { data += chunk; });
+      res.on('end', () => {
+        if (res.statusCode === 200) {
+          try { resolve(JSON.parse(data)); } catch { resolve(null); }
+        } else {
+          resolve(null);
+        }
+      });
+    });
+    req.on('error', () => resolve(null));
+    req.on('timeout', () => { req.destroy(); resolve(null); });
+    req.end();
+  });
+}
+
+/**
+ * Synchronously returns cached usage data if still valid, else null.
+ * Use this for initial render to avoid showing "--" before first async call.
+ */
+export function getUsageSync() {
+  const cache = readCache();
+  if (cache && isCacheValid(cache)) return cache.data;
+  return null;
+}
+
+/**
+ * Returns { fiveHourPercent, weeklyPercent, fiveHourResetsAt, weeklyResetsAt }
+ * or null if credentials not available / API call failed
+ */
+export async function getUsage() {
+  const cache = readCache();
+  if (cache && isCacheValid(cache)) return cache.data;
+
+  const creds = getCredentials();
+  if (!creds) { writeCache(null, true); return null; }
+
+  // Check expiry
+  if (creds.expiresAt != null && creds.expiresAt <= Date.now()) {
+    writeCache(null, true); return null;
+  }
+
+  const response = await fetchUsage(creds.accessToken);
+  if (!response) { writeCache(null, true); return null; }
+
+  const clamp = v => (v == null || !isFinite(v)) ? 0 : Math.max(0, Math.min(100, v));
+  const parseDate = s => { try { const d = new Date(s); return isNaN(d.getTime()) ? null : d; } catch { return null; } };
+
+  const fiveHour = response.five_hour?.utilization;
+  const sevenDay = response.seven_day?.utilization;
+  if (fiveHour == null && sevenDay == null) { writeCache(null, true); return null; }
+
+  const result = {
+    fiveHourPercent: clamp(fiveHour),
+    weeklyPercent:   clamp(sevenDay),
+    fiveHourResetsAt: parseDate(response.five_hour?.resets_at),
+    weeklyResetsAt:   parseDate(response.seven_day?.resets_at),
+  };
+  writeCache(result, false);
+  return result;
+}

package/scripts/session-start.mjs

@@ -0,0 +1,42 @@
+#!/usr/bin/env node
+/**
+ * HUD — SessionStart hook
+ * Shows: project git branch + token baseline at session start
+ */
+import { readTokenUsage } from './lib/token-reader.mjs';
+import { readGitInfo } from './lib/git-info.mjs';
+import { tokenLine, gitLine, divider, fmtCost } from './lib/formatter.mjs';
+import { execSync } from 'child_process';
+import fs from 'fs';
+
+let raw = '';
+try {
+  const chunks = [];
+  for await (const chunk of process.stdin) chunks.push(chunk);
+  raw = Buffer.concat(chunks).toString();
+} catch {}
+const input = JSON.parse(raw || '{}');
+const cwd = input.cwd || input.directory || process.env.CLAUDE_PROJECT_ROOT || process.cwd();
+
+const usage = readTokenUsage();
+const git = readGitInfo(cwd);
+
+// Quick file count
+let fileCount = '?';
+try {
+  fileCount = execSync('git ls-files 2>/dev/null | wc -l', { cwd, encoding: 'utf8' }).trim();
+} catch {}
+
+const D = divider(54);
+const lines = [
+  `◆ HUD`,
+  D,
+  tokenLine(usage),
+  gitLine(git),
+  `files  ${fileCount.trim()}`,
+  D,
+];
+
+const message = lines.join('\n');
+
+process.stdout.write(JSON.stringify({ continue: true, message }) + '\n');

package/scripts/statusline.mjs

@@ -0,0 +1,46 @@
+#!/usr/bin/env node
+/**
+ * HUD — statusLine script
+ * Runs every few seconds, outputs a single line shown at the bottom of Claude Code.
+ */
+import { createRequire } from 'module';
+import { fileURLToPath } from 'url';
+import { dirname, join } from 'path';
+
+const __dir = dirname(fileURLToPath(import.meta.url));
+const { readTokenUsage } = await import(join(__dir, 'lib/token-reader.mjs'));
+const { readGitInfo } = await import(join(__dir, 'lib/git-info.mjs'));
+const { fmtK, fmtCost, statusLabel } = await import(join(__dir, 'lib/formatter.mjs'));
+
+const cwd = process.env.CLAUDE_PROJECT_ROOT || process.cwd();
+
+const usage = readTokenUsage();
+const git = readGitInfo(cwd);
+
+// Token status
+const pct = Math.round((usage.totalTokens / usage.contextWindow) * 100);
+const st = statusLabel(usage.totalTokens, usage.contextWindow);
+const tokStr = `${fmtK(usage.totalTokens)}/${fmtK(usage.contextWindow)} ${st}`;
+
+// Cost
+const costStr = fmtCost(usage.cost.total);
+
+// Git
+let gitStr = '';
+if (git.isRepo) {
+  gitStr = `⎇ ${git.branch}`;
+  if (git.totalChanges > 0) gitStr += ` +${git.totalChanges}`;
+}
+
+// Model (short)
+const model = usage.model.replace('claude-', '').replace(/-\d{8}$/, '');
+
+const parts = [
+  `◆ HUD`,
+  `tok ${tokStr}`,
+  costStr,
+  gitStr,
+  model,
+].filter(Boolean);
+
+process.stdout.write(parts.join('  │  ') + '\n');

package/scripts/stop-hud.mjs

@@ -0,0 +1,31 @@
+#!/usr/bin/env node
+/**
+ * HUD — Stop hook
+ * Shows compact token bar after each Claude response.
+ */
+import { readTokenUsage } from './lib/token-reader.mjs';
+import { readGitInfo } from './lib/git-info.mjs';
+import { tokenLine, gitLine, divider } from './lib/formatter.mjs';
+
+let raw = '';
+try {
+  const chunks = [];
+  for await (const chunk of process.stdin) chunks.push(chunk);
+  raw = Buffer.concat(chunks).toString();
+} catch {}
+const input = JSON.parse(raw || '{}');
+const cwd = input.cwd || input.directory || process.env.CLAUDE_PROJECT_ROOT || process.cwd();
+
+const usage = readTokenUsage();
+const git = readGitInfo(cwd);
+
+const D = divider(54);
+const lines = [
+  `◆ HUD`,
+  D,
+  tokenLine(usage),
+  gitLine(git),
+  D,
+];
+
+process.stdout.write(JSON.stringify({ continue: true, message: lines.join('\n') }) + '\n');

package/skills/hud.md

@@ -0,0 +1,45 @@
+---
+name: hud
+description: Show full HUD dashboard — token usage, cost breakdown, git status. Trigger with /hud.
+triggers:
+  - "/hud"
+  - "hud 보여줘"
+  - "토큰 얼마나 썼어"
+  - "show hud"
+  - "hud status"
+---
+
+Run this Node.js script inline and show the result as a formatted dashboard:
+
+```javascript
+// Read token usage from ~/.claude/projects JSONL
+import { readTokenUsage } from '${CLAUDE_PLUGIN_ROOT}/scripts/lib/token-reader.mjs';
+import { readGitInfo } from '${CLAUDE_PLUGIN_ROOT}/scripts/lib/git-info.mjs';
+import { tokenPanel, gitPanel, divider } from '${CLAUDE_PLUGIN_ROOT}/scripts/lib/formatter.mjs';
+```
+
+When the user invokes /hud, execute the following shell command and show the output:
+
+```
+node -e "
+import('${CLAUDE_PLUGIN_ROOT}/scripts/lib/token-reader.mjs').then(async ({ readTokenUsage }) => {
+  const { readGitInfo } = await import('${CLAUDE_PLUGIN_ROOT}/scripts/lib/git-info.mjs');
+  const { tokenPanel, gitPanel, divider, fmtCost } = await import('${CLAUDE_PLUGIN_ROOT}/scripts/lib/formatter.mjs');
+  const usage = readTokenUsage();
+  const git = readGitInfo(process.cwd());
+  const D = divider(54);
+  console.log('◆ HUD  —  Full Dashboard');
+  console.log(D);
+  console.log('');
+  console.log('[TOKENS]');
+  console.log(tokenPanel(usage));
+  console.log('');
+  console.log('[GIT]');
+  console.log(gitPanel(git));
+  console.log('');
+  console.log(D);
+});
+"
+```
+
+Display the output in a code block with no modification. If the script fails, show the error and suggest running \`/plugin install jhhan/hud-plugin\` to reinstall.