@oar-sh/oar 0.9.21 → 0.9.22

package/server/public/app/held-details.mjs

@@ -0,0 +1,202 @@
+// The live poll's diet: the page polls its conversation every 900 ms, and a
+// finished reply's tool lines and thoughts do not change, so the poll names
+// the replies whose details it already holds and the relay leaves those out.
+// Pure: the relay's route uses the param side, the page the store side.
+//
+// The param (`heldDetails`) is `id~version,id~version,…`: an assistant
+// message id and the version of its details the page holds. The version
+// (`detailsVersion` on every assistant message of a full payload) changes
+// with any row that arrives or changes after the turn (a late sub-agent
+// line, a thought update, a history rebuild), and the relay then sends the
+// details again. A held message comes back as `detailsHeld: true` with empty
+// `activities` and `thoughts`, which the page fills from its store.
+
+export const HELD_DETAILS_MAX_IDS = 200;
+export const HELD_DETAILS_MAX_BYTES = 8 * 1024;
+const ID_PATTERN = /^[A-Za-z0-9_-]{1,64}$/;
+// The shape of a held reply's activities and thoughts. Bump it whenever the
+// relay changes how those arrays are built for a finished reply (a cap, a
+// sanitiser, a new field): every page then holds a stale version and gets
+// each reply in full once.
+export const HELD_DETAILS_SHAPE = 's1';
+// `s1.<tool rows>.<their highest row id>.<thought rows>.<their highest row
+// id>.<fingerprint of the thoughts' text and done>`. Anything else (a version
+// from before this form) is dropped, so the reply goes out in full.
+const VERSION_PATTERN = /^s\d{1,3}\.\d{1,12}\.\d{1,15}\.\d{1,12}\.\d{1,15}\.[0-9a-f]{8}$/;
+
+const nonNegative = (value) => Math.max(0, Math.trunc(Number(value) || 0));
+
+/**
+ * A finished reply's details version. Tool rows are only ever inserted, so
+ * their count and highest row id see every change. A thought row is updated
+ * in place as its text streams in and when it is done, so the thoughts also
+ * carry a fingerprint of their content (`thoughtFingerprint`).
+ */
+export function detailsVersion({ activityCount = 0, activityMaxRowId = 0, thoughtCount = 0, thoughtMaxRowId = 0, thoughtHash = '00000000' } = {}) {
+  const hash = /^[0-9a-f]{8}$/.test(String(thoughtHash)) ? String(thoughtHash) : '00000000';
+  return [HELD_DETAILS_SHAPE, nonNegative(activityCount), nonNegative(activityMaxRowId), nonNegative(thoughtCount), nonNegative(thoughtMaxRowId), hash].join('.');
+}
+
+/**
+ * The fingerprint of one reply's thought rows: FNV-1a (32 bit) over each
+ * row's id, done and text, in row id order. Any change to a thought's text or
+ * done changes it, two in the same millisecond included.
+ */
+export function thoughtFingerprint(rows) {
+  let hash = 0x811c9dc5;
+  const mix = (text) => {
+    for (let i = 0; i < text.length; i += 1) {
+      hash ^= text.charCodeAt(i);
+      hash = Math.imul(hash, 0x01000193) >>> 0;
+    }
+  };
+  const ordered = [...(Array.isArray(rows) ? rows : [])].sort((a, b) => Number(a?.rowid) - Number(b?.rowid));
+  for (const row of ordered) mix(`${nonNegative(row?.rowid)}\u0001${Number(row?.done) ? 1 : 0}\u0001${String(row?.text ?? '')}\u0002`);
+  return hash.toString(16).padStart(8, '0');
+}
+
+/**
+ * The relay's reading of the param: a Map id → version, or null when it
+ * names nothing usable or is too big (over 8 KB or 200 entries: the poll
+ * then gets the full payload). Entries that are not `id~version` with an id
+ * of [A-Za-z0-9_-]{1,64} are dropped.
+ */
+export function parseHeldDetailsParam(raw) {
+  if (raw === undefined || raw === null) return null;
+  const text = Array.isArray(raw) ? '' : String(raw);
+  if (!text || text.length > HELD_DETAILS_MAX_BYTES) return null;
+  const parts = text.split(',');
+  if (parts.length > HELD_DETAILS_MAX_IDS) return null;
+  const held = new Map();
+  for (const part of parts) {
+    const at = part.indexOf('~');
+    if (at <= 0) continue;
+    const id = part.slice(0, at);
+    const version = part.slice(at + 1);
+    if (!ID_PATTERN.test(id) || !VERSION_PATTERN.test(version)) continue;
+    held.set(id, version);
+  }
+  return held.size ? held : null;
+}
+
+/**
+ * The page's side: what it holds of one open conversation's finished
+ * replies. Filled only from conversation payloads fetched over HTTP (never
+ * from a socket's reply: the turn-end fallback carries the live list, not
+ * the finished one), and only with what it is shown.
+ */
+export function createHeldDetailsStore() {
+  let conversationId = '';
+  // id → { version, activities, thoughts }, in the payload's message order.
+  let held = new Map();
+  // A poll whose answer named a reply the page does not hold is dropped; the
+  // next poll goes without the param. Two such drops in a row and the param
+  // stays off until the next full load.
+  let fullNext = false;
+  let disabled = false;
+  let dropStreak = 0;
+
+  function forConversation(id) {
+    const key = String(id || '');
+    if (key !== conversationId) {
+      conversationId = key;
+      held = new Map();
+      fullNext = false;
+      disabled = false;
+      dropStreak = 0;
+    }
+  }
+
+  function record(messages) {
+    for (const message of Array.isArray(messages) ? messages : []) {
+      if (message?.role !== 'assistant' || message.detailsHeld) continue;
+      const id = String(message.id || '');
+      const version = String(message.detailsVersion || '');
+      if (!ID_PATTERN.test(id) || !VERSION_PATTERN.test(version)) continue;
+      held.delete(id);
+      held.set(id, {
+        version,
+        activities: Array.isArray(message.activities) ? message.activities : [],
+        thoughts: Array.isArray(message.thoughts) ? message.thoughts : [],
+      });
+    }
+  }
+
+  return {
+    /**
+     * A payload was applied. `full`: a load of the whole window (opening,
+     * reconnecting, a reload), which replaces what is held; otherwise (a
+     * poll, a page of older history) its replies are added. `shownIds`, when
+     * given, is every message on screen now: entries for others go.
+     */
+    noteApplied(id, payload, { full = false, shownIds = null } = {}) {
+      forConversation(id);
+      if (full) {
+        held = new Map();
+        fullNext = false;
+        disabled = false;
+        dropStreak = 0;
+      }
+      record(payload?.messages);
+      if (shownIds) {
+        const shown = new Set(Array.from(shownIds, (value) => String(value)));
+        for (const key of [...held.keys()]) if (!shown.has(key)) held.delete(key);
+      }
+    },
+
+    /** The param for the next poll of `id`, or '' to ask for everything. */
+    param(id) {
+      forConversation(id);
+      if (fullNext) {
+        fullNext = false;
+        return '';
+      }
+      if (disabled || !held.size) return '';
+      // The newest first, as many as fit in 8 KB and 200 entries.
+      const parts = [];
+      let bytes = 0;
+      for (const [key, entry] of [...held.entries()].reverse()) {
+        const part = `${key}~${entry.version}`;
+        if (parts.length >= HELD_DETAILS_MAX_IDS || bytes + part.length + 1 > HELD_DETAILS_MAX_BYTES) break;
+        parts.push(part);
+        bytes += part.length + 1;
+      }
+      return parts.join(',');
+    },
+
+    /**
+     * Fill the held replies of a poll's answer from the store, in place.
+     * Returns false (the answer must be dropped) when it names one the store
+     * does not hold.
+     */
+    restore(id, payload) {
+      forConversation(id);
+      const messages = Array.isArray(payload?.messages) ? payload.messages : [];
+      const missing = messages.some((message) => message?.detailsHeld && !held.has(String(message.id || '')));
+      if (missing) {
+        dropStreak += 1;
+        if (dropStreak >= 2) disabled = true;
+        else fullNext = true;
+        return false;
+      }
+      let restored = 0;
+      for (const message of messages) {
+        if (!message?.detailsHeld) continue;
+        const entry = held.get(String(message.id));
+        message.activities = entry.activities;
+        message.thoughts = entry.thoughts;
+        message.detailsVersion = entry.version;
+        delete message.detailsHeld;
+        restored += 1;
+      }
+      // Only a poll the store answered for ends a run of drops; the full
+      // poll after a drop does not.
+      if (restored) dropStreak = 0;
+      return true;
+    },
+
+    /** For tests and the page's own checks. */
+    size() { return held.size; },
+    has(messageId) { return held.has(String(messageId || '')); },
+  };
+}

