tokens-metric 0.2.4 → 0.3.0

package/dist/core/format.js

@@ -39,6 +39,20 @@ export function estimateCostUSD(model, u) {
         u.cache_creation_input_tokens * p.cacheWrite * perTok +
         u.cache_read_input_tokens * p.cacheRead * perTok);
 }
+export function categoryCostUSD(model, category, tokens) {
+    const key = priceKey(model);
+    if (!key)
+        return null;
+    const p = PRICES_PER_MTOK[key];
+    const rate = category === 'input'
+        ? p.in
+        : category === 'output'
+            ? p.out
+            : category === 'cacheWrite'
+                ? p.cacheWrite
+                : p.cacheRead;
+    return (tokens * rate) / 1_000_000;
+}
 export function fmtUSD(n) {
     if (n < 0.01)
         return `$${n.toFixed(4)}`;

package/dist/core/history-store.js

@@ -0,0 +1,102 @@
+import { existsSync, mkdirSync, readFileSync, renameSync, writeFileSync, } from 'node:fs';
+import { homedir } from 'node:os';
+import { dirname, join } from 'node:path';
+import { addUsage, EMPTY_USAGE } from './types.js';
+const STORE_VERSION = 1;
+const STORE_PATH = () => join(homedir(), '.tokens-metric', 'history.json');
+/**
+ * Read the on-disk store. Returns an empty map if the file does not exist
+ * or is unreadable/malformed — the caller can keep working from live data.
+ */
+export function loadStore() {
+    const path = STORE_PATH();
+    if (!existsSync(path))
+        return new Map();
+    try {
+        const raw = readFileSync(path, 'utf8');
+        const parsed = JSON.parse(raw);
+        if (parsed?.version !== STORE_VERSION || !parsed.days)
+            return new Map();
+        const out = new Map();
+        for (const [date, day] of Object.entries(parsed.days)) {
+            const dayMs = parseDateKey(date);
+            if (dayMs === null)
+                continue;
+            const byModel = {};
+            for (const [model, usage] of Object.entries(day.byModel ?? {})) {
+                byModel[model] = sanitizeUsage(usage);
+            }
+            out.set(dayMs, {
+                byModel,
+                sessions: new Set(Array.isArray(day.sessions) ? day.sessions : []),
+            });
+        }
+        return out;
+    }
+    catch {
+        return new Map();
+    }
+}
+/**
+ * Persist a snapshot of per-day aggregates atomically. Failures are
+ * swallowed — losing one write is recoverable on next refresh.
+ */
+export function saveStore(days) {
+    const path = STORE_PATH();
+    try {
+        mkdirSync(dirname(path), { recursive: true });
+        const out = { version: STORE_VERSION, days: {} };
+        for (const [dayMs, agg] of days) {
+            out.days[formatDateKey(dayMs)] = {
+                byModel: agg.byModel,
+                sessions: Array.from(agg.sessions),
+            };
+        }
+        const tmp = `${path}.tmp`;
+        writeFileSync(tmp, JSON.stringify(out), 'utf8');
+        renameSync(tmp, path);
+    }
+    catch {
+        // ignore — next refresh will retry
+    }
+}
+export function mergeDayInto(target, dayMs, byModel, sessions) {
+    const existing = target.get(dayMs) ?? { byModel: {}, sessions: new Set() };
+    for (const [model, usage] of Object.entries(byModel)) {
+        existing.byModel[model] = addUsage(existing.byModel[model] ?? EMPTY_USAGE(), usage);
+    }
+    for (const sid of sessions)
+        existing.sessions.add(sid);
+    target.set(dayMs, existing);
+}
+export function replaceDayIn(target, dayMs, byModel, sessions) {
+    const next = { byModel: {}, sessions: new Set(sessions) };
+    for (const [model, usage] of Object.entries(byModel)) {
+        next.byModel[model] = { ...usage };
+    }
+    target.set(dayMs, next);
+}
+function formatDateKey(ms) {
+    const d = new Date(ms);
+    const y = d.getFullYear();
+    const m = String(d.getMonth() + 1).padStart(2, '0');
+    const day = String(d.getDate()).padStart(2, '0');
+    return `${y}-${m}-${day}`;
+}
+function parseDateKey(s) {
+    const m = /^(\d{4})-(\d{2})-(\d{2})$/.exec(s);
+    if (!m)
+        return null;
+    const d = new Date(Number(m[1]), Number(m[2]) - 1, Number(m[3]), 0, 0, 0, 0);
+    return Number.isFinite(d.getTime()) ? d.getTime() : null;
+}
+function sanitizeUsage(u) {
+    const x = (u ?? {});
+    const n = (v) => (typeof v === 'number' && Number.isFinite(v) ? v : 0);
+    return {
+        input_tokens: n(x.input_tokens),
+        output_tokens: n(x.output_tokens),
+        cache_creation_input_tokens: n(x.cache_creation_input_tokens),
+        cache_read_input_tokens: n(x.cache_read_input_tokens),
+    };
+}

package/dist/core/history.js

@@ -0,0 +1,269 @@
+import { readdirSync, statSync, createReadStream, existsSync } from 'node:fs';
+import { join } from 'node:path';
+import { createInterface } from 'node:readline';
+import { claudeHome } from './detect.js';
+import { addUsage, EMPTY_USAGE, totalTokens } from './types.js';
+import { estimateCostUSD } from './format.js';
+import { loadStore, replaceDayIn, saveStore, } from './history-store.js';
+const cache = new Map();
+let storedDays = null;
+export async function buildHistory(now = Date.now()) {
+    if (storedDays === null)
+        storedDays = loadStore();
+    const root = join(claudeHome(), 'projects');
+    if (!existsSync(root)) {
+        // No transcripts available; surface whatever the store has.
+        return aggregate(now);
+    }
+    const files = listAllJsonl(root);
+    for (const f of files) {
+        const cached = cache.get(f.path);
+        if (!cached || cached.mtimeMs < f.mtimeMs) {
+            const parsed = await parseFile(f.path);
+            cache.set(f.path, {
+                mtimeMs: f.mtimeMs,
+                byDay: parsed.byDay,
+                sessionId: parsed.sessionId,
+                earliestEventMs: parsed.earliestEventMs,
+                latestEventMs: parsed.latestEventMs,
+                cwd: parsed.cwd,
+            });
+        }
+    }
+    const known = new Set(files.map((f) => f.path));
+    for (const key of Array.from(cache.keys())) {
+        if (!known.has(key))
+            cache.delete(key);
+    }
+    return aggregate(now);
+}
+function aggregate(now) {
+    const startToday = startOfDay(now);
+    const start7 = startToday - 6 * 86_400_000;
+    const start30 = startToday - 29 * 86_400_000;
+    // Build the live per-day map from the in-memory cache. Each file knows its
+    // sessionId, so we attach it to every day that file contributed to.
+    const liveDays = new Map();
+    for (const [, file] of cache) {
+        for (const [dayStart, models] of file.byDay) {
+            const entry = liveDays.get(dayStart) ?? { byModel: {}, sessions: new Set() };
+            entry.sessions.add(file.sessionId);
+            for (const [model, usage] of Object.entries(models)) {
+                entry.byModel[model] = addUsage(entry.byModel[model] ?? EMPTY_USAGE(), usage);
+            }
+            liveDays.set(dayStart, entry);
+        }
+    }
+    // Merge: start from the stored archive, then overwrite any day where live
+    // data exists (live transcripts are the authoritative source for days they
+    // cover; the store keeps days whose transcripts no longer exist on disk).
+    const merged = new Map();
+    if (storedDays) {
+        for (const [day, agg] of storedDays) {
+            merged.set(day, {
+                byModel: { ...agg.byModel },
+                sessions: new Set(agg.sessions),
+            });
+        }
+    }
+    for (const [day, agg] of liveDays) {
+        replaceDayIn(merged, day, agg.byModel, agg.sessions);
+    }
+    // Persist the merged view so historical days survive transcript deletion or
+    // a future Claude Code log rotation.
+    storedDays = merged;
+    saveStore(merged);
+    // Earliest data point — prefer the stored archive's earliest day key (since
+    // events from deleted transcripts only live there now), but the live
+    // earliest event timestamp is more precise when it sits within the archive.
+    let oldest = null;
+    for (const day of merged.keys()) {
+        if (oldest === null || day < oldest)
+            oldest = day;
+    }
+    for (const [, file] of cache) {
+        const ts = file.earliestEventMs;
+        if (ts !== null && (oldest === null || ts < oldest))
+            oldest = ts;
+    }
+    const snap = {
+        today: { byModel: {}, sessions: new Set() },
+        d7: { byModel: {}, sessions: new Set() },
+        d30: { byModel: {}, sessions: new Set() },
+        scannedFiles: cache.size,
+        generatedAt: now,
+        oldestMtimeMs: oldest,
+    };
+    for (const [dayStart, agg] of merged) {
+        const buckets = [];
+        if (dayStart >= startToday)
+            buckets.push(snap.today);
+        if (dayStart >= start7)
+            buckets.push(snap.d7);
+        if (dayStart >= start30)
+            buckets.push(snap.d30);
+        if (buckets.length === 0)
+            continue;
+        for (const b of buckets) {
+            for (const sid of agg.sessions)
+                b.sessions.add(sid);
+            for (const [model, usage] of Object.entries(agg.byModel)) {
+                b.byModel[model] = addUsage(b.byModel[model] ?? EMPTY_USAGE(), usage);
+            }
+        }
+    }
+    return snap;
+}
+export function bucketTokens(b) {
+    let n = 0;
+    for (const u of Object.values(b.byModel))
+        n += totalTokens(u);
+    return n;
+}
+export function bucketCostUSD(b) {
+    let total = 0;
+    let any = false;
+    for (const [model, u] of Object.entries(b.byModel)) {
+        const c = estimateCostUSD(model, u);
+        if (c !== null) {
+            total += c;
+            any = true;
+        }
+    }
+    return any ? total : null;
+}
+export function bucketTopModel(b) {
+    let topModel = null;
+    let topTokens = -1;
+    for (const [model, u] of Object.entries(b.byModel)) {
+        const t = totalTokens(u);
+        if (t > topTokens) {
+            topTokens = t;
+            topModel = model;
+        }
+    }
+    return topModel;
+}
+function emptySnapshot(now, scannedFiles) {
+    return {
+        today: { byModel: {}, sessions: new Set() },
+        d7: { byModel: {}, sessions: new Set() },
+        d30: { byModel: {}, sessions: new Set() },
+        scannedFiles,
+        generatedAt: now,
+        oldestMtimeMs: null,
+    };
+}
+function startOfDay(ms) {
+    const d = new Date(ms);
+    d.setHours(0, 0, 0, 0);
+    return d.getTime();
+}
+function listAllJsonl(root) {
+    const out = [];
+    for (const projectDir of safeReaddir(root)) {
+        const full = join(root, projectDir);
+        let st;
+        try {
+            st = statSync(full);
+        }
+        catch {
+            continue;
+        }
+        if (!st.isDirectory())
+            continue;
+        for (const f of safeReaddir(full)) {
+            if (!f.endsWith('.jsonl'))
+                continue;
+            const p = join(full, f);
+            try {
+                const s = statSync(p);
+                out.push({ path: p, mtimeMs: s.mtimeMs });
+            }
+            catch {
+                // ignore
+            }
+        }
+    }
+    return out;
+}
+function safeReaddir(p) {
+    try {
+        return readdirSync(p);
+    }
+    catch {
+        return [];
+    }
+}
+async function parseFile(path) {
+    const byDay = new Map();
+    const sessionId = (path.split('/').pop() ?? path).replace(/\.jsonl$/, '');
+    let earliestEventMs = null;
+    let latestEventMs = null;
+    let cwd;
+    const stream = createReadStream(path, { encoding: 'utf8' });
+    const rl = createInterface({ input: stream, crlfDelay: Infinity });
+    for await (const line of rl) {
+        if (!line.trim())
+            continue;
+        let evt;
+        try {
+            evt = JSON.parse(line);
+        }
+        catch {
+            continue;
+        }
+        if (typeof evt?.cwd === 'string' && !cwd)
+            cwd = evt.cwd;
+        const ts = typeof evt?.timestamp === 'string' ? Date.parse(evt.timestamp) : NaN;
+        if (Number.isFinite(ts)) {
+            if (earliestEventMs === null || ts < earliestEventMs)
+                earliestEventMs = ts;
+            if (latestEventMs === null || ts > latestEventMs)
+                latestEventMs = ts;
+        }
+        const message = evt?.message;
+        const usage = message?.usage;
+        if (!usage)
+            continue;
+        if (!Number.isFinite(ts))
+            continue;
+        const day = startOfDay(ts);
+        const model = typeof message.model === 'string' ? message.model : 'unknown';
+        const u = {
+            input_tokens: numberOr0(usage.input_tokens),
+            output_tokens: numberOr0(usage.output_tokens),
+            cache_creation_input_tokens: numberOr0(usage.cache_creation_input_tokens),
+            cache_read_input_tokens: numberOr0(usage.cache_read_input_tokens),
+        };
+        const bucket = byDay.get(day) ?? {};
+        bucket[model] = addUsage(bucket[model] ?? EMPTY_USAGE(), u);
+        byDay.set(day, bucket);
+    }
+    return { byDay, sessionId, earliestEventMs, latestEventMs, cwd };
+}
+function numberOr0(v) {
+    return typeof v === 'number' && Number.isFinite(v) ? v : 0;
+}
+/**
+ * Returns all sessions (transcripts) that had activity today, sorted by
+ * start time descending (most recent first). Marks the active one.
+ */
+export function getTodaySessions(now, activePath) {
+    const startToday = startOfDay(now);
+    const out = [];
+    for (const [path, file] of cache) {
+        const todayUsage = file.byDay.get(startToday);
+        if (!todayUsage)
+            continue;
+        out.push({
+            sessionId: file.sessionId,
+            cwd: file.cwd,
+            startedAt: file.earliestEventMs,
+            endedAt: file.latestEventMs,
+            byModel: todayUsage,
+            isActive: path === activePath,
+        });
+    }
+    return out.sort((a, b) => (b.startedAt ?? 0) - (a.startedAt ?? 0));
+}

package/dist/tui/bars.js

@@ -25,17 +25,25 @@ const SPARK = ['▁', '▂', '▃', '▄', '▅', '▆', '▇', '█'];
  * series max. Returns empty cells when there's no data yet.
  */
 export function sparkline(values, width) {
+    return sparklineCells(values, width)
+        .map((c) => c.char)
+        .join('');
+}
+/**
+ * Per-cell version of `sparkline` so the caller can color each character
+ * individually based on intensity.
+ */
+export function sparklineCells(values, width) {
     if (width <= 0)
-        return '';
+        return [];
     const tail = values.slice(-width);
     const padded = tail.length < width ? Array(width - tail.length).fill(0).concat(tail) : tail;
     const max = Math.max(1, ...padded);
-    return padded
-        .map((v) => {
+    return padded.map((v) => {
         if (v <= 0)
-            return ' ';
-        const idx = Math.min(SPARK.length - 1, Math.floor((v / max) * (SPARK.length - 1)));
-        return SPARK[idx];
-    })
-        .join('');
+            return { char: ' ', intensity: 0 };
+        const ratio = v / max;
+        const idx = Math.min(SPARK.length - 1, Math.floor(ratio * (SPARK.length - 1)));
+        return { char: SPARK[idx], intensity: ratio };
+    });
 }

package/dist/tui/index.js

@@ -5,17 +5,20 @@ import { render, Box, Text, useApp, useInput } from 'ink';
 import { findActiveTranscript, listTranscripts } from '../core/parser.js';
 import { tailTranscript } from '../core/tailer.js';
 import { detectAuth } from '../core/detect.js';
-import { estimateCostUSD, fmtNumber, fmtUSD } from '../core/format.js';
+import { categoryCostUSD, estimateCostUSD, fmtNumber, fmtUSD } from '../core/format.js';
+import { buildHistory, bucketCostUSD, bucketTokens, bucketTopModel, getTodaySessions, } from '../core/history.js';
 import { totalTokens } from '../core/types.js';
-import { anonymizePath, maskUserId } from '../core/privacy.js';
+import { anonymizePath } from '../core/privacy.js';
 import { HELP_TEXT, parseArgs } from '../core/args.js';
-import { bar, sparkline } from './bars.js';
+import pkg from '../../package.json' assert { type: 'json' };
+import { bar, sparklineCells } from './bars.js';
 const OPTS = parseArgs(process.argv);
 if (OPTS.help) {
     process.stdout.write(HELP_TEXT);
     process.exit(0);
 }
 const RESCAN_MS = 3_000;
+const HISTORY_REFRESH_MS = 60_000;
 const SPARK_WIDTH = 32;
 const BAR_WIDTH = 20;
 function App() {
@@ -23,11 +26,12 @@ function App() {
     const [auth] = useState(() => detectAuth());
     const [stats, setStats] = useState(null);
     const [transcriptPath, setTranscriptPath] = useState(null);
-    const [rate, setRate] = useState(0);
     const [series, setSeries] = useState(() => Array(SPARK_WIDTH).fill(0));
     const [now, setNow] = useState(Date.now());
+    const [lastTailAt, setLastTailAt] = useState(null);
+    const [history, setHistory] = useState(null);
+    const startedAtRef = useRef(Date.now());
     const lastTotalRef = useRef(0);
-    const lastSampleAtRef = useRef(Date.now());
     // useInput requires raw mode (interactive TTY). Skip it when stdin is piped
     // or otherwise non-interactive, so `node dist/tui/index.js | cat` still
     // renders instead of crashing.
@@ -39,6 +43,27 @@ function App() {
                 exit();
         });
     }
+    // Historical aggregate over all transcripts. Refreshed on an interval —
+    // the live session is already shown in SessionPanel, so minute-grain
+    // accuracy on today's bucket is enough and keeps full parses out of the
+    // hot path.
+    useEffect(() => {
+        let cancelled = false;
+        const refresh = () => {
+            buildHistory()
+                .then((h) => {
+                if (!cancelled)
+                    setHistory(h);
+            })
+                .catch(() => undefined);
+        };
+        refresh();
+        const t = setInterval(refresh, HISTORY_REFRESH_MS);
+        return () => {
+            cancelled = true;
+            clearInterval(t);
+        };
+    }, []);
     // Wall-clock tick + sparkline slot rotation (1 Hz).
     useEffect(() => {
         const t = setInterval(() => {
@@ -62,14 +87,12 @@ function App() {
             // before returning, but its first notify() fires before any listener
             // is attached, so we'd otherwise wait for the next appended line.
             lastTotalRef.current = totalTokens(handle.stats.totals);
-            lastSampleAtRef.current = Date.now();
+            setLastTailAt(Date.now());
             setStats({ ...handle.stats });
             handle.onUpdate((s) => {
+                setLastTailAt(Date.now());
                 const tot = totalTokens(s.totals);
                 const delta = Math.max(0, tot - lastTotalRef.current);
-                const dt = (Date.now() - lastSampleAtRef.current) / 60_000;
-                if (dt > 0 && delta > 0)
-                    setRate(delta / dt);
                 if (delta > 0) {
                     setSeries((arr) => {
                         const next = arr.slice();
@@ -78,7 +101,6 @@ function App() {
                     });
                 }
                 lastTotalRef.current = tot;
-                lastSampleAtRef.current = Date.now();
                 setStats({ ...s });
             });
         }
@@ -96,61 +118,162 @@ function App() {
         };
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
-    const transcripts = listTranscripts().slice(0, 5);
-    return (_jsxs(Box, { flexDirection: "column", padding: 1, children: [_jsx(Header, { auth: auth }), _jsxs(Box, { marginTop: 1, flexDirection: "row", gap: 1, children: [_jsx(SessionPanel, { stats: stats, rate: rate, now: now, series: series }), _jsx(BreakdownPanel, { stats: stats })] }), _jsx(Box, { marginTop: 1, children: _jsx(TranscriptsPanel, { transcripts: transcripts, activePath: transcriptPath, now: now }) }), _jsx(Box, { marginTop: 1, children: _jsxs(Text, { dimColor: true, children: [_jsx(Text, { color: "magenta", children: "q" }), " quit \u00B7", ' ', _jsx(Text, { color: "magenta", children: "live" }), " tail of ~/.claude/projects \u00B7 pricing is", ' ', _jsx(Text, { italic: true, children: "API-equivalent" }), ", not your real bill on a subscription"] }) })] }));
+    const allTranscripts = listTranscripts();
+    const transcripts = allTranscripts.slice(0, 5);
+    const today = countToday(allTranscripts, now);
+    const ratePerSec = series.reduce((a, b) => a + b, 0) / SPARK_WIDTH;
+    const todaySessions = getTodaySessions(now, transcriptPath);
+    return (_jsxs(Box, { flexDirection: "column", padding: 1, children: [_jsx(Header, { auth: auth, sessionsToday: today.sessions, projectsToday: today.projects, lastTailAt: lastTailAt, startedAt: startedAtRef.current, now: now }), _jsxs(Box, { marginTop: 1, flexDirection: "row", gap: 1, children: [_jsx(SessionPanel, { stats: stats, ratePerSec: ratePerSec, now: now, series: series }), _jsx(BreakdownPanel, { stats: stats })] }), _jsx(Box, { marginTop: 1, children: _jsx(HistoryPanel, { history: history }) }), todaySessions.length > 0 && (_jsx(Box, { marginTop: 1, children: _jsx(TodaySessionsPanel, { sessions: todaySessions, now: now }) })), _jsx(Box, { marginTop: 1, children: _jsx(TranscriptsPanel, { transcripts: transcripts, activePath: transcriptPath, now: now }) }), _jsx(Box, { marginTop: 1, children: _jsxs(Text, { dimColor: true, children: [_jsx(Text, { color: "magenta", children: "q" }), " quit \u00B7", ' ', _jsx(Text, { color: "magenta", children: "live" }), " tail of ~/.claude/projects \u00B7 pricing is", ' ', _jsx(Text, { italic: true, children: "API-equivalent" }), ", not your real bill on a subscription"] }) })] }));
 }
 // ── Header ───────────────────────────────────────────────────────────────────
-function Header({ auth }) {
+function Header({ auth, sessionsToday, projectsToday, lastTailAt, startedAt, now, }) {
     const ok = auth.installed && auth.loggedIn;
     const dot = ok ? 'green' : auth.installed ? 'yellow' : 'red';
-    const planChip = planChipFor(auth);
-    return (_jsxs(Box, { borderStyle: "round", borderColor: "cyan", paddingX: 1, flexDirection: "column", children: [_jsxs(Box, { children: [_jsx(Text, { bold: true, color: "cyan", children: "\u258C tokens-metric " }), _jsx(Text, { dimColor: true, children: "v0.1.0 \u2014 real-time Claude Code usage" })] }), _jsx(Box, { marginTop: 0, children: _jsxs(Text, { children: [_jsx(Text, { color: dot, children: "\u25CF" }), ' ', auth.installed ? 'Claude Code detected' : 'Claude Code NOT detected', '   ', _jsx(Text, { ...planChip.style, children: planChip.label }), auth.userIdShort && (_jsx(Text, { dimColor: true, children: `   user ${maskUserId(auth.userIdShort, OPTS.reveal)}` }))] }) }), auth.hint && (_jsx(Box, { children: _jsxs(Text, { dimColor: true, children: ["\u21B3 ", auth.hint] }) }))] }));
-}
-function planChipFor(auth) {
-    if (!auth.loggedIn)
-        return { label: ' LOGGED-OUT ', style: { color: 'red', bold: true } };
-    switch (auth.planHint) {
-        case 'api':
-            return { label: ' API ', style: { color: 'yellow', bold: true } };
-        case 'team-or-enterprise':
-            return { label: ' TEAM / ENTERPRISE ', style: { color: 'magenta', bold: true } };
-        case 'paid':
-            return { label: ' PRO / MAX ', style: { color: 'green', bold: true } };
-        case 'free':
-            return { label: ' FREE ', style: { color: 'blue', bold: true } };
-        default:
-            return { label: ' SUBSCRIPTION ', style: { color: 'cyan', bold: true } };
+    const tailLabel = lastTailAt ? `updated ${timeAgo(now - lastTailAt)} ago` : 'waiting…';
+    const tailColor = !lastTailAt ? 'gray' : now - lastTailAt < 10_000 ? 'green' : 'yellow';
+    return (_jsxs(Box, { borderStyle: "round", borderColor: "cyan", paddingX: 1, flexDirection: "column", children: [_jsxs(Box, { children: [_jsx(Text, { bold: true, color: "cyan", children: "\u258C tokens-metric " }), _jsxs(Text, { dimColor: true, children: ["v", pkg.version, " \u2014 real-time Claude Code usage"] })] }), _jsx(Box, { marginTop: 0, children: _jsxs(Text, { children: [_jsx(Text, { color: dot, children: "\u25CF" }), ' ', auth.installed ? 'Claude Code detected' : 'Claude Code NOT detected', _jsx(Text, { dimColor: true, children: '   ·   ' }), _jsx(Text, { children: sessionsToday }), _jsx(Text, { dimColor: true, children: ` ${plural(sessionsToday, 'session', 'sessions')} · ` }), _jsx(Text, { children: projectsToday }), _jsx(Text, { dimColor: true, children: ` ${plural(projectsToday, 'project', 'projects')} today` })] }) }), _jsxs(Box, { children: [_jsx(Text, { dimColor: true, children: "watching ~/.claude/projects \u00B7 " }), _jsx(Text, { color: tailColor, children: tailLabel }), _jsx(Text, { dimColor: true, children: '   ·   uptime ' }), _jsx(Text, { children: timeAgo(now - startedAt) })] })] }));
+}
+function countToday(transcripts, now) {
+    const startOfDay = new Date(now);
+    startOfDay.setHours(0, 0, 0, 0);
+    const cutoff = startOfDay.getTime();
+    const projects = new Set();
+    let sessions = 0;
+    for (const t of transcripts) {
+        if (t.mtimeMs < cutoff)
+            continue;
+        sessions++;
+        projects.add(t.cwd);
     }
+    return { sessions, projects: projects.size };
 }
 // ── Session panel ────────────────────────────────────────────────────────────
-function SessionPanel({ stats, rate, now, series, }) {
-    return (_jsxs(Box, { borderStyle: "round", borderColor: "green", paddingX: 1, flexDirection: "column", flexGrow: 1, minWidth: 42, children: [_jsx(Text, { bold: true, color: "green", children: "Active session" }), !stats ? (_jsx(Text, { dimColor: true, children: "Waiting for a Claude Code session\u2026" })) : (_jsxs(_Fragment, { children: [_jsx(KV, { k: "Model", v: _jsx(Text, { color: "cyan", children: stats.lastModel ?? '—' }) }), _jsx(KV, { k: "Msgs ", v: _jsx(Text, { children: stats.messageCount }) }), _jsx(KV, { k: "Last ", v: stats.lastEventAt ? (_jsxs(Text, { children: [timeAgo(now - stats.lastEventAt), " ago"] })) : (_jsx(Text, { dimColor: true, children: "\u2014" })) }), _jsx(KV, { k: "cwd  ", v: _jsx(Text, { dimColor: true, wrap: "truncate-middle", children: OPTS.reveal ? (stats.cwd ?? '—') : anonymizePath(stats.cwd) }) }), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsxs(Text, { children: [_jsx(Text, { bold: true, children: "\u03A3 " }), _jsx(Text, { color: "cyan", bold: true, children: fmtNumber(totalTokens(stats.totals)) }), _jsx(Text, { dimColor: true, children: " tokens" })] }), (() => {
+function SessionPanel({ stats, ratePerSec, now, series, }) {
+    return (_jsxs(Box, { borderStyle: "round", borderColor: "green", paddingX: 1, flexDirection: "column", flexGrow: 1, minWidth: 42, children: [_jsxs(Text, { bold: true, color: "green", children: ['Active session', stats?.startedAt ? (_jsx(Text, { color: "green", bold: false, children: ` · since ${fmtTime(stats.startedAt)}` })) : null] }), !stats ? (_jsx(Text, { dimColor: true, children: "Waiting for a Claude Code session\u2026" })) : (_jsxs(_Fragment, { children: [_jsx(KV, { k: "Model", v: _jsx(Text, { color: "cyan", children: stats.lastModel ?? '—' }) }), _jsx(KV, { k: "Msgs ", v: _jsx(Text, { children: stats.messageCount }) }), _jsx(KV, { k: "Last ", v: stats.lastEventAt ? (_jsxs(Text, { children: [timeAgo(now - stats.lastEventAt), " ago"] })) : (_jsx(Text, { dimColor: true, children: "\u2014" })) }), _jsx(KV, { k: "cwd  ", v: _jsx(Text, { dimColor: true, wrap: "truncate-middle", children: OPTS.reveal ? (stats.cwd ?? '—') : anonymizePath(stats.cwd) }) }), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsxs(Text, { children: [_jsx(Text, { bold: true, children: "\u03A3 " }), _jsx(Text, { color: "cyan", bold: true, children: fmtNumber(totalTokens(stats.totals)) }), _jsx(Text, { dimColor: true, children: " tokens" })] }), (() => {
                                 const cost = estimateCostUSD(stats.lastModel ?? '', stats.totals);
                                 return cost !== null ? (_jsxs(Text, { dimColor: true, children: ["~", fmtUSD(cost), " API-equivalent"] })) : null;
-                            })(), _jsxs(Text, { children: [_jsx(Text, { bold: true, children: "~ " }), _jsx(Text, { color: "yellow", children: fmtNumber(Math.round(rate)) }), _jsx(Text, { dimColor: true, children: " tok/min" })] })] }), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsxs(Text, { dimColor: true, children: ["activity (last ", SPARK_WIDTH, "s)"] }), _jsx(Text, { color: "yellow", children: sparkline(series, SPARK_WIDTH) })] })] }))] }));
+                            })(), Math.round(ratePerSec) > 0 && (_jsxs(Text, { children: [_jsx(Text, { bold: true, children: "~ " }), _jsx(Text, { color: "yellow", children: fmtNumber(Math.round(ratePerSec)) }), _jsxs(Text, { dimColor: true, children: [" tok/s (avg last ", SPARK_WIDTH, "s)"] })] }))] }), series.some((n) => n > 0) ? (_jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsxs(Text, { children: [_jsxs(Text, { dimColor: true, children: ["activity (last ", SPARK_WIDTH, "s)"] }), _jsx(Text, { dimColor: true, children: "   peak " }), _jsx(Text, { bold: true, color: "yellow", children: fmtNumber(Math.max(...series)) }), _jsx(Text, { dimColor: true, children: "/s" })] }), _jsx(Text, { children: sparklineCells(series, SPARK_WIDTH).map((cell, i) => (_jsx(Text, { color: intensityColor(cell.intensity), children: cell.char }, i))) }), _jsx(Text, { dimColor: true, children: axisLabel(SPARK_WIDTH) })] })) : (_jsx(Box, { marginTop: 1, children: _jsxs(Text, { dimColor: true, children: ["idle \u2014 no activity in the last ", SPARK_WIDTH, "s"] }) }))] }))] }));
 }
 // ── Breakdown panel ──────────────────────────────────────────────────────────
 function BreakdownPanel({ stats }) {
     return (_jsxs(Box, { borderStyle: "round", borderColor: "blue", paddingX: 1, flexDirection: "column", flexGrow: 1, minWidth: 42, children: [_jsx(Text, { bold: true, color: "blue", children: "Token breakdown" }), !stats ? (_jsx(Text, { dimColor: true, children: "No data yet." })) : ((() => {
                 const u = stats.totals;
                 const max = Math.max(1, u.input_tokens, u.output_tokens, u.cache_creation_input_tokens, u.cache_read_input_tokens);
-                return (_jsxs(Box, { flexDirection: "column", children: [_jsx(BarRow, { label: "Input    ", value: u.input_tokens, max: max, color: "cyan" }), _jsx(BarRow, { label: "Output   ", value: u.output_tokens, max: max, color: "green" }), _jsx(BarRow, { label: "C. write ", value: u.cache_creation_input_tokens, max: max, color: "yellow" }), _jsx(BarRow, { label: "C. read  ", value: u.cache_read_input_tokens, max: max, color: "magenta" }), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { dimColor: true, children: "By model" }), Object.entries(stats.byModel).map(([m, mu]) => (_jsxs(Text, { children: [_jsx(Text, { color: "cyan", children: shortModel(m) }), _jsx(Text, { dimColor: true, children: "  \u03A3 " }), _jsx(Text, { children: fmtNumber(totalTokens(mu)) })] }, m)))] })] }));
+                const total = totalTokens(u);
+                const model = stats.lastModel ?? '';
+                const cacheDenom = u.input_tokens + u.cache_read_input_tokens;
+                const hitRatio = cacheDenom > 0 ? u.cache_read_input_tokens / cacheDenom : null;
+                return (_jsxs(Box, { flexDirection: "column", children: [_jsx(BarRow, { label: "Input    ", value: u.input_tokens, max: max, total: total, color: "cyan", cost: categoryCostUSD(model, 'input', u.input_tokens) }), _jsx(BarRow, { label: "Output   ", value: u.output_tokens, max: max, total: total, color: "green", cost: categoryCostUSD(model, 'output', u.output_tokens) }), _jsx(BarRow, { label: "C. write ", value: u.cache_creation_input_tokens, max: max, total: total, color: "yellow", cost: categoryCostUSD(model, 'cacheWrite', u.cache_creation_input_tokens) }), _jsx(BarRow, { label: "C. read  ", value: u.cache_read_input_tokens, max: max, total: total, color: "magenta", cost: categoryCostUSD(model, 'cacheRead', u.cache_read_input_tokens) }), hitRatio !== null && (_jsx(Box, { marginTop: 1, children: _jsxs(Text, { children: [_jsx(Text, { bold: true, children: "Cache hit" }), _jsx(Text, { dimColor: true, children: " \u00B7 " }), _jsxs(Text, { color: hitRatio > 0.9 ? 'green' : hitRatio > 0.6 ? 'yellow' : 'red', children: [(hitRatio * 100).toFixed(1), "%"] }), _jsx(Text, { dimColor: true, children: "  (cache read / (input + cache read))" })] }) })), Object.keys(stats.byModel).length > 1 && (_jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { dimColor: true, children: "By model" }), Object.entries(stats.byModel).map(([m, mu]) => {
+                                    const c = estimateCostUSD(m, mu);
+                                    return (_jsxs(Text, { children: [_jsx(Text, { color: "cyan", children: shortModel(m) }), _jsx(Text, { dimColor: true, children: "  \u03A3 " }), _jsx(Text, { children: fmtNumber(totalTokens(mu)) }), c !== null && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: "  ~" }), _jsx(Text, { children: fmtUSD(c) })] }))] }, m));
+                                })] }))] }));
             })())] }));
 }
