@stigmer/react 3.0.9-dev.20260616060535 → 3.1.0

package/src/execution/__tests__/PlanArtifactCard.test.tsx

@@ -13,17 +13,24 @@ const planArtifact = create(ExecutionArtifactSchema, {
   kind: ExecutionArtifactKind.FILE,
   sizeBytes: 4500n,
   storageKey: "artifacts/aex_1/plan.md",
-  downloadUrl: "https://example.test/plan.md",
 });
 
 /** Modal content fetches artifact text — keep it pending so nothing rejects. */
-function createStigmerMock(): { stigmer: Stigmer; getArtifactContent: ReturnType<typeof vi.fn> } {
+function createStigmerMock(): {
+  stigmer: Stigmer;
+  getArtifactContent: ReturnType<typeof vi.fn>;
+  getArtifactDownloadUrl: ReturnType<typeof vi.fn>;
+} {
   const getArtifactContent = vi.fn().mockReturnValue(new Promise(() => {}));
+  const getArtifactDownloadUrl = vi
+    .fn()
+    .mockResolvedValue({ downloadUrl: "https://example.test/plan.md" });
   return {
     stigmer: {
-      agentExecution: { getArtifactContent },
+      agentExecution: { getArtifactContent, getArtifactDownloadUrl },
     } as unknown as Stigmer,
     getArtifactContent,
+    getArtifactDownloadUrl,
   };
 }
 
@@ -33,11 +40,16 @@ function withStigmer(children: ReactNode, stigmer: Stigmer) {
   );
 }
 
