@stigmer/react 3.1.3 → 3.1.4

package/src/session/__tests__/useSessionPanel.test.ts

@@ -1,8 +1,15 @@
 import { describe, it, expect, afterEach } from "vitest";
 import { renderHook, act, cleanup } from "@testing-library/react";
-import { ExecutionPhase } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/enum_pb";
+import { create } from "@bufbuild/protobuf";
+import {
+  ExecutionArtifactKind,
+  ExecutionPhase,
+} from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/enum_pb";
+import { ExecutionArtifactSchema } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/artifact_pb";
 import { useSessionPanel, type UseSessionPanelOptions } from "../useSessionPanel";
 import { PLAN_DOCUMENT_ENTRY_ID, PLAN_DOCUMENT_PATH } from "../plan-document";
+import { ARTIFACT_DOCUMENT_ENTRY_ID } from "../artifact-document";
+import { artifactKey } from "../useSessionArtifacts";
 import type { SelectedThreadItem } from "../../internal/store/selection-store";
 
 // ---------------------------------------------------------------------------
@@ -255,6 +262,68 @@ describe("useSessionPanel — plan document tab", () => {
   });
 });
 
+describe("useSessionPanel — artifact document tabs", () => {
+  function artifact(sandboxPath: string, name: string) {
+    return create(ExecutionArtifactSchema, {
+      name,
+      kind: ExecutionArtifactKind.FILE,
+      sandboxPath,
+      storageKey: `artifacts/aex_1/${name}`,
+    });
+  }
+
+  it("openArtifact opens the panel with a PREVIEW tab keyed by artifactKey", () => {
+    const { result } = renderPanel();
+    const a = artifact(".stigmer/notes.md", "notes.md");
+    act(() => result.current.openArtifact(a));
+
+    expect(result.current.isOpen).toBe(true);
+    expect(result.current.editorsStore.getSnapshot().editors).toEqual([
+      { entryId: ARTIFACT_DOCUMENT_ENTRY_ID, path: artifactKey(a), preview: true },
+    ]);
+  });
+
+  it("reuses the single preview slot as different artifacts are browsed", () => {
+    const { result } = renderPanel();
+    act(() => result.current.openArtifact(artifact(".stigmer/a.md", "a.md")));
+    act(() => result.current.openArtifact(artifact(".stigmer/b.md", "b.md")));
+
+    // VS Code preview semantics: single-click browsing reuses one tab.
+    expect(result.current.editorsStore.getSnapshot().editors).toEqual([
+      { entryId: ARTIFACT_DOCUMENT_ENTRY_ID, path: ".stigmer/b.md", preview: true },
+    ]);
+  });
+
+  it("does not evict a pinned plan tab when an artifact opens", () => {
+    const { result } = renderPanel();
+    act(() => result.current.openPlanDocument());
+    act(() => result.current.openArtifact(artifact(".stigmer/a.md", "a.md")));
+
+    expect(result.current.editorsStore.getSnapshot().editors).toEqual([
+      { entryId: PLAN_DOCUMENT_ENTRY_ID, path: PLAN_DOCUMENT_PATH, preview: false },
+      { entryId: ARTIFACT_DOCUMENT_ENTRY_ID, path: ".stigmer/a.md", preview: true },
+    ]);
+  });
+
+  it("pinArtifact promotes an open artifact preview to a persistent tab", () => {
+    const { result } = renderPanel();
+    const a = artifact(".stigmer/notes.md", "notes.md");
+    // The single-click open leaves a preview tab; the double-click pins it.
+    act(() => result.current.openArtifact(a));
+    act(() => result.current.pinArtifact(a));
+
+    expect(result.current.editorsStore.getSnapshot().editors).toEqual([
+      { entryId: ARTIFACT_DOCUMENT_ENTRY_ID, path: artifactKey(a), preview: false },
+    ]);
+  });
+
+  it("pinArtifact is a no-op when the artifact is not open (mirrors the store's generic pin)", () => {
+    const { result } = renderPanel();
+    act(() => result.current.pinArtifact(artifact(".stigmer/x.md", "x.md")));
+    expect(result.current.editorsStore.getSnapshot().editors).toEqual([]);
+  });
+});
+
 describe("useSessionPanel — defaultView (home view)", () => {
   it("seeds the view to the provided defaultView (launcher homes on Config)", () => {
     const { result } = renderPanel({ defaultView: "configure" });

package/src/session/artifact-document.ts

@@ -0,0 +1,23 @@
+// Identity of the session's artifact document tabs in the workspace surface's
+// editor group.
+//
+// Kept in its own module (not in ArtifactDocument.tsx) so behavior-only
+// consumers — useSessionPanel opens an artifact tab, SessionViewer routes to it
+// — depend on the identity without pulling the component (and its content
+// renderer) into their module graph (DD-003 headless-first). Mirrors
+// plan-document.ts.
+
+import { virtualEntryId } from "../internal/store/index.js";
+
+/**
+ * Virtual entry id of the artifact document FAMILY. Unlike the plan (one tab
+ * per session), artifacts are many: every opened artifact shares this one
+ * entry id and is distinguished by its {@link artifactKey}-derived `path`, so
+ * `editorKey(ARTIFACT_DOCUMENT_ENTRY_ID, path)` yields one tab per artifact —
+ * the VS Code "each file is a tab" model. The NUL-namespaced virtual id can
+ * never alias a real workspace entry, and its distinct `"artifact"` kind can
+ * never collide with the plan tab's `"plan"` kind.
+ *
+ * @see artifactKey — the `path` component (an artifact's stable identity)
+ */
+export const ARTIFACT_DOCUMENT_ENTRY_ID = virtualEntryId("artifact");

package/src/session/facets/ArtifactsTab.tsx

@@ -4,10 +4,11 @@ import { useCallback, useState } from "react";
 import type { AgentExecution } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/api_pb";
 import {
   useSessionArtifacts,
+  artifactKey,
   type SessionArtifactEntry,
 } from "../useSessionArtifacts.js";
-import { ArtifactCard } from "../../execution/ArtifactCard.js";
 import { ArtifactPreviewModal } from "../../execution/ArtifactPreviewModal.js";
+import { ArtifactRow } from "../../execution/ArtifactRow.js";
 import { isPlanArtifact } from "../../library/detect-plan-artifact.js";
 import type { ApplyResourceResult } from "../../library/useApplyResource.js";
 
@@ -29,14 +30,39 @@ export interface ArtifactsTabProps {
    * every artifact.
    */
   readonly onOpenPlan?: (executionId: string) => void;
+  /**
+   * Open an artifact as an editor-pane document (the session panel's
+   * artifact-family virtual-document tab — the VS Code "each file is a tab"
+   * model). When provided, clicking a non-plan artifact routes here instead of
+   * the preview modal. When omitted (panel-less hosts) the modal remains the
+   * open mechanism. Plan artifacts always defer to {@link onOpenPlan} first.
+   */
+  readonly onOpenArtifact?: (entry: SessionArtifactEntry) => void;
+  /**
+   * Pin a non-plan artifact's document tab — the double-click half of the
+   * open/activate split (mirrors the file tree's `onOpenFile`/`onActivateFile`).
+   * When provided, each row binds a double-click that promotes the preview the
+   * single click opened. Omit in panel-less/modal hosts: with no handler the
+   * row binds no double-click, so a double-click is just two harmless single
+   * clicks. Plans always route to {@link onOpenPlan} (their tab is already
+   * pinned), so double-click == single-click for a plan.
+   */
+  readonly onActivateArtifact?: (entry: SessionArtifactEntry) => void;
 }
 
 /**
  * Artifacts facet for the session panel (a `useSessionRailViews` rail view).
  *
- * Wraps `useSessionArtifacts` → `ArtifactCard` list with
- * `ArtifactPreviewModal` — the same content as `ArtifactsWidget`
- * without the section heading.
+ * A VS Code-style dense file list of the session's outputs: one compact
+ * {@link ArtifactRow} per artifact (shared file-type icon + name + size, with a
+ * hover/focus Download). Clicking a row opens the artifact — a `plan.md` in the
+ * plan document tab ({@link onOpenPlan}), any other artifact in an editor-pane
+ * document ({@link onOpenArtifact}), or, for panel-less hosts that inject
+ * neither, the {@link ArtifactPreviewModal} popup fallback.
+ *
+ * Deliberately metadata-only: rows do NOT fetch content for resource detection
+ * (that would be one request per artifact on open) — detection and the
+ * Apply/Push action live in the opened document/modal instead.
  */
 export function ArtifactsTab({
   executions,
@@ -44,20 +70,41 @@ export function ArtifactsTab({
   onApplied,
   onImplementPlan,
   onOpenPlan,
+  onOpenArtifact,
+  onActivateArtifact,
 }: ArtifactsTabProps) {
   const { artifacts, hasArtifacts } = useSessionArtifacts(executions);
   const [previewEntry, setPreviewEntry] = useState<SessionArtifactEntry | null>(null);
 
-  const handlePreview = useCallback(
+  const handleOpen = useCallback(
     (entry: SessionArtifactEntry) => {
-      // The plan opens as a document (the panel's plan tab), never a popup.
+      // A plan is a first-class document — it opens in the dedicated plan tab,
+      // never as a generic artifact or a popup.
       if (onOpenPlan && isPlanArtifact(entry.artifact)) {
         onOpenPlan(entry.executionId);
         return;
       }
+      // Editor-pane document when the host injected it; otherwise the modal.
+      if (onOpenArtifact) {
+        onOpenArtifact(entry);
+        return;
+      }
       setPreviewEntry(entry);
     },
-    [onOpenPlan],
+    [onOpenPlan, onOpenArtifact],
+  );
+
+  const handleActivate = useCallback(
+    (entry: SessionArtifactEntry) => {
+      // A plan's tab is always pinned, so double-click matches single-click:
+      // route to the plan tab, never pin a generic artifact.
+      if (onOpenPlan && isPlanArtifact(entry.artifact)) {
+        onOpenPlan(entry.executionId);
+        return;
+      }
+      onActivateArtifact?.(entry);
+    },
+    [onOpenPlan, onActivateArtifact],
   );
 
   const handleClosePreview = useCallback(() => {
@@ -76,19 +123,20 @@ export function ArtifactsTab({
 
   return (
     <>
-      <div role="list" className="space-y-2">
+      <ul role="list" className="flex flex-col">
         {artifacts.map((entry) => (
-          <div key={entry.artifact.sandboxPath || entry.artifact.name} role="listitem">
-            <ArtifactCard
-              artifact={entry.artifact}
-              executionId={entry.executionId}
-              org={org}
-              hasNameCollision={entry.hasNameCollision}
-              onPreview={() => handlePreview(entry)}
-            />
-          </div>
+          <ArtifactRow
+            key={artifactKey(entry.artifact)}
+            artifact={entry.artifact}
+            executionId={entry.executionId}
+            hasNameCollision={entry.hasNameCollision}
+            onOpen={() => handleOpen(entry)}
+            onActivate={
+              onActivateArtifact ? () => handleActivate(entry) : undefined
+            }
+          />
         ))}
-      </div>
+      </ul>
 
       {previewEntry && (
         <ArtifactPreviewModal

package/src/session/facets/__tests__/ArtifactsTab.test.tsx

@@ -9,7 +9,8 @@ import {
   ExecutionPhase,
 } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/enum_pb";
 import { StigmerContext } from "../../../context";
-import { ArtifactsTab } from "../ArtifactsTab";
+import { ArtifactsTab, type ArtifactsTabProps } from "../ArtifactsTab";
+import type { SessionArtifactEntry } from "../../useSessionArtifacts";
 
 function artifact(name: string) {
   return create(ExecutionArtifactSchema, {
@@ -38,86 +39,149 @@ function createStigmerMock(): Stigmer {
   } as unknown as Stigmer;
 }
 
-function renderTab(
-  onImplementPlan?: () => void,
-  onOpenPlan?: (executionId: string) => void,
-) {
+function renderTab(props: Partial<ArtifactsTabProps> = {}) {
   return render(
     <StigmerContext.Provider value={createStigmerMock()}>
-      <ArtifactsTab
-        executions={[execution]}
-        org="acme"
-        onImplementPlan={onImplementPlan}
-        onOpenPlan={onOpenPlan}
-      />
+      <ArtifactsTab executions={[execution]} org="acme" {...props} />
     </StigmerContext.Provider>,
   );
 }
 
-function openPreviewFor(name: string) {
-  const row = screen.getByText(name).closest("[role='listitem']") as HTMLElement;
-  fireEvent.click(within(row).getByText("Preview"));
+/** Click the open target of a row by its artifact name. */
+function openRow(name: string) {
+  fireEvent.click(screen.getByText(name));
+}
+
+/** Double-click the open target of a row by its artifact name (the pin gesture). */
+function activateRow(name: string) {
+  fireEvent.doubleClick(screen.getByText(name));
 }
 
 afterEach(cleanup);
 
-describe("ArtifactsTab — plan 'Build' wiring", () => {
-  it("shows 'Build' in the preview of a plan.md artifact", () => {
-    renderTab(vi.fn());
+describe("ArtifactsTab — dense row list", () => {
+  it("renders one row per artifact with a Download control (no old 'Preview' button)", () => {
+    renderTab({ onOpenArtifact: vi.fn() });
 
-    openPreviewFor("plan.md");
+    expect(screen.getAllByRole("listitem")).toHaveLength(2);
+    expect(screen.getByText("plan.md")).toBeTruthy();
+    expect(screen.getByText("notes.md")).toBeTruthy();
+    expect(screen.queryByText("Preview")).toBeNull();
+    expect(screen.getByLabelText("Download plan.md")).toBeTruthy();
+    expect(screen.getByLabelText("Download notes.md")).toBeTruthy();
+  });
 
-    const dialog = document.querySelector("dialog")!;
-    expect(within(dialog).getByText("Build")).toBeTruthy();
+  it("renders the empty state with no artifacts", () => {
+    render(
+      <StigmerContext.Provider value={createStigmerMock()}>
+        <ArtifactsTab executions={[]} org="acme" />
+      </StigmerContext.Provider>,
+    );
+    expect(screen.getByText(/No artifacts yet/)).toBeTruthy();
   });
+});
 
-  it("does not show 'Build' in the preview of a non-plan artifact", () => {
-    renderTab(vi.fn());
+describe("ArtifactsTab — open routing", () => {
+  it("routes a non-plan artifact to onOpenArtifact (no modal) when provided", () => {
+    const onOpenArtifact = vi.fn<(entry: SessionArtifactEntry) => void>();
+    renderTab({ onOpenArtifact, onOpenPlan: vi.fn() });
 
-    openPreviewFor("notes.md");
+    openRow("notes.md");
 
-    const dialog = document.querySelector("dialog")!;
-    expect(within(dialog).queryByText("Build")).toBeNull();
+    expect(onOpenArtifact).toHaveBeenCalledTimes(1);
+    expect(onOpenArtifact.mock.calls[0][0].artifact.name).toBe("notes.md");
+    expect(document.querySelector("dialog")).toBeNull();
   });
 
-  it("invokes onImplementPlan when 'Build' is clicked for a plan", () => {
-    const onImplementPlan = vi.fn();
-    renderTab(onImplementPlan);
+  it("routes plan.md to onOpenPlan (never onOpenArtifact) when both are provided", () => {
+    const onOpenArtifact = vi.fn();
+    const onOpenPlan = vi.fn();
+    renderTab({ onOpenArtifact, onOpenPlan });
 
-    openPreviewFor("plan.md");
-    const dialog = document.querySelector("dialog")!;
-    fireEvent.click(within(dialog).getByText("Build"));
+    openRow("plan.md");
 
-    expect(onImplementPlan).toHaveBeenCalledTimes(1);
+    expect(onOpenPlan).toHaveBeenCalledWith("aex_1");
+    expect(onOpenArtifact).not.toHaveBeenCalled();
+    expect(document.querySelector("dialog")).toBeNull();
+  });
+
+  it("falls back to the modal for a non-plan artifact when onOpenArtifact is omitted", () => {
+    renderTab({ onOpenPlan: vi.fn() });
+
+    openRow("notes.md");
+
+    expect(document.querySelector("dialog")).toBeTruthy();
+  });
+
+  it("falls back to the modal for plan.md when neither onOpenPlan nor onOpenArtifact is provided", () => {
+    renderTab();
+
+    openRow("plan.md");
+
+    expect(document.querySelector("dialog")).toBeTruthy();
   });
 });
 
-describe("ArtifactsTab — plan routes to the plan document tab", () => {
-  it("routes a plan.md preview to onOpenPlan (no modal) when provided", () => {
+describe("ArtifactsTab — pin (double-click) routing", () => {
+  it("routes a non-plan double-click to onActivateArtifact (pin)", () => {
+    const onActivateArtifact = vi.fn<(entry: SessionArtifactEntry) => void>();
+    renderTab({ onOpenArtifact: vi.fn(), onActivateArtifact, onOpenPlan: vi.fn() });
+
+    activateRow("notes.md");
+
+    expect(onActivateArtifact).toHaveBeenCalledTimes(1);
+    expect(onActivateArtifact.mock.calls[0][0].artifact.name).toBe("notes.md");
+  });
+
+  it("routes a plan.md double-click to onOpenPlan (its tab is already pinned), never onActivateArtifact", () => {
+    const onActivateArtifact = vi.fn();
     const onOpenPlan = vi.fn();
-    renderTab(vi.fn(), onOpenPlan);
+    renderTab({ onOpenArtifact: vi.fn(), onActivateArtifact, onOpenPlan });
 
-    openPreviewFor("plan.md");
+    activateRow("plan.md");
 
     expect(onOpenPlan).toHaveBeenCalledWith("aex_1");
-    expect(document.querySelector("dialog")).toBeNull();
+    expect(onActivateArtifact).not.toHaveBeenCalled();
   });
 
-  it("keeps the modal for non-plan artifacts even when onOpenPlan is provided", () => {
-    const onOpenPlan = vi.fn();
-    renderTab(vi.fn(), onOpenPlan);
+  it("binds no double-click when onActivateArtifact is omitted (panel-less host) — a double-click is harmless", () => {
+    const onOpenArtifact = vi.fn();
+    renderTab({ onOpenArtifact });
 
-    openPreviewFor("notes.md");
+    // With no pin handler the row binds no onDoubleClick, so a dblclick fires
+    // nothing (in a real browser the leading single-clicks still preview).
+    expect(() => activateRow("notes.md")).not.toThrow();
+    expect(onOpenArtifact).not.toHaveBeenCalled();
+  });
+});
 
-    expect(onOpenPlan).not.toHaveBeenCalled();
-    expect(document.querySelector("dialog")).toBeTruthy();
+describe("ArtifactsTab — modal fallback plan 'Build' wiring", () => {
+  it("shows 'Build' in the modal preview of a plan.md artifact (panel-less host)", () => {
+    renderTab({ onImplementPlan: vi.fn() });
+
+    openRow("plan.md");
+
+    const dialog = document.querySelector("dialog")!;
+    expect(within(dialog).getByText("Build")).toBeTruthy();
   });
 
-  it("keeps the modal for plan.md when onOpenPlan is omitted (hosts without the plan tab)", () => {
-    renderTab(vi.fn());
+  it("does not show 'Build' in the modal preview of a non-plan artifact", () => {
+    renderTab({ onImplementPlan: vi.fn() });
 
-    openPreviewFor("plan.md");
+    openRow("notes.md");
 
-    expect(document.querySelector("dialog")).toBeTruthy();
+    const dialog = document.querySelector("dialog")!;
+    expect(within(dialog).queryByText("Build")).toBeNull();
+  });
+
+  it("invokes onImplementPlan when 'Build' is clicked for a plan", () => {
+    const onImplementPlan = vi.fn();
+    renderTab({ onImplementPlan });
+
+    openRow("plan.md");
+    const dialog = document.querySelector("dialog")!;
+    fireEvent.click(within(dialog).getByText("Build"));
+
+    expect(onImplementPlan).toHaveBeenCalledTimes(1);
   });
 });

package/src/session/index.ts

@@ -33,7 +33,7 @@ export type {
   UseSessionConversationReturn,
 } from "./useSessionConversation.js";
 
-export { useSessionArtifacts } from "./useSessionArtifacts.js";
+export { useSessionArtifacts, artifactKey } from "./useSessionArtifacts.js";
 export type {
   SessionArtifactEntry,
   UseSessionArtifactsReturn,
@@ -127,6 +127,10 @@ export {
   PLAN_DOCUMENT_PATH,
 } from "./plan-document.js";
 
+// Artifact document — the editor-area rendering of an execution artifact
+// (mounted as an artifact-family virtual document) and the identity of its tabs.
+export { ARTIFACT_DOCUMENT_ENTRY_ID } from "./artifact-document.js";
+
 // Selection types (for platform builders composing their own Inspect facet)
 export type { SelectedThreadItem } from "../internal/store/selection-store.js";
 

package/src/session/useSessionArtifacts.ts

@@ -41,11 +41,22 @@ export interface UseSessionArtifactsReturn {
 }
 
 /**
- * Returns the dedup key for an artifact. Uses `sandbox_path` when
- * available (stable filesystem identity within the session sandbox),
- * falling back to `name` for older artifacts that predate the field.
+ * The stable identity of an artifact within a session. Uses `sandbox_path`
+ * when available (the artifact's filesystem identity within the session
+ * sandbox), falling back to `name` for older artifacts that predate the field.
+ *
+ * This is the SINGLE source of truth for artifact identity across three sites
+ * that must agree or a tab could fail to resolve its artifact:
+ * 1. deduplication here (latest execution wins per key),
+ * 2. the virtual-document tab `path` when an artifact opens in the editor area
+ *    (see `SessionViewer` / `useSessionPanel.openArtifact`), and
+ * 3. the `artifactKey → entry` lookup that renders the open tab's document.
+ *
+ * Its basename doubles as the editor tab's label (paths render as their last
+ * `/` segment in `EditorTabs`), so `sandbox_path` gives a natural filename
+ * label with cross-directory disambiguation for free.
  */
-function dedupKey(artifact: ExecutionArtifact): string {
+export function artifactKey(artifact: ExecutionArtifact): string {
   return artifact.sandboxPath || artifact.name;
 }
 
@@ -102,7 +113,7 @@ export function useSessionArtifacts(
       const terminal = isTerminalPhase(phase);
 
       for (const artifact of execution.status?.artifacts ?? []) {
-        const key = dedupKey(artifact);
+        const key = artifactKey(artifact);
         entryMap.set(key, {
           artifact,
           executionId,

package/src/session/useSessionConversation.ts

@@ -117,6 +117,15 @@ export interface SendFollowUpOptions {
    * @see {@link CreateAgentExecutionInput.workspaceFileRefs}
    */
   readonly workspaceFileRefs?: string[];
+  /**
+   * ID of the execution this follow-up supersedes (edit-and-resubmit).
+   *
+   * The conversation read model hides the superseded execution so the
+   * edited message replaces the original in place.
+   *
+   * @see {@link CreateAgentExecutionInput.supersedesExecutionId}
+   */
+  readonly supersedesExecutionId?: string;
 }
 
 /**
@@ -129,7 +138,14 @@ export interface SendFollowUpOptions {
 export interface UseSessionConversationReturn {
   /** The session object, or null while loading. */
   readonly session: Session | null;
-  /** Executions in terminal phases, in chronological order. */
+  /**
+   * Executions in terminal phases, in chronological order.
+   *
+   * Excludes turns replaced via edit-and-resubmit (an execution whose id
+   * appears as another execution's `supersedesExecutionId`) — the edited
+   * message stands in the original's place. Superseded records remain in
+   * execution history surfaces; only the conversation view hides them.
+   */
   readonly completedExecutions: readonly AgentExecution[];
   /** Currently streaming execution (stream or fetch fallback), or null. */
   readonly activeStreamExecution: AgentExecution | null;
@@ -491,12 +507,37 @@ export function useSessionConversation(
     }
   }, [activeExecutionId, stream.phase, refetch]);
 
+  // Executions replaced via edit-and-resubmit. The successor carries
+  // `spec.supersedes_execution_id`; hiding the superseded turn makes the
+  // edited message read as a single corrected exchange (in-place replace).
+  // The link must also be read off the live stream copy — right after a
+  // resubmit, the successor streams before the list refetch delivers it.
+  // Display-only: the raw `executions` list (and therefore active-id
+  // resolution above) is never filtered.
+  //
+  // Dep is the scalar link, NOT stream.execution: the stream object changes
+  // reference every frame, and rebuilding the Set per frame would hand
+  // MessageThread a fresh executions array mid-stream, defeating its
+  // memoization (DD-010).
+  const streamSupersededId =
+    stream.execution?.spec?.supersedesExecutionId || null;
+  const supersededIds = useMemo(() => {
+    const ids = new Set<string>();
+    for (const e of executions) {
+      const superseded = e.spec?.supersedesExecutionId;
+      if (superseded) ids.add(superseded);
+    }
+    if (streamSupersededId) ids.add(streamSupersededId);
+    return ids;
+  }, [executions, streamSupersededId]);
+
   const completedExecutions = useMemo(() => {
-    if (!activeExecutionId) return executions;
-    return executions.filter(
-      (e) => (e.metadata?.id ?? "") !== activeExecutionId,
-    );
-  }, [executions, activeExecutionId]);
+    return executions.filter((e) => {
+      const id = e.metadata?.id ?? "";
+      if (activeExecutionId && id === activeExecutionId) return false;
+      return !supersededIds.has(id);
+    });
+  }, [executions, activeExecutionId, supersededIds]);
 
   const fetchedActiveExecution = useMemo(() => {
     if (!activeExecutionId) return null;
@@ -604,6 +645,7 @@ export function useSessionConversation(
           buildFromPlan: options?.buildFromPlan,
           autoApproveAll: options?.autoApproveAll,
           workspaceFileRefs: options?.workspaceFileRefs,
+          supersedesExecutionId: options?.supersedesExecutionId,
         });
         setPendingExecutionId(result.executionId);
         refetch();

package/src/session/useSessionPageFlow.ts

@@ -410,6 +410,7 @@ export function useSessionPageFlow(
         // not from the composer (the pre-arm toggle was removed).
         autoApproveAll: autoApproveAll || undefined,
         workspaceFileRefs: context?.workspaceFileRefs,
+        supersedesExecutionId: context?.supersedesExecutionId,
       });
 
       sessionVariables.clear();