Keep the agents panel live on wall clock, and stop rebuilding rows unchanged

Critique review found two gaps in the agents panel: its elapsed clock
and stalled flag only refreshed on the next unrelated chrome event
(goal change, subagent progress), so a worker that went quiet with no
further events never flipped to stalled; and setChromeZones rebuilt
every agent row's TextRenderable on every call, including pushes that
only touched goal or task.

The sticky poll now repaints the agents panel on its own 200ms tick,
matching the cadence already used for the transcript trailer. Row
rebuild is now skipped unless the panel's actual lines changed.

Author: TheGreatAxios

src/tui-opentui/product-host.test.ts

@@ -47,6 +47,8 @@ async function mountHeadless(
   host: Awaited<ReturnType<typeof mountProductHost>>
   emitter: EventEmitter
   destroyHarness: () => void
+  renderOnce: () => Promise<void>
+  captureCharFrame: () => string
 }> {
   const harness = await createHarness({ width: 80, height: 24 })
   const emitter = new EventEmitter()
@@ -60,7 +62,13 @@ async function mountHeadless(
     createRenderer: async () => harness.renderer,
     ...overrides,
   })
-  return { host, emitter, destroyHarness: harness.destroy }
+  return {
+    host,
+    emitter,
+    destroyHarness: harness.destroy,
+    renderOnce: harness.renderOnce,
+    captureCharFrame: harness.captureCharFrame,
+  }
 }
 
 function makeRequest(
@@ -270,6 +278,36 @@ describe("mountProductHost", () => {
     ).not.toThrow()
     expect(host.shell.streamLog).toEqual([])
   })
+
+  test("the agents panel's elapsed clock advances on the sticky poll tick, without another chrome push", async () => {
+    const now = Date.now()
+    const { host, renderOnce, captureCharFrame } = await mountHeadless({
+      chrome: {
+        agents: [
+          {
+            agentId: "explore",
+            description: "map callers",
+            status: "running",
+            startedAt: now - 59_000,
+            lastActivityAt: now,
+          },
+        ],
+      },
+    })
+    try {
+      await renderOnce()
+      expect(captureCharFrame()).toContain("0:59")
+
+      // No further chrome push or event — only wall-clock time passing.
+      // Only the 200ms sticky poll can be responsible for the clock moving.
+      await new Promise((r) => setTimeout(r, 1_100))
+      await renderOnce()
+      expect(captureCharFrame()).not.toContain("0:59")
+      expect(captureCharFrame()).toMatch(/1:0\d/)
+    } finally {
+      host.dispose()
+    }
+  })
 })
 
 describe("provider-first model picker", () => {

src/tui-opentui/product-host.ts

@@ -392,6 +392,11 @@ export async function mountProductHost(
       if (config.subAgentSessions !== undefined) {
         bridge.syncAgentProgress(config.subAgentSessions())
       }
+      // The agents panel's elapsed clock and stalled flag are a function of
+      // wall time, not just of the last event — repaint on the same tick as
+      // the transcript trailer so a worker that goes quiet still flips to
+      // "stalled" without waiting on an unrelated chrome push.
+      if (chromeState !== null) paintChromeZones()
     } catch {
       clearInterval(stickyPoll)
     }

src/tui-opentui/shell.ts

@@ -4084,8 +4084,13 @@ export function setChromeZones(
   if (content.task !== undefined) {
     bag.chrome.task = content.task ?? ""
   }
+  let agentsChanged = false
   if (content.agents !== undefined) {
-    bag.chrome.agents = content.agents ?? []
+    const next = content.agents ?? []
+    agentsChanged =
+      next.length !== bag.chrome.agents.length ||
+      next.some((line, i) => line !== bag.chrome.agents[i])
+    bag.chrome.agents = next
   }
 
   const goalOn = bag.chrome.goal.length > 0
@@ -4095,7 +4100,10 @@ export function setChromeZones(
 
   shell.goalText.content = goalOn ? ` ${bag.chrome.goal}` : ""
   shell.taskText.content = taskOn ? ` ${bag.chrome.task}` : ""
-  renderAgentsRows(shell, bag.chrome.agents)
+  // Rebuilding N TextRenderable children is real node churn; skip it unless
+  // the panel's actual lines changed (not every goal/task/agents push carries
+  // new agent data).
+  if (agentsChanged) renderAgentsRows(shell, bag.chrome.agents)
 
   // Only a zone appearing/disappearing or its row count changing alters the
   // row budget; retitling a zone whose row count is unchanged must not

src/tui-opentui/wave6.test.ts

@@ -321,6 +321,38 @@ describe("Wave 6: chrome zones", () => {
       { width: 80, height: 24 },
     )
   })
+
+  test("agents panel rows are only rebuilt when the panel's lines actually change", async () => {
+    await withTestRenderer(
+      async (h) => {
+        const shell = createAppShell(h.renderer, {
+          terminal: { columns: 80, rows: 24 },
+          wireKeys: false,
+        })
+        try {
+          setChromeZones(shell, { agents: ["explore: map callers"] })
+          const rowsBefore = [...shell.agentsBox.getChildren()]
+          expect(rowsBefore).toHaveLength(1)
+
+          // An unrelated goal push must not touch the agents rows.
+          setChromeZones(shell, { goal: "goal: unrelated" })
+          expect([...shell.agentsBox.getChildren()]).toEqual(rowsBefore)
+
+          // Pushing the exact same agent lines again must not rebuild either.
+          setChromeZones(shell, { agents: ["explore: map callers"] })
+          expect([...shell.agentsBox.getChildren()]).toEqual(rowsBefore)
+
+          // Changed lines must rebuild.
+          setChromeZones(shell, { agents: ["explore: map callers · 0:01"] })
+          expect([...shell.agentsBox.getChildren()]).not.toEqual(rowsBefore)
+          expect(shell.agentsBox.getChildren()).toHaveLength(1)
+        } finally {
+          shell.dispose()
+        }
+      },
+      { width: 80, height: 24 },
+    )
+  })
 })
 
 describe("Wave 6: keyboard copy path", () => {