Add task artifacts and file reveal support (#26)

* Add task artifacts and file reveal support

* Address artifact review feedback

Author: afurm

src/client/api.ts

@@ -76,6 +76,12 @@ export const api = {
   async deleteTask(id: string) {
     return request<void>(`/api/tasks/${id}`, { method: "DELETE" });
   },
+  async openTaskArtifact(id: string, artifactId: string) {
+    return request<{ ok: boolean; path: string }>(
+      `/api/tasks/${id}/artifacts/${artifactId}/open`,
+      { method: "POST" },
+    );
+  },
   async settings() {
     return request<AppSettings>("/api/settings");
   },

src/client/components/TaskModal.test.tsx

@@ -8,10 +8,22 @@ import { TaskModal } from "./TaskModal";
 (globalThis as typeof globalThis & { IS_REACT_ACT_ENVIRONMENT?: boolean }).IS_REACT_ACT_ENVIRONMENT =
   true;
 
+const apiMocks = vi.hoisted(() => ({
+  openTaskArtifact: vi.fn(),
+}));
+
+vi.mock("../api", () => ({
+  api: {
+    openTaskArtifact: apiMocks.openTaskArtifact,
+  },
+}));
+
 let container: HTMLDivElement;
 let root: Root;
 
 beforeEach(() => {
+  apiMocks.openTaskArtifact.mockReset();
+  apiMocks.openTaskArtifact.mockResolvedValue({ ok: true, path: "/tmp/task-report.md" });
   try {
     window.localStorage.clear();
   } catch {
@@ -90,6 +102,71 @@ describe("TaskModal", () => {
     );
   });
 
+  it("labels the inspector tab as Artifacts and renders useful artifacts as clickable rows", async () => {
+    await renderTaskModal({
+      ...task(),
+      execution: execution({
+        status: "succeeded",
+        output: "Created useful evidence.",
+        artifacts: [
+          {
+            id: "artifact-issue",
+            type: "link",
+            title: "GitHub issue #25",
+            content: "github.com",
+            url: "https://github.com/afurm/draftmora/issues/25",
+            createdAt: "2026-05-03T07:01:00.000Z",
+          },
+          {
+            id: "artifact-issue-duplicate",
+            type: "link",
+            title: "GitHub issue #25",
+            content: "github.com",
+            url: "https://github.com/afurm/draftmora/issues/25",
+            createdAt: "2026-05-03T07:01:01.000Z",
+          },
+          {
+            id: "artifact-file",
+            type: "output",
+            title: "File: task-report.md",
+            content: "/tmp/task-report.md",
+            url: "file:///tmp/task-report.md",
+            createdAt: "2026-05-03T07:01:02.000Z",
+          },
+        ],
+      }),
+    });
+
+    await clickButtonByLabel("Open Artifacts");
+
+    expect(document.body.textContent).toContain("Artifacts");
+    expect(document.body.textContent).not.toContain("Files");
+    expect(document.body.textContent).toContain("GitHub issue #25");
+    expect(document.body.textContent).toContain("File: task-report.md");
+
+    const inspector = document.body.querySelector<HTMLElement>('aside[aria-label="Task details"]');
+    expect(inspector).toBeTruthy();
+    const issueLinks = inspector!.querySelectorAll<HTMLAnchorElement>(
+      'a[href="https://github.com/afurm/draftmora/issues/25"]',
+    );
+    expect(issueLinks).toHaveLength(1);
+    expect(issueLinks[0]?.target).toBe("_blank");
+    expect(issueLinks[0]?.rel).toBe("noreferrer");
+
+    const fileLink = inspector!.querySelector<HTMLAnchorElement>('a[href="file:///tmp/task-report.md"]');
+    expect(fileLink).toBeNull();
+
+    const fileButton = inspector!.querySelector<HTMLButtonElement>(
+      'button[aria-label="Reveal File: task-report.md"]',
+    );
+    expect(fileButton).toBeTruthy();
+    await act(async () => {
+      fileButton!.click();
+      await Promise.resolve();
+    });
+    expect(apiMocks.openTaskArtifact).toHaveBeenCalledWith("task-1", "artifact-file");
+  });
+
   it("shows running AI work above locked details", async () => {
     await renderTaskModal({
       ...task(),

src/client/components/TaskModal.tsx

@@ -6,6 +6,7 @@ import {
   Clock3,
   ExternalLink,
   FileText,
+  FolderOpen,
   Info,
   Link2,
   LoaderCircle,
@@ -40,6 +41,7 @@ import type {
   TaskStatus,
 } from "../../shared/types";
 import { COLUMN_LABELS, PRIORITIES, TASK_STATUSES } from "../../shared/types";
+import { api } from "../api";
 import { Alert, AlertDescription } from "@/components/ui/alert";
 import {
   AlertDialog,
@@ -206,7 +208,7 @@ const INSPECTOR_TABS: Array<{
   { value: "details", label: "Details", icon: Info },
   { value: "context", label: "Context", icon: MessageSquareText },
   { value: "runs", label: "Runs", icon: Clock3 },
-  { value: "artifacts", label: "Files", icon: FileText },
+  { value: "artifacts", label: "Artifacts", icon: FileText },
 ];
 
 export function TaskModal(props: {
@@ -1424,8 +1426,8 @@ function TaskThreadMessageRow(props: {
 
   return (
     <ItemGroup>
-      {message.execution.artifacts.map((artifact) => (
-        <ArtifactRow artifact={artifact} key={artifact.id} />
+      {dedupeTaskExecutionArtifacts(message.execution.artifacts).map((artifact) => (
+        <ArtifactRow artifact={artifact} key={artifact.id} taskId={message.execution.taskId} />
       ))}
     </ItemGroup>
   );
@@ -1582,7 +1584,7 @@ function TaskInspector(props: {
             <TabsTrigger value="details">Details</TabsTrigger>
             <TabsTrigger value="context">Context</TabsTrigger>
             <TabsTrigger value="runs">Runs</TabsTrigger>
-            <TabsTrigger value="artifacts">Files</TabsTrigger>
+            <TabsTrigger value="artifacts">Artifacts</TabsTrigger>
           </TabsList>
           <Button
             type="button"
@@ -1771,7 +1773,9 @@ function TaskRunsPanel(props: { task: Task }) {
 }
 
 function TaskArtifactsPanel(props: { task: Task }) {
-  const artifacts = getTaskExecutionHistory(props.task).flatMap((execution) => execution.artifacts);
+  const artifacts = dedupeTaskExecutionArtifacts(
+    getTaskExecutionHistory(props.task).flatMap((execution) => execution.artifacts),
+  );
   if (artifacts.length === 0) {
     return (
       <Empty className="min-h-40 border">
@@ -1788,7 +1792,7 @@ function TaskArtifactsPanel(props: { task: Task }) {
   return (
     <ItemGroup>
       {artifacts.map((artifact) => (
-        <ArtifactRow artifact={artifact} key={artifact.id} />
+        <ArtifactRow artifact={artifact} key={artifact.id} taskId={props.task.id} />
       ))}
     </ItemGroup>
   );
@@ -2251,7 +2255,10 @@ function ExecutionOutput(props: {
   );
 }
 
-function ArtifactRow(props: { artifact: TaskExecutionArtifact }) {
+function ArtifactRow(props: { artifact: TaskExecutionArtifact; taskId: string }) {
+  const [opening, setOpening] = useState(false);
+  const canRevealFile = isLocalFileArtifact(props.artifact);
+  const externalUrl = isHttpArtifactUrl(props.artifact.url) ? props.artifact.url : null;
   const icon =
     props.artifact.type === "link" ? (
       <Link2 />
@@ -2266,20 +2273,60 @@ function ArtifactRow(props: { artifact: TaskExecutionArtifact }) {
       <ItemContent>
         <ItemTitle>{props.artifact.title}</ItemTitle>
         {props.artifact.content && (
-          <p className="text-sm text-muted-foreground">{props.artifact.content}</p>
+          <p className="break-words text-sm text-muted-foreground">{props.artifact.content}</p>
         )}
       </ItemContent>
-      {props.artifact.url && (
+      {(externalUrl || canRevealFile) && (
         <ItemActions>
-          <ExternalLink />
+          {canRevealFile ? (
+            opening ? (
+              <LoaderCircle className="animate-spin" />
+            ) : (
+              <FolderOpen />
+            )
+          ) : (
+            <ExternalLink />
+          )}
         </ItemActions>
       )}
     </>
   );
 
-  return props.artifact.url ? (
+  async function revealFile() {
+    if (opening) {
+      return;
+    }
+    setOpening(true);
+    try {
+      await api.openTaskArtifact(props.taskId, props.artifact.id);
+    } catch (error) {
+      const localPath = props.artifact.content ?? props.artifact.url ?? "";
+      if (localPath) {
+        await navigator.clipboard?.writeText(localPath).catch(() => undefined);
+      }
+      window.alert(error instanceof Error ? error.message : "Could not reveal artifact file.");
+    } finally {
+      setOpening(false);
+    }
+  }
+
+  if (canRevealFile) {
+    return (
+      <Item asChild variant="outline" size="sm">
+        <button
+          type="button"
+          aria-label={`Reveal ${props.artifact.title}`}
+          onClick={() => void revealFile()}
+        >
+          {content}
+        </button>
+      </Item>
+    );
+  }
+
+  return externalUrl ? (
     <Item asChild variant="outline" size="sm">
-      <a href={props.artifact.url} target="_blank" rel="noreferrer">
+      <a href={externalUrl} target="_blank" rel="noreferrer">
         {content}
       </a>
     </Item>
@@ -2290,6 +2337,35 @@ function ArtifactRow(props: { artifact: TaskExecutionArtifact }) {
   );
 }
 
+function isHttpArtifactUrl(url: string | undefined): url is string {
+  return Boolean(url?.startsWith("http://") || url?.startsWith("https://"));
+}
+
+function isLocalFileArtifact(artifact: TaskExecutionArtifact) {
+  return (
+    artifact.url?.startsWith("file://") ||
+    (artifact.type === "output" && Boolean(artifact.content && isAbsoluteLocalPath(artifact.content)))
+  );
+}
+
+function isAbsoluteLocalPath(value: string) {
+  return value.startsWith("/") || /^[A-Za-z]:[\\/]/.test(value);
+}
+
+function dedupeTaskExecutionArtifacts(artifacts: TaskExecutionArtifact[]) {
+  const seen = new Set<string>();
+  return artifacts.filter((artifact) => {
+    const key =
+      artifact.url?.trim().toLowerCase() ??
+      `${artifact.type}:${artifact.title.trim()}:${artifact.content?.trim() ?? ""}`;
+    if (seen.has(key)) {
+      return false;
+    }
+    seen.add(key);
+    return true;
+  });
+}
+
 function executionStatusIcon(execution: TaskExecution) {
   if (execution.status === "succeeded") {
     return <CheckCircle2 data-icon="inline-start" />;

src/server/artifact-file-opener.ts

@@ -0,0 +1,69 @@
+import { execFile } from "node:child_process";
+import { access, stat } from "node:fs/promises";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+import type { TaskExecutionArtifact } from "../shared/types";
+
+export type ArtifactOpenCommand = {
+  command: string;
+  args: string[];
+};
+
+export type ArtifactFileOpenResult =
+  | { ok: true; path: string }
+  | { ok: false; path: string; error: string };
+
+export function resolveArtifactFilePath(artifact: TaskExecutionArtifact): string | null {
+  if (artifact.url?.startsWith("file://")) {
+    try {
+      return fileURLToPath(artifact.url);
+    } catch {
+      return null;
+    }
+  }
+  return artifact.type === "output" && artifact.content && path.isAbsolute(artifact.content)
+    ? artifact.content
+    : null;
+}
+
+export function resolveArtifactRevealCommand(
+  filePath: string,
+  platform: NodeJS.Platform = process.platform,
+  isDirectory = false,
+): ArtifactOpenCommand {
+  if (platform === "darwin") {
+    return { command: "open", args: ["-R", filePath] };
+  }
+  if (platform === "win32") {
+    return { command: "explorer.exe", args: [`/select,${filePath}`] };
+  }
+  return { command: "xdg-open", args: [isDirectory ? filePath : path.dirname(filePath)] };
+}
+
+export async function revealArtifactFile(filePath: string): Promise<ArtifactFileOpenResult> {
+  try {
+    const fileStat = await stat(filePath);
+    if (!fileStat.isFile() && !fileStat.isDirectory()) {
+      return { ok: false, path: filePath, error: "artifact path is not a file or folder" };
+    }
+    await access(filePath);
+    await execArtifactOpenCommand(
+      resolveArtifactRevealCommand(filePath, process.platform, fileStat.isDirectory()),
+    );
+    return { ok: true, path: filePath };
+  } catch {
+    return { ok: false, path: filePath, error: "failed to reveal artifact file" };
+  }
+}
+
+function execArtifactOpenCommand(command: ArtifactOpenCommand): Promise<void> {
+  return new Promise((resolve, reject) => {
+    execFile(command.command, command.args, (error) => {
+      if (error) {
+        reject(error);
+        return;
+      }
+      resolve();
+    });
+  });
+}

src/server/local-agent-tools.ts

@@ -16,6 +16,8 @@ import {
   String as TypeString,
 } from "typebox";
 import type { Tool, ToolCall, ToolResultMessage } from "@mariozechner/pi-ai";
+import type { TaskExecutionArtifact } from "../shared/types";
+import { extractLocalToolResultArtifacts } from "./task-artifacts";
 
 const DEFAULT_OUTPUT_LIMIT = 30_000;
 const MAX_OUTPUT_LIMIT = 120_000;
@@ -81,6 +83,7 @@ export const LOCAL_AGENT_TOOLS: Tool[] = [
 export type ExecutedLocalTool = {
   message: ToolResultMessage;
   summary: string;
+  artifacts: TaskExecutionArtifact[];
 };
 
 export async function executeLocalToolCall(
@@ -100,6 +103,7 @@ export async function executeLocalToolCall(
     return {
       message: buildToolResult(call, content, isError),
       summary: summarizeToolCall(call, content, Date.now() - started),
+      artifacts: isError ? [] : extractLocalToolResultArtifacts(call.name, content),
     };
   } catch (err) {
     if (isToolRunCancellationError(err)) {
@@ -110,6 +114,7 @@ export async function executeLocalToolCall(
     return {
       message: buildToolResult(call, content, true),
       summary: `${call.name} failed: ${message}`,
+      artifacts: [],
     };
   }
 }