-function BarRow({ label, value, max, color, }) {
-    return (_jsxs(Text, { children: [_jsx(Text, { bold: true, children: label }), _jsx(Text, { color: color, children: bar(value / max, BAR_WIDTH) }), _jsxs(Text, { children: ["  ", fmtNumber(value)] })] }));
+function BarRow({ label, value, max, total, color, cost, }) {
+    const pct = total > 0 ? (value / total) * 100 : 0;
+    return (_jsxs(Text, { children: [_jsx(Text, { bold: true, children: label }), _jsx(Text, { color: color, children: bar(value / max, BAR_WIDTH) }), _jsxs(Text, { children: ["  ", fmtNumber(value).padStart(7, ' ')] }), _jsx(Text, { dimColor: true, children: `  ${pct.toFixed(1).padStart(5, ' ')}%` }), cost !== null && _jsx(Text, { dimColor: true, children: `  ~${fmtUSD(cost)}` })] }));
+}
+// ── History panel ────────────────────────────────────────────────────────────
+function HistoryPanel({ history }) {
+    return (_jsxs(Box, { borderStyle: "round", borderColor: "magenta", paddingX: 1, flexDirection: "column", width: "100%", children: [_jsx(Text, { bold: true, color: "magenta", children: "Usage history" }), !history ? (_jsx(Text, { dimColor: true, children: "Scanning ~/.claude/projects\u2026" })) : history.scannedFiles === 0 ? (_jsx(Text, { dimColor: true, children: "No transcripts found." })) : (_jsxs(_Fragment, { children: [_jsx(HistoryRow, { label: "", today: "Today", d7: "7d", d30: "30d", dim: true }), _jsx(HistoryRow, { label: "Tokens ", today: fmtNumber(bucketTokens(history.today)), d7: fmtNumber(bucketTokens(history.d7)), d30: fmtNumber(bucketTokens(history.d30)) }), _jsx(HistoryRow, { label: "Cost~  ", today: fmtCost(bucketCostUSD(history.today)), d7: fmtCost(bucketCostUSD(history.d7)), d30: fmtCost(bucketCostUSD(history.d30)) }), _jsx(HistoryRow, { label: "Sessions", today: String(history.today.sessions.size), d7: String(history.d7.sessions.size), d30: String(history.d30.sessions.size) }), _jsx(HistoryRow, { label: "Top model", today: fmtTopModel(history.today), d7: fmtTopModel(history.d7), d30: fmtTopModel(history.d30) }), _jsx(Box, { marginTop: 1, children: _jsxs(Text, { dimColor: true, children: [`scanned ${history.scannedFiles} transcripts`, history.oldestMtimeMs !== null &&
+                                    ` · data since ${fmtDate(history.oldestMtimeMs)} (${daysAgo(history.oldestMtimeMs, history.generatedAt)} days)`] }) })] }))] }));
+}
+function fmtDate(ms) {
+    const d = new Date(ms);
+    const y = d.getFullYear();
+    const m = String(d.getMonth() + 1).padStart(2, '0');
+    const day = String(d.getDate()).padStart(2, '0');
+    return `${y}-${m}-${day}`;
+}
+function daysAgo(from, to) {
+    return Math.max(0, Math.floor((to - from) / 86_400_000));
+}
+function HistoryRow({ label, today, d7, d30, dim, }) {
+    const col = (s) => s.padEnd(14, ' ');
+    return (_jsxs(Text, { dimColor: dim, children: [_jsx(Text, { bold: true, children: label.padEnd(10, ' ') }), _jsx(Text, { children: col(today) }), _jsx(Text, { children: col(d7) }), _jsx(Text, { children: col(d30) })] }));
+}
+function fmtCost(c) {
+    return c === null ? '—' : fmtUSD(c);
+}
+function fmtTopModel(b) {
+    const m = bucketTopModel(b);
+    return m ? shortModel(m) : '—';
+}
+// ── Today's sessions panel ───────────────────────────────────────────────────
+function TodaySessionsPanel({ sessions, now }) {
+    return (_jsxs(Box, { borderStyle: "round", borderColor: "cyan", paddingX: 1, flexDirection: "column", width: "100%", children: [_jsx(Text, { bold: true, color: "cyan", children: "Today's sessions" }), sessions.map((s) => {
+                const tokens = Object.values(s.byModel).reduce((acc, u) => acc + totalTokens(u), 0);
+                const cost = Object.entries(s.byModel).reduce((acc, [m, u]) => {
+                    const c = estimateCostUSD(m, u);
+                    if (c === null)
+                        return acc;
+                    return (acc ?? 0) + c;
+                }, null);
+                const topModel = Object.entries(s.byModel).reduce((best, [m, u]) => best === null || totalTokens(u) > totalTokens(s.byModel[best] ?? {})
+                    ? m
+                    : best, null);
+                const duration = s.startedAt !== null && s.endedAt !== null
+                    ? fmtDuration(s.endedAt - s.startedAt)
+                    : null;
+                return (_jsxs(Text, { children: [_jsx(Text, { color: s.isActive ? 'green' : 'gray', children: s.isActive ? '▶ ' : '  ' }), _jsx(Text, { bold: s.isActive, children: s.startedAt ? fmtTime(s.startedAt) : '??:??' }), _jsx(Text, { dimColor: true, children: '  ' }), _jsx(Text, { wrap: "truncate-middle", dimColor: !s.isActive, children: OPTS.reveal ? (s.cwd ?? '—') : displayCwd(s.cwd) }), _jsx(Text, { dimColor: true, children: '  ' }), _jsx(Text, { color: "cyan", children: topModel ? shortModel(topModel) : '—' }), _jsx(Text, { dimColor: true, children: '  ' }), _jsx(Text, { children: fmtNumber(tokens) }), cost !== null && _jsx(Text, { dimColor: true, children: `  ~${fmtUSD(cost)}` }), duration && _jsx(Text, { dimColor: true, children: `  ${duration}` }), s.isActive && _jsx(Text, { color: "green", children: " active" })] }, s.sessionId));
+            })] }));
+}
+function fmtDuration(ms) {
+    const totalSec = Math.floor(ms / 1000);
+    const h = Math.floor(totalSec / 3600);
+    const m = Math.floor((totalSec % 3600) / 60);
+    if (h > 0)
+        return `${h}h ${m}m`;
+    if (m > 0)
+        return `${m}m`;
+    return `${totalSec}s`;
 }
 // ── Transcripts panel ────────────────────────────────────────────────────────
 function TranscriptsPanel({ transcripts, activePath, now, }) {
     return (_jsxs(Box, { borderStyle: "round", borderColor: "gray", paddingX: 1, flexDirection: "column", width: "100%", children: [_jsx(Text, { bold: true, children: "Recent transcripts" }), transcripts.length === 0 ? (_jsx(Text, { dimColor: true, children: "None found under ~/.claude/projects" })) : (transcripts.map((t) => {
                 const isActive = t.path === activePath;
-                return (_jsxs(Text, { children: [_jsx(Text, { color: isActive ? 'green' : 'gray', children: isActive ? '▶ ' : '  ' }), _jsx(Text, { dimColor: !isActive, wrap: "truncate-middle", children: OPTS.reveal ? t.cwd : anonymizePath(t.cwd) }), _jsx(Text, { dimColor: true, children: `   ${timeAgo(now - t.mtimeMs)}` })] }, t.path));
+                return (_jsxs(Text, { children: [_jsx(Text, { color: isActive ? 'green' : 'gray', children: isActive ? '▶ ' : '  ' }), _jsx(Text, { dimColor: !isActive, wrap: "truncate-middle", children: OPTS.reveal ? t.cwd : displayCwd(t.cwd) }), _jsx(Text, { dimColor: true, children: `   ${timeAgo(now - t.mtimeMs)}` })] }, t.path));
             }))] }));
 }
 // ── helpers ──────────────────────────────────────────────────────────────────
 function KV({ k, v }) {
     return (_jsxs(Text, { children: [_jsx(Text, { bold: true, children: k }), _jsx(Text, { dimColor: true, children: " \u00B7 " }), v] }));
 }
+function fmtTime(ms) {
+    const d = new Date(ms);
+    const h = String(d.getHours()).padStart(2, '0');
+    const m = String(d.getMinutes()).padStart(2, '0');
+    return `${h}:${m}`;
+}
+function plural(n, one, many) {
+    return n === 1 ? one : many;
+}
+/**
+ * Like anonymizePath, but distinguishes the bare home directory from "no
+ * path" — a transcript whose cwd is $HOME would otherwise show as a lonely
+ * `~`, which looks like a bug.
+ */
+function displayCwd(cwd) {
+    const out = anonymizePath(cwd);
+    if (out === '~')
+        return '~ (home)';
+    return out;
+}
+function intensityColor(ratio) {
+    if (ratio <= 0)
+        return 'gray';
+    if (ratio < 0.34)
+        return 'green';
+    if (ratio < 0.67)
+        return 'yellow';
+    return 'red';
+}
+function axisLabel(width) {
+    const left = `-${width}s`;
+    const right = 'now';
+    const gap = Math.max(1, width - left.length - right.length);
+    return `${left}${' '.repeat(gap)}${right}`;
+}
 function shortModel(m) {
     return m.replace(/^claude-/, '').replace(/-20\d{6}/, '').replace(/-\d{8}$/, '');
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tokens-metric",
-  "version": "0.2.4",
+  "version": "0.3.0",
   "description": "Real-time token usage meter for Claude Code — statusline + Ink TUI.",
   "type": "module",
   "bin": {