@tokentop/ttop 0.6.1 → 0.8.0

package/src/storage/persistence-service.test.ts

@@ -0,0 +1,201 @@
+import { beforeEach, describe, expect, mock, test } from "bun:test";
+import type {
+  AgentSessionSnapshotInsert,
+  AgentSessionStreamSnapshotRow,
+  AgentSessionUpsert,
+  UsageEventInsert,
+} from "./types.ts";
+
+mock.module("./db.ts", () => ({
+  isDatabaseInitialized: () => true,
+}));
+
+let upsertCalls: AgentSessionUpsert[] = [];
+let snapshotCalls: Array<{
+  snapshot: AgentSessionSnapshotInsert;
+  streams: Omit<AgentSessionStreamSnapshotRow, "agentSessionSnapshotId">[];
+}> = [];
+let usageEventCalls: UsageEventInsert[][] = [];
+
+let seededSnapshots: Array<{
+  agentId: string;
+  sessionId: string;
+  timestamp: number;
+  totalCostUsd: number;
+  requestCount: number;
+  totalInputTokens: number;
+  totalOutputTokens: number;
+}> = [];
+
+mock.module("./repos/agentSessions.ts", () => ({
+  getLatestSnapshotsForAllSessions: () => seededSnapshots,
+  getLatestStreamTotalsForAllSessions: () => [],
+  upsertAgentSession: (session: AgentSessionUpsert) => {
+    upsertCalls.push(session);
+    return upsertCalls.length;
+  },
+  insertAgentSessionSnapshot: (
+    snapshot: AgentSessionSnapshotInsert,
+    streams: Omit<AgentSessionStreamSnapshotRow, "agentSessionSnapshotId">[],
+  ) => {
+    snapshotCalls.push({ snapshot, streams });
+  },
+}));
+
+mock.module("./repos/usageEvents.ts", () => ({
+  insertUsageEventBatch: (events: UsageEventInsert[]) => {
+    usageEventCalls.push(events);
+  },
+}));
+
+const { persistSessions, seedPreviousTotals } = await import("./persistence-service.ts");
+
+beforeEach(() => {
+  upsertCalls = [];
+  snapshotCalls = [];
+  usageEventCalls = [];
+  seededSnapshots = [];
+  (globalThis as { __tokentopPersistence?: unknown }).__tokentopPersistence = undefined;
+});
+
+function makePersistData(overrides: {
+  agentId?: string;
+  sessionId?: string;
+  totalCostUsd?: number;
+  requestCount?: number;
+  totalInputTokens?: number;
+  totalOutputTokens?: number;
+  timestamp?: number;
+}) {
+  const now = overrides.timestamp ?? Date.now();
+  return {
+    session: {
+      agentId: overrides.agentId ?? "claude-code",
+      sessionId: overrides.sessionId ?? "s1",
+      projectPath: null,
+      startedAt: null,
+      lastSeenAt: now,
+    },
+    snapshot: {
+      timestamp: now,
+      lastActivityAt: now,
+      status: null,
+      totalInputTokens: overrides.totalInputTokens ?? 1000,
+      totalOutputTokens: overrides.totalOutputTokens ?? 500,
+      totalCacheReadTokens: 0,
+      totalCacheWriteTokens: 0,
+      totalCostUsd: overrides.totalCostUsd ?? 1.5,
+      requestCount: overrides.requestCount ?? 10,
+    },
+    streams: [],
+  };
+}
+
+describe("seedPreviousTotals", () => {
+  test("skips persist for session whose fingerprint matches seeded DB snapshot", () => {
+    seededSnapshots = [
+      {
+        agentId: "claude-code",
+        sessionId: "s1",
+        timestamp: Date.now() - 60_000,
+        totalCostUsd: 1.5,
+        requestCount: 10,
+        totalInputTokens: 1000,
+        totalOutputTokens: 500,
+      },
+    ];
+
+    seedPreviousTotals();
+
+    const persistedCount = persistSessions([
+      makePersistData({
+        agentId: "claude-code",
+        sessionId: "s1",
+        totalCostUsd: 1.5,
+        requestCount: 10,
+        totalInputTokens: 1000,
+        totalOutputTokens: 500,
+      }),
+    ]);
+
+    expect(persistedCount).toBe(0);
+    expect(upsertCalls).toHaveLength(0);
+    expect(snapshotCalls).toHaveLength(0);
+  });
+
+  test("persists session whose usage changed since seeded snapshot", () => {
+    seededSnapshots = [
+      {
+        agentId: "claude-code",
+        sessionId: "s1",
+        timestamp: Date.now() - 10 * 60 * 1000,
+        totalCostUsd: 1.5,
+        requestCount: 10,
+        totalInputTokens: 1000,
+        totalOutputTokens: 500,
+      },
+    ];
+
+    seedPreviousTotals();
+
+    const persistedCount = persistSessions([
+      makePersistData({
+        agentId: "claude-code",
+        sessionId: "s1",
+        totalCostUsd: 2.0,
+        requestCount: 12,
+        totalInputTokens: 1200,
+        totalOutputTokens: 600,
+      }),
+    ]);
+
+    expect(persistedCount).toBe(1);
+    expect(upsertCalls).toHaveLength(1);
+    expect(snapshotCalls).toHaveLength(1);
+  });
+
+  test("persists brand-new session not present in seed", () => {
+    seededSnapshots = [];
+
+    seedPreviousTotals();
+
+    const persistedCount = persistSessions([
+      makePersistData({ agentId: "claude-code", sessionId: "new-session" }),
+    ]);
+
+    expect(persistedCount).toBe(1);
+    expect(upsertCalls).toHaveLength(1);
+  });
+
+  test("skips thousands of unchanged sessions after seed (regression for startup freeze)", () => {
+    const baseTs = Date.now() - 60_000;
+    seededSnapshots = Array.from({ length: 5000 }, (_, i) => ({
+      agentId: "claude-code",
+      sessionId: `s${i}`,
+      timestamp: baseTs + i,
+      totalCostUsd: i * 0.01,
+      requestCount: i,
+      totalInputTokens: i * 100,
+      totalOutputTokens: i * 50,
+    }));
+
+    seedPreviousTotals();
+
+    const persistData = seededSnapshots.map((s) =>
+      makePersistData({
+        agentId: s.agentId,
+        sessionId: s.sessionId,
+        totalCostUsd: s.totalCostUsd,
+        requestCount: s.requestCount,
+        totalInputTokens: s.totalInputTokens,
+        totalOutputTokens: s.totalOutputTokens,
+      }),
+    );
+
+    const persistedCount = persistSessions(persistData);
+
+    expect(persistedCount).toBe(0);
+    expect(upsertCalls).toHaveLength(0);
+    expect(snapshotCalls).toHaveLength(0);
+  });
+});

