@hoox-sh/hoox-tui 0.3.1 → 0.4.0

package/src/components/views/config-editor/code-editor.tsx

@@ -159,7 +159,7 @@ export function tokenizeTomlLine(line: string): TokenSpan[] {
 // ─── Syntax Highlighting — JSON ───────────────────────────────────────────────
 
 /** Color map for JSON token types. */
-const JSON_COLORS: Record<string, { fg: string; bold: boolean }> = {
+const JSON_COLORS = {
   brace: { fg: Colors.foreground, bold: false },
   key: { fg: Colors.accent, bold: false },
   colon: { fg: Colors.foreground, bold: false },
@@ -171,7 +171,7 @@ const JSON_COLORS: Record<string, { fg: string; bold: boolean }> = {
   whitespace: { fg: Colors.foreground, bold: false },
   error: { fg: Colors.error, bold: true },
   comment: { fg: Colors.muted, bold: false },
-};
+} as const;
 
 /**
  * Tokenize a single line of JSON text into colored spans.
@@ -202,8 +202,9 @@ export function tokenizeJsonLine(line: string): TokenSpan[] {
   }
 
   // Braces/brackets at start
-  if ("{]}[".includes(trimmed[0])) {
-    spans.push({ text: trimmed[0], color: JSON_COLORS.brace.fg, bold: true });
+  const firstChar = trimmed[0];
+  if (firstChar !== undefined && "{]}[".includes(firstChar)) {
+    spans.push({ text: firstChar, color: JSON_COLORS.brace.fg, bold: true });
     const rest = tokenizeJsonLine(trimmed.slice(1));
     spans.push(...rest);
     return spans;
@@ -218,6 +219,7 @@ export function tokenizeJsonLine(line: string): TokenSpan[] {
     trimmed.endsWith("]")
   ) {
     const last = trimmed[trimmed.length - 1];
+    if (last === undefined) return spans;
     const prefix = trimmed.slice(0, -1);
     const prefixSpans = tokenizeJsonLine(prefix);
     spans.push(...prefixSpans);
@@ -400,8 +402,8 @@ export function validateSyntax(
       const colMatch =
         msg.match(/column\s+(\d+)/i) ?? msg.match(/position\s+(\d+)/i);
       errors.push({
-        line: lineMatch ? parseInt(lineMatch[1]) : 1,
-        column: colMatch ? parseInt(colMatch[1]) : 0,
+        line: lineMatch?.[1] !== undefined ? parseInt(lineMatch[1], 10) : 1,
+        column: colMatch?.[1] !== undefined ? parseInt(colMatch[1], 10) : 0,
         message: msg,
       });
     }

package/src/components/views/config-editor.test.tsx

@@ -101,22 +101,25 @@ describe("ConfigEditor", () => {
   describe("CONFIG_TREE_BLUEPRINT", () => {
     it("has config directory as root", async () => {
       expect(CONFIG_TREE_BLUEPRINT.length).toBeGreaterThan(0);
-      expect(CONFIG_TREE_BLUEPRINT[0].name).toBe("config");
-      expect(CONFIG_TREE_BLUEPRINT[0].type).toBe("directory");
+      expect(CONFIG_TREE_BLUEPRINT[0]?.name).toBe("config");
+      expect(CONFIG_TREE_BLUEPRINT[0]?.type).toBe("directory");
     });
 
     it("contains config files without secret-like .env entries", async () => {
-      const children = CONFIG_TREE_BLUEPRINT[0].children!;
+      const root = CONFIG_TREE_BLUEPRINT[0];
+      expect(root?.children).toBeDefined();
+      const children = root!.children!;
       // wrangler.toml, trade.config.json, risk.config.json, strategies (no .env)
       expect(children.length).toBe(4);
       expect(children.some((c) => c.name === ".env")).toBe(false);
     });
 
     it("strategies directory has 3 config files", async () => {
-      const strategies = CONFIG_TREE_BLUEPRINT[0].children!.find(
-        (c) => c.name === "strategies"
-      );
+      const root = CONFIG_TREE_BLUEPRINT[0];
+      expect(root?.children).toBeDefined();
+      const strategies = root!.children!.find((c) => c.name === "strategies");
       expect(strategies).toBeDefined();
+      expect(strategies!.children).toBeDefined();
       expect(strategies!.children!.length).toBe(3);
       const names = strategies!.children!.map((c) => c.name);
       expect(names).toContain("grid.config.json");
@@ -139,10 +142,10 @@ describe("ConfigEditor", () => {
       ];
       const flat = flattenTree(nodes);
       expect(flat.length).toBe(2); // directory + file
-      expect(flat[0].node.name).toBe("dir");
-      expect(flat[0].level).toBe(0);
-      expect(flat[1].node.name).toBe("file.txt");
-      expect(flat[1].level).toBe(1);
+      expect(flat[0]?.node.name).toBe("dir");
+      expect(flat[0]?.level).toBe(0);
+      expect(flat[1]?.node.name).toBe("file.txt");
+      expect(flat[1]?.level).toBe(1);
     });
 
     it("returns empty array for empty input", async () => {
@@ -180,8 +183,8 @@ describe("ConfigEditor", () => {
     it("highlights full-line comments as muted", async () => {
       const tokens = tokenizeTomlLine("# this is a comment");
       expect(tokens.length).toBeGreaterThan(0);
-      expect(tokens[0].text).toContain("#");
-      expect(tokens[0].color).toBe(Colors.muted);
+      expect(tokens[0]?.text).toContain("#");
+      expect(tokens[0]?.color).toBe(Colors.muted);
     });
 
     it("highlights section headers as accent bold", async () => {
@@ -389,8 +392,8 @@ describe("ConfigEditor", () => {
       // line 3 (unclosed string); the parser may point to the same
       // line or to the first line where it becomes unrecoverable.
       // Either way, the error must NOT be on a known-valid line.
-      expect(errors[0].line).toBeGreaterThanOrEqual(3);
-      expect(errors[0].line).toBeLessThanOrEqual(4);
+      expect(errors[0]?.line).toBeGreaterThanOrEqual(3);
+      expect(errors[0]?.line).toBeLessThanOrEqual(4);
     });
 
     it("reports 1-based column for invalid TOML", async () => {
@@ -398,16 +401,16 @@ describe("ConfigEditor", () => {
       const errors = validateSyntax(toml, "toml");
       expect(errors.length).toBeGreaterThan(0);
       // Column must be at least 1 (1-based) for a useful error marker.
-      expect(errors[0].column).toBeGreaterThanOrEqual(1);
+      expect(errors[0]?.column).toBeGreaterThanOrEqual(1);
     });
 
     it("includes the parser's error message verbatim", async () => {
       const toml = 'key = = "invalid"\n';
       const errors = validateSyntax(toml, "toml");
       expect(errors.length).toBeGreaterThan(0);
-      expect(errors[0].message.length).toBeGreaterThan(0);
+      expect(errors[0]?.message.length).toBeGreaterThan(0);
       // Must not be the old generic "Unbalanced brackets" message.
-      expect(errors[0].message).not.toMatch(/unbalanced/i);
+      expect(errors[0]?.message).not.toMatch(/unbalanced/i);
     });
 
     it("returns empty errors for empty TOML", async () => {

package/src/components/views/config-editor.tsx

@@ -544,20 +544,22 @@ export function ConfigEditor() {
   const handleUndo = useCallback(() => {
     if (undoStack.length === 0 || !selectedFile) return;
     const prev = undoStack[undoStack.length - 1];
+    if (prev === undefined) return;
     setUndoStack((s) => s.slice(0, -1));
     setRedoStack((s) => [...s, currentContent]);
-    setFileContents((contents) => new Map(contents).set(selectedFile!, prev));
-    setUnsavedPaths((paths) => new Set(paths).add(selectedFile!));
+    setFileContents((contents) => new Map(contents).set(selectedFile, prev));
+    setUnsavedPaths((paths) => new Set(paths).add(selectedFile));
     setStatusMessage("Undo");
   }, [undoStack, currentContent, selectedFile]);
 
   const handleRedo = useCallback(() => {
     if (redoStack.length === 0 || !selectedFile) return;
     const next = redoStack[redoStack.length - 1];
+    if (next === undefined) return;
     setRedoStack((s) => s.slice(0, -1));
     setUndoStack((s) => [...s, currentContent]);
-    setFileContents((prev) => new Map(prev).set(selectedFile!, next));
-    setUnsavedPaths((paths) => new Set(paths).add(selectedFile!));
+    setFileContents((prev) => new Map(prev).set(selectedFile, next));
+    setUnsavedPaths((paths) => new Set(paths).add(selectedFile));
     setStatusMessage("Redo");
   }, [redoStack, currentContent, selectedFile]);
 
@@ -624,7 +626,7 @@ export function ConfigEditor() {
           setFocusedTreeIdx((i) => Math.min(flatFiles.length - 1, i + 1));
           break;
         case "enter":
-          if (focusedFilePath) selectFile(focusedFilePath);
+          if (focusedFilePath) void selectFile(focusedFilePath);
           break;
       }
     }
@@ -641,7 +643,7 @@ export function ConfigEditor() {
     }
 
     if (key.ctrl && key.name === "s" && selectedFile) {
-      handleSave();
+      void handleSave();
     }
   });
 

package/src/components/views/dashboard/model-health-section.tsx

@@ -4,14 +4,12 @@
  */
 
 /** @jsxImportSource @opentui/react */
-import { useState, useCallback, useEffect } from "react";
+import { useState, useCallback, useEffect, useRef } from "react";
 import { Colors, WorkerStatusColor } from "@hoox-sh/hoox-shared";
 import { StatusDot } from "../../shared/status-dot";
 import { cliBridge } from "../../../services/cli-bridge";
 import type { ModelHealth } from "../../../services/cli-bridge";
-
-/** Polling interval for AI model health checks (30 seconds). */
-const MODEL_HEALTH_POLL_MS = 30_000;
+import { usePolling } from "../../../hooks/use-polling";
 
 /**
  * Map model status to a StatusDot-compatible status string.
@@ -116,7 +114,7 @@ function ModelHealthRow({
 /**
  * ModelHealthSection — displays health status of all configured AI providers.
  *
- * Auto-refreshes every 30 seconds when the dashboard is active.
+ * Auto-refreshes on the Settings interval when the dashboard is active.
  * Supports multiple providers: Workers AI, OpenAI, Anthropic, Google, Azure.
  * Click on a provider to expand detailed stats (latency, daily usage, error).
  * Cancels in-flight probes on unmount; race-safe via generation counter.
@@ -127,51 +125,45 @@ function ModelHealthSection() {
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
   const [lastRefresh, setLastRefresh] = useState<number | null>(null);
+  const genRef = useRef(0);
+  const inFlightRef = useRef(false);
 
-  // Initial fetch + 30s polling with cancel + race safety
-  useEffect(() => {
-    let cancelled = false;
-    let generation = 0;
-    let inFlight = false;
-
-    const fetchHealth = async () => {
-      if (cancelled || inFlight) return;
-      inFlight = true;
-      const gen = ++generation;
-      try {
-        const result = await cliBridge.agentHealthCheck();
-        if (cancelled || gen !== generation) return;
-        if (result.success && result.data) {
-          setProviders(result.data.providers ?? []);
-          setError(null);
-          setLastRefresh(Date.now());
-        } else {
-          // Keep prior providers if any; surface probe failure distinctly
-          setError(
-            result.stderr ||
-              result.stdout ||
-              "AI health probe failed (CLI offline?)"
-          );
-        }
-      } catch (err) {
-        if (cancelled || gen !== generation) return;
-        setError(err instanceof Error ? err.message : String(err));
-      } finally {
-        inFlight = false;
-        if (!cancelled && gen === generation) setLoading(false);
+  const fetchHealth = useCallback(async () => {
+    if (inFlightRef.current) return;
+    inFlightRef.current = true;
+    const gen = ++genRef.current;
+    try {
+      const result = await cliBridge.agentHealthCheck();
+      if (gen !== genRef.current) return;
+      if (result.success && result.data) {
+        setProviders(result.data.providers ?? []);
+        setError(null);
+        setLastRefresh(Date.now());
+      } else {
+        // Keep prior providers if any; surface probe failure distinctly
+        setError(
+          result.stderr ||
+            result.stdout ||
+            "AI health probe failed (CLI offline?)"
+        );
       }
-    };
-
-    void fetchHealth();
-    const interval = setInterval(() => {
-      void fetchHealth();
-    }, MODEL_HEALTH_POLL_MS);
-    return () => {
-      cancelled = true;
-      clearInterval(interval);
-    };
+    } catch (err) {
+      if (gen !== genRef.current) return;
+      setError(err instanceof Error ? err.message : String(err));
+    } finally {
+      inFlightRef.current = false;
+      if (gen === genRef.current) setLoading(false);
+    }
   }, []);
 
+  useEffect(
+    () => () => {
+      genRef.current += 1;
+    },
+    []
+  );
+  usePolling({ callback: fetchHealth, immediate: true });
+
   const toggleExpand = useCallback((index: number) => {
     setExpandedIndex((prev) => (prev === index ? null : index));
   }, []);

package/src/components/views/dashboard/pyne-health-section.tsx

@@ -4,13 +4,12 @@
  */
 
 /** @jsxImportSource @opentui/react */
-import { useState, useEffect } from "react";
+import { useState, useEffect, useCallback, useRef } from "react";
 import { Colors, WorkerStatusColor } from "@hoox-sh/hoox-shared";
 import { StatusDot } from "../../shared/status-dot";
 import { cliBridge } from "../../../services/cli-bridge";
 import type { PyneHealthResult } from "../../../services/cli-bridge";
-
-const POLL_MS = 30_000;
+import { usePolling } from "../../../hooks/use-polling";
 
 function statusToDot(
   status: PyneHealthResult["status"]
@@ -27,54 +26,50 @@ function statusToDot(
 export function PyneHealthSection() {
   const [result, setResult] = useState<PyneHealthResult | null>(null);
   const [loading, setLoading] = useState(true);
+  const genRef = useRef(0);
+  const inFlightRef = useRef(false);
 
-  // Poll with cancel-on-unmount and skip overlapping probes
-  useEffect(() => {
-    let cancelled = false;
-    let generation = 0;
-    let inFlight = false;
-
-    const refresh = async () => {
-      if (cancelled || inFlight) return;
-      inFlight = true;
-      const gen = ++generation;
-      try {
-        const res = await cliBridge.pyneHealthCheck();
-        if (cancelled || gen !== generation) return;
-        if (res.data) {
-          setResult(res.data);
-        } else {
-          setResult({
-            worker: "pyne-worker",
-            url: "",
-            status: "down",
-            error: res.stderr || "probe failed",
-            timestamp: new Date().toISOString(),
-          });
-        }
-      } catch (err) {
-        if (cancelled || gen !== generation) return;
+  const refresh = useCallback(async () => {
+    if (inFlightRef.current) return;
+    inFlightRef.current = true;
+    const gen = ++genRef.current;
+    try {
+      const res = await cliBridge.pyneHealthCheck();
+      if (gen !== genRef.current) return;
+      if (res.data) {
+        setResult(res.data);
+      } else {
         setResult({
           worker: "pyne-worker",
           url: "",
           status: "down",
-          error: err instanceof Error ? err.message : "probe failed",
+          error: res.stderr || "probe failed",
           timestamp: new Date().toISOString(),
         });
-      } finally {
-        inFlight = false;
-        if (!cancelled && gen === generation) setLoading(false);
       }
-    };
-
-    void refresh();
-    const id = setInterval(() => void refresh(), POLL_MS);
-    return () => {
-      cancelled = true;
-      clearInterval(id);
-    };
+    } catch (err) {
+      if (gen !== genRef.current) return;
+      setResult({
+        worker: "pyne-worker",
+        url: "",
+        status: "down",
+        error: err instanceof Error ? err.message : "probe failed",
+        timestamp: new Date().toISOString(),
+      });
+    } finally {
+      inFlightRef.current = false;
+      if (gen === genRef.current) setLoading(false);
+    }
   }, []);
 
+  useEffect(
+    () => () => {
+      genRef.current += 1;
+    },
+    []
+  );
+  usePolling({ callback: refresh, immediate: true });
+
   const status = result?.status ?? "down";
   const dot = statusToDot(status);
   const color = WorkerStatusColor[dot];

package/src/components/views/dashboard.tsx

@@ -37,6 +37,7 @@ import { PyneHealthSection } from "./dashboard/pyne-health-section";
 import { AlertsPanel } from "./dashboard/alerts-panel";
 import { useUIStore } from "@hoox-sh/hoox-shared";
 import { useViewKeyboard } from "../../hooks/shell-overlay";
+import { usePolling } from "../../hooks/use-polling";
 
 // ─── Props ────────────────────────────────────────────────────────────────────
 
@@ -71,42 +72,38 @@ function formatStatNumber(value: number, isPnl = false): string {
 
 /**
  * KillSwitchStatusBadge — Compact trade kill-switch indicator for the dashboard
- * header. Auto-refreshes on mount and shows the engaged/released state with a
- * color-coded status dot. Errors degrade gracefully (badge just shows UNKNOWN).
+ * header. Auto-refreshes on the Settings interval and shows the engaged/released
+ * state with a color-coded status dot. Errors degrade to UNKNOWN.
  */
-/** How often the dashboard kill-switch badge re-probes (ms). */
-const KILL_SWITCH_POLL_MS = 15_000;
-
 function KillSwitchStatusBadge() {
   const [state, setState] = useState<"engaged" | "released" | "unknown">(
     "unknown"
   );
-  useEffect(() => {
-    let cancelled = false;
-    const refresh = async () => {
-      try {
-        const result = await cliBridge.monitorKillSwitch("show");
-        if (cancelled) return;
-        if (result.success && result.data) {
-          setState(result.data.engaged ? "engaged" : "released");
-        } else {
-          setState("unknown");
-        }
-      } catch {
-        if (!cancelled) setState("unknown");
+  const genRef = useRef(0);
+
+  const refresh = useCallback(async () => {
+    const gen = ++genRef.current;
+    try {
+      const result = await cliBridge.monitorKillSwitch("show");
+      if (gen !== genRef.current) return;
+      if (result.success && result.data) {
+        setState(result.data.engaged ? "engaged" : "released");
+      } else {
+        setState("unknown");
       }
-    };
-    void refresh();
-    // Re-probe periodically so engage/release in Service Manager is visible here
-    const timer = setInterval(() => {
-      void refresh();
-    }, KILL_SWITCH_POLL_MS);
-    return () => {
-      cancelled = true;
-      clearInterval(timer);
-    };
+    } catch {
+      if (gen === genRef.current) setState("unknown");
+    }
   }, []);
 
+  useEffect(
+    () => () => {
+      genRef.current += 1;
+    },
+    []
+  );
+  usePolling({ callback: refresh, immediate: true });
+
   const label =
     state === "engaged"
       ? "KILL SWITCH ENGAGED"

package/src/components/views/kv-viewer.test.tsx

@@ -23,9 +23,10 @@ import {
   filterKvKeys,
   sanitizeKvValue,
   MAX_VISIBLE_KEYS,
-  REFRESH_INTERVAL_MS,
 } from "./kv-viewer";
+import { formatPollIntervalLabel } from "../../hooks/use-polling";
 import { Colors, type ViewId } from "@hoox-sh/hoox-shared";
+import { ALL_VIEWS } from "../../types";
 import { useUIStore } from "@hoox-sh/hoox-shared/stores/ui-store";
 import {
   cliBridgeDouble,
@@ -124,8 +125,8 @@ describe("KvViewer", () => {
 
   // ── Pattern contract (mirrors queue-depth subtask 02) ──────────────────
 
-  it("auto-refreshes every 5 seconds while active", () => {
-    expect(REFRESH_INTERVAL_MS).toBe(5_000);
+  it("labels configured poll intervals", () => {
+    expect(formatPollIntervalLabel(5_000)).toBe("5s auto");
   });
 
   it("filters keys case-insensitively by name", () => {
@@ -235,19 +236,6 @@ describe("KvViewer", () => {
   });
 
   it("is included in the local ALL_VIEWS list (tui/src/types.ts)", () => {
-    const ALL_VIEWS: string[] = [
-      "dashboard",
-      "workers",
-      "worker-detail",
-      "trade-monitor",
-      "logs-viewer",
-      "service-manager",
-      "config-editor",
-      "setup-wizard",
-      "settings",
-      "queue-depth",
-      "kv-viewer",
-    ];
     expect(ALL_VIEWS).toContain("kv-viewer");
     // ViewId is derived from ALL_VIEWS so the local type must include it
     // as well. The TypeScript type-check is the real assertion; this

package/src/components/views/kv-viewer.tsx

@@ -49,16 +49,14 @@
  */
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 
-import { Colors, useUIStore } from "@hoox-sh/hoox-shared";
+import { Colors, useUIStore, useConfigStore } from "@hoox-sh/hoox-shared";
 import { ErrorBoundary } from "../shared/error-boundary";
 import { Spinner, EmptyState } from "../shared/spinner";
 import { ViewHeader } from "../shared/view-header";
 import { cliBridge } from "../../services/cli-bridge";
 import type { KvKey, KvKeySnapshot } from "../../services/cli-bridge";
 import { useViewKeyboard } from "../../hooks/shell-overlay";
-
-/** Auto-refresh interval in milliseconds. */
-export const REFRESH_INTERVAL_MS = 5_000;
+import { usePolling, formatPollIntervalLabel } from "../../hooks/use-polling";
 
 /** Cap rendered rows so large namespaces stay responsive. */
 export const MAX_VISIBLE_KEYS = 200;
@@ -427,14 +425,12 @@ export function KvViewer() {
     };
   }, [refresh]);
 
-  // Auto-refresh every 5s while the view is the active view (soft = no flicker).
-  useEffect(() => {
-    if (!isActive) return;
-    const handle = setInterval(() => {
-      void refresh({ soft: true });
-    }, REFRESH_INTERVAL_MS);
-    return () => clearInterval(handle);
-  }, [isActive, refresh]);
+  const refreshIntervalMs = useConfigStore((s) => s.refreshIntervalMs);
+  usePolling({
+    callback: () => refresh({ soft: true }),
+    enabled: isActive,
+    immediate: false,
+  });
 
   // ── Derived data ─────────────────────────────────────────────────────
   const allKeys = snapshot?.keys ?? [];
@@ -558,7 +554,7 @@ export function KvViewer() {
                 ⚠ read-only
               </text>
               <text fg={Colors.info} dim>
-                {`◉ ${REFRESH_INTERVAL_MS / 1000}s auto`}
+                {`◉ ${formatPollIntervalLabel(refreshIntervalMs)}`}
               </text>
             </box>
           }

package/src/components/views/logs-viewer.test.tsx

@@ -113,7 +113,7 @@ describe("LogsViewer filter logic", () => {
     });
     // Entries with workerId=w1 (alpha-worker) + entries with no workerId
     expect(result).toHaveLength(1); // only id=5 has workerId=w1
-    expect(result[0].id).toBe("5");
+    expect(result[0]?.id).toBe("5");
   });
 
   it("filters by text search (case-insensitive)", () => {
@@ -125,7 +125,7 @@ describe("LogsViewer filter logic", () => {
       workers,
     });
     expect(result).toHaveLength(1);
-    expect(result[0].message).toBe("Trade executed");
+    expect(result[0]?.message).toBe("Trade executed");
   });
 
   it("combines filters with AND logic", () => {
@@ -138,7 +138,7 @@ describe("LogsViewer filter logic", () => {
     });
     // Must be error OR info, alpha-worker, contains "auth"
     expect(result).toHaveLength(1);
-    expect(result[0].id).toBe("5"); // error + w1 + "Auth failure"
+    expect(result[0]?.id).toBe("5"); // error + w1 + "Auth failure"
   });
 
   it("handles empty text search as pass-through", () => {
@@ -263,7 +263,7 @@ describe("LogsViewer sanitization & caps", () => {
       workers: [],
     });
     expect(result).toHaveLength(1);
-    expect(result[0].id).toBe("1");
+    expect(result[0]?.id).toBe("1");
   });
 
   it("caps visible render window below store ring buffer (1000)", () => {

package/src/components/views/queue-depth.test.tsx

@@ -17,11 +17,8 @@
 import { describe, it, expect, beforeEach, afterEach } from "bun:test";
 import { createRoot } from "@opentui/react";
 import { createCliRenderer } from "@opentui/core";
-import {
-  QueueDepthView,
-  sortQueuesByPressure,
-  REFRESH_INTERVAL_MS,
-} from "./queue-depth";
+import { QueueDepthView, sortQueuesByPressure } from "./queue-depth";
+import { formatPollIntervalLabel } from "../../hooks/use-polling";
 import { Colors } from "@hoox-sh/hoox-shared";
 import { useUIStore } from "@hoox-sh/hoox-shared/stores/ui-store";
 import {
@@ -126,8 +123,9 @@ describe("QueueDepthView", () => {
 
   // ── Refresh interval contract ─────────────────────────────────────────
 
-  it("auto-refreshes every 5 seconds while active", () => {
-    expect(REFRESH_INTERVAL_MS).toBe(5_000);
+  it("labels configured poll intervals", () => {
+    expect(formatPollIntervalLabel(5_000)).toBe("5s auto");
+    expect(formatPollIntervalLabel(500)).toBe("500ms auto");
   });
 
   it("sorts queues by pressure: critical → backlogged → paused → healthy", () => {