feat(messages): export plan tool output to markdown file

Author: Dimillian

src-tauri/src/files/mod.rs

@@ -1,4 +1,5 @@
 use serde_json::json;
+use std::path::PathBuf;
 use tauri::{AppHandle, State};
 
 use self::io::TextFileResponse;
@@ -81,3 +82,18 @@ pub(crate) async fn file_write(
 ) -> Result<(), String> {
     file_write_impl(scope, kind, workspace_id, content, &*state, &app).await
 }
+
+#[tauri::command]
+pub(crate) fn write_text_file(path: String, content: String) -> Result<(), String> {
+    let target = PathBuf::from(path.trim());
+    if target.as_os_str().is_empty() {
+        return Err("Path is required".to_string());
+    }
+    if let Some(parent) = target.parent() {
+        if !parent.as_os_str().is_empty() {
+            std::fs::create_dir_all(parent)
+                .map_err(|err| format!("Failed to create export directory: {err}"))?;
+        }
+    }
+    std::fs::write(&target, content).map_err(|err| format!("Failed to write export file: {err}"))
+}

src-tauri/src/lib.rs

@@ -170,6 +170,7 @@ pub fn run() {
             settings::get_codex_config_path,
             files::file_read,
             files::file_write,
+            files::write_text_file,
             codex::get_config_model,
             menu::menu_set_accelerators,
             codex::codex_doctor,

src/features/messages/components/MessageRows.tsx

@@ -13,6 +13,8 @@ import Terminal from "lucide-react/dist/esm/icons/terminal";
 import Users from "lucide-react/dist/esm/icons/users";
 import Wrench from "lucide-react/dist/esm/icons/wrench";
 import X from "lucide-react/dist/esm/icons/x";
+import { exportMarkdownFile } from "@services/tauri";
+import { pushErrorToast } from "@services/toasts";
 import type { ConversationItem } from "../../../types";
 import { languageFromPath } from "../../../utils/syntax";
 import { DiffBlock } from "../../git/components/DiffBlock";
@@ -273,6 +275,19 @@ function toolIconForSummary(
   return Wrench;
 }
 
+function buildPlanExportFileName(itemId: string) {
+  const normalized = itemId
+    .trim()
+    .toLowerCase()
+    .replace(/[^a-z0-9_-]+/g, "-")
+    .replace(/^-+|-+$/g, "")
+    .slice(0, 48);
+  if (!normalized) {
+    return "plan.md";
+  }
+  return normalized.startsWith("plan-") ? `${normalized}.md` : `plan-${normalized}.md`;
+}
+
 export const WorkingIndicator = memo(function WorkingIndicator({
   isThinking,
   processingStartedAt = null,
@@ -531,6 +546,7 @@ export const ToolRow = memo(function ToolRow({
 }: ToolRowProps) {
   const isFileChange = item.toolType === "fileChange";
   const isCommand = item.toolType === "commandExecution";
+  const isPlan = item.toolType === "plan";
   const commandText = isCommand
     ? item.title.replace(/^Command:\s*/i, "").trim()
     : "";
@@ -562,6 +578,7 @@ export const ToolRow = memo(function ToolRow({
     typeof item.durationMs === "number" ? item.durationMs : null;
   const isLongRunning = commandDurationMs !== null && commandDurationMs >= 1200;
   const [showLiveOutput, setShowLiveOutput] = useState(false);
+  const [isExportingPlan, setIsExportingPlan] = useState(false);
 
   useEffect(() => {
     if (!isCommandRunning) {
@@ -587,6 +604,30 @@ export const ToolRow = memo(function ToolRow({
     }
   }, [isCommandRunning, onRequestAutoScroll, showCommandOutput, showLiveOutput]);
 
+  const handlePlanExport = useCallback(
+    async (event: MouseEvent<HTMLButtonElement>) => {
+      event.preventDefault();
+      event.stopPropagation();
+      const output = (summary.output ?? "").trim();
+      if (!output) {
+        return;
+      }
+      setIsExportingPlan(true);
+      try {
+        await exportMarkdownFile(output, buildPlanExportFileName(item.id));
+      } catch (error) {
+        const message = error instanceof Error ? error.message : "Unable to export plan.";
+        pushErrorToast({
+          title: "Plan export failed",
+          message,
+        });
+      } finally {
+        setIsExportingPlan(false);
+      }
+    },
+    [item.id, summary.output],
+  );
+
   return (
     <div className={`tool-inline ${isExpanded ? "tool-inline-expanded" : ""}`}>
       <button
@@ -688,6 +729,18 @@ export const ToolRow = memo(function ToolRow({
             onOpenThreadLink={onOpenThreadLink}
           />
         )}
+        {showToolOutput && isPlan && (summary.output ?? "").trim() && (
+          <div className="tool-inline-actions">
+            <button
+              type="button"
+              className="ghost tool-inline-action"
+              onClick={handlePlanExport}
+              disabled={isExportingPlan}
+            >
+              {isExportingPlan ? "Exporting..." : "Export .md"}
+            </button>
+          </div>
+        )}
       </div>
     </div>
   );

src/features/messages/components/Messages.test.tsx

@@ -13,6 +13,9 @@ const useFileLinkOpenerMock = vi.fn(
 );
 const openFileLinkMock = vi.fn();
 const showFileLinkMenuMock = vi.fn();
+const { exportMarkdownFileMock } = vi.hoisted(() => ({
+  exportMarkdownFileMock: vi.fn(),
+}));
 
 vi.mock("../hooks/useFileLinkOpener", () => ({
   useFileLinkOpener: (
@@ -22,6 +25,16 @@ vi.mock("../hooks/useFileLinkOpener", () => ({
   ) => useFileLinkOpenerMock(workspacePath, openTargets, selectedOpenAppId),
 }));
 
+vi.mock("@services/tauri", async () => {
+  const actual = await vi.importActual<typeof import("@services/tauri")>(
+    "@services/tauri",
+  );
+  return {
+    ...actual,
+    exportMarkdownFile: exportMarkdownFileMock,
+  };
+});
+
 describe("Messages", () => {
   beforeAll(() => {
     if (!HTMLElement.prototype.scrollIntoView) {
@@ -37,6 +50,7 @@ describe("Messages", () => {
     useFileLinkOpenerMock.mockClear();
     openFileLinkMock.mockReset();
     showFileLinkMenuMock.mockReset();
+    exportMarkdownFileMock.mockReset();
   });
 
   it("renders image grid above message text and opens lightbox", () => {
@@ -904,6 +918,44 @@ describe("Messages", () => {
     ).toBeTruthy();
   });
 
+  it("exports plan tool-call output from the conversation view", async () => {
+    exportMarkdownFileMock.mockResolvedValueOnce("/tmp/plan-7.md");
+    const items: ConversationItem[] = [
+      {
+        id: "plan-7",
+        kind: "tool",
+        toolType: "plan",
+        title: "Plan",
+        detail: "completed",
+        status: "completed",
+        output: "## Steps\n- Step 1",
+      },
+    ];
+
+    render(
+      <Messages
+        items={items}
+        threadId="thread-1"
+        workspaceId="ws-1"
+        isThinking={false}
+        openTargets={[]}
+        selectedOpenAppId=""
+      />,
+    );
+
+    const exportButton = await screen.findByRole("button", {
+      name: "Export .md",
+    });
+    fireEvent.click(exportButton);
+
+    await waitFor(() =>
+      expect(exportMarkdownFileMock).toHaveBeenCalledWith(
+        "## Steps\n- Step 1",
+        "plan-7.md",
+      ),
+    );
+  });
+
   it("hides the plan-ready follow-up once the user has replied after the plan", () => {
     const onPlanAccept = vi.fn();
     const onPlanSubmitChanges = vi.fn();

src/services/tauri.test.ts

@@ -1,8 +1,9 @@
 import { beforeEach, describe, expect, it, vi } from "vitest";
 import { invoke } from "@tauri-apps/api/core";
-import { open } from "@tauri-apps/plugin-dialog";
+import { open, save } from "@tauri-apps/plugin-dialog";
 import * as notification from "@tauri-apps/plugin-notification";
 import {
+  exportMarkdownFile,
   addWorkspace,
   compactThread,
   createGitHubRepo,
@@ -47,6 +48,7 @@ vi.mock("@tauri-apps/api/core", () => ({
 
 vi.mock("@tauri-apps/plugin-dialog", () => ({
   open: vi.fn(),
+  save: vi.fn(),
 }));
 
 vi.mock("@tauri-apps/plugin-notification", () => ({
@@ -100,6 +102,36 @@ describe("tauri invoke wrappers", () => {
     await expect(pickWorkspacePaths()).resolves.toEqual(["/tmp/one", "/tmp/two"]);
   });
 
+  it("returns null when markdown export is cancelled", async () => {
+    const saveMock = vi.mocked(save);
+    const invokeMock = vi.mocked(invoke);
+    saveMock.mockResolvedValueOnce(null);
+
+    await expect(exportMarkdownFile("# Plan")).resolves.toBeNull();
+    expect(invokeMock).not.toHaveBeenCalledWith(
+      "write_text_file",
+      expect.anything(),
+    );
+  });
+
+  it("writes markdown to the selected path", async () => {
+    const saveMock = vi.mocked(save);
+    const invokeMock = vi.mocked(invoke);
+    saveMock.mockResolvedValueOnce("/tmp/plan.md");
+
+    await expect(exportMarkdownFile("# Plan", "my-plan.md")).resolves.toBe("/tmp/plan.md");
+
+    expect(saveMock).toHaveBeenCalledWith({
+      title: "Export plan as Markdown",
+      defaultPath: "my-plan.md",
+      filters: [{ name: "Markdown", extensions: ["md"] }],
+    });
+    expect(invokeMock).toHaveBeenCalledWith("write_text_file", {
+      path: "/tmp/plan.md",
+      content: "# Plan",
+    });
+  });
+
   it("maps workspace_id to workspaceId for git status", async () => {
     const invokeMock = vi.mocked(invoke);
     invokeMock.mockResolvedValueOnce({

src/services/tauri.ts

@@ -1,5 +1,5 @@
 import { invoke } from "@tauri-apps/api/core";
-import { open } from "@tauri-apps/plugin-dialog";
+import { open, save } from "@tauri-apps/plugin-dialog";
 import type { Options as NotificationOptions } from "@tauri-apps/plugin-notification";
 import type {
   AppSettings,
@@ -67,6 +67,27 @@ export async function pickImageFiles(): Promise<string[]> {
   return Array.isArray(selection) ? selection : [selection];
 }
 
+export async function exportMarkdownFile(
+  content: string,
+  defaultFileName = "plan.md",
+): Promise<string | null> {
+  const selection = await save({
+    title: "Export plan as Markdown",
+    defaultPath: defaultFileName,
+    filters: [
+      {
+        name: "Markdown",
+        extensions: ["md"],
+      },
+    ],
+  });
+  if (!selection) {
+    return null;
+  }
+  await invoke("write_text_file", { path: selection, content });
+  return selection;
+}
+
 export async function listWorkspaces(): Promise<WorkspaceInfo[]> {
   try {
     return await invoke<WorkspaceInfo[]>("list_workspaces");

src/styles/messages.css

@@ -724,6 +724,17 @@
   color: var(--text-quiet);
 }
 
+.tool-inline-actions {
+  display: flex;
+  justify-content: flex-end;
+}
+
+.tool-inline-action {
+  font-size: 11px;
+  line-height: 1.2;
+  padding: 4px 8px;
+}
+
 .tool-inline-terminal {
   background: var(--surface-command);
   border-radius: 10px;