package/src/storage/persistence-service.ts

@@ -15,6 +15,7 @@
 
 import { isDatabaseInitialized } from "./db.ts";
 import {
+  getLatestSnapshotsForAllSessions,
   getLatestStreamTotalsForAllSessions,
   insertAgentSessionSnapshot,
   upsertAgentSession,
@@ -36,6 +37,12 @@ import { computeStreamDelta } from "./types.ts";
 /** Minimum interval between DB writes for the same session */
 const SNAPSHOT_INTERVAL_MS = 300_000; // 5 minutes
 
+/** Remove tracking entries for sessions not written in this window */
+const STALE_ENTRY_MAX_AGE_MS = 24 * 60 * 60 * 1000; // 24 hours
+
+/** Run eviction at most this often */
+const EVICTION_INTERVAL_MS = 10 * 60 * 1000; // 10 minutes
+
 // ---------------------------------------------------------------------------
 // Global state (survives bun --hot HMR and React remounts)
 // ---------------------------------------------------------------------------
@@ -49,6 +56,8 @@ interface PersistenceState {
   previousStreamTotals: Map<string, StreamTotals>;
   /** Whether startup seeding has completed */
   seeded: boolean;
+  /** Timestamp of last stale entry eviction run */
+  lastEvictionAt: number;
 }
 
 declare global {
@@ -63,6 +72,7 @@ function getState(): PersistenceState {
       sessionFingerprints: new Map(),
       previousStreamTotals: new Map(),
       seeded: false,
+      lastEvictionAt: 0,
     };
   }
   return globalThis.__tokentopPersistence;
@@ -91,6 +101,27 @@ export interface SessionPersistData {
   streams: Omit<AgentSessionStreamSnapshotRow, "agentSessionSnapshotId">[];
 }
 
+function evictStaleEntries(state: PersistenceState, now: number): void {
+  if (now - state.lastEvictionAt < EVICTION_INTERVAL_MS) return;
+  state.lastEvictionAt = now;
+
+  const cutoff = now - STALE_ENTRY_MAX_AGE_MS;
+  for (const [key, ts] of state.lastWriteTimestamps) {
+    if (ts < cutoff) {
+      state.lastWriteTimestamps.delete(key);
+      state.sessionFingerprints.delete(key);
+    }
+  }
+
+  // Evict stream totals whose parent session was evicted
+  for (const streamKey of state.previousStreamTotals.keys()) {
+    const sessionKey = streamKey.slice(0, streamKey.indexOf(":", streamKey.indexOf(":") + 1));
+    if (!state.lastWriteTimestamps.has(sessionKey)) {
+      state.previousStreamTotals.delete(streamKey);
+    }
+  }
+}
+
 /**
  * Persist session data to the database with per-session throttling.
  *
@@ -105,6 +136,7 @@ export function persistSessions(sessions: SessionPersistData[]): number {
 
   const state = getState();
   const now = Date.now();
+  evictStaleEntries(state, now);
   let persistedCount = 0;
 
   for (const { session, snapshot, streams } of sessions) {
@@ -177,11 +209,6 @@ export function persistSessions(sessions: SessionPersistData[]): number {
   return persistedCount;
 }
 
-/**
- * Seed previous stream totals from the database.
- * Called once at startup after DB initialization to ensure
- * accurate delta computation from the first persistence call.
- */
 export function seedPreviousTotals(): void {
   const state = getState();
   if (state.seeded) return;
@@ -199,6 +226,28 @@ export function seedPreviousTotals(): void {
         requestCount: row.requestCount,
       });
     }
