canopy-ui 0.18.0 → 0.18.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "canopy-ui",
-  "version": "0.18.0",
+  "version": "0.18.1",
   "license": "BSD-3-Clause",
   "type": "module",
   "repository": {

package/src/chat/MessageItem.test.tsx

@@ -0,0 +1,34 @@
+// @vitest-environment jsdom
+import { afterEach, describe, expect, it } from "vitest";
+import { cleanup, render, screen } from "@testing-library/react";
+
+import type { Message } from "./protocol";
+import { MessageItem } from "./MessageItem";
+
+function userRow(content: Record<string, unknown>): Message {
+  return {
+    id: "1", turn_index: 1, role: "user", content,
+    plaintext: "This session is being continued from a previous conversation…",
+    status: "complete", error_detail: null, started_at: null, completed_at: null,
+    created_at: "2026-10-17T12:35:14Z",
+  };
+}
+
+afterEach(() => {
+  cleanup();
+});
+
+describe("MessageItem — a compaction summary", () => {
+  it("renders collapsed as context, not as a line the person typed", () => {
+    render(<MessageItem message={userRow({ record: { compact_summary: true } })} />);
+    const row = screen.getByTestId("compaction-summary-row");
+    expect(row.tagName).toBe("DETAILS");
+    expect(row.hasAttribute("open")).toBe(false);
+    expect(row.textContent).toContain("Context compacted");
+  });
+
+  it("leaves an ordinary typed line as a bubble", () => {
+    render(<MessageItem message={userRow({ record: {} })} />);
+    expect(screen.queryByTestId("compaction-summary-row")).toBeNull();
+  });
+});

package/src/chat/MessageItem.tsx

@@ -42,6 +42,14 @@ function otherAuthorOf(
   return isMine(message.author, currentUserId, currentContactId) ? null : message.author;
 }
 
+/** A `user` row Claude Code wrote, not a person: the summary it leaves when it
+ *  compacts the conversation. The runner keeps the transcript record's own
+ *  flags on the row as `content.record` (`canopy_transcript.record_flags`). */
+function isCompactionSummary(message: Message): boolean {
+  const record = message.content?.record as Record<string, unknown> | undefined;
+  return message.role === "user" && Boolean(record?.compact_summary);
+}
+
 /** Count visible lines for the "▸ System context (N lines)" header. */
 function countLines(text: string): number {
   if (!text) return 0;
@@ -137,6 +145,20 @@ export function MessageItem({
       />
     );
   }
+  // Same treatment for a compaction summary: it sits on the human's side of the
+  // transcript, but nobody typed it — as a user bubble it read as the person
+  // pasting a wall of text.
+  if (isCompactionSummary(message)) {
+    return (
+      <SystemSeedRow
+        message={message}
+        forceOpen={forceToolOpen}
+        renderMarkdown={renderMarkdown}
+        label="Context compacted"
+        testId="compaction-summary-row"
+      />
+    );
+  }
 
   const otherAuthor = otherAuthorOf(message, currentUserId, currentContactId);
   // A teammate's line sits on the agent's side of the column, so it needs its
@@ -210,10 +232,14 @@ function SystemSeedRow({
   message,
   forceOpen,
   renderMarkdown,
+  label = "System context",
+  testId = "system-seed-row",
 }: {
   message: Message;
   forceOpen: boolean | undefined;
   renderMarkdown: RenderMarkdown;
+  label?: string;
+  testId?: string;
 }) {
   const text = message.plaintext;
   const lineCount = countLines(text);
@@ -221,13 +247,13 @@ function SystemSeedRow({
   return (
     <details
       className="group my-2 mr-auto max-w-[80%] rounded-2xl border border-border bg-muted/40 px-3 py-1.5 text-sm"
-      data-testid="system-seed-row"
+      data-testid={testId}
       {...(openProp !== undefined ? { open: openProp } : {})}
     >
       <summary className="flex cursor-pointer items-center gap-1.5 text-muted-foreground hover:text-foreground select-none list-none [&::-webkit-details-marker]:hidden">
         <ChevronRight className="h-3.5 w-3.5 transition-transform group-open:rotate-90" />
         <span className="text-xs font-medium uppercase tracking-wide">
-          System context
+          {label}
         </span>
         {lineCount > 0 && (
           <span className="text-xs text-muted-foreground/70">

package/src/chat/agui.ts

@@ -122,6 +122,9 @@ export function fromAgui(frame: AguiFrame): WsEvent[] {
             // canopy's only chance to say (spec 2026-09-26). Absent when the
             // server sent none (an agent/scheduled/email turn's own send).
             author: m.author as MessageAuthor | undefined,
+            // The transcript record's provenance — the `content.record` a
+            // history row carries — so a compaction summary is known live.
+            ...(m.record ? { record: m.record as Record<string, unknown> } : {}),
           },
         },
       ];

package/src/chat/protocol.ts

@@ -356,7 +356,7 @@ export type WsEvent =
   // this row to the server's queued-turn projection, and a contact's or
   // widget's own send rendered twice: once as their bubble, once as a "queued"
   // placeholder for the same send.
-  | { event: "chat.user_message"; data: { message_id: string; turn_index: number; plaintext: string; author?: MessageAuthor | null; client_id?: string } }
+  | { event: "chat.user_message"; data: { message_id: string; turn_index: number; plaintext: string; author?: MessageAuthor | null; client_id?: string; record?: Record<string, unknown> } }
   | { event: "chat.delta"; data: { message_id: string; text: string } }
   // `turn_index` is the row's transcript ordinal — the same key the persisted
   // Message carries, so a live tool row sorts into exactly the position it will

package/src/chat/sessionReducer.test.ts

@@ -551,6 +551,15 @@ describe("sessionReducer — a web send arriving twice", () => {
     expect(next.messages).toHaveLength(10)
   })
 
+  it("keeps the record's provenance, so a compaction summary is known live", () => {
+    const next = sessionReducer(makeState(), {
+      event: "chat.user_message",
+      data: { message_id: "9", turn_index: 9, plaintext: "This session is being continued…",
+              record: { compact_summary: true } },
+    } as WsEvent)
+    expect(next.messages[0].content.record).toEqual({ compact_summary: true })
+  })
+
   it("an empty-text frame never collapses onto another empty row", () => {
     const seeded = makeState({
       messages: [makeMessage({ id: "1", turn_index: 1, role: "user", plaintext: "" })],

package/src/chat/sessionReducer.ts

@@ -201,6 +201,9 @@ export function sessionReducer(prev: SessionState, frame: WsEvent): SessionState
                   // had it (an optimistic send knows its own author) and the
                   // frame is silent, but let the frame win otherwise.
                   author: frame.data.author ?? m.author ?? null,
+                  ...(frame.data.record
+                    ? { content: { ...m.content, record: frame.data.record } }
+                    : {}),
                   // The agent read it, so a pending or unconfirmed row is sent.
                   ...(m.role === "user" ? { status: "complete" as const, error_detail: null } : {}),
                 }
@@ -216,9 +219,11 @@ export function sessionReducer(prev: SessionState, frame: WsEvent): SessionState
         // `client_id` (when the caller has one — an HTTP send) lets
         // `QueuedRows.hideClientIds` recognise the server's queued-turn
         // projection as THIS row rather than a duplicate.
-        content: frame.data.client_id
-          ? { text: frame.data.plaintext, client_id: frame.data.client_id }
-          : { text: frame.data.plaintext },
+        content: {
+          text: frame.data.plaintext,
+          ...(frame.data.client_id ? { client_id: frame.data.client_id } : {}),
+          ...(frame.data.record ? { record: frame.data.record } : {}),
+        },
         plaintext: frame.data.plaintext,
         status: "complete",
         error_detail: null,