@stigmer/react 3.12.8 → 3.12.9

package/src/conversation/ConversationsWorkbench.tsx

@@ -82,6 +82,19 @@ export interface ConversationsWorkbenchProps {
   readonly channelHref?: (channel: AgentChannel) => string | null;
   /** Frozen instant for deterministic hosts (tests, documentation tours). */
   readonly now?: Date;
+  /**
+   * Scroll to the reader's own reply when they send one from a scrolled-up
+   * position (stigmer-cloud#267): an accepted send pins the timeline to the
+   * latest content and re-engages follow mode, so the reply stays in view
+   * when the refetch delivers its real ledger item. Refused sends never pin
+   * — the composer restores the draft and there is nothing to show. Default
+   * `true` on all three SDK thread surfaces at once (the ratified DD-011
+   * divergence — cross-surface consistency is the point); set `false` to
+   * keep today's leave-the-reader-alone behavior.
+   *
+   * @default true
+   */
+  readonly scrollOnSend?: boolean;
   /** Additional classes for the workbench container. */
   readonly className?: string;
 }
@@ -103,6 +116,7 @@ export function ConversationsWorkbench({
   headerAccessory,
   channelHref,
   now,
+  scrollOnSend = true,
   className,
 }: ConversationsWorkbenchProps) {
   const [channelFilter, setChannelFilter] = useState("");
@@ -233,6 +247,12 @@ export function ConversationsWorkbench({
     }
   }, [timeline.items, settlingItemId]);
 
+  // Scroll-on-send (stigmer-cloud#267): a monotonic counter the timeline
+  // view pins on. Lives outside the conversation-keyed column, which is
+  // safe by the signal contract: the view initializes to the current value
+  // on (re)mount and pins only on increments it observes.
+  const [sendPinSignal, setSendPinSignal] = useState(0);
+
   const handleSend = useCallback(
     async (payload: ConversationReplyPayload) => {
       const output = await participation.reply(payload);
@@ -252,6 +272,10 @@ export function ConversationsWorkbench({
           selectionKey,
           itemId: outboundItemIdOf(output.outboundMessageId),
         });
+        // The reply produced a ledger item to show — pin the timeline so
+        // it lands in view (a refusal pins nothing: the draft came back
+        // and the reader's position should not move for it).
+        setSendPinSignal((n) => n + 1);
       }
       timeline.refetch();
       return output;
@@ -379,6 +403,7 @@ export function ConversationsWorkbench({
             isLoadingOlder={timeline.isLoadingOlder}
             provider={descriptor?.id ?? null}
             now={now}
+            pinToLatestSignal={scrollOnSend ? sendPinSignal : undefined}
           />
 
           <ConversationComposer

package/src/conversation/__tests__/ConversationTimelineView.layout.test.tsx

@@ -35,7 +35,13 @@ function items(count: number): ConversationTimelineItem[] {
           ? ConversationItemAuthor.author_customer
           : ConversationItemAuthor.author_agent,
       text: `message ${i}`,
-      at: timestampFromDate(new Date(NOW.getTime() - (count - i) * 60_000)),
+      // Anchored by INDEX, never by count: growth must only APPEND rows,
+      // as production items keep their timestamps. A count-relative time
+      // rewrote every existing row on growth — the resulting full-thread
+      // reflow could clamp scrollTop mid-pin and trip the hook's
+      // reader-took-control guard (measured flaky ~1-in-5 on the
+      // scroll-on-send case).
+      at: timestampFromDate(new Date(NOW.getTime() - (1_000 - i) * 60_000)),
     }),
   );
 }