+
+    // Seeds Gate 1/2 so the first post-startup tick does not rewrite every
+    // historical session. computeFingerprint only reads cost/count/input/output,
+    // so the other fields are placeholders to satisfy the snapshot shape.
+    const latestSnapshots = getLatestSnapshotsForAllSessions();
+    for (const snap of latestSnapshots) {
+      const sessionKey = `${snap.agentId}:${snap.sessionId}`;
+      const fp = computeFingerprint({
+        timestamp: snap.timestamp,
+        lastActivityAt: snap.timestamp,
+        status: null,
+        totalInputTokens: snap.totalInputTokens,
+        totalOutputTokens: snap.totalOutputTokens,
+        totalCacheReadTokens: 0,
+        totalCacheWriteTokens: 0,
+        totalCostUsd: snap.totalCostUsd,
+        requestCount: snap.requestCount,
+      });
+      state.sessionFingerprints.set(sessionKey, fp);
+      state.lastWriteTimestamps.set(sessionKey, snap.timestamp);
+    }
+
     state.seeded = true;
   } catch (err) {
     console.error("Failed to seed previous totals from DB:", err);

package/src/storage/repos/agentSessions.ts

@@ -172,6 +172,55 @@ export interface LatestStreamTotals {
   requestCount: number;
 }
 
+export interface LatestSessionSnapshot {
+  agentId: string;
+  sessionId: string;
+  timestamp: number;
+  totalCostUsd: number;
+  requestCount: number;
+  totalInputTokens: number;
+  totalOutputTokens: number;
+}
+
+export function getLatestSnapshotsForAllSessions(): LatestSessionSnapshot[] {
+  const db = getDatabase();
+
+  const rows = db
+    .prepare(`
+    SELECT
+      s.agent_id, s.session_id,
+      snap.timestamp,
+      snap.total_cost_usd, snap.request_count,
+      snap.total_input_tokens, snap.total_output_tokens
+    FROM agent_session_snapshots snap
+    JOIN agent_sessions s ON s.id = snap.agent_session_id
+    WHERE snap.id IN (
+      SELECT MAX(snap2.id)
+      FROM agent_session_snapshots snap2
+      GROUP BY snap2.agent_session_id
+    )
+  `)
+    .all() as Array<{
+    agent_id: string;
+    session_id: string;
+    timestamp: number;
+    total_cost_usd: number;
+    request_count: number;
+    total_input_tokens: number;
+    total_output_tokens: number;
+  }>;
+
+  return rows.map((r) => ({
+    agentId: r.agent_id,
+    sessionId: r.session_id,
+    timestamp: r.timestamp,
+    totalCostUsd: r.total_cost_usd,
+    requestCount: r.request_count,
+    totalInputTokens: r.total_input_tokens,
+    totalOutputTokens: r.total_output_tokens,
+  }));
+}
+
 export function getLatestStreamTotalsForAllSessions(): LatestStreamTotals[] {
   const db = getDatabase();
 

package/src/tui/App.tsx

@@ -245,12 +245,12 @@ function AppContent() {
   ]);
 
   useKeyboard((key) => {
-    if (key.ctrl && key.name === "p") {
-      handleCaptureFrame();
+    if ((key.ctrl && key.shift && key.name === "p") || (key.shift && key.name === "p")) {
+      handleBurstRecord();
       return;
     }
-    if (key.ctrl && key.shift && key.name === "p") {
-      handleBurstRecord();
+    if (key.ctrl && key.name === "p") {
+      handleCaptureFrame();
       return;
     }
 

package/src/tui/components/SessionDetailsDrawer.tsx

@@ -158,6 +158,16 @@ export function SessionDetailsDrawer({ session, onClose: _onClose }: SessionDeta
     };
   }, [session.streams]);
 
+  const hasAnyLongContext = session.streams.some((s) => s.hasLongContext);
+  const totalLongContextRequests = session.streams.reduce(
+    (sum, s) => sum + (s.longContextRequestCount ?? 0),
+    0,
+  );
+  const totalLongContextTokens = session.streams.reduce((sum, s) => {
+    if (!s.longContextTokens) return sum;
+    return sum + s.longContextTokens.input + s.longContextTokens.output;
+  }, 0);
+
   const isMultiDay = session.lastActivityAt - session.startedAt > 24 * 60 * 60 * 1000;
   const startTimeStr = formatTimelineLabel(session.startedAt, isMultiDay);
   const endTimeStr = formatTimelineLabel(session.lastActivityAt, isMultiDay);
@@ -338,6 +348,18 @@ export function SessionDetailsDrawer({ session, onClose: _onClose }: SessionDeta
               </text>
             </box>
           )}
+
+          {hasAnyLongContext && (
+            <box flexDirection="row" height={1} marginBottom={0}>
+              <text height={1} overflow="hidden">
+                <span fg={colors.warning}>↑ Long ctx: </span>
+                <span fg={colors.text}>{totalLongContextRequests} reqs</span>
+                <span fg={colors.textMuted}> · </span>
+                <span fg={colors.text}>{formatTokens(totalLongContextTokens)} tokens</span>
+                <span fg={colors.textMuted}> at tiered rate</span>
+              </text>
+            </box>
+          )}
         </box>
 
         <box
@@ -407,11 +429,17 @@ export function SessionDetailsDrawer({ session, onClose: _onClose }: SessionDeta
                   </text>
                   <box width={10} height={1} justifyContent="flex-end">
                     <text fg={colors.textMuted}>
-                      {formatTokens(stream.tokens.input + stream.tokens.output)}
+                      {formatTokens(
+                        stream.tokens.input +
+                          stream.tokens.output +
+                          (stream.longContextTokens?.input ?? 0) +
+                          (stream.longContextTokens?.output ?? 0),
+                      )}
                     </text>
                   </box>
                   <box width={10} height={1} justifyContent="flex-end">
                     <text fg={colors.success}>{formatCost(stream.costUsd)}</text>
+                    <text fg={colors.textMuted}>{stream.hasLongContext ? "↑" : " "}</text>
                   </box>
                 </box>
               );

package/src/tui/components/SessionsTable.tsx

@@ -13,6 +13,8 @@ import { getSortDirectionIndicator, getSortFieldLabel } from "../types/sort.ts";
 interface SessionsTableProps {
   sessions: AgentSessionAggregate[];
   selectedRow: number;
+  scrollOffset: number;
+  visibleRows: number;
   isLoading: boolean;
   isFiltering: boolean;
   filterQuery: string;
@@ -159,6 +161,7 @@ const SessionRow = memo(function SessionRow({
   const cacheRead = session.totals.cacheRead ?? 0;
   const hasCacheData = cacheRead > 0;
   const isEstimated = session.metadata?.isEstimated === true;
+  const hasLongContext = session.streams.some((s) => s.hasLongContext === true);
   const costUsd = session.totalCostUsd ?? 0;
 
   const animatedTokens = useAnimatedValue(effectiveTokens, { durationMs: 300, precision: 0 });
@@ -271,8 +274,9 @@ const SessionRow = memo(function SessionRow({
           </span>
           <span fg={textMutedColor}>{hasCacheData ? ` ↯${formatCacheBadge(cacheRead)}` : ""}</span>
         </text>
-        <text width={8} height={1} fg={costColor} {...bgProp}>
-          {costDisplay.padStart(7)}
+        <text width={8} height={1} {...bgProp}>
+          <span fg={costColor}>{costDisplay.padStart(7)}</span>
+          <span fg={textMutedColor}>{hasLongContext ? "↑" : " "}</span>
         </text>
         <text width={14} height={1} fg={textSubtleColor} {...bgProp}>
           {projectDisplay}
@@ -329,8 +333,9 @@ const SessionRow = memo(function SessionRow({
           {hasCacheData && showCacheBadge ? ` ↯${formatCacheBadge(cacheRead)}` : ""}
         </span>
       </text>
-      <text width={7} height={1} fg={costColor} {...bgProp}>
-        {formatCostVal(costUsd).padStart(6)}
+      <text width={7} height={1} {...bgProp}>
+        <span fg={costColor}>{formatCostVal(costUsd).padStart(6)}</span>
+        <span fg={textMutedColor}>{hasLongContext ? "↑" : " "}</span>
       </text>
       <text flexGrow={1} height={1} fg={textSubtleColor} {...bgProp}>
         {projectDisplay}
@@ -351,6 +356,8 @@ export const SessionsTable = forwardRef(function SessionsTable(
   {
     sessions,
     selectedRow,
+    scrollOffset,
+    visibleRows,
     isLoading,
     isFiltering,
     filterQuery,
@@ -398,10 +405,18 @@ export const SessionsTable = forwardRef(function SessionsTable(
     bulkThreshold: 100,
   });
 
-  let activeIndex = 0;
   const selectedSession = sessions[selectedRow] ?? null;
   const inspector = selectedSession ? getInspectorData(selectedSession) : null;
 
+  // Spacer boxes preserve scrollbox inner height so scrollTo(scrollOffset) still maps correctly.
+  const RENDER_BUFFER = 4;
+  const visibleStart = Math.max(0, scrollOffset - RENDER_BUFFER);
+  const visibleEnd = Math.min(animatedSessions.length, scrollOffset + visibleRows + RENDER_BUFFER);
+  const visibleSlice =
+    animatedSessions.length > 0 ? animatedSessions.slice(visibleStart, visibleEnd) : [];
+  const topSpacer = visibleStart;
+  const bottomSpacer = Math.max(0, animatedSessions.length - visibleEnd);
+
   // Sort indicator helpers for column headers
   const sortIndicator = (field: string) =>
     sortField === field ? (sortDirection === "desc" ? "▼" : "▲") : " ";
@@ -527,8 +542,10 @@ export const SessionsTable = forwardRef(function SessionsTable(
               </text>
             </box>
           )}
-          {animatedSessions.map((entry) => {
-            const isSelectedRow = !entry.isExiting && activeIndex++ === selectedRow;
+          {topSpacer > 0 && <box height={topSpacer} flexShrink={0} />}
+          {visibleSlice.map((entry, i) => {
+            const absIndex = visibleStart + i;
+            const isSelectedRow = !entry.isExiting && absIndex === selectedRow;
             return (
               <SessionRow
                 key={entry.item.sessionId}
@@ -544,6 +561,7 @@ export const SessionsTable = forwardRef(function SessionsTable(
               />
             );
           })}
+          {bottomSpacer > 0 && <box height={bottomSpacer} flexShrink={0} />}
         </box>
       </scrollbox>
       {terminalHeight >= 30 && (