fix(cli): avoid duplicate tui tool rows

- Keep single-shot turns live through completion instead of freezing stale running rows

- Clear completed tool labels and avoid grouping sequential tool calls retroactively

Co-Authored-By: devagent <devagent@egavrin>

Author: egavrin

packages/cli/src/tui/SingleShotApp.tsx

@@ -33,27 +33,25 @@ export function SingleShotApp({ bus, query, onQuery, model, onFinalOutput }: Sin
   const { exit } = useApp();
   const [running, setRunning] = useState(true);
   const hasStartedRef = useRef(false);
+  const mountedRef = useRef(true);
 
   const {
     transcriptNodes, status, subagents, spinnerMessage,
     startTurn, appendTurnPart, completeTurn, flushThinking, flushGroup, nextId,
     refs,
   } = useAgentLog({ bus, model });
 
+  useEffect(() => () => { mountedRef.current = false; }, []);
+
   useEffect(() => {
-    if (hasStartedRef.current) {
-      return;
-    }
+    if (hasStartedRef.current) return;
     hasStartedRef.current = true;
-
-    let cancelled = false;
-
     const runQuery = async (): Promise<void> => {
       refs.turnStart.current = Date.now(); refs.turnToolCount.current = 0; refs.costAccum.current = 0;
       startTurn(nextId("turn"), query, refs.turnStart.current);
       try {
         const result = await onQuery(query);
-        if (cancelled) return;
+        if (!mountedRef.current) return;
         flushThinking();
         flushGroup();
 
@@ -63,16 +61,15 @@ export function SingleShotApp({ bus, query, onQuery, model, onFinalOutput }: Sin
           onFinalOutput(finalText);
         }
         const notice = noticeForSingleShotStatus(result.status);
-        if (notice) {
-          appendTurnPart(nextId("status"), makeInfoPart("status", [notice]));
-        }
+        if (notice) appendTurnPart(nextId("status"), makeInfoPart("status", [notice]));
 
         completeTurn(
           nextId("summary"),
           makeTurnSummaryPart({ iterations: result.iterations, toolCalls: refs.turnToolCount.current, cost: refs.costAccum.current, elapsedMs: Date.now() - refs.turnStart.current }),
           { status: turnStatusForQueryStatus(result.status), finishedAt: Date.now() },
         );
       } catch (err) {
+        if (!mountedRef.current) return;
         appendTurnPart(nextId("e"), makeErrorPart({ message: err instanceof Error ? err.message : String(err), code: "QUERY_ERROR" }));
         completeTurn(
           nextId("summary"),
@@ -81,16 +78,15 @@ export function SingleShotApp({ bus, query, onQuery, model, onFinalOutput }: Sin
         );
       }
       setRunning(false);
-      scheduleExit(() => cancelled, exit);
+      scheduleExit(() => !mountedRef.current, exit);
     };
 
     void runQuery();
-    return () => { cancelled = true; };
   }, [appendTurnPart, completeTurn, exit, flushGroup, flushThinking, model, nextId, onFinalOutput, onQuery, query, refs, startTurn]);
 
   return (
     <>
-      <TranscriptView showWelcome={false} transcriptNodes={transcriptNodes} model={model} />
+      <TranscriptView showWelcome={false} transcriptNodes={transcriptNodes} model={model} keepLatestNodeLive />
       {hasActiveSubagents(subagents) && <SubagentPanel agents={subagents} />}
       <Spinner active={running} message={spinnerMessage} suffix={status.cost > 0 ? `$${status.cost.toFixed(4)}` : ""} />
       <StatusBar {...status} />

packages/cli/src/tui/useAgentLog.ts

@@ -267,6 +267,7 @@ function registerToolAfterEvent(
 ): void {
   unsubs.push(runtime.bus.on("tool:after", (event) => {
     if (shouldSkipToolAfter(event)) return;
+    runtime.setSpinnerMessage(undefined);
     if (runtime.collapseFailures && !event.result.success && event.name !== "execute_tool_script") {
       failureBuffer.count++;
       return;
@@ -295,7 +296,10 @@ function applyPendingToolResult(
   pendingGroup.totalMs += event.durationMs;
   pendingGroup.completed++;
   if (!event.result.success) pendingGroup.lastSuccess = false;
-  if (pendingGroup.count === 1) addToolAfterParts(event, runtime);
+  if (pendingGroup.count === 1) {
+    addToolAfterParts(event, runtime);
+    runtime.pendingGroupRef.current = null;
+  }
   if (pendingGroup.count > 1 && pendingGroup.completed >= pendingGroup.count) {
     runtime.flushGroup();
   }
@@ -367,6 +371,7 @@ function registerApprovalAndSessionEvents(unsubs: Array<() => void>, runtime: Ag
     runtime.appendTurnPart(runtime.nextId("approval-response"), presentApprovalResponseEvent(event));
   }));
   unsubs.push(runtime.bus.on("session:end", () => {
+    runtime.setSpinnerMessage(undefined);
     runtime.setSubagents(new Map());
   }));
 }

packages/cli/src/tui/visual-regression.test.ts

@@ -0,0 +1,124 @@
+import { EventBus } from "@devagent/runtime";
+import React, { useEffect, useMemo } from "react";
+import { afterEach, describe, expect, it } from "vitest";
+
+import { TranscriptView } from "./App.js";
+import {
+  cleanupRenderedInstances,
+  renderForTest,
+  settle,
+  stripAnsi,
+  waitForRenders,
+} from "./App.test-utils.js";
+import { SingleShotApp } from "./SingleShotApp.js";
+import { useAgentLog } from "./useAgentLog.js";
+import { makeTurnSummaryPart } from "../transcript-presenter.js";
+
+afterEach(cleanupRenderedInstances);
+
+function emitTool(bus: EventBus, name: string, callId: string, durationMs: number): void {
+  bus.emit("tool:before", {
+    name,
+    params: { pattern: "." },
+    callId,
+  });
+  emitToolAfter(bus, name, callId, durationMs);
+}
+
+function emitToolAfter(bus: EventBus, name: string, callId: string, durationMs: number): void {
+  bus.emit("tool:after", {
+    name,
+    callId,
+    durationMs,
+    result: {
+      success: true,
+      output: "1 file(s) found",
+      error: null,
+      artifacts: [],
+    },
+  });
+}
+
+function VisualHarness(
+  { mode, onSpinnerMessage }: {
+    readonly mode: "grouped" | "sequential";
+    readonly onSpinnerMessage?: (message: string | undefined) => void;
+  },
+): React.ReactElement {
+  const bus = useMemo(() => new EventBus(), []);
+  const { transcriptNodes, spinnerMessage, startTurn, completeTurn, nextId } = useAgentLog({ bus, model: "test-model" });
+
+  useEffect(() => {
+    onSpinnerMessage?.(spinnerMessage);
+  }, [onSpinnerMessage, spinnerMessage]);
+
+  useEffect(() => {
+    startTurn(nextId("turn"), mode === "grouped" ? "Check LSP" : "Find twice", Date.now());
+    if (mode === "grouped") {
+      bus.emit("tool:before", { name: "lsp", params: { operation: "diagnostics", path: "src/tmp.ts" }, callId: "call-1" });
+      bus.emit("tool:before", { name: "lsp", params: { operation: "symbols", path: "src/tmp.ts" }, callId: "call-2" });
+      emitToolAfter(bus, "lsp", "call-1", 1);
+      emitToolAfter(bus, "lsp", "call-2", 9);
+    } else {
+      emitTool(bus, "find_files", "call-1", 50);
+      emitTool(bus, "find_files", "call-2", 52);
+    }
+    completeTurn(nextId("summary"), makeTurnSummaryPart({ iterations: 1, toolCalls: 2, cost: 0, elapsedMs: 120 }));
+  }, [bus, completeTurn, mode, nextId, startTurn]);
+
+  return React.createElement(TranscriptView, { showWelcome: false, transcriptNodes, model: "test-model" });
+}
+
+describe("TUI visual regressions", () => {
+  it("flushes grouped tool rows and clears the active tool label", async () => {
+    const spinnerMessages: Array<string | undefined> = [];
+    const view = renderForTest(React.createElement(VisualHarness, {
+      mode: "grouped",
+      onSpinnerMessage: (message) => spinnerMessages.push(message),
+    }));
+
+    await settle();
+
+    const plain = stripAnsi(view.stdout.readAll());
+    expect(plain).toContain("✓ lsp ×2");
+    expect(spinnerMessages.at(-1)).toBeUndefined();
+  });
+
+  it("does not add grouped summaries for sequential same-name tools", async () => {
+    const view = renderForTest(React.createElement(VisualHarness, { mode: "sequential" }));
+
+    await settle();
+
+    const plain = stripAnsi(view.stdout.readAll());
+    expect(plain).toContain("✓ find_files (50ms)");
+    expect(plain).toContain("✓ find_files (52ms)");
+    expect(plain).not.toContain("✓ find_files ×2");
+  });
+
+  it("finishes single-shot turns after tool-event rerenders", async () => {
+    const bus = new EventBus();
+    let finalOutput: string | null = null;
+    const view = renderForTest(React.createElement(SingleShotApp, {
+      bus,
+      query: "single shot tools",
+      model: "test-model",
+      onFinalOutput: (text) => { finalOutput = text; },
+      onQuery: () => new Promise((resolve) => {
+        emitTool(bus, "lsp", "call-lsp-1", 5);
+        setTimeout(() => resolve({
+          iterations: 1,
+          toolCalls: 1,
+          lastText: "LSP finished.",
+          status: "success",
+        }), 0);
+      }),
+    }), { columns: 180 });
+
+    await waitForRenders();
+
+    const output = stripAnsi(view.stdout.readAll());
+    expect(output).toContain("╭─ completed single shot tools");
+    expect(output).toContain("LSP finished.");
+    expect(finalOutput).toBe("LSP finished.");
+  });
+});