@stigmer/react 3.1.1 → 3.1.2

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

@@ -784,6 +784,50 @@ describe("MessageThread", () => {
     });
   });
 
+  describe("live plan collapse (streaming Plan turn)", () => {
+    function streamingPlanExecution() {
+      return makeExecution({
+        id: "exec-live",
+        phase: ExecutionPhase.EXECUTION_IN_PROGRESS,
+        interactionMode: InteractionMode.PLAN,
+        aiContent: "# Rollout Plan\n\n1. First step",
+      });
+    }
+
+    it("collapses the streaming plan behind a live card when onOpenPlan is wired", () => {
+      const onOpenPlan = vi.fn();
+      render(
+        <MessageThread
+          executions={[]}
+          activeStreamExecution={streamingPlanExecution()}
+          onOpenPlan={onOpenPlan}
+        />,
+      );
+
+      const card = screen.getByRole("region", { name: "Plan being written" });
+      expect(card.textContent).toContain("Rollout Plan");
+      // The plan body lives in the panel's plan tab, not the thread.
+      expect(screen.queryByText(/First step/)).toBeNull();
+
+      fireEvent.click(screen.getByText("Open plan"));
+      expect(onOpenPlan).toHaveBeenCalledWith("exec-live");
+    });
+
+    it("keeps the plan streaming inline for hosts without a plan surface (DD-011)", () => {
+      render(
+        <MessageThread
+          executions={[]}
+          activeStreamExecution={streamingPlanExecution()}
+        />,
+      );
+
+      expect(
+        screen.queryByRole("region", { name: "Plan being written" }),
+      ).toBeNull();
+      expect(screen.getByText(/First step/)).toBeTruthy();
+    });
+  });
+
   it("renders plan-completion card when last execution is completed Plan mode", () => {
     const exec = makeExecution({
       id: "exec-plan",
@@ -806,4 +850,61 @@ describe("MessageThread", () => {
     fireEvent.click(buildBtn);
     expect(onBuildFromPlan).toHaveBeenCalledOnce();
   });
+
+  describe("plan-turn identity", () => {
+    it("marks a Plan turn's prompt bubble with the Plan badge", () => {
+      const exec = makeExecution({
+        id: "exec-plan",
+        phase: ExecutionPhase.EXECUTION_COMPLETED,
+        interactionMode: InteractionMode.PLAN,
+      });
+
+      render(<MessageThread executions={[exec]} />);
+
+      expect(screen.getByRole("status", { name: "Plan mode" })).toBeTruthy();
+    });
+
+    it("shows no mode badge on Agent turns", () => {
+      const exec = makeExecution({
+        id: "exec-agent",
+        phase: ExecutionPhase.EXECUTION_COMPLETED,
+        interactionMode: InteractionMode.AGENT,
+      });
+
+      render(<MessageThread executions={[exec]} />);
+
+      expect(screen.queryByRole("status", { name: "Plan mode" })).toBeNull();
+    });
+
+    it("renders a completed Plan turn's plan as a document", () => {
+      const exec = makeExecution({
+        id: "exec-plan",
+        phase: ExecutionPhase.EXECUTION_COMPLETED,
+        interactionMode: InteractionMode.PLAN,
+        aiContent: "# Rollout Plan\n\n1. First step",
+      });
+
+      render(<MessageThread executions={[exec]} />);
+
+      const doc = screen.getByRole("article", { name: "Plan document" });
+      expect(doc.textContent).toContain("Rollout Plan");
+      expect(doc.textContent).toContain("First step");
+    });
+
+    it("renders a streaming Plan turn's text as an ordinary chat message", () => {
+      const exec = makeExecution({
+        id: "exec-live",
+        phase: ExecutionPhase.EXECUTION_IN_PROGRESS,
+        interactionMode: InteractionMode.PLAN,
+        aiContent: "Draft so far",
+      });
+
+      render(<MessageThread executions={[]} activeStreamExecution={exec} />);
+
+      expect(
+        screen.queryByRole("article", { name: "Plan document" }),
+      ).toBeNull();
+      expect(screen.getByRole("article", { name: "AI response" })).toBeTruthy();
+    });
+  });
 });

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

@@ -47,18 +47,32 @@ function renderCard(ui: ReactNode) {
 
 afterEach(cleanup);
 
-describe("PlanArtifactCard — action surface", () => {
-  it("is an accessible region labelled as the plan's actions, with name + size", () => {
+describe("PlanArtifactCard — compact document card", () => {
+  it("is an accessible region with the plan's title, filename, and size", () => {
     renderCard(
-      <PlanArtifactCard executionId="aex_1" artifact={planArtifact} org="acme" />,
+      <PlanArtifactCard
+        executionId="aex_1"
+        artifact={planArtifact}
+        title="Refactor the auth flow"
+        org="acme"
+      />,
     );
 
-    const region = screen.getByRole("region", { name: "Plan actions" });
-    expect(region.textContent).toContain("Plan");
+    const region = screen.getByRole("region", { name: "Plan" });
+    expect(region.textContent).toContain("Refactor the auth flow");
+    expect(region.textContent).toContain("plan.md");
     expect(region.textContent).toContain("KB");
   });
 
-  it("does NOT render the plan content (the message above is the document)", () => {
+  it("falls back to 'Plan' when the plan has no title", () => {
+    renderCard(
+      <PlanArtifactCard executionId="aex_1" artifact={planArtifact} org="acme" />,
+    );
+    const region = screen.getByRole("region", { name: "Plan" });
+    expect(region.textContent).toContain("Plan");
+  });
+
+  it("does NOT render the plan content (the document lives in the plan tab)", () => {
     const { stigmer, getArtifactContent } = createStigmerMock();
     render(
       withStigmer(
@@ -66,8 +80,8 @@ describe("PlanArtifactCard — action surface", () => {
         stigmer,
       ),
     );
-    // The card is a pure action surface — it must not fetch the plan body until
-    // the user explicitly opens the full preview.
+    // The card is the plan's compact stand-in — it must not fetch the plan
+    // body; that belongs to the plan tab (or the explicit preview modal).
     expect(getArtifactContent).not.toHaveBeenCalled();
   });
 
@@ -93,6 +107,25 @@ describe("PlanArtifactCard — action surface", () => {
     expect(screen.queryByText("Build from plan")).toBeNull();
   });
 
+  it("shows the pending label while the approved plan uploads (buildPending)", () => {
+    renderCard(
+      <PlanArtifactCard
+        executionId="aex_1"
+        artifact={planArtifact}
+        org="acme"
+        onImplement={vi.fn()}
+        disabled
+        buildPending
+      />,
+    );
+
+    // The primary reads as in-progress and stays disabled — no double-submits
+    // while the upload precedes the implement turn.
+    expect(screen.queryByText("Build from plan")).toBeNull();
+    const button = screen.getByText("Starting build…").closest("button")!;
+    expect(button.disabled).toBe(true);
+  });
+
   it("disables 'Build from plan' when disabled", () => {
     const onImplement = vi.fn();
     renderCard(
@@ -141,7 +174,7 @@ describe("PlanArtifactCard — Cmd/Ctrl+Enter accelerator (card-scoped)", () =>
       />,
     );
 
-    const region = screen.getByRole("region", { name: "Plan actions" });
+    const region = screen.getByRole("region", { name: "Plan" });
     fireEvent.keyDown(region, { key: "Enter", metaKey: true });
     expect(onImplement).toHaveBeenCalledTimes(1);
   });
@@ -157,7 +190,7 @@ describe("PlanArtifactCard — Cmd/Ctrl+Enter accelerator (card-scoped)", () =>
       />,
     );
 
-    const region = screen.getByRole("region", { name: "Plan actions" });
+    const region = screen.getByRole("region", { name: "Plan" });
     fireEvent.keyDown(region, { key: "Enter", ctrlKey: true });
     expect(onImplement).toHaveBeenCalledTimes(1);
   });
@@ -173,7 +206,7 @@ describe("PlanArtifactCard — Cmd/Ctrl+Enter accelerator (card-scoped)", () =>
       />,
     );
 
-    const region = screen.getByRole("region", { name: "Plan actions" });
+    const region = screen.getByRole("region", { name: "Plan" });
     fireEvent.keyDown(region, { key: "Enter" });
     expect(onImplement).not.toHaveBeenCalled();
   });
@@ -190,7 +223,7 @@ describe("PlanArtifactCard — Cmd/Ctrl+Enter accelerator (card-scoped)", () =>
       />,
     );
 
-    const region = screen.getByRole("region", { name: "Plan actions" });
+    const region = screen.getByRole("region", { name: "Plan" });
     fireEvent.keyDown(region, { key: "Enter", metaKey: true });
     expect(onImplement).not.toHaveBeenCalled();
   });
@@ -230,3 +263,24 @@ describe("PlanArtifactCard — Open full (org-gated preview)", () => {
     expect(screen.queryByText("Download")).not.toBeNull();
   });
 });
+
+describe("PlanArtifactCard — Open plan (panel-first review)", () => {
+  it("replaces the modal secondary with 'Open plan' when onOpenPlan is provided", () => {
+    const onOpenPlan = vi.fn();
+    renderCard(
+      <PlanArtifactCard
+        executionId="aex_1"
+        artifact={planArtifact}
+        org="acme"
+        onOpenPlan={onOpenPlan}
+      />,
+    );
+
+    // One review affordance, not two: the facet supersedes the modal.
+    expect(screen.queryByText("Open full")).toBeNull();
+
+    fireEvent.click(screen.getByText("Open plan"));
+    expect(onOpenPlan).toHaveBeenCalledTimes(1);
+    expect(document.querySelector("dialog")).toBeNull();
+  });
+});

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

@@ -0,0 +1,55 @@
+import { describe, it, expect, afterEach } from "vitest";
+import { render, screen, cleanup } from "@testing-library/react";
+import { PlanDocumentMessage } from "../PlanDocumentMessage";
+
+afterEach(cleanup);
+
+describe("PlanDocumentMessage", () => {
+  it("lifts the leading H1 into the header and renders the body as markdown", () => {
+    render(
+      <PlanDocumentMessage
+        content={"# Migration Plan\n\n## Phase 1\n\n- step one"}
+      />,
+    );
+
+    const doc = screen.getByRole("article", { name: "Plan document" });
+    expect(doc).toBeTruthy();
+    expect(doc.querySelector("header")!.textContent).toContain(
+      "Migration Plan",
+    );
+    // The lifted title does not repeat inside the prose body.
+    expect(doc.querySelectorAll("h1")).toHaveLength(0);
+  });
+
+  it("falls back to a 'Plan' header when the document has no leading H1", () => {
+    render(<PlanDocumentMessage content="Just prose, no heading." />);
+
+    const doc = screen.getByRole("article", { name: "Plan document" });
+    expect(doc.querySelector("header")!.textContent).toContain("Plan");
+    expect(doc.textContent).toContain("Just prose, no heading.");
+  });
+
+  it("unwraps a whole-body BARE fence (plan-scoped fence handling)", () => {
+    render(
+      <PlanDocumentMessage content={"```\n# Fenced Plan\n\nBody text\n```"} />,
+    );
+
+    const doc = screen.getByRole("article", { name: "Plan document" });
+    // Unwrapped: the H1 became the header title, the body is prose (not a
+    // flat code block).
+    expect(doc.querySelector("header")!.textContent).toContain("Fenced Plan");
+    expect(doc.querySelector("pre")).toBeNull();
+    expect(doc.textContent).toContain("Body text");
+  });
+
+  it("keeps an inner code fence as a code block", () => {
+    render(
+      <PlanDocumentMessage
+        content={"# Plan\n\n```ts\nconst x = 1;\n```"}
+      />,
+    );
+
+    const doc = screen.getByRole("article", { name: "Plan document" });
+    expect(doc.querySelector("pre")).not.toBeNull();
+  });
+});

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

@@ -0,0 +1,49 @@
+import { describe, it, expect, vi, afterEach } from "vitest";
+import { render, screen, fireEvent, cleanup } from "@testing-library/react";
+import { PlanStreamingCard } from "../PlanStreamingCard";
+
+afterEach(cleanup);
+
+describe("PlanStreamingCard — live plan stand-in", () => {
+  it("is a busy region with the streaming title, filename, and live size", () => {
+    render(
+      <PlanStreamingCard
+        title="Refactor the auth flow"
+        sizeBytes={2048}
+        onOpenPlan={vi.fn()}
+      />,
+    );
+
+    const region = screen.getByRole("region", { name: "Plan being written" });
+    expect(region.getAttribute("aria-busy")).toBe("true");
+    expect(region.textContent).toContain("Refactor the auth flow");
+    expect(region.textContent).toContain("plan.md");
+    expect(region.textContent).toContain("Writing…");
+    expect(region.textContent).toContain("2.0 KB");
+  });
+
+  it("falls back to 'Writing plan…' until the title has streamed in", () => {
+    render(<PlanStreamingCard sizeBytes={12} onOpenPlan={vi.fn()} />);
+    expect(screen.getByText("Writing plan…")).toBeTruthy();
+  });
+
+  it("routes 'Open plan' to onOpenPlan", () => {
+    const onOpenPlan = vi.fn();
+    render(<PlanStreamingCard sizeBytes={64} onOpenPlan={onOpenPlan} />);
+
+    fireEvent.click(screen.getByText("Open plan"));
+    expect(onOpenPlan).toHaveBeenCalledTimes(1);
+  });
+
+  it("offers no Download or Build actions — nothing final exists yet", () => {
+    render(<PlanStreamingCard sizeBytes={64} onOpenPlan={vi.fn()} />);
+    expect(screen.queryByText("Download")).toBeNull();
+    expect(screen.queryByText("Build from plan")).toBeNull();
+  });
+
+  it("renders without an action when onOpenPlan is absent", () => {
+    render(<PlanStreamingCard sizeBytes={64} />);
+    expect(screen.queryByText("Open plan")).toBeNull();
+    expect(screen.queryByRole("button")).toBeNull();
+  });
+});