@stigmer/react 3.0.2 → 3.0.3

package/src/execution/MessageThread.tsx

@@ -141,6 +141,19 @@ export interface MessageThreadProps {
    * compatible — existing consumers see no change.
    */
   readonly onBuildFromPlan?: () => void;
+  /**
+   * Organization slug. Required for the plan completion card's
+   * "Review plan" action, which opens the shared artifact preview
+   * modal (the modal needs `org` for its detection/apply pipeline).
+   */
+  readonly org?: string;
+  /**
+   * Disables the plan completion card's actions (Implement / Review).
+   * Defense in depth for the brief windows where a follow-up cannot be
+   * sent (e.g. an execution is streaming); the composer also no-ops a
+   * disabled submit.
+   */
+  readonly planActionsDisabled?: boolean;
   /**
    * Center thread content within a max-width reading column.
    *
@@ -462,6 +475,8 @@ export function MessageThread({
   summarizationEvents,
   virtualized = false,
   onBuildFromPlan,
+  org,
+  planActionsDisabled,
   centerContent = false,
 }: MessageThreadProps) {
   useRenderTracer("MessageThread", { executions, activeStreamExecution });
@@ -499,6 +514,8 @@ export function MessageThread({
             filePathCtx={filePathCtx}
             sandboxCtx={sandboxCtx}
             onBuildFromPlan={onBuildFromPlan}
+            org={org}
+            planActionsDisabled={planActionsDisabled}
             centerContent={centerContent}
           />
         </Suspense>
@@ -517,6 +534,8 @@ export function MessageThread({
       filePathCtx={filePathCtx}
       sandboxCtx={sandboxCtx}
       onBuildFromPlan={onBuildFromPlan}
+      org={org}
+      planActionsDisabled={planActionsDisabled}
     />
   );
 }
@@ -539,6 +558,8 @@ interface NonVirtualizedThreadProps {
   readonly filePathCtx: FilePathContextValue;
   readonly sandboxCtx: SandboxContextValue;
   readonly onBuildFromPlan?: () => void;
+  readonly org?: string;
+  readonly planActionsDisabled?: boolean;
 }
 
 function NonVirtualizedThread({
@@ -551,6 +572,8 @@ function NonVirtualizedThread({
   filePathCtx,
   sandboxCtx,
   onBuildFromPlan,
+  org,
+  planActionsDisabled,
 }: NonVirtualizedThreadProps) {
   const { scrollRef, sentinelRef, contentRef, isFollowing, jumpToLatest } =
     useAutoScroll();
@@ -584,6 +607,8 @@ function NonVirtualizedThread({
                   onApprovalSubmit={onApprovalSubmit}
                   submittingApprovalIds={submittingApprovalIds}
                   onBuildFromPlan={onBuildFromPlan}
+                  org={org}
+                  planActionsDisabled={planActionsDisabled}
                 />
               </ThreadItemWrapper>
             ))}
@@ -618,6 +643,8 @@ export interface ThreadItemRendererProps {
   ) => void;
   readonly submittingApprovalIds?: ReadonlySet<string>;
   readonly onBuildFromPlan?: () => void;
+  readonly org?: string;
+  readonly planActionsDisabled?: boolean;
 }
 
 /**
@@ -637,6 +664,8 @@ export function ThreadItemRenderer({
   onApprovalSubmit,
   submittingApprovalIds,
   onBuildFromPlan,
+  org,
+  planActionsDisabled,
 }: ThreadItemRendererProps) {
   switch (item.kind) {
     case "message":
@@ -694,10 +723,15 @@ export function ThreadItemRenderer({
         <PlanArtifactCard
           executionId={item.executionId}
           artifact={item.planArtifact}
+          org={org}
           onImplement={onBuildFromPlan}
+          disabled={planActionsDisabled}
         />
       ) : (
-        <PlanCompletionCard onImplement={onBuildFromPlan} />
+        <PlanCompletionCard
+          onImplement={onBuildFromPlan}
+          disabled={planActionsDisabled}
+        />
       );
   }
 }

package/src/execution/PlanArtifactCard.tsx

@@ -1,21 +1,23 @@
 "use client";
 
-import { memo, useCallback, useState } from "react";
+import { memo, useState } from "react";
 import { cn } from "@stigmer/theme";
 import type { ExecutionArtifact } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/artifact_pb";
-import { useArtifactContent } from "./useArtifactContent";
-import { ArtifactContentRenderer } from "./ArtifactContentRenderer";
+import { ArtifactPreviewModal } from "./ArtifactPreviewModal";
 import { formatArtifactSize } from "./artifact-utils";
 
-/** Plans above this size are not inlined for preview — download instead. */
-const MAX_PREVIEW_BYTES = 512 * 1024;
-
 /** Props for {@link PlanArtifactCard}. */
 export interface PlanArtifactCardProps {
   /** Execution that produced the plan — used to fetch the plan content. */
   readonly executionId: string;
   /** The published `plan.md` artifact (from `findPlanArtifact`). */
   readonly artifact: ExecutionArtifact;
+  /**
+   * Organization slug. Required for the "Review plan" modal (the shared
+   * {@link ArtifactPreviewModal} uses it for its detection/apply pipeline).
+   * When omitted, the Review action is hidden — Implement and Download remain.
+   */
+  readonly org?: string;
   /** Called when the user clicks "Implement". Hidden when omitted. */
   readonly onImplement?: () => void;
   /** Disables the Implement CTA (e.g., while an execution is active). */
@@ -28,11 +30,13 @@ export interface PlanArtifactCardProps {
  * Reviewable card shown after a completed Plan-mode execution when the agent
  * published a `plan.md` artifact.
  *
- * Unlike {@link PlanCompletionCard} (a bare Implement CTA), this card makes the
- * plan a first-class, durable object: expand to review the rendered plan, copy
- * it, download the `plan.md` file, or proceed to implement. The plan content is
- * the single source of truth (the published artifact), fetched on demand via
- * {@link useArtifactContent} rather than duplicated into component state.
+ * Presentational by design: it surfaces the plan as a first-class object with
+ * three actions — **Implement** (turn the plan into an Agent run), **Review
+ * plan** (open the rendered plan in the shared {@link ArtifactPreviewModal},
+ * the same popup used elsewhere for artifact previews — where Copy and an
+ * Implement CTA also live), and **Download** the `plan.md` file. The plan text
+ * is the single source of truth (the published artifact); the modal fetches it
+ * on demand, so the card itself holds no plan content.
  *
  * All visual properties flow through `--stgm-*` tokens; the component is
  * self-contained and embeddable.
@@ -40,35 +44,12 @@ export interface PlanArtifactCardProps {
 export const PlanArtifactCard = memo(function PlanArtifactCard({
   executionId,
   artifact,
+  org,
   onImplement,
   disabled,
   className,
 }: PlanArtifactCardProps) {
-  const [expanded, setExpanded] = useState(false);
-  const [copied, setCopied] = useState(false);
-
-  // Plans are small markdown; fetch eagerly (within the size cap) so both the
-  // preview and Copy have content ready. contentHash invalidates the cache when
-  // the plan is re-published in the same execution.
-  const fetchable = Number(artifact.sizeBytes) < MAX_PREVIEW_BYTES;
-  const { content, contentType, isTruncated, isLoading } = useArtifactContent(
-    fetchable ? executionId : null,
-    fetchable ? artifact.storageKey : null,
-    undefined,
-    artifact.contentHash || undefined,
-  );
-
-  const handleCopy = useCallback(async () => {
-    if (!content) return;
-    try {
-      await navigator.clipboard.writeText(content);
-      setCopied(true);
-      setTimeout(() => setCopied(false), 1500);
-    } catch {
-      // Clipboard can be unavailable (insecure context / denied permission).
-      // Silently no-op: Download remains available as the durable fallback.
-    }
-  }, [content]);
+  const [previewOpen, setPreviewOpen] = useState(false);
 
   return (
     <div
@@ -111,30 +92,19 @@ export const PlanArtifactCard = memo(function PlanArtifactCard({
 
       {/* Secondary actions */}
       <div className="flex flex-wrap items-center gap-x-4 gap-y-1 border-t border-border-muted px-3 py-1.5">
-        <button
-          type="button"
-          aria-expanded={expanded}
-          onClick={() => setExpanded((v) => !v)}
-          className={cn(
-            "inline-flex items-center gap-1 text-xs font-medium text-primary transition-colors hover:text-primary-muted",
-            FOCUS_RING,
-          )}
-        >
-          <ChevronIcon expanded={expanded} />
-          {expanded ? "Hide plan" : "Review plan"}
-        </button>
-        <button
-          type="button"
-          onClick={handleCopy}
-          disabled={!content}
-          className={cn(
-            "text-xs font-medium text-muted-foreground transition-colors hover:text-foreground",
-            "disabled:pointer-events-none disabled:opacity-50",
-            FOCUS_RING,
-          )}
-        >
-          {copied ? "Copied" : "Copy"}
-        </button>
+        {org && (
+          <button
+            type="button"
+            onClick={() => setPreviewOpen(true)}
+            className={cn(
+              "inline-flex items-center gap-1 text-xs font-medium text-primary transition-colors hover:text-primary-muted",
+              FOCUS_RING,
+            )}
+          >
+            <ExpandIcon />
+            Review plan
+          </button>
+        )}
         <a
           href={artifact.downloadUrl}
           download={artifact.name}
@@ -148,28 +118,18 @@ export const PlanArtifactCard = memo(function PlanArtifactCard({
         </a>
       </div>
 
-      {/* Expandable plan preview */}
-      {expanded && (
-        <div className="max-h-96 overflow-auto border-t border-border-muted px-3 py-2">
-          {!fetchable ? (
-            <p className="text-xs text-muted-foreground">
-              This plan is large — use Download to view the full file.
-            </p>
-          ) : isLoading ? (
-            <div className="h-4 w-40 animate-pulse rounded bg-muted" aria-hidden="true" />
-          ) : content ? (
-            <ArtifactContentRenderer
-              content={content}
-              fileName={artifact.name}
-              contentType={contentType}
-              isTruncated={isTruncated}
-            />
-          ) : (
-            <p className="text-xs text-muted-foreground">
-              Plan content is unavailable. Use Download to retrieve the file.
-            </p>
-          )}
-        </div>
+      {/* Review opens the shared artifact preview popup — consistent with the
+          Artifacts tab and the single place that fetches/renders plan content. */}
+      {org && previewOpen && (
+        <ArtifactPreviewModal
+          artifact={artifact}
+          executionId={executionId}
+          org={org}
+          isTerminal
+          open
+          onClose={() => setPreviewOpen(false)}
+          onImplement={onImplement}
+        />
       )}
     </div>
   );
@@ -237,7 +197,7 @@ function DownloadIcon() {
   );
 }
 
-function ChevronIcon({ expanded }: { readonly expanded: boolean }) {
+function ExpandIcon() {
   return (
     <svg
       width="10"
@@ -248,10 +208,10 @@ function ChevronIcon({ expanded }: { readonly expanded: boolean }) {
       strokeWidth="1.5"
       strokeLinecap="round"
       strokeLinejoin="round"
-      className={cn("shrink-0 transition-transform", expanded && "rotate-90")}
+      className="shrink-0"
       aria-hidden="true"
     >
-      <path d="M4 2l4 4-4 4" />
+      <path d="M7 1.5h3.5V5M10.5 1.5L6.5 5.5M5 10.5H1.5V7M1.5 10.5l4-4" />
     </svg>
   );
 }

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

@@ -0,0 +1,85 @@
+import { describe, it, expect, vi, afterEach } from "vitest";
+import { render, screen, fireEvent, cleanup } from "@testing-library/react";
+import type { ReactNode } from "react";
+import { create } from "@bufbuild/protobuf";
+import type { Stigmer } from "@stigmer/sdk";
+import { ExecutionArtifactSchema } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/artifact_pb";
+import { ExecutionArtifactKind } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/enum_pb";
+import { StigmerContext } from "../../context";
+import { ArtifactPreviewContent } from "../ArtifactPreviewModal";
+
+// A non-text artifact: ArtifactPreviewContent skips the content fetch, so the
+// test exercises the Implement action without any network mocking.
+const binaryArtifact = create(ExecutionArtifactSchema, {
+  name: "report.bin",
+  kind: ExecutionArtifactKind.FILE,
+  sizeBytes: 128n,
+  storageKey: "artifacts/aex_1/report.bin",
+  downloadUrl: "https://example.test/report.bin",
+});
+
+function withStigmer(children: ReactNode) {
+  const client = {} as unknown as Stigmer;
+  return (
+    <StigmerContext.Provider value={client}>{children}</StigmerContext.Provider>
+  );
+}
+
+afterEach(cleanup);
+
+describe("ArtifactPreviewContent — Implement action", () => {
+  it("renders an Implement button only when onImplement is provided", () => {
+    const { rerender } = render(
+      withStigmer(
+        <ArtifactPreviewContent
+          artifact={binaryArtifact}
+          executionId="aex_1"
+          org="acme"
+          isTerminal
+          onClose={() => {}}
+        />,
+      ),
+    );
+    expect(screen.queryByText("Implement")).toBeNull();
+
+    rerender(
+      withStigmer(
+        <ArtifactPreviewContent
+          artifact={binaryArtifact}
+          executionId="aex_1"
+          org="acme"
+          isTerminal
+          onClose={() => {}}
+          onImplement={() => {}}
+        />,
+      ),
+    );
+    expect(screen.getByText("Implement")).toBeTruthy();
+  });
+
+  it("calls onImplement then closes the modal when Implement is clicked", () => {
+    const calls: string[] = [];
+    const onImplement = vi.fn(() => calls.push("implement"));
+    const onClose = vi.fn(() => calls.push("close"));
+
+    render(
+      withStigmer(
+        <ArtifactPreviewContent
+          artifact={binaryArtifact}
+          executionId="aex_1"
+          org="acme"
+          isTerminal
+          onClose={onClose}
+          onImplement={onImplement}
+        />,
+      ),
+    );
+
+    fireEvent.click(screen.getByText("Implement"));
+
+    expect(onImplement).toHaveBeenCalledTimes(1);
+    expect(onClose).toHaveBeenCalledTimes(1);
+    // Run the plan action before tearing down the modal.
+    expect(calls).toEqual(["implement", "close"]);
+  });
+});

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

@@ -0,0 +1,122 @@
+import { describe, it, expect, vi, afterEach } from "vitest";
+import { render, screen, fireEvent, cleanup } from "@testing-library/react";
+import type { ReactNode } from "react";
+import { create } from "@bufbuild/protobuf";
+import type { Stigmer } from "@stigmer/sdk";
+import { ExecutionArtifactSchema } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/artifact_pb";
+import { ExecutionArtifactKind } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/enum_pb";
+import { StigmerContext } from "../../context";
+import { PlanArtifactCard } from "../PlanArtifactCard";
+
+const planArtifact = create(ExecutionArtifactSchema, {
+  name: "plan.md",
+  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 {
+  return {
+    agentExecution: {
+      getArtifactContent: vi.fn().mockReturnValue(new Promise(() => {})),
+    },
+  } as unknown as Stigmer;
+}
+
+function withStigmer(children: ReactNode) {
+  return (
+    <StigmerContext.Provider value={createStigmerMock()}>
+      {children}
+    </StigmerContext.Provider>
+  );
+}
+
+afterEach(cleanup);
+
+describe("PlanArtifactCard", () => {
+  it("renders the review header with the artifact name and size", () => {
+    render(
+      <PlanArtifactCard executionId="aex_1" artifact={planArtifact} org="acme" />,
+    );
+
+    const region = screen.getByRole("region", { name: "Plan ready to review" });
+    expect(region.textContent).toContain("Plan ready to review");
+    expect(region.textContent).toContain("plan.md");
+  });
+
+  it("calls onImplement when Implement is clicked", () => {
+    const onImplement = vi.fn();
+    render(
+      <PlanArtifactCard
+        executionId="aex_1"
+        artifact={planArtifact}
+        org="acme"
+        onImplement={onImplement}
+      />,
+    );
+
+    fireEvent.click(screen.getByText("Implement"));
+    expect(onImplement).toHaveBeenCalledTimes(1);
+  });
+
+  it("hides Implement when onImplement is not provided", () => {
+    render(
+      <PlanArtifactCard executionId="aex_1" artifact={planArtifact} org="acme" />,
+    );
+    expect(screen.queryByText("Implement")).toBeNull();
+  });
+
+  it("disables Implement when disabled", () => {
+    const onImplement = vi.fn();
+    render(
+      <PlanArtifactCard
+        executionId="aex_1"
+        artifact={planArtifact}
+        org="acme"
+        onImplement={onImplement}
+        disabled
+      />,
+    );
+
+    const button = screen.getByText("Implement").closest("button")!;
+    expect(button.disabled).toBe(true);
+    fireEvent.click(button);
+    expect(onImplement).not.toHaveBeenCalled();
+  });
+
+  it("exposes a Download link to the artifact", () => {
+    render(
+      <PlanArtifactCard executionId="aex_1" artifact={planArtifact} org="acme" />,
+    );
+    const link = screen.getByText("Download").closest("a")!;
+    expect(link.getAttribute("href")).toBe("https://example.test/plan.md");
+  });
+
+  it("opens the shared preview modal when Review plan is clicked", () => {
+    render(
+      withStigmer(
+        <PlanArtifactCard
+          executionId="aex_1"
+          artifact={planArtifact}
+          org="acme"
+        />,
+      ),
+    );
+
+    // No dialog before the user reviews.
+    expect(document.querySelector("dialog")).toBeNull();
+
+    fireEvent.click(screen.getByText("Review plan"));
+
+    const dialog = document.querySelector("dialog");
+    expect(dialog).toBeTruthy();
+    expect(dialog!.getAttribute("aria-label")).toBe("Preview plan.md");
+  });
+
+  it("hides Review plan when org is absent (modal needs org)", () => {
+    render(<PlanArtifactCard executionId="aex_1" artifact={planArtifact} />);
+    expect(screen.queryByText("Review plan")).toBeNull();
+  });
+});

package/src/execution/useCreateAgentExecution.ts

@@ -3,14 +3,9 @@
 import { useCallback, useState } from "react";
 import type { JsonObject } from "@bufbuild/protobuf";
 import type { AttachmentInput, EnvVarInput } from "@stigmer/sdk";
-import { InteractionMode } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/enum_pb";
 import { useStigmer } from "../hooks";
 import { toError } from "../internal/toError";
-
-const INTERACTION_MODE_MAP: Record<string, InteractionMode> = {
-  agent: InteractionMode.AGENT,
-  plan: InteractionMode.PLAN,
-};
+import { toProtoInteractionMode } from "../composer/interaction-mode";
 
 /** Input for {@link UseCreateAgentExecutionReturn.create}. */
 export interface CreateAgentExecutionInput {
@@ -168,7 +163,7 @@ export function useCreateAgentExecution(): UseCreateAgentExecutionReturn {
           ? {
               ...(input.modelName ? { modelName: input.modelName } : {}),
               ...(input.interactionMode
-                ? { interactionMode: INTERACTION_MODE_MAP[input.interactionMode] ?? InteractionMode.UNSPECIFIED }
+                ? { interactionMode: toProtoInteractionMode(input.interactionMode) }
                 : {}),
               ...(input.structuredOutputSchema
                 ? { structuredOutputSchema: input.structuredOutputSchema }

package/src/internal/VirtualizedThread.tsx

@@ -38,6 +38,8 @@ export interface VirtualizedThreadProps {
   readonly filePathCtx: FilePathContextValue;
   readonly sandboxCtx: SandboxContextValue;
   readonly onBuildFromPlan?: () => void;
+  readonly org?: string;
+  readonly planActionsDisabled?: boolean;
   readonly centerContent?: boolean;
 }
 
@@ -96,6 +98,8 @@ export function VirtualizedThread({
   filePathCtx,
   sandboxCtx,
   onBuildFromPlan,
+  org,
+  planActionsDisabled,
   centerContent,
 }: VirtualizedThreadProps) {
   const virtuosoRef = useRef<VirtuosoHandle>(null);
@@ -126,8 +130,10 @@ export function VirtualizedThread({
       onApprovalSubmit,
       submittingApprovalIds,
       onBuildFromPlan,
+      org,
+      planActionsDisabled,
     }),
-    [formatToolCallSummary, onApprovalSubmit, submittingApprovalIds, onBuildFromPlan],
+    [formatToolCallSummary, onApprovalSubmit, submittingApprovalIds, onBuildFromPlan, org, planActionsDisabled],
   );
 
   return (

package/src/session/SessionViewer.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useCallback, useMemo, useRef, useState, type ReactNode } from "react";
+import { useCallback, useMemo, useRef, type ReactNode } from "react";
 import { cn } from "@stigmer/theme";
 import { getUserMessage, type ResourceRef } from "@stigmer/sdk";
 import type { UseGitHubConnectionReturn } from "../github/useGitHubConnection";
@@ -18,6 +18,14 @@ import { SecretFlowErrorGuide, isSecretFlowError } from "../error";
 import { useSessionPageFlow } from "./useSessionPageFlow";
 import { SessionInspector } from "./inspector/SessionInspector";
 
+/**
+ * Message submitted when the user implements a plan. References the published
+ * `plan.md` explicitly so the agent acts on the durable artifact rather than
+ * relying on re-reading its own prior chat message.
+ */
+const IMPLEMENT_PLAN_MESSAGE =
+  "Implement the plan above (saved as plan.md). Follow it step by step and make the changes it describes.";
+
 /** Props for {@link SessionViewer}. */
 export interface SessionViewerProps {
   /** Session ID to load and display. */
@@ -126,7 +134,7 @@ export function SessionViewer({
   const { conv } = flow;
 
   const [modelId, setModelId] = flow.model;
-  const [interactionMode, setInteractionMode] = useState<InteractionModeOption>("agent");
+  const [interactionMode, setInteractionMode] = flow.interactionMode;
   const composerRef = useRef<SessionComposerHandle>(null);
 
   const selectionStoreRef = useRef<SelectionStore | null>(null);
@@ -136,15 +144,15 @@ export function SessionViewer({
   const selectionStore = selectionStoreRef.current;
 
   const handleBuildFromPlan = useCallback(() => {
+    // Switch the picker to Agent (so subsequent turns stay in Agent) and submit
+    // the implement message immediately through the composer's full pipeline.
+    // `interactionMode: "agent"` is passed explicitly to win the same-tick race
+    // where the composer prop has not yet re-rendered from "plan".
     setInteractionMode("agent");
-    // Reference the plan explicitly (it is also published as plan.md) and direct
-    // the agent to act on it, rather than a bare "implement" that relies on the
-    // model re-reading its own prior message.
-    composerRef.current?.setMessage(
-      "Implement the plan above (saved as plan.md). Follow it step by step and make the changes it describes.",
-    );
-    composerRef.current?.focus();
-  }, []);
+    composerRef.current?.submit(IMPLEMENT_PLAN_MESSAGE, {
+      interactionMode: "agent",
+    });
+  }, [setInteractionMode]);
 
   if (conv.isLoading) {
     return (
@@ -202,6 +210,7 @@ export function SessionViewer({
               org={org}
               selectionStore={selectionStore}
               onApplied={onApplied}
+              onImplementPlan={handleBuildFromPlan}
               enableGitHub={enableGitHub}
               enableLocal={enableLocal}
               gitHubConnection={gitHubConnection}
@@ -261,6 +270,8 @@ function ConversationColumn({
         workspaceEntries={conv.workspaceEntries}
         sandboxWorkspaceRoot={flow.sandboxWorkspaceRoot}
         onBuildFromPlan={onBuildFromPlan}
+        org={org}
+        planActionsDisabled={!conv.canSendFollowUp}
         centerContent
         className="flex-1"
       />
@@ -319,6 +330,8 @@ interface InspectorPanelProps {
   readonly org: string;
   readonly selectionStore: SelectionStore;
   readonly onApplied?: (result: ApplyResourceResult) => void;
+  /** Implement a plan from the Artifacts tab (same action as the thread card). */
+  readonly onImplementPlan?: () => void;
   readonly enableGitHub: boolean;
   readonly enableLocal: boolean;
   readonly gitHubConnection?: UseGitHubConnectionReturn;
@@ -331,6 +344,7 @@ function InspectorPanel({
   org,
   selectionStore,
   onApplied,
+  onImplementPlan,
   enableGitHub,
   enableLocal,
   gitHubConnection,
@@ -411,6 +425,7 @@ function InspectorPanel({
         org={org}
         selectedItem={selectedItem}
         onApplied={onApplied}
+        onImplementPlan={onImplementPlan}
         sessionConfig={sessionConfig}
         workspaceConfig={workspaceConfig}
         className="min-h-0 flex-1"