fix(ui): preserve interleaved tool card pairing

Takhoffman · Takhoffman · commit d9812b85c41d · 2026-04-11T07:34:45.000-05:00
(cherry picked from commit 5553d61)
diff --git a/ui/src/ui/chat/tool-cards.test.ts b/ui/src/ui/chat/tool-cards.test.ts
@@ -85,6 +85,47 @@ describe("tool-cards", () => {
     expect(cards[0]?.inputText).toContain('"mode": "preview"');
   });
 
+  it("pairs interleaved nameless tool results in content order", () => {
+    const cards = extractToolCards(
+      {
+        role: "assistant",
+        content: [
+          {
+            type: "tool_use",
+            name: "browser.open",
+            input: { url: "https://example.com/a" },
+          },
+          {
+            type: "tool_result",
+            name: "browser.open",
+            text: "Opened A",
+          },
+          {
+            type: "tool_use",
+            name: "browser.open",
+            input: { url: "https://example.com/b" },
+          },
+          {
+            type: "tool_result",
+            name: "browser.open",
+            text: "Opened B",
+          },
+        ],
+      },
+      "msg:ordered",
+    );
+
+    expect(cards).toHaveLength(2);
+    expect(cards[0]).toMatchObject({
+      inputText: '{\n  "url": "https://example.com/a"\n}',
+      outputText: "Opened A",
+    });
+    expect(cards[1]).toMatchObject({
+      inputText: '{\n  "url": "https://example.com/b"\n}',
+      outputText: "Opened B",
+    });
+  });
+
   it("builds sidebar content with input and empty output status", () => {
     const [card] = extractToolCards(
       {
diff --git a/ui/src/ui/chat/tool-cards.ts b/ui/src/ui/chat/tool-cards.ts
@@ -149,40 +149,35 @@ export function extractToolCards(message: unknown, prefix = "tool"): ToolCard[]
       ["toolcall", "tool_call", "tooluse", "tool_use"].includes(kind) ||
       (typeof item.name === "string" &&
         (item.arguments != null || item.args != null || item.input != null));
-    if (!isToolCall) {
+    if (isToolCall) {
+      const args = coerceArgs(item.arguments ?? item.args ?? item.input);
+      cards.push({
+        id: resolveToolCardId(item, m, index, prefix),
+        name: (item.name as string) ?? "tool",
+        args,
+        inputText: serializeToolInput(args),
+      });
       continue;
     }
-    const args = coerceArgs(item.arguments ?? item.args ?? item.input);
-    cards.push({
-      id: resolveToolCardId(item, m, index, prefix),
-      name: (item.name as string) ?? "tool",
-      args,
-      inputText: serializeToolInput(args),
-    });
-  }
 
-  for (let index = 0; index < content.length; index++) {
-    const item = content[index] ?? {};
-    const kind = (typeof item.type === "string" ? item.type : "").toLowerCase();
-    if (kind !== "toolresult" && kind !== "tool_result") {
-      continue;
+    if (kind === "toolresult" || kind === "tool_result") {
+      const name = typeof item.name === "string" ? item.name : "tool";
+      const cardId = resolveToolCardId(item, m, index, prefix);
+      const existing = findLatestCard(cards, cardId, name);
+      const text = extractToolText(item);
+      const preview = extractToolPreview(text, name);
+      if (existing) {
+        existing.outputText = text;
+        existing.preview = preview;
+        continue;
+      }
+      cards.push({
+        id: cardId,
+        name,
+        outputText: text,
+        preview,
+      });
     }
-    const name = typeof item.name === "string" ? item.name : "tool";
-    const cardId = resolveToolCardId(item, m, index, prefix);
-    const existing = findLatestCard(cards, cardId, name);
-    const text = extractToolText(item);
-    const preview = extractToolPreview(text, name);
-    if (existing) {
-      existing.outputText = text;
-      existing.preview = preview;
-      continue;
-    }
-    cards.push({
-      id: cardId,
-      name,
-      outputText: text,
-      preview,
-    });
   }
 
   const role = typeof m.role === "string" ? m.role.toLowerCase() : "";