@@ -43,6 +49,7 @@ function items(count: number): ConversationTimelineItem[] {
 function view(props: {
   readonly items: readonly ConversationTimelineItem[];
   readonly isLoading: boolean;
+  readonly pinToLatestSignal?: number;
 }): ReactElement {
   return (
     <ConversationTimelineView
@@ -54,6 +61,7 @@ function view(props: {
       isLoadingOlder={false}
       provider="whatsapp"
       now={NOW}
+      pinToLatestSignal={props.pinToLatestSignal}
     />
   );
 }
@@ -157,4 +165,32 @@ describe("ConversationTimelineView scroll behavior (F-09)", () => {
       expect(jumpButton().getAttribute("aria-hidden")).toBe("true");
     });
   });
+
+  it("pins a scrolled-up reader on their OWN send via pinToLatestSignal, and keeps following as the reply's real item lands (stigmer-cloud#267)", async () => {
+    const { rerender } = renderInPane(
+      view({ items: [], isLoading: true, pinToLatestSignal: 0 }),
+    );
+    rerender(view({ items: items(40), isLoading: false, pinToLatestSignal: 0 }));
+    await settled(() => expect(isPinnedToBottom(scroller())).toBe(true));
+
+    // The reader scrolls up to read history.
+    scroller().scrollTop = 0;
+    await settled(() =>
+      expect(jumpButton().getAttribute("aria-hidden")).toBe("false"),
+    );
+
+    // They send a reply: the workbench increments the signal on the
+    // accepted send. The view pins and re-engages follow — the timeline
+    // has no optimistic item, so re-engaged follow is what carries the
+    // reply's REAL ledger item into view when the refetch delivers it.
+    rerender(view({ items: items(40), isLoading: false, pinToLatestSignal: 1 }));
+    await settled(() => {
+      expect(isPinnedToBottom(scroller())).toBe(true);
+      expect(jumpButton().getAttribute("aria-hidden")).toBe("true");
+    });
+
+    // The refetch delivers the item — still pinned, the reply visible.
+    rerender(view({ items: items(41), isLoading: false, pinToLatestSignal: 1 }));
+    await settled(() => expect(isPinnedToBottom(scroller())).toBe(true));
+  });
 });

package/src/execution/MessageThread.tsx

@@ -1,8 +1,9 @@
 "use client";
 
-import { lazy, memo, Suspense, useCallback, useMemo, type ComponentType } from "react";
+import { lazy, memo, Suspense, useCallback, useEffect, useMemo, useRef, useState, type ComponentType } from "react";
 import { create } from "@bufbuild/protobuf";
-import type { AgentExecution } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/api_pb";
+import type { AgentExecution, RecalledMemoriesReport } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/api_pb";
+import type { RecalledMemoryFact } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/spec_pb";
 import type { AgentMessage, ToolCall } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/message_pb";
 import { AgentMessageSchema } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/message_pb";
 import type { SubAgentExecution } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/subagent_pb";
@@ -29,6 +30,7 @@ import { ToolCallGroup } from "./ToolCallGroup.js";
 import { SubAgentSection } from "./SubAgentSection.js";
 import { ExecutionPhaseBadge } from "./ExecutionPhaseBadge.js";
 import { SetupProgress, type SetupProgressProps } from "./SetupProgress.js";
