@tokentop/ttop 0.2.2 → 0.4.0

package/src/tui/contexts/DashboardRuntimeContext.tsx

@@ -1,8 +1,12 @@
-import { createContext, useContext, useState, useEffect, useRef, type ReactNode } from 'react';
-import { useAgentSessions } from './AgentSessionContext.tsx';
-import { useTimeWindow } from './TimeWindowContext.tsx';
-import { useRealTimeActivity } from './RealTimeActivityContext.tsx';
-import { useEmaActivity, type ActivityState, type ActivityDebugData } from '../hooks/useEmaActivity.ts';
+import { createContext, type ReactNode, useContext, useEffect, useRef, useState } from "react";
+import {
+  type ActivityDebugData,
+  type ActivityState,
+  useEmaActivity,
+} from "../hooks/useEmaActivity.ts";
+import { useAgentSessions } from "./AgentSessionContext.tsx";
+import { useRealTimeActivity } from "./RealTimeActivityContext.tsx";
+import { useTimeWindow } from "./TimeWindowContext.tsx";
 
 interface Deltas {
   cost: number;
@@ -13,10 +17,10 @@ interface Deltas {
 interface DashboardRuntimeContextValue {
   activity: ActivityState;
   sparkData: number[];
-  
+
   deltas: Deltas;
-  history: Array<{time: number, cost: number, tokens: number}>;
-  
+  history: Array<{ time: number; cost: number; tokens: number }>;
+
   debugDataRef: React.MutableRefObject<ActivityDebugData>;
 }
 
@@ -26,48 +30,46 @@ export function DashboardRuntimeProvider({ children }: { children: ReactNode })
   const { sessions: agentSessions, isLoading } = useAgentSessions();
   const { windowMs } = useTimeWindow();
   const { subscribe } = useRealTimeActivity();
-  
+
   const totalTokens = agentSessions.reduce((sum, s) => sum + s.totals.input + s.totals.output, 0);
   const { activity, sparkData, debugDataRef, injectDelta } = useEmaActivity(totalTokens);
-  
+
   useEffect(() => {
     return subscribe((delta, _timestamp) => {
       injectDelta(delta);
     });
   }, [subscribe, injectDelta]);
 
-  const historyRef = useRef<{time: number, cost: number, tokens: number}[]>([]);
+  const historyRef = useRef<{ time: number; cost: number; tokens: number }[]>([]);
   const [deltas, setDeltas] = useState<Deltas>({ cost: 0, tokens: 0, windowSec: 0 });
 
   useEffect(() => {
     if (isLoading || agentSessions.length === 0) return;
-    
+
     const totalCost = agentSessions.reduce((sum, s) => sum + (s.totalCostUsd ?? 0), 0);
     const currentTime = Date.now();
-    
+
     const lastEntry = historyRef.current[historyRef.current.length - 1];
-    const isDiscontinuity = lastEntry && (
-      totalTokens < lastEntry.tokens ||
-      totalTokens > lastEntry.tokens * 2
-    );
+    const isDiscontinuity =
+      lastEntry && (totalTokens < lastEntry.tokens || totalTokens > lastEntry.tokens * 2);
     if (isDiscontinuity) {
       historyRef.current = [];
     }
-    
+
     historyRef.current.push({ time: currentTime, cost: totalCost, tokens: totalTokens });
-    
+
     if (historyRef.current.length > 300) historyRef.current.shift();
 
     const targetTime = windowMs !== null ? currentTime - windowMs : 0;
     let baseline = historyRef.current[0];
-    
+
     for (let i = historyRef.current.length - 1; i >= 0; i--) {
       if (historyRef.current[i]!.time <= targetTime) {
         baseline = historyRef.current[i];
         break;
       }
     }
-    
+
     if (baseline) {
       const windowSec = (currentTime - baseline.time) / 1000;
       setDeltas({
@@ -83,20 +85,18 @@ export function DashboardRuntimeProvider({ children }: { children: ReactNode })
     sparkData,
     deltas,
     history: historyRef.current,
-    debugDataRef
+    debugDataRef,
   };
 
   return (
-    <DashboardRuntimeContext.Provider value={value}>
-      {children}
-    </DashboardRuntimeContext.Provider>
+    <DashboardRuntimeContext.Provider value={value}>{children}</DashboardRuntimeContext.Provider>
   );
 }
 
 export function useDashboardRuntime() {
   const context = useContext(DashboardRuntimeContext);
   if (!context) {
-    throw new Error('useDashboardRuntime must be used within DashboardRuntimeProvider');
+    throw new Error("useDashboardRuntime must be used within DashboardRuntimeProvider");
   }
   return context;
 }

package/src/tui/contexts/DemoModeContext.tsx

@@ -1,5 +1,5 @@
-import { createContext, useContext, useMemo, type ReactNode } from 'react';
-import { DemoSimulator, type DemoPreset, type DemoSimulatorOptions } from '@/demo/simulator.ts';
+import { createContext, type ReactNode, useContext, useMemo } from "react";
+import { type DemoPreset, DemoSimulator, type DemoSimulatorOptions } from "@/demo/simulator.ts";
 
 interface DemoModeContextValue {
   demoMode: boolean;
@@ -22,7 +22,10 @@ interface DemoModeProviderProps {
   children: ReactNode;
 }
 
-function buildSimulatorOptions(seed: number | undefined, preset: DemoPreset | undefined): DemoSimulatorOptions {
+function buildSimulatorOptions(
+  seed: number | undefined,
+  preset: DemoPreset | undefined,
+): DemoSimulatorOptions {
   if (seed !== undefined && preset !== undefined) {
     return { seed, preset };
   }
@@ -35,24 +38,28 @@ function buildSimulatorOptions(seed: number | undefined, preset: DemoPreset | un
   return {};
 }
 
-export function DemoModeProvider({ demoMode, demoSeed, demoPreset, children }: DemoModeProviderProps) {
+export function DemoModeProvider({
+  demoMode,
+  demoSeed,
+  demoPreset,
+  children,
+}: DemoModeProviderProps) {
   const simulator = useMemo(() => {
     if (!demoMode) return null;
     return new DemoSimulator(buildSimulatorOptions(demoSeed, demoPreset));
   }, [demoMode, demoSeed, demoPreset]);
 
-  const value = useMemo<DemoModeContextValue>(() => ({
-    demoMode,
-    simulator,
-    seed: simulator?.getSeed() ?? null,
-    preset: simulator?.getPreset() ?? null,
-  }), [demoMode, simulator]);
-
-  return (
-    <DemoModeContext.Provider value={value}>
-      {children}
-    </DemoModeContext.Provider>
+  const value = useMemo<DemoModeContextValue>(
+    () => ({
+      demoMode,
+      simulator,
+      seed: simulator?.getSeed() ?? null,
+      preset: simulator?.getPreset() ?? null,
+    }),
+    [demoMode, simulator],
   );
+
+  return <DemoModeContext.Provider value={value}>{children}</DemoModeContext.Provider>;
 }
 
 export function useDemoMode(): DemoModeContextValue {

package/src/tui/contexts/DrawerContext.tsx

@@ -1,5 +1,5 @@
-import { createContext, useContext, useState, useCallback, type ReactNode } from 'react';
-import type { AgentSessionAggregate } from '@/agents/types.ts';
+import { createContext, type ReactNode, useCallback, useContext, useState } from "react";
+import type { AgentSessionAggregate } from "@/agents/types.ts";
 
 interface DrawerContextValue {
   selectedSession: AgentSessionAggregate | null;
@@ -22,12 +22,14 @@ export function DrawerProvider({ children }: { children: ReactNode }) {
   }, []);
 
   return (
-    <DrawerContext.Provider value={{
-      selectedSession,
-      showDrawer,
-      hideDrawer,
-      isOpen: selectedSession !== null,
-    }}>
+    <DrawerContext.Provider
+      value={{
+        selectedSession,
+        showDrawer,
+        hideDrawer,
+        isOpen: selectedSession !== null,
+      }}
+    >
       {children}
     </DrawerContext.Provider>
   );
@@ -36,7 +38,7 @@ export function DrawerProvider({ children }: { children: ReactNode }) {
 export function useDrawer(): DrawerContextValue {
   const context = useContext(DrawerContext);
   if (!context) {
-    throw new Error('useDrawer must be used within DrawerProvider');
+    throw new Error("useDrawer must be used within DrawerProvider");
   }
   return context;
 }

package/src/tui/contexts/InputContext.tsx

@@ -1,4 +1,4 @@
-import { createContext, useContext, useState, useCallback, type ReactNode } from 'react';
+import { createContext, type ReactNode, useCallback, useContext, useState } from "react";
 
 interface InputContextType {
   isInputFocused: boolean;
@@ -24,7 +24,7 @@ export function InputProvider({ children }: { children: ReactNode }) {
 export function useInputFocus() {
   const context = useContext(InputContext);
   if (context === undefined) {
-    throw new Error('useInputFocus must be used within an InputProvider');
+    throw new Error("useInputFocus must be used within an InputProvider");
   }
   return context;
 }

package/src/tui/contexts/LogContext.tsx

@@ -1,6 +1,6 @@
-import { createContext, useContext, useState, useCallback, type ReactNode } from 'react';
+import { createContext, type ReactNode, useCallback, useContext, useState } from "react";
 
-export type LogLevel = 'debug' | 'info' | 'warn' | 'error';
+export type LogLevel = "debug" | "info" | "warn" | "error";
 
 export interface LogEntry {
   id: number;
@@ -40,46 +40,64 @@ export function LogProvider({ children, debugEnabled = true }: LogProviderProps)
   const [logs, setLogs] = useState<LogEntry[]>([]);
   const [isConsoleOpen, setIsConsoleOpen] = useState(false);
 
-  const addLog = useCallback((level: LogLevel, message: string, data?: Record<string, unknown>, source?: string) => {
-    if (level === 'debug' && !debugEnabled) return;
-
-    const entry: LogEntry = {
-      id: ++logIdCounter,
-      level,
-      message,
-      timestamp: Date.now(),
-      ...(data !== undefined ? { data } : {}),
-      ...(source !== undefined ? { source } : {}),
-    };
-
-    setLogs((prev) => {
-      const next = [...prev, entry];
-      if (next.length > MAX_LOGS) {
-        return next.slice(-MAX_LOGS);
-      }
-      return next;
-    });
-  }, [debugEnabled]);
+  const addLog = useCallback(
+    (level: LogLevel, message: string, data?: Record<string, unknown>, source?: string) => {
+      if (level === "debug" && !debugEnabled) return;
+
+      const entry: LogEntry = {
+        id: ++logIdCounter,
+        level,
+        message,
+        timestamp: Date.now(),
+        ...(data !== undefined ? { data } : {}),
+        ...(source !== undefined ? { source } : {}),
+      };
+
+      setLogs((prev) => {
+        const next = [...prev, entry];
+        if (next.length > MAX_LOGS) {
+          return next.slice(-MAX_LOGS);
+        }
+        return next;
+      });
+    },
+    [debugEnabled],
+  );
 
-  const log = useCallback((level: LogLevel, message: string, data?: Record<string, unknown>, source?: string) => {
-    addLog(level, message, data, source);
-  }, [addLog]);
+  const log = useCallback(
+    (level: LogLevel, message: string, data?: Record<string, unknown>, source?: string) => {
+      addLog(level, message, data, source);
+    },
+    [addLog],
+  );
 
-  const debug = useCallback((message: string, data?: Record<string, unknown>, source?: string) => {
-    addLog('debug', message, data, source);
-  }, [addLog]);
+  const debug = useCallback(
+    (message: string, data?: Record<string, unknown>, source?: string) => {
+      addLog("debug", message, data, source);
+    },
+    [addLog],
+  );
 
-  const info = useCallback((message: string, data?: Record<string, unknown>, source?: string) => {
-    addLog('info', message, data, source);
-  }, [addLog]);
+  const info = useCallback(
+    (message: string, data?: Record<string, unknown>, source?: string) => {
+      addLog("info", message, data, source);
+    },
+    [addLog],
+  );
 
-  const warn = useCallback((message: string, data?: Record<string, unknown>, source?: string) => {
-    addLog('warn', message, data, source);
-  }, [addLog]);
+  const warn = useCallback(
+    (message: string, data?: Record<string, unknown>, source?: string) => {
+      addLog("warn", message, data, source);
+    },
+    [addLog],
+  );
 
-  const error = useCallback((message: string, data?: Record<string, unknown>, source?: string) => {
-    addLog('error', message, data, source);
-  }, [addLog]);
+  const error = useCallback(
+    (message: string, data?: Record<string, unknown>, source?: string) => {
+      addLog("error", message, data, source);
+    },
+    [addLog],
+  );
 
   const clearLogs = useCallback(() => {
     setLogs([]);
@@ -100,11 +118,11 @@ export function LogProvider({ children, debugEnabled = true }: LogProviderProps)
   const exportLogs = useCallback(() => {
     const lines = logs.map((entry) => {
       const time = new Date(entry.timestamp).toISOString();
-      const src = entry.source ? `[${entry.source}]` : '';
-      const dataStr = entry.data ? ` ${JSON.stringify(entry.data)}` : '';
+      const src = entry.source ? `[${entry.source}]` : "";
+      const dataStr = entry.data ? ` ${JSON.stringify(entry.data)}` : "";
       return `${time} ${entry.level.toUpperCase().padEnd(5)} ${src} ${entry.message}${dataStr}`;
     });
-    return lines.join('\n');
+    return lines.join("\n");
   }, [logs]);
 
   const value: LogContextValue = {
@@ -122,17 +140,13 @@ export function LogProvider({ children, debugEnabled = true }: LogProviderProps)
     exportLogs,
   };
 
-  return (
-    <LogContext.Provider value={value}>
-      {children}
-    </LogContext.Provider>
-  );
+  return <LogContext.Provider value={value}>{children}</LogContext.Provider>;
 }
 
 export function useLogs(): LogContextValue {
   const context = useContext(LogContext);
   if (!context) {
-    throw new Error('useLogs must be used within LogProvider');
+    throw new Error("useLogs must be used within LogProvider");
   }
   return context;
 }
@@ -141,7 +155,8 @@ export function useLogger(source: string) {
   const { log, debug, info, warn, error } = useLogs();
 
   return {
-    log: (level: LogLevel, message: string, data?: Record<string, unknown>) => log(level, message, data, source),
+    log: (level: LogLevel, message: string, data?: Record<string, unknown>) =>
+      log(level, message, data, source),
     debug: (message: string, data?: Record<string, unknown>) => debug(message, data, source),
     info: (message: string, data?: Record<string, unknown>) => info(message, data, source),
     warn: (message: string, data?: Record<string, unknown>) => warn(message, data, source),