Agent pane: messages from other sessions draw as received lines

scripts/cmux-next/build-agent-pane-web.sh

@@ -76,7 +76,7 @@ grep -v '^@import ' "$SRC/acpmux/changes/changes.css" >> "$WORK/styles.css"
 cat "$SRC/acpmux/handoff/styles.css" "$SRC/acpmux/checkpoints/styles.css" "$SRC/acpmux/composerControls.css" "$SRC/acpmux/composerStates.css" "$SRC/acpmux/composerLocation.css" "$SRC/acpmux/composerAttachments.css" "$SRC/acpmux/markdownField.css" \
   "$SRC/acpmux/modelPicker.css" "$SRC/acpmux/keys.css" "$SRC/acpmux/summary/summary.css" "$SRC/acpmux/subagents/subagents.css" "$SRC/acpmux/header/header.css" "$SRC/acpmux/newtab/screen.css" "$SRC/acpmux/newtab/history.css" "$SRC/acpmux/threadMinimap/threadMinimap.css" >> "$WORK/styles.css"
 cat "$SRC/acpmux/turnChanges/turnChanges.css" "$SRC/acpmux/Inspector.css" >> "$WORK/styles.css"
-cat "$SRC/acpmux/addProject.css" "$SRC/acpmux/harnesses/harnesses.css" "$SRC/acpmux/replay/replay.css" "$SRC/acpmux/offer/suggestedTasks.css" "$ROOT/webviews/src/markdown-task-checkbox.css" >> "$WORK/styles.css"
+cat "$SRC/acpmux/addProject.css" "$SRC/acpmux/harnesses/harnesses.css" "$SRC/acpmux/replay/replay.css" "$SRC/acpmux/offer/suggestedTasks.css" "$SRC/acpmux/conversation/receivedMessages.css" "$ROOT/webviews/src/markdown-task-checkbox.css" >> "$WORK/styles.css"
 # Every sheet the pane imports ships: a missing one renders its component unstyled in the app
 # only (the dev server loads imports), as New Tab's tools did.
 while IFS= read -r sheet; do

webviews/src/agent-session/acpmux/App.tsx

@@ -268,6 +268,8 @@ import { SideQuestion, type SideQuestionState } from "./aside/SideQuestion";
 import { sideQuestion } from "./aside/sideQuestion.experiment";
 import { ReceivedResult, SuggestedTasks, type OfferActions } from "./offer/SuggestedTasks";
 import { OFFER_RESULT, setSuggestedTasks } from "./offer/offersShown";
+import { ReceivedGroup, ReceivedMessage } from "./conversation/ReceivedMessage";
+import { RECEIVED_GROUP, RECEIVED_MESSAGE, drawnKind, groupReceived } from "./conversation/receivedMessages";
 import { offerWorktree } from "./offer/offerWorktree";
 import { experimentArm } from "../../experiments/experiment";
 import { setSessionStatus, useSessionStatus } from "./sessionStatus";
@@ -801,6 +803,36 @@ const OfferResultRow = memo(
   (a, b) => a.row.id === b.row.id && a.row.version === b.row.version,
 );
 
+/// Another session's message, which opens to the sender's words, and received lines folded
+/// together (conversation/ReceivedMessage.tsx).
+const ReceivedMessageRow = memo(
+  function ReceivedMessageRow({ row, expanded, onToggleActivity }: RowProps) {
+    return row.message ? (
+      <ReceivedMessage
+        message={row.message}
+        open={expanded}
+        onToggle={() => onToggleActivity(row.id)}
+        onOpen={openOfferChat}
+      />
+    ) : null;
+  },
+  (a, b) =>
+    a.row.id === b.row.id &&
+    a.row.version === b.row.version &&
+    a.expanded === b.expanded &&
+    a.onToggleActivity === b.onToggleActivity,
+);
+const ReceivedGroupRow = memo(
+  function ReceivedGroupRow({ row, expanded, onToggleActivity }: RowProps) {
+    return <ReceivedGroup row={row} open={expanded} onToggle={() => onToggleActivity(row.id)} />;
+  },
+  (a, b) =>
+    a.row.id === b.row.id &&
+    a.row.version === b.row.version &&
+    a.expanded === b.expanded &&
+    a.onToggleActivity === b.onToggleActivity,
+);
+
 const defaultRegistry: NativeRegistry = {
   user: MessageRow,
   assistant: MessageRow,
@@ -821,6 +853,8 @@ const defaultRegistry: NativeRegistry = {
   sessionStart: SessionStartRow,
   sessionOffer: SessionOfferRow,
   [OFFER_RESULT]: OfferResultRow,
+  [RECEIVED_MESSAGE]: ReceivedMessageRow,
+  [RECEIVED_GROUP]: ReceivedGroupRow,
   typing: NoticeRow,
   permission: PermissionRow,
   [SHELL_ROW]: ShellRow,
@@ -1036,7 +1070,7 @@ const RowFrame = React.memo(function RowFrame({
 /// Who spoke, for assistive technology: each article is one message in the transcript feed.
 const speaker = (kind: string, t: Translate) =>
   kind === "user" ? t("transcript.you") : kind === "assistant" ? t("transcript.agent") : undefined;
-const rowKind = (row: AcpmuxRow) => (isEditRow(row) ? "editedFiles" : row.kind);
+const rowKind = (row: AcpmuxRow) => (isEditRow(row) ? "editedFiles" : drawnKind(row));
 /// A row drawn as tool rows: tool calls and thoughts, a background task's end, a compaction, a
 /// failover or a session start note.
 const isStepRow = (row: AcpmuxRow | undefined) =>
@@ -3021,7 +3055,8 @@ function AcpmuxPane() {
       const subagents = subagentRowsFrom(turns.rows, expanded, last?.subagents);
       lastTurns.current = { turns, subagents };
       // After the turns: a live turn's status reads its last row, the call's included.
-      return withoutAskedCalls(withShellRows(subagents.rows, chatShellRuns), panelAsks);
+      // Received lines in a row fold last, over the drawn rows.
+      return groupReceived(withoutAskedCalls(withShellRows(subagents.rows, chatShellRuns), panelAsks), expanded);
     });
   }, [
     childRows,