@tokentop/ttop 0.5.0 → 0.6.1

package/src/plugins/providers/chutes.ts

@@ -109,6 +109,22 @@ export const chutesPlugin: ProviderPlugin = {
       if (!response.ok) {
         log.warn("Failed to fetch Chutes usage", { status: response.status });
 
+        if (response.status === 429) {
+          const retryAfterHeader = response.headers.get("retry-after");
+          const parsedRetryAfter = retryAfterHeader
+            ? Number.parseInt(retryAfterHeader, 10)
+            : Number.NaN;
+          const retrySec =
+            Number.isFinite(parsedRetryAfter) && parsedRetryAfter > 0 ? parsedRetryAfter : 300;
+          log.warn("Rate limited by Chutes API", { retryAfterHeader, retryAfterSec: retrySec });
+          return {
+            fetchedAt: Date.now(),
+            error: `Rate limited. Retry after ${retrySec}s.`,
+            rateLimited: true,
+            retryAfterMs: retrySec * 1000,
+          };
+        }
+
         if (response.status === 401 || response.status === 403) {
           return {
             fetchedAt: Date.now(),

package/src/plugins/providers/codex.ts

@@ -178,6 +178,22 @@ export const codexPlugin: ProviderPlugin = {
         const bodyText = await response.text().catch(() => "");
         log.warn("Failed to fetch ChatGPT usage", { status: response.status, body: bodyText });
 
+        if (response.status === 429) {
+          const retryAfterHeader = response.headers.get("retry-after");
+          const parsedRetryAfter = retryAfterHeader
+            ? Number.parseInt(retryAfterHeader, 10)
+            : Number.NaN;
+          const retrySec =
+            Number.isFinite(parsedRetryAfter) && parsedRetryAfter > 0 ? parsedRetryAfter : 300;
+          log.warn("Rate limited by ChatGPT API", { retryAfterHeader, retryAfterSec: retrySec });
+          return {
+            fetchedAt: Date.now(),
+            error: `Rate limited. Retry after ${retrySec}s.`,
+            rateLimited: true,
+            retryAfterMs: retrySec * 1000,
+          };
+        }
+
         if (response.status === 401) {
           return {
             fetchedAt: Date.now(),

package/src/plugins/providers/gemini.ts

@@ -212,6 +212,22 @@ export const geminiPlugin: ProviderPlugin = {
       });
 
       if (!response.ok) {
+        if (response.status === 429) {
+          const retryAfterHeader = response.headers.get("retry-after");
+          const parsedRetryAfter = retryAfterHeader
+            ? Number.parseInt(retryAfterHeader, 10)
+            : Number.NaN;
+          const retrySec =
+            Number.isFinite(parsedRetryAfter) && parsedRetryAfter > 0 ? parsedRetryAfter : 300;
+          log.warn("Rate limited by Google API", { retryAfterHeader, retryAfterSec: retrySec });
+          return {
+            fetchedAt: Date.now(),
+            error: `Rate limited. Retry after ${retrySec}s.`,
+            rateLimited: true,
+            retryAfterMs: retrySec * 1000,
+          };
+        }
+
         const errorText = await response.text().catch(() => "");
         if (response.status === 401) {
           return {

package/src/plugins/providers/github-copilot.ts

@@ -134,6 +134,22 @@ export const githubCopilotPlugin: ProviderPlugin = {
       });
 
       if (!response.ok) {
+        if (response.status === 429) {
+          const retryAfterHeader = response.headers.get("retry-after");
+          const parsedRetryAfter = retryAfterHeader
+            ? Number.parseInt(retryAfterHeader, 10)
+            : Number.NaN;
+          const retrySec =
+            Number.isFinite(parsedRetryAfter) && parsedRetryAfter > 0 ? parsedRetryAfter : 300;
+          log.warn("Rate limited by GitHub API", { retryAfterHeader, retryAfterSec: retrySec });
+          return {
+            fetchedAt: Date.now(),
+            error: `Rate limited. Retry after ${retrySec}s.`,
+            rateLimited: true,
+            retryAfterMs: retrySec * 1000,
+          };
+        }
+
         if (response.status === 404) {
           return {
             planType: "None",

package/src/plugins/providers/minimax.ts

@@ -151,6 +151,22 @@ function createMinimaxPlugin(id: string, name: string): ProviderPlugin {
         if (!response.ok) {
           log.warn("Failed to fetch MiniMax usage", { status: response.status });
 
+          if (response.status === 429) {
+            const retryAfterHeader = response.headers.get("retry-after");
+            const parsedRetryAfter = retryAfterHeader
+              ? Number.parseInt(retryAfterHeader, 10)
+              : Number.NaN;
+            const retrySec =
+              Number.isFinite(parsedRetryAfter) && parsedRetryAfter > 0 ? parsedRetryAfter : 300;
+            log.warn("Rate limited by MiniMax API", { retryAfterHeader, retryAfterSec: retrySec });
+            return {
+              fetchedAt: Date.now(),
+              error: `Rate limited. Retry after ${retrySec}s.`,
+              rateLimited: true,
+              retryAfterMs: retrySec * 1000,
+            };
+          }
+
           if (response.status === 401 || response.status === 403) {
             return {
               fetchedAt: Date.now(),

package/src/plugins/providers/openai-api.ts

@@ -49,6 +49,15 @@ interface CostsResponse {
   has_more: boolean;
 }
 
+class RateLimitError extends Error {
+  readonly retryAfterMs: number;
+  constructor(retryAfterMs: number) {
+    super(`Rate limited. Retry after ${retryAfterMs / 1000}s.`);
+    this.name = "RateLimitError";
+    this.retryAfterMs = retryAfterMs;
+  }
+}
+
 export const openaiApiPlugin: ProviderPlugin = {
   apiVersion: 2,
   id: "openai-api",
@@ -145,6 +154,21 @@ export const openaiApiPlugin: ProviderPlugin = {
         fetchCosts(http, adminKey, oneDayAgo),
       ]);
 
+      // If either helper hit a 429, surface rate-limit info immediately
+      for (const settled of [usageResult, costsResult]) {
+        if (settled.status === "rejected" && settled.reason instanceof RateLimitError) {
+          log.warn("Rate limited by OpenAI API", { retryAfterMs: settled.reason.retryAfterMs });
+          return {
+            planType: "API",
+            allowed: true,
+            fetchedAt: Date.now(),
+            error: settled.reason.message,
+            rateLimited: true,
+            retryAfterMs: settled.reason.retryAfterMs,
+          };
+        }
+      }
+
       const result: ProviderUsageData = {
         planType: "API",
         allowed: true,
@@ -208,6 +232,16 @@ export const openaiApiPlugin: ProviderPlugin = {
 
       return result;
     } catch (err) {
+      if (err instanceof RateLimitError) {
+        return {
+          planType: "API",
+          allowed: true,
+          fetchedAt: Date.now(),
+          error: err.message,
+          rateLimited: true,
+          retryAfterMs: err.retryAfterMs,
+        };
+      }
       const msg = err instanceof Error ? err.message : String(err);
       log.error("OpenAI fetch error", { error: msg });
 
@@ -236,6 +270,15 @@ async function fetchCompletionsUsage(
   });
 
   if (!response.ok) {
+    if (response.status === 429) {
+      const retryAfterHeader = response.headers.get("retry-after");
+      const parsedRetryAfter = retryAfterHeader
+        ? Number.parseInt(retryAfterHeader, 10)
+        : Number.NaN;
+      const retrySec =
+        Number.isFinite(parsedRetryAfter) && parsedRetryAfter > 0 ? parsedRetryAfter : 300;
+      throw new RateLimitError(retrySec * 1000);
+    }
     if (response.status === 403) {
       return null;
     }
@@ -260,6 +303,15 @@ async function fetchCosts(
   });
 
   if (!response.ok) {
+    if (response.status === 429) {
+      const retryAfterHeader = response.headers.get("retry-after");
+      const parsedRetryAfter = retryAfterHeader
+        ? Number.parseInt(retryAfterHeader, 10)
+        : Number.NaN;
+      const retrySec =
+        Number.isFinite(parsedRetryAfter) && parsedRetryAfter > 0 ? parsedRetryAfter : 300;
+      throw new RateLimitError(retrySec * 1000);
+    }
     if (response.status === 403) {
       return null;
     }

package/src/plugins/providers/perplexity.ts

@@ -135,11 +135,20 @@ export const perplexityPlugin: ProviderPlugin = {
       }
 
       if (response.status === 429) {
+        const retryAfterHeader = response.headers.get("retry-after");
+        const parsedRetryAfter = retryAfterHeader
+          ? Number.parseInt(retryAfterHeader, 10)
+          : Number.NaN;
+        const retrySec =
+          Number.isFinite(parsedRetryAfter) && parsedRetryAfter > 0 ? parsedRetryAfter : 300;
+        log.warn("Rate limited by Perplexity API", { retryAfterHeader, retryAfterSec: retrySec });
         return {
           planType: "API",
           allowed: true,
           fetchedAt: Date.now(),
-          error: "Rate limited",
+          error: `Rate limited. Retry after ${retrySec}s.`,
+          rateLimited: true,
+          retryAfterMs: retrySec * 1000,
         };
       }
 

package/src/plugins/providers/zai.ts

@@ -124,6 +124,22 @@ export const zaiCodingPlanPlugin: ProviderPlugin = {
       if (!response.ok) {
         log.warn("Failed to fetch Z.ai usage", { status: response.status });
 
+        if (response.status === 429) {
+          const retryAfterHeader = response.headers.get("retry-after");
+          const parsedRetryAfter = retryAfterHeader
+            ? Number.parseInt(retryAfterHeader, 10)
+            : Number.NaN;
+          const retrySec =
+            Number.isFinite(parsedRetryAfter) && parsedRetryAfter > 0 ? parsedRetryAfter : 300;
+          log.warn("Rate limited by Z.ai API", { retryAfterHeader, retryAfterSec: retrySec });
+          return {
+            fetchedAt: Date.now(),
+            error: `Rate limited. Retry after ${retrySec}s.`,
+            rateLimited: true,
+            retryAfterMs: retrySec * 1000,
+          };
+        }
+
         if (response.status === 401 || response.status === 403) {
           return {
             fetchedAt: Date.now(),

package/src/pricing/fallback.ts

@@ -57,6 +57,10 @@ export const FALLBACK_PRICING: Record<string, Record<string, ModelPricing>> = {
     "gemini-2.0-flash-lite": { input: 0.075, output: 0.3, source: "fallback" },
     "gemini-2.5-pro": { input: 1.25, output: 10, source: "fallback" },
     "gemini-2.5-flash": { input: 0.15, output: 0.6, source: "fallback" },
+    "gemini-3-flash-preview": { input: 0.5, output: 3, cacheRead: 0.05, source: "fallback" },
+    "gemini-3-pro-preview": { input: 2, output: 12, cacheRead: 0.2, source: "fallback" },
+    "gemini-3.1-pro-preview": { input: 2, output: 12, cacheRead: 0.2, source: "fallback" },
+    "gemini-3.1-flash-lite-preview": { input: 0.25, output: 1.5, source: "fallback" },
   },
 
   openrouter: {

package/src/tui/App.tsx

@@ -16,6 +16,7 @@ import { copyToClipboard } from "@/utils/clipboard.ts";
 import { type CommandAction, CommandPalette } from "./components/CommandPalette.tsx";
 import { DebugPanel } from "./components/DebugPanel.tsx";
 import { Header } from "./components/Header.tsx";
+import { NotificationFlash } from "./components/NotificationFlash.tsx";
 import { SessionDetailsDrawer } from "./components/SessionDetailsDrawer.tsx";
 import { SettingsModal } from "./components/SettingsModal.tsx";
 import { StatusBar } from "./components/StatusBar.tsx";
@@ -35,6 +36,7 @@ import { RealTimeActivityProvider } from "./contexts/RealTimeActivityContext.tsx
 import { StorageProvider } from "./contexts/StorageContext.tsx";
 import { TimeWindowProvider } from "./contexts/TimeWindowContext.tsx";
 import { ToastProvider, useToastContext } from "./contexts/ToastContext.tsx";
+import { useNotificationBridge } from "./hooks/useNotificationBridge.ts";
 import { useSafeRenderer } from "./hooks/useSafeRenderer.ts";
 import { triggerShutdown } from "./shutdown.ts";
 import { Dashboard } from "./views/Dashboard.tsx";
@@ -48,6 +50,7 @@ interface AppProps {
   demoSeed?: number;
   demoPreset?: DemoPreset;
   cliPlugins?: string[];
+  cliTheme?: string;
 }
 
 type View = "dashboard" | "providers" | "trends" | "projects";
@@ -55,7 +58,7 @@ type View = "dashboard" | "providers" | "trends" | "projects";
 function AppContent() {
   const renderer = useSafeRenderer();
   const colors = useColors();
-  const { theme, setTheme } = useTheme();
+  const { theme, setTheme, cliTheme } = useTheme();
   const { refreshAllProviders, isInitialized, themes } = usePlugins();
   const { info } = useLogs();
   const { toast, showToast, dismissToast } = useToastContext();
@@ -67,6 +70,8 @@ function AppContent() {
   const { debugDataRef, activity, sparkData } = useDashboardRuntime();
   const burstRecorderRef = { current: null as BurstRecorder | null };
 
+  useNotificationBridge();
+
   const refreshInterval = config.refresh.pauseAutoRefresh ? 0 : config.refresh.intervalMs;
 
   const [lastRefresh, setLastRefresh] = useState<number | null>(null);
@@ -292,8 +297,10 @@ function AppContent() {
 
   useEffect(() => {
     if (themes.length === 0) return;
+    // CLI --theme flag takes priority over config
+    const themeId = cliTheme ?? config.display.theme;
     const resolved = resolveTheme(
-      config.display.theme,
+      themeId,
       config.display.colorScheme,
       themes,
       renderer?.themeMode ?? null,
@@ -301,7 +308,7 @@ function AppContent() {
     if (resolved.id !== theme.id) {
       setTheme(resolved);
     }
-  }, [themes, config.display.theme, config.display.colorScheme, renderer]);
+  }, [themes, cliTheme, config.display.theme, config.display.colorScheme, renderer]);
 
   useEffect(() => {
     if (isInitialized) {
@@ -360,27 +367,30 @@ function AppContent() {
       {isDrawerOpen && selectedSession && (
         <SessionDetailsDrawer session={selectedSession} onClose={hideDrawer} />
       )}
+
+      <NotificationFlash />
     </box>
   );
 }
 
-function ConfiguredApp({ cliPlugins }: { cliPlugins?: string[] }) {
+function ConfiguredApp({ cliPlugins, cliTheme }: { cliPlugins?: string[]; cliTheme?: string }) {
   const { config, isLoading } = useConfig();
 
   if (isLoading) {
     return null;
   }
 
-  const initialTheme = builtinThemeList.find((t) => t.id === config.display.theme);
+  const themeId = cliTheme ?? config.display.theme;
+  const initialTheme = builtinThemeList.find((t) => t.id === themeId);
   const themeProps = initialTheme ? { initialTheme } : {};
 
   return (
-    <ThemeProvider {...themeProps}>
+    <ThemeProvider {...themeProps} {...(cliTheme ? { cliTheme } : {})}>
       <TimeWindowProvider defaultWindow={config.display.defaultTimeWindow}>
         <ToastProvider>
           <PluginProvider {...(cliPlugins ? { cliPlugins } : {})}>
             <RealTimeActivityProvider>
-              <AgentSessionProvider autoRefresh={true} refreshInterval={1000}>
+              <AgentSessionProvider autoRefresh={true}>
                 <DashboardRuntimeProvider>
                   <DrawerProvider>
                     <AppContent />
@@ -401,6 +411,7 @@ export function App({
   demoSeed,
   demoPreset,
   cliPlugins,
+  cliTheme,
 }: AppProps) {
   const demoProviderProps: { demoMode: boolean; demoSeed?: number; demoPreset?: DemoPreset } = {
     demoMode,
@@ -414,7 +425,10 @@ export function App({
         <InputProvider>
           <StorageProvider>
             <ConfigProvider>
-              <ConfiguredApp {...(cliPlugins ? { cliPlugins } : {})} />
+              <ConfiguredApp
+                {...(cliPlugins ? { cliPlugins } : {})}
+                {...(cliTheme ? { cliTheme } : {})}
+              />
             </ConfigProvider>
           </StorageProvider>
         </InputProvider>

package/src/tui/components/HelpOverlay.tsx

@@ -59,7 +59,7 @@ export function HelpOverlay() {
           <text width={10} height={1} fg={colors.textMuted}>
             s
           </text>
-          <text height={1}>Sort</text>
+          <text height={1}>Sort menu</text>
         </box>
         <box flexDirection="row" height={1}>
           <text width={10} height={1} fg={colors.textMuted}>

package/src/tui/components/LimitGauge.tsx

@@ -1,4 +1,5 @@
 import type { ReactNode } from "react";
+import { getErrorCategoryDisplay, type ProviderErrorCategory } from "@/utils/error-category.ts";
 import { useColors } from "../contexts/ThemeContext.tsx";
 import { usePulse } from "../hooks/usePulse.ts";
 
@@ -8,6 +9,7 @@ interface LimitGaugeProps {
   color: string;
   ghost?: boolean;
   error?: string;
+  errorCategory?: ProviderErrorCategory;
   resetTime?: string;
   compact?: boolean;
   labelWidth?: number;
@@ -89,6 +91,7 @@ export function LimitGauge({
   color,
   ghost = false,
   error,
+  errorCategory,
   resetTime,
   compact = false,
   labelWidth = 12,
@@ -152,7 +155,12 @@ export function LimitGauge({
 
   if (error) {
     const displayLabel = truncateLabel(label, labelWidth);
-    const errorIcon = selected ? "▌" : "✗";
+
+    const display = errorCategory ? getErrorCategoryDisplay(errorCategory) : undefined;
+    const errColor = display?.isWarning ? colors.warning : colors.error;
+    const errLabel = display?.label ?? "ERR";
+    const errorIcon = selected ? "\u258C" : (display?.icon ?? "\u2717");
+
     return (
       <box
         height={1}
@@ -160,10 +168,10 @@ export function LimitGauge({
         {...(selected ? { backgroundColor: colors.borderMuted } : {})}
       >
         <text height={1}>
-          <span fg={selected ? colors.primary : colors.error}>{errorIcon} </span>
+          <span fg={selected ? colors.primary : errColor}>{errorIcon} </span>
           <span fg={selected ? colors.text : colors.text}>{displayLabel} </span>
-          <span fg={colors.error}>{"─".repeat(barWidth)}</span>
-          <span fg={colors.error}> ERR</span>
+          <span fg={errColor}>{"\u2500".repeat(barWidth)}</span>
+          <span fg={errColor}> {errLabel}</span>
         </text>
       </box>
     );

package/src/tui/components/NotificationFlash.tsx

@@ -0,0 +1,141 @@
+import type { NotificationEvent } from "@tokentop/plugin-sdk";
+import { useEffect, useRef, useState } from "react";
+import { notificationBus } from "@/plugins/notification-bus.ts";
+import { useColors } from "../contexts/ThemeContext.tsx";
+import { animationTick } from "../hooks/useAnimationTick.ts";
+import { Z_INDEX } from "./ModalBackdrop.tsx";
+
+/**
+ * Notification flash as an animated border glow.
+ *
+ * On notification:
+ *   0–15%   Overbright burst → alert color  (double border)
+ *   15–40%  Alert color fading              (double border)
+ *   40–100% Continuing fade → background    (single border, then unmount)
+ *
+ * Uses the global 30 Hz animation tick for smooth interpolation.
+ */
+
+const GLOW_DURATION_MS = 500;
+
+/** Bright, saturated alert colors — vivid regardless of theme */
+const GLOW_COLORS: Record<NotificationEvent["severity"], string> = {
+  critical: "#ff3333",
+  warning: "#ffaa22",
+  info: "#3399ff",
+};
+
+// ── Color math ──────────────────────────────────────────────
+
+function parseHex(hex: string): [number, number, number] {
+  const h = hex.replace("#", "");
+  return [
+    Number.parseInt(h.slice(0, 2), 16),
+    Number.parseInt(h.slice(2, 4), 16),
+    Number.parseInt(h.slice(4, 6), 16),
+  ];
+}
+
+function toHex(r: number, g: number, b: number): string {
+  const clamp = (v: number) => Math.max(0, Math.min(255, Math.round(v)));
+  return `#${[r, g, b].map((v) => clamp(v).toString(16).padStart(2, "0")).join("")}`;
+}
+
+/** Linearly interpolate two hex colors. t=0 → from, t=1 → to. */
+function lerpColor(from: string, to: string, t: number): string {
+  const [r1, g1, b1] = parseHex(from);
+  const [r2, g2, b2] = parseHex(to);
+  return toHex(r1 + (r2 - r1) * t, g1 + (g2 - g1) * t, b1 + (b2 - b1) * t);
+}
+
+/** Brighten a color by a factor (>1 = brighter). Clamps at 255. */
+function brighten(hex: string, factor = 1.4): string {
+  const [r, g, b] = parseHex(hex);
+  return toHex(r * factor, g * factor, b * factor);
+}
+
+/** easeOutCubic — fast attack, gentle tail */
+function easeOutCubic(t: number): number {
+  return 1 - (1 - t) ** 3;
+}
+
+// ── Component ───────────────────────────────────────────────
+
+export function NotificationFlash() {
+  const colors = useColors();
+  const [flash, setFlash] = useState<{
+    severity: NotificationEvent["severity"];
+    startTime: number;
+  } | null>(null);
+  const [borderColor, setBorderColor] = useState<string | null>(null);
+  const [borderStyle, setBorderStyle] = useState<"double" | "single">("double");
+  const unsubRef = useRef<(() => void) | null>(null);
+
+  // Register flash handler on the notification bus
+  useEffect(() => {
+    notificationBus.setFlashHandler((severity) => {
+      setFlash({ severity, startTime: Date.now() });
+    });
+    return () => notificationBus.setFlashHandler(null);
+  }, []);
+
+  // Drive the animation via the global 30 Hz tick
+  useEffect(() => {
+    if (!flash) {
+      setBorderColor(null);
+      return;
+    }
+
+    unsubRef.current?.();
+
+    const alertColor = GLOW_COLORS[flash.severity];
+    const brightColor = brighten(alertColor);
+    const bgColor = colors.background;
+
+    unsubRef.current = animationTick.subscribe((now) => {
+      const elapsed = now - flash.startTime;
+      const progress = Math.min(elapsed / GLOW_DURATION_MS, 1);
+
+      let currentColor: string;
+      if (progress < 0.15) {
+        // Burst phase: overbright → alert color
+        currentColor = lerpColor(brightColor, alertColor, progress / 0.15);
+      } else {
+        // Fade phase: alert → background (eased for gentle tail)
+        const fadeT = (progress - 0.15) / 0.85;
+        currentColor = lerpColor(alertColor, bgColor, easeOutCubic(fadeT));
+      }
+
+      setBorderColor(currentColor);
+      setBorderStyle(progress < 0.4 ? "double" : "single");
+
+      if (progress >= 1) {
+        unsubRef.current?.();
+        unsubRef.current = null;
+        setFlash(null);
+        setBorderColor(null);
+      }
+    });
+
+    return () => {
+      unsubRef.current?.();
+      unsubRef.current = null;
+    };
+  }, [flash, colors.background]);
+
+  if (!borderColor) return null;
+
+  return (
+    <box
+      position="absolute"
+      left={0}
+      top={0}
+      width="100%"
+      height="100%"
+      zIndex={Z_INDEX.TOAST + 1}
+      border
+      borderStyle={borderStyle}
+      borderColor={borderColor}
+    />
+  );
+}