fix(canvas): render agent status as thread content

Generated-By: PostHog Code
Task-Id: 87a79e23-20c4-440b-818b-28154924ffbc

Author: k11kirky

packages/core/src/canvas/threadTimeline.test.ts

@@ -72,6 +72,11 @@ describe("deriveThreadAgentStatus", () => {
       input: { hasActivity: true, hasPullRequest: true },
       expected: { phase: "complete", label: "Shipped" },
     },
+    {
+      name: "reports settled work without a pull request as done",
+      input: { hasActivity: true },
+      expected: { phase: "complete", label: "Done" },
+    },
   ])("$name", ({ input, expected }) => {
     expect(deriveThreadAgentStatus(input)).toEqual(expected);
   });

packages/core/src/canvas/threadTimeline.ts

@@ -99,7 +99,7 @@ export function deriveThreadAgentStatus({
   }
   return {
     phase: "complete",
-    label: hasPullRequest ? "Shipped" : "Ready to ship",
+    label: hasPullRequest ? "Shipped" : "Done",
   };
 }
 

packages/ui/src/features/canvas/components/ThreadPanel.test.tsx

@@ -0,0 +1,19 @@
+import { render, screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import { AgentTurnRow } from "./ThreadPanel";
+
+describe("AgentTurnRow", () => {
+  it.each([
+    { phase: "active" as const, label: "Working…" },
+    { phase: "complete" as const, label: "Done" },
+  ])("renders $label in the message area", (statusValue) => {
+    render(<AgentTurnRow status={statusValue} streaming={false} />);
+
+    const author = screen.getByText("Agent");
+    const status = screen.getByText(statusValue.label);
+
+    expect(author.parentElement).not.toContainElement(status);
+    expect(author.closest("article")).toContainElement(status);
+    expect(status.closest('[data-slot="thread-item-body"]')).not.toBeNull();
+  });
+});

packages/ui/src/features/canvas/components/ThreadPanel.tsx

@@ -211,7 +211,7 @@ function AgentStatusChip({ status }: { status: ThreadAgentStatus }) {
   }
 }
 
-function AgentTurnRow({
+export function AgentTurnRow({
   message,
   status,
   streaming,
@@ -232,20 +232,25 @@ function AgentTurnRow({
       <ThreadItemContent>
         <ThreadItemHeader>
           <ThreadItemAuthor>Agent</ThreadItemAuthor>
-          {status && <AgentStatusChip status={status} />}
           {message?.timestamp !== undefined && (
             <ThreadTimestamp
               dateTime={new Date(message.timestamp).toISOString()}
             />
           )}
         </ThreadItemHeader>
-        {message?.text && (
+        {(message?.text || status) && (
           <ThreadItemBody>
             <div className="rounded-md border border-border bg-muted px-2 py-1.5">
-              {streaming ? (
-                <ChatStreamingMarkdown content={message.text} />
-              ) : (
-                <ChatMarkdown content={message.text} />
+              {message?.text &&
+                (streaming ? (
+                  <ChatStreamingMarkdown content={message.text} />
+                ) : (
+                  <ChatMarkdown content={message.text} />
+                ))}
+              {status && (
+                <div className={message?.text ? "mt-2" : undefined}>
+                  <AgentStatusChip status={status} />
+                </div>
               )}
             </div>
           </ThreadItemBody>