+import { RecalledMemoriesCard, type RecalledMemoriesCardProps } from "./RecalledMemoriesCard.js";
 import {
   LivenessStatusLine,
   type LivenessStatusLineProps,
@@ -56,7 +58,7 @@ import {
   unwrapEnclosingMarkdownFence,
 } from "../internal/markdown-components.js";
 import { useRenderTracer, useKeyStability, useDomNodeCount, DevProfiler } from "../internal/dev/index.js";
-import { useAutoScroll } from "../internal/useAutoScroll.js";
+import { useAutoScroll, usePinToLatestOnSignal } from "../internal/useAutoScroll.js";
 import { JumpToLatestButton } from "../internal/JumpToLatestButton.js";
 import { ApprovalPeekBar } from "../internal/ApprovalPeekBar.js";
 import { ThreadItemWrapper } from "../internal/ThreadItemWrapper.js";
@@ -113,6 +115,11 @@ export interface MessageThreadSlots {
   readonly PlanStreamingCard?: ComponentType<PlanStreamingCardProps>;
   /** Pre-first-token setup / "Thinking…" indicator. */
   readonly SetupProgress?: ComponentType<SetupProgressProps>;
+  /**
+   * The retriever transparency card at a selection-active execution's
+   * segment start — "Recalled N of M memories" (DD-008 D5).
+   */
+  readonly RecalledMemoriesCard?: ComponentType<RecalledMemoriesCardProps>;
   /**
    * The terminal execution-failure notice. Receives the raw server-reported
    * reason and the retry wiring, so a host can turn the failure into its own
@@ -170,6 +177,25 @@ export interface MessageThreadProps {
    * "Retry" control when {@link pendingMessageFailed} is `true`.
    */
   readonly onRetrySend?: () => void;
+  /**
+   * Scroll to the reader's own message when they send one from a
+   * scrolled-up position (stigmer-cloud#267 — the WhatsApp convention:
+   * showing the result of the reader's own action is Nielsen #1
+   * system-status feedback). The send moment is the
+   * {@link pendingUserMessage} transition from empty to present; the pin
+   * re-engages follow mode, so the optimistic bubble and the streamed
+   * reply stay in view. Incoming content is unaffected — it still never
+   * moves a scrolled-up reader.
+   *
+   * Default `true` on all three SDK thread surfaces at once — a deliberate,
+   * ratified divergence from DD-011's opt-in default: the issue's whole
+   * point is cross-surface consistency, and a per-surface opt-in would
+   * re-create the inconsistency it fixes. Set `false` to keep today's
+   * leave-the-reader-alone behavior.
+   *
+   * @default true
+   */
+  readonly scrollOnSend?: boolean;
   /**
    * When provided, the in-flight human turn (the active execution's prompt)
    * shows a hover "Edit" affordance. Clicking it invokes this callback with
@@ -379,6 +405,7 @@ export type ThreadItem =
   | { readonly kind: "approval-request"; readonly pendingApproval: PendingApproval; readonly key: string }
   | { readonly kind: "file-review-record"; readonly fileChangeSet: FileChangeSet; readonly key: string }
   | { readonly kind: "setup-progress"; readonly workspaceEntries: readonly WorkspaceEntry[]; readonly serverPhase?: string; readonly isAwaitingResponse?: boolean; readonly key: string }
+  | { readonly kind: "recalled-memories"; readonly report: RecalledMemoriesReport; readonly facts: readonly RecalledMemoryFact[]; readonly key: string }
   | { readonly kind: "context-compacted"; readonly event: SummarizationEventView; readonly key: string }
   | {
       readonly kind: "todos";
@@ -805,6 +832,24 @@ export function buildThreadItems(
       });
     }
 
+    // The retriever transparency card (stigmer#293 Phase 3a, DD-008 D5):
+    // this execution ran semantic selection over its memory snapshot, so
+    // its segment discloses the subset right after the user's turn —
+    // spec.message is the query the retriever embedded. Absent report or
+    // selection_active=false means wholesale (unchanged Phase 2 behavior)
+    // and renders nothing. Gated on the REPORT, not the prompt bubble:
+    // syntheticUserPrompt deliberately skips some user turns (empty
+    // prompt, build-from-plan) that can still be selection-active.
+    const recalledReport = exec.status?.recalledMemoriesReport;
+    if (recalledReport?.selectionActive) {
+      items.push({
+        kind: "recalled-memories",
+        report: recalledReport,
+        facts: exec.spec?.recalledMemories?.facts ?? [],
+        key: `${execId}-recalled-memories`,
+      });
+    }
+
     for (let mi = 0; mi < messages.length; mi++) {
       const msg = messages[mi];
 
@@ -1163,6 +1208,7 @@ export function MessageThread({
   pendingAttachments,
   pendingMessageFailed = false,
   onRetrySend,
+  scrollOnSend = true,
   onRetryExecution,
   onEditMessage,
   className,
@@ -1199,6 +1245,22 @@ export function MessageThread({
 
   useKeyStability(items);
 
+  // Scroll-on-send (stigmer-cloud#267): the send moment is the optimistic
+  // message's empty→present transition — the one signal both render paths
+  // share. A monotonic counter (not the message text) carries it down, so
+  // repeated sends of identical text still pin and a retry of a FAILED send
+  // (pending stays present throughout) deliberately does not re-pin.
+  const [sendSignal, setSendSignal] = useState(0);
+  const wasPendingRef = useRef(false);
+  useEffect(() => {
+    const isPending = !!pendingUserMessage;
+    if (isPending && !wasPendingRef.current) {
+      setSendSignal((n) => n + 1);
+    }
+    wasPendingRef.current = isPending;
+  }, [pendingUserMessage]);
+  const pinToLatestSignal = scrollOnSend ? sendSignal : undefined;
+
   const filePathCtx = useMemo<FilePathContextValue>(
     () => ({
       workspaceEntries: workspaceEntries ?? [],
@@ -1288,6 +1350,7 @@ export function MessageThread({
             onRetryExecution={onRetryExecution}
             onEditMessage={onEditMessage}
             slots={slots}
+            pinToLatestSignal={pinToLatestSignal}
           />
         </Suspense>
       </div>
@@ -1317,6 +1380,7 @@ export function MessageThread({
       onRetryExecution={onRetryExecution}
       onEditMessage={onEditMessage}
       slots={slots}
+      pinToLatestSignal={pinToLatestSignal}
     />
   );
 }
@@ -1352,6 +1416,8 @@ interface NonVirtualizedThreadProps {
   readonly onRetryExecution?: (message: string) => void;
   readonly onEditMessage?: (text: string) => void;
   readonly slots?: MessageThreadSlots;
+  /** Scroll-on-send counter from the parent (see `usePinToLatestOnSignal`). */
+  readonly pinToLatestSignal?: number;
 }
 
 function NonVirtualizedThread({
@@ -1376,9 +1442,11 @@ function NonVirtualizedThread({
   onRetryExecution,
   onEditMessage,
   slots,
+  pinToLatestSignal,
 }: NonVirtualizedThreadProps) {
   const { scrollRef, sentinelRef, contentRef, isFollowing, jumpToLatest } =
     useAutoScroll();
+  usePinToLatestOnSignal(pinToLatestSignal, jumpToLatest);
 
   useDomNodeCount(scrollRef, "MessageThread");
 
@@ -1593,6 +1661,10 @@ export function ThreadItemRenderer({
         />
       );
     }
+    case "recalled-memories": {
+      const Recalled = slots?.RecalledMemoriesCard ?? RecalledMemoriesCard;
+      return <Recalled report={item.report} facts={item.facts} />;
+    }
     case "context-compacted":
       return <SummarizationCard event={item.event} />;
     case "liveness": {

package/src/execution/RecalledMemoriesCard.tsx

@@ -0,0 +1,164 @@
+"use client";
+
+import { memo, useId, useMemo, useState } from "react";
+import type { RecalledMemoriesReport } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/api_pb";
+import type { RecalledMemoryFact } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/spec_pb";
+import { cn } from "@stigmer/theme";
+
+/**
+ * Resolve the report's injected memory ids against the execution's
+ * snapshot facts, preserving snapshot order (the stable prompt order —
+ * the selector re-sorts its subset the same way, so this join renders
+ * the facts exactly as the agent saw them).
+ *
+ * The contract guarantees injected ids are a subset of the snapshot
+ * (the merge path's never-invent pin), so an unknown id can only mean a
+ * bug upstream — it is skipped, never invented. The summary count stays
+ * the wire truth (`injectedMemoryIds.length`) regardless.
+ */
+export function resolveInjectedFacts(
+  report: RecalledMemoriesReport,
+  facts: readonly RecalledMemoryFact[],
+): RecalledMemoryFact[] {
+  const injected = new Set(report.injectedMemoryIds);
+  return facts.filter((fact) => injected.has(fact.memoryId));
+}
+
+/** Props for {@link RecalledMemoriesCard}. */
+export interface RecalledMemoriesCardProps {
+  /** The runner's injection report from the execution's status. */
+  readonly report: RecalledMemoriesReport;
+  /** The full candidate set from `spec.recalled_memories.facts`. */
+  readonly facts: readonly RecalledMemoryFact[];
+  /** Additional CSS classes for the root element. */
+  readonly className?: string;
+}
+
+/**
+ * Inline timeline card disclosing the semantic retriever's selection for
+ * one execution: "Recalled N of M memories", expandable to the injected
+ * facts (stigmer/stigmer#293 Phase 3a, DD-008 D5's transparency promise).
+ *
+ * Renders at the top of the execution's {@link MessageThread} segment,
+ * right after the user's turn — `spec.message` is the query the
+ * retriever embedded, so the card reads as "for this message, these
+ * memories were most relevant".
+ *
+ * Renders NOTHING unless the report says selection was active: an
+ * absent report and `selection_active=false` both mean wholesale (every
+ * snapshot fact injected — the shipped Phase 2 behavior), and unchanged
+ * behavior earns no UI noise. The same rule is applied by the thread
+ * builder; it is repeated here so directly-embedding platform builders
+ * get the correct contract by construction.
+ *
+ * All visual properties flow through `--stgm-*` tokens.
+ *
+ * @see resolveInjectedFacts - the report→snapshot join this card renders
+ * @see SummarizationCard - the sibling system-event card this follows
+ */
+export const RecalledMemoriesCard = memo(function RecalledMemoriesCard({
+  report,
+  facts,
+  className,
+}: RecalledMemoriesCardProps) {
+  const [expanded, setExpanded] = useState(false);
+  const listId = useId();
+
+  const injectedFacts = useMemo(
+    () => resolveInjectedFacts(report, facts),
+    [report, facts],
+  );
+
+  if (!report.selectionActive) return null;
+
+  const injectedCount = report.injectedMemoryIds.length;
+  const summary = `Recalled ${injectedCount} of ${facts.length} memories`;
+
+  return (
+    <div
+      role="status"
+      aria-label={summary}
+      className={cn(
+        "stg:mx-4 stg:rounded-md stg:border stg:border-border/50 stg:bg-muted/30",
+        className,
+      )}
+    >
+      <button
+        type="button"
+        aria-expanded={expanded}
+        aria-controls={listId}
+        onClick={() => setExpanded((prev) => !prev)}
+        className={cn(
+          "stg:flex stg:w-full stg:items-center stg:gap-3 stg:px-3 stg:py-2 stg:text-left",
+          "stg:text-xs stg:text-muted-foreground hover:stg:text-foreground",
+        )}
+      >
+        <MemoryIcon />
+        <span className="stg:flex stg:min-w-0 stg:flex-1 stg:flex-wrap stg:items-baseline stg:gap-x-2">
+          <span className="stg:font-medium">{summary}</span>
+          {report.embeddingModel && (
+            <>
+              <span aria-hidden="true" className="stg:text-muted-foreground/50">&middot;</span>
+              <span className="stg:text-muted-foreground/80">{report.embeddingModel}</span>
+            </>
+          )}
+        </span>
+        <ChevronIcon expanded={expanded} />
+      </button>
+      {expanded && (
+        <ul
+          id={listId}
+          className="stg:m-0 stg:flex stg:list-none stg:flex-col stg:gap-1.5 stg:border-t stg:border-border/50 stg:px-3 stg:py-2"
+        >
+          {injectedFacts.map((fact) => (
+            <li
+              key={fact.memoryId}
+              className="stg:text-xs stg:leading-relaxed stg:text-muted-foreground"
+            >
+              {fact.content}
+            </li>
+          ))}
+        </ul>
+      )}
+    </div>
+  );
+});
+
+function MemoryIcon() {
+  return (
+    <svg
+      width="16"
+      height="16"
+      viewBox="0 0 16 16"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="1.5"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      className="stg:shrink-0 stg:text-muted-foreground/70"
+      aria-hidden="true"
+    >
+      <path d="M8 2a3 3 0 0 0-3 3c-1.2.4-2 1.5-2 2.8 0 1 .5 1.9 1.3 2.4A2.8 2.8 0 0 0 7 13.8c.4.1.7.2 1 .2s.6-.1 1-.2a2.8 2.8 0 0 0 2.7-3.6c.8-.5 1.3-1.4 1.3-2.4 0-1.3-.8-2.4-2-2.8a3 3 0 0 0-3-3z" />
+      <path d="M8 2v12" />
+    </svg>
+  );
+}
+
+function ChevronIcon({ expanded }: { expanded: boolean }) {
+  return (
+    <svg
+      width="14"
+      height="14"
+      viewBox="0 0 16 16"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="1.5"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      className="stg:shrink-0 stg:text-muted-foreground/70"
+      aria-hidden="true"
+    >
+      {expanded ? <path d="M4 10l4-4 4 4" /> : <path d="M4 6l4 4 4-4" />}
+    </svg>
+  );
+}

package/src/execution/__tests__/RecalledMemoriesCard.test.tsx

@@ -0,0 +1,123 @@
+// The retriever transparency card (stigmer/stigmer#293 Phase 3a, DD-008
+// D5): an honest "Recalled N of M memories" join of the status report
+// against the spec snapshot — and NOTHING for wholesale, the majority
+// case that must stay noise-free.
+
+import { describe, it, expect, afterEach } from "vitest";
+import { cleanup, render, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { create } from "@bufbuild/protobuf";
+import {
+  RecalledMemoriesReportSchema,
+  type RecalledMemoriesReport,
+} from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/api_pb";
+import {
+  RecalledMemoryFactSchema,
+  type RecalledMemoryFact,
+} from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/spec_pb";
+import {
+  RecalledMemoriesCard,
+  resolveInjectedFacts,
+} from "../RecalledMemoriesCard";
+
+function makeFact(id: string, content: string): RecalledMemoryFact {
+  return create(RecalledMemoryFactSchema, { memoryId: id, content });
+}
+
+function makeReport(
+  overrides: Partial<Pick<RecalledMemoriesReport, "selectionActive" | "injectedMemoryIds" | "embeddingModel">>,
+): RecalledMemoriesReport {
+  return create(RecalledMemoriesReportSchema, {
+    selectionActive: true,
+    embeddingModel: "text-embedding-3-small",
+    ...overrides,
+  });
+}
+
+const SNAPSHOT: RecalledMemoryFact[] = [
+  makeFact("mem_a", "Prefers concise answers."),
+  makeFact("mem_b", "Works in the Europe/Berlin timezone."),
+  makeFact("mem_c", "Deploys with Bazel."),
+  makeFact("mem_d", "Reviews PRs on Fridays."),
+];
+
+afterEach(cleanup);
+
+describe("resolveInjectedFacts", () => {
+  it("preserves snapshot order regardless of the report's id order", () => {
+    const report = makeReport({ injectedMemoryIds: ["mem_d", "mem_a"] });
+    expect(resolveInjectedFacts(report, SNAPSHOT).map((f) => f.memoryId)).toEqual([
+      "mem_a",
+      "mem_d",
+    ]);
+  });
+
+  it("skips an unknown id — never invents a fact", () => {
+    const report = makeReport({ injectedMemoryIds: ["mem_b", "mem_ghost"] });
+    expect(resolveInjectedFacts(report, SNAPSHOT).map((f) => f.memoryId)).toEqual([
+      "mem_b",
+    ]);
+  });
+
+  it("returns nothing against an empty snapshot", () => {
+    const report = makeReport({ injectedMemoryIds: ["mem_a"] });
+    expect(resolveInjectedFacts(report, [])).toEqual([]);
+  });
+});
+
+describe("RecalledMemoriesCard", () => {
+  it("renders nothing for a wholesale report (selection_active=false)", () => {
+    const report = makeReport({
+      selectionActive: false,
+      injectedMemoryIds: [],
+      embeddingModel: "",
+    });
+    const { container } = render(
+      <RecalledMemoriesCard report={report} facts={SNAPSHOT} />,
+    );
+    expect(container.innerHTML).toBe("");
+  });
+
+  it("summarizes the selection with the wire count and the embedding model", () => {
+    const report = makeReport({ injectedMemoryIds: ["mem_a", "mem_c"] });
+    render(<RecalledMemoriesCard report={report} facts={SNAPSHOT} />);
+
+    expect(screen.getByRole("status", { name: "Recalled 2 of 4 memories" })).toBeTruthy();
+    expect(screen.getByText("text-embedding-3-small")).toBeTruthy();
+    // Collapsed by default: the facts are behind the disclosure.
+    expect(screen.queryByText("Prefers concise answers.")).toBeNull();
+  });
+
+  it("expands to exactly the injected facts, in snapshot order", async () => {
+    const report = makeReport({ injectedMemoryIds: ["mem_c", "mem_a"] });
+    render(<RecalledMemoriesCard report={report} facts={SNAPSHOT} />);
+    const user = userEvent.setup();
+
+    const toggle = screen.getByRole("button", { expanded: false });
+    expect(toggle.getAttribute("aria-controls")).toBeTruthy();
+
+    await user.click(toggle);
+
+    expect(toggle.getAttribute("aria-expanded")).toBe("true");
+    const items = screen.getAllByRole("listitem").map((li) => li.textContent);
+    expect(items).toEqual(["Prefers concise answers.", "Deploys with Bazel."]);
+    // Non-injected snapshot facts never render.
+    expect(screen.queryByText("Works in the Europe/Berlin timezone.")).toBeNull();
+
+    await user.click(toggle);
+    expect(toggle.getAttribute("aria-expanded")).toBe("false");
+    expect(screen.queryByRole("listitem")).toBeNull();
+  });
+
+  it("keeps the summary count honest when an id cannot be resolved", async () => {
+    // Contractually impossible (injected ids ⊂ snapshot, the merge path's
+    // never-invent pin) — but if it ever happens, the count stays the wire
+    // truth and the list simply omits the unresolvable entry.
+    const report = makeReport({ injectedMemoryIds: ["mem_b", "mem_ghost"] });
+    render(<RecalledMemoriesCard report={report} facts={SNAPSHOT} />);
+
+    expect(screen.getByRole("status", { name: "Recalled 2 of 4 memories" })).toBeTruthy();
+    await userEvent.setup().click(screen.getByRole("button"));
+    expect(screen.getAllByRole("listitem")).toHaveLength(1);
+  });
+});