fix(dashboard): stop automatic health polling (#331)

Author: outof-place

apps/dashboard/app/(cockpit)/cockpit-shell.test.tsx

@@ -413,6 +413,20 @@ test("returning to the tab restores the refresh cycle, not a single refresh", (t
 
 // ── The LIVE badge ──────────────────────────────────────────────────────────
 
+test("health never joins global polling, even when Live was persisted", (t) => {
+  beginTest(t, { livePolling: true });
+  const { refreshes, root } = mountShell(t, "/health", <div>Health</div>);
+
+  advance(60_000);
+
+  assert.equal(refreshes.length, 0, "health probes ran without a manual scan");
+  assert.equal(
+    root.findAllByProps({ "aria-label": "Toggle live updates" }).length,
+    0,
+    "health showed a Live control that cannot safely apply to this screen",
+  );
+});
+
 test("the badge does not claim live data while the tab is hidden and nothing polls", (t) => {
   // The worst failure mode: a frozen screen that also tells the user it is
   // current, removing their only cue to reload.

apps/dashboard/app/(cockpit)/cockpit-shell.tsx

@@ -132,8 +132,15 @@ export function CockpitShell({
   // cadence. A surface with nothing in flight still watches for new work, just
   // slowly — that is the AIW-266 criterion "polling stops or slows when no
   // active runs are present", and it is what lets a new run appear in the list.
-  const livePollFast = runRefreshCadence === "live" || !!t.livePolling;
-  const livePollEnabled = livePollFast || runRefreshCadence === "idle";
+  // Health probes hit every configured provider. They are intentionally
+  // user-triggered so a persisted global Live preference cannot turn one open
+  // health tab into a continuous fan-out of production requests.
+  const globalPollingAllowed = screen !== "health";
+  const livePollFast =
+    globalPollingAllowed && (runRefreshCadence === "live" || !!t.livePolling);
+  const livePollEnabled =
+    globalPollingAllowed &&
+    (livePollFast || runRefreshCadence === "idle");
   const liveCycleMs = livePollFast ? LIVE_POLL_MS : IDLE_POLL_MS;
 
   // Timestamp of the next scheduled refresh, surfaced via context so the
@@ -189,16 +196,19 @@ export function CockpitShell({
         <main className="flex-1 flex flex-col min-w-0 min-h-0">
           {/* Mobile header */}
           <div className="lg:hidden">
-            <MobileHeader title={TITLE_FOR_SCREEN[screen] ?? "AI Workflow"} />
+            <MobileHeader
+              title={TITLE_FOR_SCREEN[screen] ?? "AI Workflow"}
+              showLivePoll={globalPollingAllowed}
+            />
           </div>
 
-          {/* Desktop top bar — global live-poll control, present on every screen */}
+          {/* Desktop top bar — live polling is omitted for expensive health probes */}
           <div className="hidden lg:flex items-center justify-between flex-[0_0_44px] h-11 border-b border-neutral-200 bg-panel px-6">
             <span className="font-mono text-[10px] uppercase tracking-[0.06em] text-neutral-500">
               {TITLE_FOR_SCREEN[screen] ?? "AI Workflow"}
             </span>
             <div className="flex items-center gap-4">
-              <LivePollControl />
+              {globalPollingAllowed && <LivePollControl />}
               <LogoutButton />
             </div>
           </div>

apps/dashboard/components/cockpit/mobile/mobile-header.tsx

@@ -4,14 +4,22 @@
 import { BlazityLogo } from "@/components/ui";
 import { LivePollControl } from "@/components/cockpit/controls";
 
-export function MobileHeader({ title }: { title: string }) {
+export function MobileHeader({
+  title,
+  showLivePoll = true,
+}: {
+  title: string;
+  showLivePoll?: boolean;
+}) {
   return (
     <header className="flex-[0_0_auto] h-12 bg-panel border-b border-neutral-200 flex items-center gap-2 px-4">
       <BlazityLogo size={20} color="#FD6027" wordmarkColor="#181B20" showWord={false} />
       <span className="font-display font-medium text-[15px] text-coal">{title}</span>
-      <div className="ml-auto">
-        <LivePollControl size="sm" />
-      </div>
+      {showLivePoll && (
+        <div className="ml-auto">
+          <LivePollControl size="sm" />
+        </div>
+      )}
     </header>
   );
 }

apps/dashboard/components/cockpit/screens/health.test.tsx

@@ -1,5 +1,5 @@
 import assert from "node:assert/strict";
-import test from "node:test";
+import test, { mock } from "node:test";
 import React from "react";
 import { act, create } from "react-test-renderer";
 import { AppRouterContext } from "next/dist/shared/lib/app-router-context.shared-runtime";
@@ -70,19 +70,68 @@ test("health screen exposes the failed service, fix hint, and safe env names", (
   act(() => renderer.unmount());
 });
 
-test("scan again refreshes the server data", () => {
+test("scan again runs once and recovers when fresh data arrives", () => {
   let refreshes = 0;
   const router = { refresh: () => refreshes++ };
+  const tree = (nextData: SystemHealthResponse) => (
+    <AppRouterContext.Provider value={router as never}>
+      <HealthScreen data={nextData} />
+    </AppRouterContext.Provider>
+  );
+  let renderer!: ReturnType<typeof create>;
+  act(() => {
+    renderer = create(tree(data));
+  });
+  const button = renderer.root.findByProps({ children: "Scan again" });
+  act(() => {
+    button.props.onClick();
+    button.props.onClick();
+  });
+  assert.equal(refreshes, 1);
+  assert.equal(
+    renderer.root.findByProps({ children: "Scanning…" }).props.disabled,
+    true,
+  );
+
+  act(() => {
+    renderer.update(
+      tree({
+        ...data,
+        generatedAt: "2026-08-20T12:00:01.000Z",
+      }),
+    );
+  });
+  assert.equal(
+    renderer.root.findByProps({ children: "Scan again" }).props.disabled,
+    false,
+  );
+  act(() => renderer.unmount());
+});
+
+test("scan again recovers if a refresh never commits", (t) => {
+  mock.timers.enable({ apis: ["setTimeout"] });
+  t.after(() => mock.timers.reset());
+
+  const router = { refresh() {} };
   let renderer!: ReturnType<typeof create>;
   act(() => {
     renderer = create(
       <AppRouterContext.Provider value={router as never}>
-        <HealthScreen data={{ ...data, alerts: [], summary: { ...data.summary, down: 0, criticalDown: 0 } }} />
+        <HealthScreen data={data} />
       </AppRouterContext.Provider>,
     );
   });
-  const button = renderer.root.findByProps({ children: "Scan again" });
-  act(() => button.props.onClick());
-  assert.equal(refreshes, 1);
+  act(() => renderer.root.findByProps({ children: "Scan again" }).props.onClick());
+  assert.equal(
+    renderer.root.findByProps({ children: "Scanning…" }).props.disabled,
+    true,
+  );
+
+  act(() => mock.timers.tick(15_000));
+
+  assert.equal(
+    renderer.root.findByProps({ children: "Scan again" }).props.disabled,
+    false,
+  );
   act(() => renderer.unmount());
 });

apps/dashboard/components/cockpit/screens/health.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useTransition } from "react";
+import { useEffect, useRef, useState } from "react";
 import { useRouter } from "next/navigation";
 import type {
   SystemHealthGroup,
@@ -82,9 +82,43 @@ const STATUS: Record<
   },
 };
 
+const REFRESH_TIMEOUT_MS = 15_000;
+
 export function HealthScreen({ data }: { data: SystemHealthResponse }) {
   const router = useRouter();
-  const [refreshing, startRefresh] = useTransition();
+  const [refreshing, setRefreshing] = useState(false);
+  const refreshInFlight = useRef(false);
+  const refreshStartedAt = useRef<string | null>(null);
+
+  useEffect(() => {
+    if (
+      !refreshInFlight.current ||
+      refreshStartedAt.current === data.generatedAt
+    ) {
+      return;
+    }
+    refreshInFlight.current = false;
+    refreshStartedAt.current = null;
+    setRefreshing(false);
+  }, [data.generatedAt]);
+
+  useEffect(() => {
+    if (!refreshing) return;
+    const timeout = setTimeout(() => {
+      refreshInFlight.current = false;
+      refreshStartedAt.current = null;
+      setRefreshing(false);
+    }, REFRESH_TIMEOUT_MS);
+    return () => clearTimeout(timeout);
+  }, [refreshing]);
+
+  const refresh = () => {
+    if (refreshInFlight.current) return;
+    refreshInFlight.current = true;
+    refreshStartedAt.current = data.generatedAt;
+    setRefreshing(true);
+    router.refresh();
+  };
   const criticalAlerts = data.alerts.filter((alert) => alert.severity === "critical");
   const overall = criticalAlerts.length > 0
     ? {
@@ -131,7 +165,7 @@ export function HealthScreen({ data }: { data: SystemHealthResponse }) {
           <button
             type="button"
             disabled={refreshing}
-            onClick={() => startRefresh(() => router.refresh())}
+            onClick={refresh}
             className="appearance-none rounded-[3px] border border-neutral-300 bg-panel px-3 py-2 font-body text-[12px] font-semibold text-neutral-800 transition-colors duration-[120ms] hover:border-neutral-400 hover:bg-app-bg focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-mariner disabled:cursor-wait disabled:opacity-60"
           >
             {refreshing ? "Scanning…" : "Scan again"}