package/server/public/app/inbox-ui.js

@@ -1,7 +1,8 @@
-// The Inbox in the page: the sidebar's "Inbox" button with its count, the
-// view it opens in place of a transcript (like Status), and the card a
-// question that does not block shows in its own session. inbox-view.mjs
-// builds the DOM; this module loads, keeps and answers.
+// The Inbox in the page: the sidebar's "Inbox" button with its count and
+// the view it opens in place of a transcript (like Status). A session's own
+// questions that don't block are in its 📓 (questions-panel-ui.js), which
+// answers through here. inbox-view.mjs builds the DOM; this module loads,
+// keeps and answers.
 //
 // The list comes from GET /api/inbox (this relay and every paired relay that
 // answers), again on every change of a question here (socket) and every
@@ -15,17 +16,15 @@ import { currentConvId, IS_SHARED_VIEW, setCurrentConv, showTransientRelayNotice
 import { isStatusViewActive, leaveStatusView } from './status-view.mjs';
 import { actOnRelayBoard } from './relay-board-view.js';
 import {
-  buildAskCard,
   captureInboxFolds,
   createCoalescedRefresh,
-  inboxPendingCount,
+  inboxBadge,
   INBOX_FILTERS,
   INBOX_FOLD_SELECTOR,
   noteInboxFold,
   pruneInboxFolds,
   renderInbox,
   restoreInboxFolds,
-  sessionAsksFromInbox,
 } from './inbox-view.mjs';
 
 const FILTER_STORAGE_KEY = 'oar_inbox_filter';
@@ -47,14 +46,18 @@ const drafts = new Map();
 // re-renders the same way: every socket change and the minute's poll draw
 // the cards anew, closed. Forgotten when the item leaves the list.
 const openFolds = new Set();
-// This relay's asks for the session cards: id → ask (each Inbox load
-// replaces it; the socket updates single asks in between).
-let sessionAsks = new Map();
-let sessionCardKey = '';
 // Where the Inbox was scrolled when it was last left; the next opening
 // starts there (the first one at the top). The transcript's own scroll
 // height is the transcript's, never the Inbox's.
 let inboxScrollTop = 0;
+// The 📓 panel's side (questions-panel-ui.js), handed in so the two modules
+// do not import each other: an ask the answer routes returned, "open" on an
+// ask's session, and that open having run (or failed).
+let askHooks = { onAskUpdated: null, onOpenAsk: null, onOpenSettled: null };
+
+export function setInboxAskHooks(hooks = {}) {
+  askHooks = { ...askHooks, ...hooks };
+}
 
 function readFilter() {
   try {
@@ -69,15 +72,24 @@ export function isInboxViewActive() {
   return inboxActive;
 }
 
-/** The sidebar button's count: everything pending, here and on paired relays. */
+/**
+ * The sidebar button's count: everything pending, here and on paired relays;
+ * while an urgent ask waits, the urgent count in red.
+ */
 function syncInboxBadge() {
-  const count = inboxPendingCount(relays);
+  const { text, urgent, pending: count, urgentCount } = inboxBadge(relays);
   const badge = document.getElementById('inbox-count');
   const buttonEl = document.getElementById('inbox-btn');
-  if (badge) badge.textContent = count ? String(count) : '';
+  if (badge) {
+    badge.textContent = text;
+    badge.classList.toggle('is-urgent', urgent);
+  }
   if (buttonEl) {
     buttonEl.classList.toggle('has-pending', count > 0);
-    buttonEl.setAttribute('aria-label', count ? `Inbox, ${count} question${count === 1 ? '' : 's'} waiting` : 'Inbox');
+    const label = urgent
+      ? `Inbox, ${urgentCount} urgent of ${count} waiting`
+      : (count ? `Inbox, ${count} question${count === 1 ? '' : 's'} waiting` : 'Inbox');
+    buttonEl.setAttribute('aria-label', label);
     buttonEl.setAttribute('aria-pressed', inboxActive ? 'true' : 'false');
   }
 }
@@ -87,16 +99,18 @@ function draftKey(node) {
   return card ? `${card.dataset.relayId || 'self'}:${card.dataset.itemId || ''}` : '';
 }
 
-function captureDrafts(host) {
+export function captureDrafts(host) {
+  // Only fields typed into: the same ask can be drawn twice (its session's
+  // card and the 📓 panel), and the untouched copy must not wipe the draft.
   for (const field of host.querySelectorAll('.inbox-answer-text')) {
     const key = draftKey(field);
-    if (key) drafts.set(key, field.value);
+    if (key && field.dataset.draftTouched === '1') drafts.set(key, field.value);
   }
   const active = document.activeElement;
   return active?.classList?.contains('inbox-answer-text') && host.contains(active) ? draftKey(active) : '';
 }
 
-function restoreDrafts(host, focusedKey) {
+export function restoreDrafts(host, focusedKey) {
   for (const field of host.querySelectorAll('.inbox-answer-text')) {
     const key = draftKey(field);
     if (drafts.has(key)) field.value = drafts.get(key);
@@ -122,8 +136,8 @@ function renderInboxNow({ opening = false } = {}) {
   host.scrollTop = top;
   const title = document.getElementById('chat-title');
   if (title) {
-    const count = inboxPendingCount(relays);
-    title.textContent = count ? `Inbox · ${count} waiting` : 'Inbox';
+    const { pending: count, urgentCount } = inboxBadge(relays);
+    title.textContent = count ? `Inbox · ${urgentCount ? `${urgentCount} urgent · ` : ''}${count} waiting` : 'Inbox';
   }
 }
 
@@ -132,13 +146,10 @@ async function loadInbox() {
   if (response && Array.isArray(response.relays)) {
     relays = response.relays;
     loaded = true;
-    // Built anew from each load: an ask withdrawn or cancelled meanwhile goes.
-    sessionAsks = sessionAsksFromInbox(relays);
     pruneInboxFolds(openFolds, relays);
   }
   syncInboxBadge();
   renderInboxNow();
-  renderSessionAskCards();
   return response;
 }
 
@@ -160,10 +171,7 @@ function scheduleRefresh() {
 }
 
 /** Socket: an ask of this relay changed (created, answered, dismissed, withdrawn). */
-export function noteRelayAskUpdated(payload = {}) {
-  const ask = payload?.ask;
-  if (ask?.id) sessionAsks.set(ask.id, ask);
-  renderSessionAskCards();
+export function noteRelayAskUpdated() {
   scheduleRefresh();
 }
 
@@ -271,7 +279,9 @@ async function answerAsk(card, data, { choice = '', dismiss = false } = {}) {
     return false;
   }
   drafts.delete(`${relayId}:${id}`);
-  if (relayId === 'self' && result.response?.question?.id) sessionAsks.set(result.response.question.id, result.response.question);
+  if (relayId === 'self' && result.response?.question?.id) {
+    try { askHooks.onAskUpdated?.(result.response.question); } catch {}
+  }
   return true;
 }
 
@@ -318,9 +328,17 @@ async function handleAction(target) {
   if (data.inboxAction === 'open') {
     const id = String(data.sessionId || '').trim();
     if (!id) return;
+    // An ask's session opens with 📓 open at that ask.
+    const askId = card?.dataset.kind === 'ask' && (card.dataset.relayId || 'self') === 'self' ? String(card.dataset.itemId || '') : '';
+    if (askId) askHooks.onOpenAsk?.(id, askId);
     leaveInboxView();
     previousConversationId = '';
-    await window.openConversation?.(id);
+    try {
+      await window.openConversation?.(id);
+    } finally {
+      // Failed, or landed elsewhere: the request to open 📓 there is dropped.
+      if (askId) askHooks.onOpenSettled?.(id);
+    }
     return;
   }
   const buttons = card ? [...card.querySelectorAll('button')] : [target];
@@ -336,73 +354,46 @@ async function handleAction(target) {
   } finally {
     if (!done) for (const node of buttons) node.disabled = false;
   }
-  if (done) {
-    renderSessionAskCards();
-    await refreshInbox();
-  }
+  if (done) await refreshInbox();
 }
 
-function bindClicks() {
-  if (clickBound) return;
-  clickBound = true;
-  const host = document.getElementById('messages');
-  host?.addEventListener('click', (event) => {
+/**
+ * The Inbox's buttons, typed answers and folds inside `host`: the transcript
+ * (the Inbox view) or another host that draws the
+ * same cards (the 📓 panel). `scope`: the selector a click must be inside.
+ */
+export function bindInboxActionHost(host, { scope = '.inbox-view' } = {}) {
+  if (!host || host.dataset.inboxActionsBound === '1') return;
+  host.dataset.inboxActionsBound = '1';
+  host.addEventListener('click', (event) => {
     const target = event.target instanceof Element ? event.target.closest('[data-inbox-action], [data-inbox-filter]') : null;
-    if (!target || !target.closest('.inbox-view, .relay-ask-container')) return;
+    if (!target || !target.closest(scope)) return;
     event.preventDefault();
     void handleAction(target);
   });
-  host?.addEventListener('input', (event) => {
+  host.addEventListener('input', (event) => {
     const field = event.target instanceof Element && event.target.classList.contains('inbox-answer-text') ? event.target : null;
     const key = field ? draftKey(field) : '';
-    if (key) drafts.set(key, field.value);
+    if (key) {
+      field.dataset.draftTouched = '1';
+      drafts.set(key, field.value);
+    }
   });
   // A fold opened or closed by hand. `toggle` does not bubble: caught on the
-  // way down. Also covers a session's card that a transcript render dropped
-  // before renderSessionAskCards drew it again.
-  host?.addEventListener('toggle', (event) => {
+  // way down.
+  host.addEventListener('toggle', (event) => {
     const details = event.target instanceof Element && event.target.matches(INBOX_FOLD_SELECTOR) ? event.target : null;
     if (details && details.isConnected) noteInboxFold(openFolds, details);
   }, true);
 }
 
-// ─── The card in the session ──────────────────────────────────────────────────
-
-/**
- * The pending asks of the conversation on screen, as cards at the end of its
- * transcript (before the cards it waits on). Called with every render of the
- * question cards; a no-op while nothing changed.
- */
-export function renderSessionAskCards() {
-  const host = document.getElementById('messages');
-  if (!host || IS_SHARED_VIEW) return;
-  const id = String(currentConvId || '').trim();
-  const shown = inboxActive || isStatusViewActive() || !id
-    ? []
-    : [...sessionAsks.values()]
-      .filter((ask) => ask && (ask.conversationId || ask.session?.id) === id && ask.status === 'pending')
-      .sort((a, b) => String(a.createdAt || '').localeCompare(String(b.createdAt || '')));
-  const key = JSON.stringify([id, shown.map((ask) => [ask.id, ask.status])]);
-  const existing = host.querySelectorAll('.relay-ask-container');
-  if (key === sessionCardKey && existing.length === shown.length && [...existing].every((node) => node.isConnected)) return;
-  sessionCardKey = key;
-  const focused = captureDrafts(host);
-  existing.forEach((node) => captureInboxFolds(openFolds, node));
-  existing.forEach((node) => node.remove());
-  const firstQuestion = host.querySelector('.relay-question-container');
-  for (const ask of shown) {
-    const wrapper = document.createElement('div');
-    wrapper.className = 'msg relay-ask-container';
-    wrapper.dataset.askId = ask.id;
-    wrapper.append(buildAskCard(document, { ...ask, session: ask.session || { id } }, { relay: { id: 'self', self: true }, mode: 'session', now: Date.now() }));
-    if (firstQuestion) host.insertBefore(wrapper, firstQuestion);
-    else host.append(wrapper);
-    restoreInboxFolds(openFolds, wrapper);
-  }
-  restoreDrafts(host, focused);
+function bindClicks() {
+  if (clickBound) return;
+  clickBound = true;
+  bindInboxActionHost(document.getElementById('messages'));
 }
 
-/** Boot: the count, the session cards, a refresh every minute (paired relays). */
+/** Boot: the count and a refresh every minute (paired relays). */
 export function startInbox() {
   if (started || IS_SHARED_VIEW) return;
   started = true;

package/server/public/app/inbox-view.mjs

@@ -153,20 +153,6 @@ export function createCoalescedRefresh(load) {
   return refresh;
 }
 
-/**
- * This relay's asks out of an Inbox load (GET /api/inbox), by id: what the
- * session cards show. Built anew from each load, so an ask that was
- * withdrawn or cancelled (no longer listed) drops out.
- */
-export function sessionAsksFromInbox(relays) {
-  const own = (Array.isArray(relays) ? relays : []).find((relay) => relay?.self === true);
-  const asks = new Map();
-  for (const item of Array.isArray(own?.items) ? own.items : []) {
-    if (item?.kind === 'ask' && toText(item.id)) asks.set(item.id, { ...item, conversationId: item.session?.id });
-  }
-  return asks;
-}
-
 // The folds a card has: an ask's `Details` and a plan card's `The plan`.
 export const INBOX_FOLD_SELECTOR = 'details.inbox-item-detail, details.inbox-plan-body';
 
@@ -226,6 +212,25 @@ export function inboxPendingCount(relays) {
     .reduce((sum, relay) => sum + (Array.isArray(relay?.items) ? relay.items : []).filter((item) => toText(item?.status) === 'pending').length, 0);
 }
 
+/**
+ * The sidebar badge: the urgent count, marked, while an urgent item waits;
+ * else every pending item. Only asks can be urgent (`urgency: 'now'`); a
+ * card a turn waits on or a plan card counts as a normal one.
+ */
+export function inboxBadge(relays) {
+  let pending = 0;
+  let urgent = 0;
+  for (const relay of Array.isArray(relays) ? relays : []) {
+    for (const item of Array.isArray(relay?.items) ? relay.items : []) {
+      if (toText(item?.status) !== 'pending') continue;
+      pending += 1;
+      if (toText(item.kind) === 'ask' && item.urgency === 'now') urgent += 1;
+    }
+  }
+  if (urgent > 0) return { text: String(urgent), urgent: true, pending, urgentCount: urgent };
+  return { text: pending ? String(pending) : '', urgent: false, pending, urgentCount: 0 };
+}
+
 function headLine(doc, item, { relay, now, label }) {
   const head = el(doc, 'div', 'inbox-item-head');
   head.append(el(doc, 'span', 'inbox-item-kind', label));
@@ -263,9 +268,17 @@ function sessionLine(doc, item, relay, { withLink = true } = {}) {
   return line;
 }
 
-function outcomeLine(doc, item) {
+function outcomeLine(doc, item, mode = 'inbox') {
   if (item.status === 'dismissed') return el(doc, 'div', 'inbox-item-outcome', 'Dismissed');
+  // The 📓 panel lists every close of the last day; the Inbox only these two.
+  if (mode === 'panel' && item.status === 'withdrawn') return el(doc, 'div', 'inbox-item-outcome', 'Withdrawn');
+  if (mode === 'panel' && item.status === 'cancelled') return el(doc, 'div', 'inbox-item-outcome', 'Cancelled');
   if (item.status !== 'answered') return null;
+  if (mode === 'panel') {
+    // The choice, or the answer's first line.
+    const short = toText(item.choice) || toText(String(item.answer || '').split(/\r?\n/).find((line) => line.trim()) || '');
+    return el(doc, 'div', 'inbox-item-outcome', `Answered: ${short}`);
+  }
   const answer = toText(item.answer) || toText(item.choice);
   const via = toText(item.answeredVia);
   return el(doc, 'div', 'inbox-item-outcome', `Answered: ${answer}${via ? ` (from ${via})` : ''}`);
@@ -273,8 +286,9 @@ function outcomeLine(doc, item) {
 
 /**
  * A question that does not block, as a card: in the Inbox (`mode` "inbox",
- * with its session and relay) or in its session ("session"). `answerable`:
- * the buttons answer it (this relay's, or a paired relay's ask).
+ * with its session and relay), in its session ("session") or in the
+ * session's 📓 panel ("panel": its Details open). `answerable`: the buttons
+ * answer it (this relay's, or a paired relay's ask).
  */
 export function buildAskCard(doc, item, { relay = null, mode = 'inbox', now = Date.now(), answerable = true } = {}) {
   const card = el(doc, 'article', `inbox-item inbox-ask${mode === 'session' ? ' relay-ask-card' : ''}`);
@@ -282,7 +296,8 @@ export function buildAskCard(doc, item, { relay = null, mode = 'inbox', now = Da
   card.dataset.kind = 'ask';
   if (relay?.id) card.dataset.relayId = relay.id;
   card.dataset.status = toText(item.status) || 'pending';
-  card.append(headLine(doc, item, { relay, now, label: mode === 'session' ? 'Question for you · does not block this session' : 'Question' }));
+  const label = mode === 'session' ? 'Question for you · does not block this session' : (mode === 'panel' ? 'Question for you' : 'Question');
+  card.append(headLine(doc, item, { relay, now, label }));
   if (mode === 'inbox') card.append(sessionLine(doc, item, relay));
   else if (item.onBehalf && item.askedBy) card.append(sessionLine(doc, item, relay, { withLink: false }));
   card.append(el(doc, 'p', 'inbox-item-question', item.question || item.prompt || ''));
@@ -295,9 +310,10 @@ export function buildAskCard(doc, item, { relay = null, mode = 'inbox', now = Da
     details.append(el(doc, 'summary', '', 'Details'));
     // Plain text, line breaks kept: never parsed as markup.
     details.append(el(doc, 'pre', 'inbox-item-detail-text', item.detail));
+    if (mode === 'panel') details.open = true;
     card.append(details);
   }
-  const outcome = outcomeLine(doc, item);
+  const outcome = outcomeLine(doc, item, mode);
   if (outcome) card.append(outcome);
   if (item.status === 'pending' && answerable) {
     const data = { relayId: relay?.id || 'self', itemId: item.id };

package/server/public/app/journal-view.js

@@ -100,6 +100,7 @@ import {
   setConversationTaskStallMinutes,
 } from './background-tasks-view.mjs';
 import { setConversationPins, setPinsConversation } from './pinned-messages-view.mjs';
+import { setQuestionsConversation } from './questions-panel-ui.js';
 import { setConversationHiddenMessages, setHiddenMessagesConversation } from './hidden-messages-view.mjs';
 import { setUsageLimitConversation } from './usage-limit-ui.js';
 import { mergeConversationPreviews } from './preview-cards.mjs';
@@ -109,6 +110,11 @@ import { clearAttachments, setRepoBrowserSessionInfo, loadRepoBrowserTree, getRe
 import { buildKnownCwdOptions, normalizeKnownCwdPath } from './known-cwd-options.mjs';
 import { shouldApplyConversationLoad } from './activity-replay-state.mjs';
 import { conversationPayloadCache, payloadHasMoreOlder, windowPageInfo } from './conversation-payload-cache.mjs';
+import { createHeldDetailsStore } from './held-details.mjs';
+
+// The finished replies' details this page holds of the open conversation
+// (the live poll's `heldDetails`, held-details.mjs).
+export const heldDetailsStore = createHeldDetailsStore();
 import { loadKeepingLiveRows, shouldKeepTranscriptOnReload } from './transcript-reload-freshness.mjs';
 import { createInfiniteLoader } from './infinite-loader.js';
 import {
@@ -993,7 +999,15 @@ export function applyLoadedConversationState(id, response, {
   mergeFrom = null,
   windowPayload = null,
   backgroundTasksAsOf = null,
+  fromPoll = false,
 } = {}) {
+  // What the page holds of the finished replies, for the live poll's
+  // `heldDetails`: a full load replaces it, a poll or an older page adds to
+  // it, and a poll trims it to the rows on screen.
+  if (response && !IS_SHARED_VIEW) {
+    const shown = fromPoll ? (response.messages || []).map((message) => message?.id) : null;
+    heldDetailsStore.noteApplied(id, response, { full: !fromPoll && !keepTranscript && !mergeFrom, shownIds: shown });
+  }
   if (!response) {
     if (!IS_SHARED_VIEW) conversationPayloadCache.forget(id);
     setRepoBrowserSessionInfo('', '');
@@ -1089,6 +1103,8 @@ export function applyLoadedConversationState(id, response, {
       ? mergeMessagesIntoTranscript(mergeFrom, response.messages, response)
       : renderMessages(response.messages, !restoreScroll, response);
   }
+  // 📓: a newly opened conversation loads its questions (a no-op on the poll).
+  setQuestionsConversation(id);
   hydrateConversationDraft(id, {
     draftText: response.draftText,
     draftAttachments: response.draftAttachments,
@@ -1178,6 +1194,7 @@ function applyCachedConversationState(id, response, { viewAnchor = null } = {})
   if ('hiddenMessages' in response) setConversationHiddenMessages(id, response.hiddenMessages, response.hiddenMessagesRevision);
   setHiddenMessagesConversation(id);
   const didRenderMessages = renderMessages(response.messages, false, response);
+  setQuestionsConversation(id);
   // The panel shows this conversation's tasks as the socket keeps them.
   setBackgroundTasksConversation(id);
   window.syncChatTitleControls?.();