+/** PlanArtifactCard now resolves downloads on demand, so it needs a provider. */
+function renderCard(ui: ReactNode) {
+  return render(withStigmer(ui, createStigmerMock().stigmer));
+}
+
 afterEach(cleanup);
 
 describe("PlanArtifactCard — action surface", () => {
   it("is an accessible region labelled as the plan's actions, with name + size", () => {
-    render(
+    renderCard(
       <PlanArtifactCard executionId="aex_1" artifact={planArtifact} org="acme" />,
     );
 
@@ -61,7 +73,7 @@ describe("PlanArtifactCard — action surface", () => {
 
   it("offers exactly one primary 'Build from plan' action that calls onImplement", () => {
     const onImplement = vi.fn();
-    render(
+    renderCard(
       <PlanArtifactCard
         executionId="aex_1"
         artifact={planArtifact}
@@ -75,7 +87,7 @@ describe("PlanArtifactCard — action surface", () => {
   });
 
   it("hides 'Build from plan' when onImplement is not provided", () => {
-    render(
+    renderCard(
       <PlanArtifactCard executionId="aex_1" artifact={planArtifact} org="acme" />,
     );
     expect(screen.queryByText("Build from plan")).toBeNull();
@@ -83,7 +95,7 @@ describe("PlanArtifactCard — action surface", () => {
 
   it("disables 'Build from plan' when disabled", () => {
     const onImplement = vi.fn();
-    render(
+    renderCard(
       <PlanArtifactCard
         executionId="aex_1"
         artifact={planArtifact}
@@ -99,19 +111,28 @@ describe("PlanArtifactCard — action surface", () => {
     expect(onImplement).not.toHaveBeenCalled();
   });
 
-  it("exposes a Download link to the artifact", () => {
+  it("downloads the artifact on demand via a freshly minted URL", async () => {
+    const { stigmer, getArtifactDownloadUrl } = createStigmerMock();
     render(
-      <PlanArtifactCard executionId="aex_1" artifact={planArtifact} org="acme" />,
+      withStigmer(
+        <PlanArtifactCard executionId="aex_1" artifact={planArtifact} org="acme" />,
+        stigmer,
+      ),
     );
-    const link = screen.getByText("Download").closest("a")!;
-    expect(link.getAttribute("href")).toBe("https://example.test/plan.md");
+    fireEvent.click(screen.getByText("Download"));
+    // The URL is resolved at click time from the stable storage key — never a
+    // baked, expirable URL.
+    expect(getArtifactDownloadUrl).toHaveBeenCalledTimes(1);
+    const req = getArtifactDownloadUrl.mock.calls[0][0];
+    expect(req.executionId).toBe("aex_1");
+    expect(req.storageKey).toBe("artifacts/aex_1/plan.md");
   });
 });
 
 describe("PlanArtifactCard — Cmd/Ctrl+Enter accelerator (card-scoped)", () => {
   it("fires onImplement on Cmd+Enter from within the card", () => {
     const onImplement = vi.fn();
-    render(
+    renderCard(
       <PlanArtifactCard
         executionId="aex_1"
         artifact={planArtifact}
@@ -127,7 +148,7 @@ describe("PlanArtifactCard — Cmd/Ctrl+Enter accelerator (card-scoped)", () =>
 
   it("fires onImplement on Ctrl+Enter", () => {
     const onImplement = vi.fn();
-    render(
+    renderCard(
       <PlanArtifactCard
         executionId="aex_1"
         artifact={planArtifact}
@@ -143,7 +164,7 @@ describe("PlanArtifactCard — Cmd/Ctrl+Enter accelerator (card-scoped)", () =>
 
   it("ignores a plain Enter (no modifier) so it never hijacks typing", () => {
     const onImplement = vi.fn();
-    render(
+    renderCard(
       <PlanArtifactCard
         executionId="aex_1"
         artifact={planArtifact}
@@ -159,7 +180,7 @@ describe("PlanArtifactCard — Cmd/Ctrl+Enter accelerator (card-scoped)", () =>
 
   it("does not fire when disabled", () => {
     const onImplement = vi.fn();
-    render(
+    renderCard(
       <PlanArtifactCard
         executionId="aex_1"
         artifact={planArtifact}
@@ -197,7 +218,7 @@ describe("PlanArtifactCard — Open full (org-gated preview)", () => {
 
   it("hides 'Open full' when org is absent (modal needs org), keeping Build + Download", () => {
     const onImplement = vi.fn();
-    render(
+    renderCard(
       <PlanArtifactCard
         executionId="aex_1"
         artifact={planArtifact}

package/src/execution/__tests__/ResultView.test.tsx

@@ -1,10 +1,24 @@
-import { describe, it, expect, afterEach } from "vitest";
-import { render, cleanup } from "@testing-library/react";
+import { describe, it, expect, afterEach, vi } from "vitest";
+import { render, cleanup, screen, fireEvent, waitFor } from "@testing-library/react";
+import type { ReactNode } from "react";
+import { create, type JsonObject } from "@bufbuild/protobuf";
+import { ToolCallSchema } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/message_pb";
+import {
+  ToolCallStatus,
+  ToolKind,
+} from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/enum_pb";
+import { normalizeToolResult } from "@stigmer/sdk";
 import type { ToolResultView } from "@stigmer/sdk";
+import type { Stigmer } from "@stigmer/sdk";
+import { StigmerContext } from "../../context";
 import { ResultView, summarizeResultView } from "../ResultView";
 
 afterEach(cleanup);
 
+function withStigmer(children: ReactNode, stigmer: Stigmer) {
+  return <StigmerContext.Provider value={stigmer}>{children}</StigmerContext.Provider>;
+}
+
 describe("ResultView", () => {
   it("renders an edit diff with add/remove counts from the envelope", () => {
     const view: ToolResultView = {
@@ -30,6 +44,39 @@ describe("ResultView", () => {
     expect(container.textContent).toContain("hello world");
   });
 
+  it("renders a Cursor unifiedDiff through the DiffViewer table, not a raw patch dump", () => {
+    const view: ToolResultView = {
+      type: "diff",
+      path: "/workspace/notes.md",
+      unifiedDiff: "--- /dev/null\n+++ b/notes.md\n@@ -0,0 +1,2 @@\n+# Title\n+body\n",
+      linesAdded: 2,
+      linesRemoved: 0,
+    };
+    const { container } = render(<ResultView view={view} />);
+    // The accessible table renders the content...
+    expect(container.querySelector("table")).not.toBeNull();
+    expect(container.textContent).toContain("# Title");
+    // ...and the raw patch preamble never reaches the screen.
+    expect(container.textContent).not.toContain("/dev/null");
+    expect(container.textContent).not.toContain("@@");
+  });
+
+  it("suppresses the +N -M stats when showStats is false (owning row shows them)", () => {
+    const view: ToolResultView = {
+      type: "diff",
+      path: "/workspace/x.md",
+      oldText: "a",
+      newText: "a b",
+    };
+    const { container } = render(
+      <ResultView view={view} showFileName={false} showStats={false} />,
+    );
+    // The diff content still renders, but the duplicate counts do not.
+    expect(container.textContent).toContain("a b");
+    expect(container.textContent).not.toContain("+1");
+    expect(container.textContent).not.toContain("-0");
+  });
+
   it("renders a terminal with a non-zero exit badge", () => {
     const view: ToolResultView = {
       type: "terminal",
@@ -42,6 +89,26 @@ describe("ResultView", () => {
     expect(container.textContent).toContain("boom");
   });
 
+  it("renders a terminal as one session: $ command then output, no badge on success", () => {
+    const view: ToolResultView = {
+      type: "terminal",
+      command: "echo hello",
+      stdout: "hello",
+      stderr: "",
+      exitCode: 0,
+    };
+    const { container } = render(<ResultView view={view} />);
+    // The command leads the session as a prompt line, with its output below.
+    expect(container.textContent).toContain("$ echo hello");
+    expect(container.textContent).toContain("hello");
+    // Success carries no exit badge — the row's status icon confirms the run.
+    expect(container.textContent).not.toContain("exit 0");
+    // One block, not a command box + a separate output box.
+    expect(
+      container.querySelectorAll('[data-cursor-target="terminal-session"]'),
+    ).toHaveLength(1);
+  });
+
   it("renders a search match list", () => {
     const view: ToolResultView = {
       type: "search",
@@ -52,6 +119,95 @@ describe("ResultView", () => {
     expect(container.textContent).toContain("2 matches");
   });
 
+  it("renders a file-name search as a clickable file list with a 'files' count", () => {
+    const view: ToolResultView = {
+      type: "search",
+      kind: "files",
+      matches: [{ file: "src/a.ts", text: "src/a.ts" }],
+      count: 1,
+    };
+    const { container } = render(<ResultView view={view} />);
+    expect(container.textContent).toContain("1 file");
+    // The path renders filename-first through FilePathLink (an interactive control).
+    expect(container.textContent).toContain("a.ts");
+    expect(container.querySelector("button, a")).not.toBeNull();
+  });
+
+  it("renders content matches grouped under their file with line numbers", () => {
+    const view: ToolResultView = {
+      type: "search",
+      kind: "content",
+      matches: [
+        { file: "a.ts", line: 12, text: "// TODO: fix" },
+        { file: "a.ts", line: 30, text: "// TODO: later" },
+      ],
+      count: 2,
+    };
+    const { container } = render(<ResultView view={view} />);
+    expect(container.textContent).toContain("2 matches");
+    expect(container.textContent).toContain("12:");
+    expect(container.textContent).toContain("// TODO: fix");
+  });
+
+  it("names the subtype in the empty state (files vs matches), query-free", () => {
+    const files = render(
+      <ResultView view={{ type: "search", kind: "files", matches: [], count: 0 }} />,
+    );
+    expect(files.container.textContent).toContain("No files found");
+
+    const content = render(
+      <ResultView view={{ type: "search", kind: "content", matches: [], count: 0 }} />,
+    );
+    expect(content.container.textContent).toContain("No matches");
+  });
+
+  it("shows a 'showing first N' note when the engine truncated the results", () => {
+    const view: ToolResultView = {
+      type: "search",
+      kind: "files",
+      matches: [
+        { file: "a.ts", text: "a.ts" },
+        { file: "b.ts", text: "b.ts" },
+      ],
+      count: 200,
+      truncated: true,
+    };
+    const { container } = render(<ResultView view={view} />);
+    expect(container.textContent).toContain("200 files");
+    expect(container.textContent).toContain("showing first 2");
+  });
+
+  it("suppresses the search count when showStats is false (owning row shows it)", () => {
+    const view: ToolResultView = {
+      type: "search",
+      kind: "files",
+      matches: [{ file: "Dockerfile", text: "Dockerfile" }],
+      count: 1,
+    };
+    const { container } = render(<ResultView view={view} showStats={false} />);
+    // The file still renders, but the redundant "1 file" count does not.
+    expect(container.textContent).toContain("Dockerfile");
+    expect(container.textContent).not.toContain("1 file");
+  });
+
+  it("keeps the truncation note even when the count is suppressed", () => {
+    const view: ToolResultView = {
+      type: "search",
+      kind: "files",
+      matches: [
+        { file: "a.ts", text: "a.ts" },
+        { file: "b.ts", text: "b.ts" },
+      ],
+      count: 200,
+      truncated: true,
+    };
+    const { container } = render(<ResultView view={view} showStats={false} />);
+    // The count header is gone, but the "showing first N of M" note remains —
+    // it is information the row header does not carry.
+    expect(container.textContent).not.toContain("200 files");
+    expect(container.textContent).toContain("Showing first 2 of 200");
+  });
+
   it("renders unknown JSON results as a labeled code block, not a raw dump", () => {
     const view: ToolResultView = { type: "json", value: { a: 1 } };
     const { container } = render(<ResultView view={view} />);
@@ -70,6 +226,119 @@ describe("ResultView", () => {
     const { container } = render(<ResultView view={{ type: "empty" }} />);
     expect(container.textContent).toBe("");
   });
+
+  it("suppresses the diff filename when showFileName is false (owning row names it)", () => {
+    const view: ToolResultView = {
+      type: "diff",
+      path: "/workspace/secret.md",
+      oldText: "a",
+      newText: "a b",
+    };
+    const { container } = render(<ResultView view={view} showFileName={false} />);
+    // The path is not restated in the body; the diff content still renders.
+    expect(container.textContent).not.toContain("secret.md");
+    expect(container.textContent).toContain("a b");
+  });
+
+  it("renders a neutral 'no preview' notice for a contentless diff", () => {
+    const view: ToolResultView = { type: "diff", path: "/workspace/x.md" };
+    const { container } = render(<ResultView view={view} showFileName={false} />);
+    expect(container.textContent).toContain("No preview available for this change");
+    expect(container.textContent).not.toContain("x.md");
+  });
+
+  // Integration lock through the full normalizeToolResult -> ResultView pipeline:
+  // a whole-file write's proposed content is reconstructed from the tool args
+  // (Phase 5 Slice 4 removed the ToolCall.file_changes capture) and renders as
+  // the file body — never the "No preview available" notice.
+  it("renders a whole-file write's proposed content from args, not 'No preview available'", () => {
+    const CONTENT = "# Notes\n\n- first bullet\n- second bullet\n";
+    const toolCall = create(ToolCallSchema, {
+      id: "tool_create",
+      name: "write_file",
+      toolKind: ToolKind.FILE_WRITE,
+      status: ToolCallStatus.TOOL_CALL_COMPLETED,
+      args: { path: "notes.md", contents: CONTENT } as JsonObject,
+    });
+
+    const { container } = render(<ResultView view={normalizeToolResult(toolCall)} />);
+    expect(container.textContent).toContain("first bullet");
+    expect(container.textContent).not.toContain("No preview available");
+  });
+
+  it("suppresses the file path in a write fallback when showFileName is false", () => {
+    const view: ToolResultView = {
+      type: "file",
+      path: "/workspace/created.md",
+      content: "the body",
+      truncated: false,
+    };
+    const { container } = render(<ResultView view={view} showFileName={false} />);
+    expect(container.textContent).toContain("the body");
+    expect(container.textContent).not.toContain("created.md");
+  });
+});
+
+describe("ResultView — offloaded outputRef (on-demand resolution)", () => {
+  const imageView: ToolResultView = {
+    type: "outputRef",
+    storageKey: "artifacts/aex_1/toolcalls/tc.png",
+    contentHash: "h",
+    isImage: true,
+    mimeType: "image/png",
+    sizeBytes: 1234,
+    preview: "",
+  };
+
+  const textView: ToolResultView = {
+    type: "outputRef",
+    storageKey: "artifacts/aex_1/toolcalls/tc.txt",
+    contentHash: "h",
+    isImage: false,
+    mimeType: "text/plain",
+    sizeBytes: 900_000,
+    preview: "short head…",
+  };
+
+  it("renders an offloaded image from a freshly minted URL (never a baked one)", async () => {
+    const getArtifactDownloadUrl = vi
+      .fn()
+      .mockResolvedValue({ downloadUrl: "https://fresh/url.png" });
+    const stigmer = {
+      agentExecution: { getArtifactDownloadUrl, getArtifactContent: vi.fn() },
+    } as unknown as Stigmer;
+
+    render(withStigmer(<ResultView view={imageView} />, stigmer));
+
+    const img = await screen.findByRole("img");
+    expect(img.getAttribute("src")).toBe("https://fresh/url.png");
+    // URL was resolved on demand from the stable storage key.
+    const req = getArtifactDownloadUrl.mock.calls[0][0];
+    expect(req.storageKey).toBe("artifacts/aex_1/toolcalls/tc.png");
+    expect(req.executionId).toBe("aex_1");
+  });
+
+  it("shows the preview head and defers the full fetch until 'View full output'", async () => {
+    const getArtifactContent = vi.fn().mockResolvedValue({
+      content: new TextEncoder().encode("THE FULL OUTPUT"),
+      contentType: "text/plain",
+      truncated: false,
+    });
+    const stigmer = {
+      agentExecution: { getArtifactContent, getArtifactDownloadUrl: vi.fn() },
+    } as unknown as Stigmer;
+
+    render(withStigmer(<ResultView view={textView} />, stigmer));
+
+    // Lazy: nothing fetched until the user expands.
+    expect(screen.getByText("short head…")).toBeTruthy();
+    expect(getArtifactContent).not.toHaveBeenCalled();
+
+    fireEvent.click(screen.getByText(/View full output/));
+
+    await waitFor(() => expect(screen.getByText("THE FULL OUTPUT")).toBeTruthy());
+    expect(getArtifactContent).toHaveBeenCalledTimes(1);
+  });
 });
 
 describe("summarizeResultView", () => {
@@ -89,6 +358,15 @@ describe("summarizeResultView", () => {
     expect(summarizeResultView({ type: "list", entries: [], count: 1 })).toBe("1 item");
   });
 
+  it("uses the file noun for a file-name search summary", () => {
+    expect(
+      summarizeResultView({ type: "search", kind: "files", matches: [], count: 3 }),
+    ).toBe("3 files");
+    expect(
+      summarizeResultView({ type: "search", kind: "files", matches: [], count: 1 }),
+    ).toBe("1 file");
+  });
+
   it("returns null when there is nothing to summarize", () => {
     expect(summarizeResultView({ type: "text", text: "hi" })).toBeNull();
   });

package/src/execution/__tests__/SubAgentSection.test.tsx

@@ -0,0 +1,180 @@
+import { describe, it, expect, afterEach, vi } from "vitest";
+import { render, screen, cleanup, act } from "@testing-library/react";
+import { create } from "@bufbuild/protobuf";
+import {
+  AgentMessageSchema,
+  ToolCallSchema,
+  type AgentMessage,
+} from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/message_pb";
+import {
+  SubAgentExecutionSchema,
+  type SubAgentExecution,
+} from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/subagent_pb";
+import {
+  PendingApprovalSchema,
+  type PendingApproval,
+} from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/approval_pb";
+import {
+  MessageType,
+  SubAgentStatus,
+  ToolCallStatus,
+} from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/enum_pb";
+import { SubAgentSection } from "../SubAgentSection";
+import { ApprovalContext, type ApprovalContextValue } from "../ApprovalContext";
+
+afterEach(cleanup);
+
+function gatedToolMessage(toolCallId: string): AgentMessage {
+  return create(AgentMessageSchema, {
+    type: MessageType.MESSAGE_AI,
+    content: "",
+    toolCalls: [
+      create(ToolCallSchema, {
+        id: toolCallId,
+        name: "delete_file",
+        status: ToolCallStatus.TOOL_CALL_WAITING_APPROVAL,
+      }),
+    ],
+  });
+}
+
+function subAgent(opts: {
+  status: SubAgentStatus;
+  messages?: AgentMessage[];
+  startedAt?: string;
+  completedAt?: string;
+}): SubAgentExecution {
+  return create(SubAgentExecutionSchema, {
+    id: "sa-1",
+    name: "researcher",
+    status: opts.status,
+    messages: opts.messages ?? [],
+    startedAt: opts.startedAt ?? "",
+    completedAt: opts.completedAt ?? "",
+  });
+}
+
+/** The CollapsibleCard's own toggle is the first button under its role=group. */
+function sectionExpanded(container: HTMLElement): boolean {
+  const toggle = container.querySelector('[role="group"] > button');
+  return toggle?.getAttribute("aria-expanded") === "true";
+}
+
+const emptyCtx: ApprovalContextValue = {
+  approvalsByToolCallId: new Map(),
+  submittingIds: new Set(),
+  errorsByToolCallId: new Map(),
+};
+
+describe("SubAgentSection auto-disclosure", () => {
+  it("auto-opens while the sub-agent is running", () => {
+    const { container } = render(
+      <ApprovalContext.Provider value={emptyCtx}>
+        <SubAgentSection
+          subAgentExecution={subAgent({ status: SubAgentStatus.SUB_AGENT_IN_PROGRESS })}
+        />
+      </ApprovalContext.Provider>,
+    );
+    expect(sectionExpanded(container)).toBe(true);
+  });
+
+  it("stays collapsed when the sub-agent has settled", () => {
+    const { container } = render(
+      <ApprovalContext.Provider value={emptyCtx}>
+        <SubAgentSection
+          subAgentExecution={subAgent({ status: SubAgentStatus.SUB_AGENT_COMPLETED })}
+        />
+      </ApprovalContext.Provider>,
+    );
+    expect(sectionExpanded(container)).toBe(false);
+  });
+
+  it("auto-opens a settled sub-agent when a nested tool awaits approval, and shows the gate inline", () => {
+    const approval: PendingApproval = create(PendingApprovalSchema, {
+      toolCallId: "tc-nested",
+      toolName: "delete_file",
+      argsPreview: '{"path":"/tmp/x"}',
+    });
+    const ctx: ApprovalContextValue = {
+      approvalsByToolCallId: new Map([["tc-nested", approval]]),
+      onSubmit: () => {},
+      submittingIds: new Set(),
+      errorsByToolCallId: new Map(),
+    };
+
+    const { container } = render(
+      <ApprovalContext.Provider value={ctx}>
+        <SubAgentSection
+          subAgentExecution={subAgent({
+            status: SubAgentStatus.SUB_AGENT_COMPLETED,
+            messages: [gatedToolMessage("tc-nested")],
+          })}
+        />
+      </ApprovalContext.Provider>,
+    );
+
+    expect(sectionExpanded(container)).toBe(true);
+    // The nested gate's actions surface inside the sub-agent section.
+    expect(screen.getByLabelText("Approve")).toBeTruthy();
+  });
+});
+
+// The Cursor SDK delivers sub-agent internals only at completion (nothing to
+// stream mid-run), so the running card's honest live signal is a ticking
+// elapsed counter from started_at. Completed cards keep the precise static
+// duration (start -> completion), not a counter.
+describe("SubAgentSection running duration", () => {
+  afterEach(() => {
+    vi.useRealTimers();
+  });
+
+  it("shows a ticking elapsed time while running", () => {
+    vi.useFakeTimers();
+    vi.setSystemTime(new Date("2026-07-02T12:00:42Z"));
+
+    render(
+      <ApprovalContext.Provider value={emptyCtx}>
+        <SubAgentSection
+          subAgentExecution={subAgent({
+            status: SubAgentStatus.SUB_AGENT_IN_PROGRESS,
+            startedAt: "2026-07-02T12:00:00Z",
+          })}
+        />
+      </ApprovalContext.Provider>,
+    );
+
+    expect(screen.getByText("42s")).toBeTruthy();
+
+    act(() => {
+      vi.advanceTimersByTime(20_000);
+    });
+    expect(screen.getByText("1m 2s")).toBeTruthy();
+  });
+
+  it("shows no counter while running when started_at is absent", () => {
+    render(
+      <ApprovalContext.Provider value={emptyCtx}>
+        <SubAgentSection
+          subAgentExecution={subAgent({ status: SubAgentStatus.SUB_AGENT_IN_PROGRESS })}
+        />
+      </ApprovalContext.Provider>,
+    );
+    expect(screen.queryByText(/^\d+s$/)).toBeNull();
+  });
+
+  it("shows the static duration (not a counter) once completed", () => {
+    render(
+      <ApprovalContext.Provider value={emptyCtx}>
+        <SubAgentSection
+          subAgentExecution={subAgent({
+            status: SubAgentStatus.SUB_AGENT_COMPLETED,
+            startedAt: "2026-07-02T12:00:00Z",
+            completedAt: "2026-07-02T12:01:14.500Z",
+          })}
+        />
+      </ApprovalContext.Provider>,
+    );
+    // formatDuration's m/s rendering for a completed 74.5s run.
+    expect(screen.getByText("1m 15s")).toBeTruthy();
+  });
+});