create-walle 0.9.32 → 0.9.33

package/template/claude-task-manager/lib/headless-term-service.js

@@ -710,6 +710,24 @@ async function handleMessage(msg) {
       break;
     }
 
+    // Option B: bottom-anchor clamp. The main thread sets this to the held primary SHRINK target while a
+    // rows-only resize is deferred mid-stream, so extractGrid emits only the bottom N viewport rows (the
+    // agent's composer stays inside the frame instead of CUP-clamping blank onto a shorter client). rows<=0
+    // clears it. The emitted grid SHAPE changes, so force a clean keyframe on any change (diffing a
+    // bottom-anchored grid against a top-anchored acked grid would smear the transition).
+    case 'set-emit-clamp': {
+      const entry = terminals.get(msg.sessionId);
+      if (!entry) break;
+      const next = Math.max(0, Number(msg.rows) || 0);
+      if (Number(entry.emitClampRows || 0) === next) break; // no change → no keyframe churn
+      entry.emitClampRows = next;
+      if (_stateSyncEmitter) {
+        if (_stateSyncFramesSuppressed(msg.sessionId)) _stateSyncMarkHiddenDirty(msg.sessionId);
+        else _stateSyncEmitter.onKeyframeReq(msg.sessionId, {});
+      }
+      break;
+    }
+
     // Option B: client confirmed it applied frame `seq` (no-op when state-sync is off).
     case 'ack': {
       if (_stateSyncEmitter) _stateSyncEmitter.onAck(msg.sessionId, Number(msg.seq || 0));
@@ -946,8 +964,18 @@ function extractGrid(sessionId, opts) {
   if (!length || !viewportRows) return { cols: Number(term.cols || 0), rows: 0, rowAnsi: [], baseRow: 0 };
   const scrollbackRows = Math.max(0, Number(opts && opts.scrollbackRows) || 0);
   const baseY = Math.max(0, Number(buf.baseY || 0));
-  const start = Math.max(0, baseY - scrollbackRows);
+  // Bottom-anchor clamp: while a primary rows-only SHRINK resize is HELD (StreamResizePolicy flap-hold),
+  // the PTY/mirror stays TALLER than the already-shrunk client. A top-aligned full-height frame would push
+  // the agent's bottom-pinned composer past the client's last row, where every CUP write clamps onto it and
+  // the composer renders blank. Emit only the BOTTOM `emitClampRows` viewport rows so the composer is always
+  // inside the frame and the (matching-height) client paints it 1:1. Sacrifices the top (held-delta) viewport
+  // rows for the turn; the held resize reconciles them on apply (keyframe). 0 / >= viewportRows ⇒ no clamp.
+  // Only narrows the LIVE viewport window (scrollbackRows === 0) — snapshot/scrollback extraction is untouched.
+  const clampRows = Math.max(0, Number(entry.emitClampRows || 0));
+  const topTrim = (scrollbackRows === 0 && clampRows > 0 && clampRows < viewportRows) ? (viewportRows - clampRows) : 0;
   const end = Math.min(length - 1, baseY + viewportRows - 1);
+  let start = Math.max(0, baseY + topTrim - scrollbackRows);
+  if (start > end) start = Math.max(0, baseY - scrollbackRows); // defensive: never invert the range
   const rowAnsi = [];
   for (let r = start; r <= end; r++) {
     rowAnsi.push(serializeRow(buf.getLine(r), term.cols));

package/template/claude-task-manager/lib/state-sync/emit-clamp.js

@@ -0,0 +1,32 @@
+'use strict';
+// Option B state-sync — bottom-anchor emit clamp decision (server side).
+//
+// While a primary rows-only SHRINK resize is HELD mid-stream (StreamResizePolicy flap-hold), the PTY/mirror
+// stays TALLER than the already-shrunk client. A top-aligned full-height frame then positions the agent's
+// bottom-pinned composer at rows past the client's last row, where xterm CUP-clamps every write onto the
+// bottom row and the composer renders BLANK (the "running Claude composer is blank, reflow won't fix" bug).
+// The fix bottom-anchors the worker's emitted grid to the held target height so the composer stays inside
+// the frame; this predicate decides the clamp value from the PTY + held-resize dims.
+//
+// Returns the clampRows (the held target row count) when a bottom-anchor clamp should be engaged, else 0
+// (no clamp / full viewport). Engages ONLY for the rows-only shrink signature:
+//   - a resize is held (pend present, positive dims), AND
+//   - cols are unchanged (a cols change is a real resize handled promptly via width arbitration — never
+//     bottom-anchor it), AND
+//   - the held target is strictly SHORTER than the current PTY (a GROW is the client-taller / orphan-rows
+//     case, compensated on the client, not here).
+// Fail-safe: any non-finite / non-positive input ⇒ 0 (no clamp).
+function bottomAnchorClampRows(opts) {
+  const o = opts || {};
+  const ptyCols = Number(o.ptyCols);
+  const ptyRows = Number(o.ptyRows);
+  const pendCols = Number(o.pendCols);
+  const pendRows = Number(o.pendRows);
+  if (![ptyCols, ptyRows, pendCols, pendRows].every(Number.isFinite)) return 0;
+  if (ptyCols <= 0 || ptyRows <= 0 || pendCols <= 0 || pendRows <= 0) return 0;
+  if (pendCols !== ptyCols) return 0;   // cols change ⇒ real resize, not the chrome-flap shrink
+  if (pendRows >= ptyRows) return 0;     // grow / equal ⇒ nothing to bottom-anchor
+  return pendRows;
+}
+
+module.exports = { bottomAnchorClampRows };

package/template/claude-task-manager/lib/state-sync/frame-emitter.js

@@ -105,7 +105,7 @@ function createFrameEmitter(deps) {
     const cursorMoved = !cursorsEqual(grid.cursor, s.ackedGrid && s.ackedGrid.cursor);
     if (!force && !cursorMoved && gridsEqual(grid, s.ackedGrid)) return false; // nothing changed since last applied frame
     const patch = computeAnsiPatch(force ? EMPTY_GRID : s.ackedGrid, grid);
-    if (patch.changedRows === 0 && !force && !cursorMoved) return false;
+    if (!patch.ansi && !force && !cursorMoved) return false;
     s.seq += 1;
     noteEmit(s.fr, t);
     s.dirty = false;

package/template/claude-task-manager/lib/walle-ctm-history.js

@@ -398,8 +398,27 @@ function compactWalleToolCallSummary(call = {}) {
   return summary ? `${head}: ${summary}` : head;
 }
 
+function turnActivityCalls(toolCalls = [], sawThinking = false, completed = false) {
+  const calls = Array.isArray(toolCalls) ? cloneToolCalls(toolCalls).filter(Boolean) : [];
+  if (sawThinking && !calls.some((call) => call && (call.name === 'think' || call.tool === 'think'))) {
+    calls.unshift({
+      name: 'think',
+      tool: 'think',
+      summary: completed ? 'Reasoning step completed' : 'Wall-E is thinking',
+      status: completed ? 'done' : 'working',
+      output: '',
+    });
+  }
+  if (completed) {
+    for (const call of calls) {
+      if (call && (!call.status || call.status === 'working')) call.status = 'done';
+    }
+  }
+  return calls;
+}
+
 function openTurnActivityMessage(toolCalls = [], sawThinking = false, timestamp = '') {
-  const calls = Array.isArray(toolCalls) ? toolCalls.filter(Boolean) : [];
+  const calls = turnActivityCalls(toolCalls, sawThinking, false);
   if (!sawThinking && calls.length === 0) return null;
   const lines = ['Wall-E is working on this prompt.'];
   const visibleCalls = calls.slice(-6);
@@ -413,6 +432,12 @@ function openTurnActivityMessage(toolCalls = [], sawThinking = false, timestamp
     role: 'system',
     content: lines.join('\n'),
     timestamp,
+    // Stamp a uuid on this synthesized live-activity row (it has no backing jsonl
+    // record) so EVERY displayed message carries a uuid. Without it, the client's
+    // all-or-nothing uuid gate used to disable the branch pager for the whole session
+    // whenever an open turn was present. It threads to its linear predecessor on the
+    // client (no parentUuid), and is replaced on the next durable reload.
+    uuid: `walle-open-turn-${timestamp || 'live'}`,
     toolCalls: calls.length
       ? cloneToolCalls(calls)
       : [{ name: 'think', tool: 'think', summary: 'Wall-E is thinking', status: 'working' }],
@@ -422,6 +447,27 @@ function openTurnActivityMessage(toolCalls = [], sawThinking = false, timestamp
   };
 }
 
+function completedTurnActivityMessage(toolCalls = [], sawThinking = false, timestamp = '', key = '') {
+  const calls = turnActivityCalls(toolCalls, sawThinking, true);
+  if (!sawThinking && calls.length === 0) return null;
+  const lines = ['Wall-E activity log for this prompt.'];
+  const visibleCalls = calls.slice(-8);
+  if (visibleCalls.length) {
+    for (const call of visibleCalls) lines.push(`- ${compactWalleToolCallSummary(call)}`);
+    if (calls.length > visibleCalls.length) lines.push(`- +${calls.length - visibleCalls.length} earlier activities`);
+  }
+  return {
+    role: 'system',
+    content: lines.join('\n'),
+    timestamp,
+    uuid: `walle-completed-turn-${key || timestamp || 'activity'}`,
+    toolCalls: calls,
+    liveActivity: true,
+    agentLabel: 'Wall-E',
+    metadata: { source: 'walle-completed-turn-activity', completed: true },
+  };
+}
+
 function terminalBoundaryMessageFromEntry(entry) {
   if (!entry || typeof entry !== 'object') return null;
   const type = String(entry.type || '').trim();
@@ -597,6 +643,11 @@ function readWalleCtmHistory(filePath) {
   let openTurnHasUser = false;
   let pendingAssistantText = '';
   let pendingAssistantTimestamp = '';
+  // A coding_summary part is written just BEFORE the turn's final assistant entry
+  // (the event fires right before `done`), so buffer it and stamp it onto that
+  // assistant message when it's pushed. Also attached to the last assistant at EOF
+  // for the rare case the part trails the assistant entry.
+  let pendingCodingSummary = null;
   // Durable approval cards: a permission_request part becomes a card message; a
   // later permission_resolved part marks that same card resolved (so a reload
   // shows an answered request as resolved, and a still-pending one as actionable).
@@ -607,14 +658,27 @@ function readWalleCtmHistory(filePath) {
   const parentByUuid = Object.create(null);
   let pendingAssistantUuid = '';
   let pendingAssistantParent = null;
+  let syntheticActivityOrdinal = 0;
+  const pushCompletedTurnActivity = (toolCalls, sawThinking, timestamp, key) => {
+    const activity = completedTurnActivityMessage(
+      toolCalls,
+      sawThinking,
+      timestamp,
+      `${key || 'turn'}-${syntheticActivityOrdinal++}`
+    );
+    if (!activity) return false;
+    messages.push(activity);
+    return true;
+  };
   const flushPendingAssistantText = (options = {}) => {
     const content = normalizeWalleDisplayContent(pendingAssistantText);
     if (!content) { pendingAssistantUuid = ''; pendingAssistantParent = null; return false; }
-    messages.push({
+    const assistantToolCalls = cloneToolCalls(pendingToolCalls);
+    const assistantMessage = {
       role: 'assistant',
       content,
       timestamp: pendingAssistantTimestamp || openTurnActivityTimestamp || 0,
-      toolCalls: cloneToolCalls(pendingToolCalls),
+      toolCalls: assistantToolCalls,
       uuid: pendingAssistantUuid || undefined,
       parentUuid: pendingAssistantParent != null ? pendingAssistantParent : undefined,
       metadata: {
@@ -622,7 +686,16 @@ function readWalleCtmHistory(filePath) {
         partial: options.partial !== false,
         boundary: options.boundary || '',
       },
-    });
+    };
+    if (pushCompletedTurnActivity(
+      assistantToolCalls,
+      openTurnSawThinking,
+      assistantMessage.timestamp,
+      pendingAssistantUuid || assistantMessage.timestamp || 'text'
+    )) {
+      assistantMessage.metadata.activityLogged = true;
+    }
+    messages.push(assistantMessage);
     pendingAssistantText = '';
     pendingAssistantTimestamp = '';
     pendingAssistantUuid = '';
@@ -721,6 +794,14 @@ function readWalleCtmHistory(filePath) {
       }
       continue;
     }
+    if (entry.type === 'walle_part' && entry.partType === 'coding_summary') {
+      // Buffer it — the assistant entry it belongs to is written NEXT. Stored under
+      // metadata.codingSummary (not a top-level field) so it survives the durable DB
+      // row store, which persists `metadata` but not arbitrary message fields
+      // (db._messageRowMeta).
+      pendingCodingSummary = entry.data && typeof entry.data === 'object' ? entry.data : {};
+      continue;
+    }
     const textPart = walleTextPartContent(entry);
     if (textPart) {
       if (!pendingAssistantUuid && entry.uuid) {
@@ -783,7 +864,7 @@ function readWalleCtmHistory(filePath) {
         openTurnHasUser = false;
         continue;
       }
-      messages.push({
+      const assistantMessage = {
         role: 'assistant',
         content: candidateContent,
         model: entry.message?.model || entry.model || entry.modelId || '',
@@ -792,7 +873,20 @@ function readWalleCtmHistory(filePath) {
         uuid: entry.uuid || undefined,
         parentUuid: entry.parentUuid != null ? entry.parentUuid : undefined,
         toolCalls: dedupeToolCallsById(Array.isArray(entry.toolCalls) ? cloneToolCalls(entry.toolCalls) : cloneToolCalls(pendingToolCalls)),
-      });
+      };
+      if (pushCompletedTurnActivity(
+        assistantMessage.toolCalls,
+        openTurnSawThinking,
+        assistantMessage.timestamp,
+        entry.uuid || entry.timestamp || 'assistant'
+      )) {
+        assistantMessage.metadata = Object.assign({}, assistantMessage.metadata, { activityLogged: true });
+      }
+      if (pendingCodingSummary) {
+        assistantMessage.metadata = Object.assign({}, assistantMessage.metadata, { codingSummary: pendingCodingSummary });
+        pendingCodingSummary = null;
+      }
+      messages.push(assistantMessage);
       pendingToolCalls = [];
       openTurnSawThinking = false;
       openTurnActivityTimestamp = '';
@@ -800,6 +894,17 @@ function readWalleCtmHistory(filePath) {
     }
   }
   flushPendingAssistantText({ boundary: 'eof' });
+  // Rare: a coding_summary part that trailed the assistant entry (or whose turn
+  // ended without a fresh assistant push) — stamp it onto the last assistant.
+  if (pendingCodingSummary) {
+    for (let k = messages.length - 1; k >= 0; k--) {
+      if (messages[k] && messages[k].role === 'assistant') {
+        messages[k].metadata = Object.assign({}, messages[k].metadata, { codingSummary: pendingCodingSummary });
+        break;
+      }
+    }
+    pendingCodingSummary = null;
+  }
   const openActivity = openTurnHasUser
     ? openTurnActivityMessage(pendingToolCalls, openTurnSawThinking, openTurnActivityTimestamp)
     : null;
@@ -1041,6 +1146,10 @@ function cloneMessage(message) {
   if (message?.metadata) {
     try { out.metadata = JSON.parse(JSON.stringify(message.metadata)); } catch { out.metadata = message.metadata; }
   }
+  if (message?.codingSummary) {
+    // Whitelist clone — carry the pinned summary-card payload through the merge.
+    try { out.codingSummary = JSON.parse(JSON.stringify(message.codingSummary)); } catch { out.codingSummary = message.codingSummary; }
+  }
   if (message?.runtimeDiagnostic) {
     try { out.runtimeDiagnostic = JSON.parse(JSON.stringify(message.runtimeDiagnostic)); } catch { out.runtimeDiagnostic = message.runtimeDiagnostic; }
   }

package/template/claude-task-manager/public/css/walle-session.css

@@ -179,11 +179,13 @@
   flex: 0 1 auto;
   min-width: 3ch;
 }
+/* cwd · msgs meta now LEADS the right-aligned control cluster (no title/icon on
+   the left — CTM-faithful), so it centre-aligns against the 24px chip/nav/⋯. */
 .walle-session-header .session-meta {
   font-size: 12px;
   color: var(--fg-dim, #565f89);
   display: flex;
-  align-items: baseline;
+  align-items: center;
   gap: 6px;
   min-width: 0;
   flex: 0 1 auto;
@@ -1187,6 +1189,12 @@ body.walle-composer-resizing {
   display: grid;
   gap: 5px;
   margin-top: 7px;
+  /* Append-only progress log (WS1): show every step, but cap the panel height and
+     scroll internally (pinned to the newest step) so a long turn reads like a
+     scrollback without pushing the composer off-screen. */
+  max-height: 340px;
+  overflow-y: auto;
+  overscroll-behavior: contain;
 }
 .walle-live-activity-item {
   display: block;
@@ -2620,3 +2628,51 @@ html[data-theme="light"] .walle-error-details pre {
 html[data-theme="light"] .walle-image-viewer {
   background: var(--overlay-bg);
 }
+
+/* ── Coding summary card (WS2) ─────────────────────────────────────────────
+   Deterministic, actionable wrap-up pinned atop a completed coding turn. Built
+   by MR.renderCodingSummaryHtml; data from coding-run-controller buildCodingSummary. */
+.coding-summary-card{
+  border:1px solid var(--border,#3b4261);border-radius:10px;
+  background:var(--bg-card,#24283b);
+  margin:8px 0 12px;overflow:hidden;
+  box-shadow:0 3px 12px rgba(0,0,0,.22);
+}
+.coding-summary-card .csum-top{
+  display:flex;align-items:center;gap:9px;padding:9px 13px;
+  border-bottom:1px solid var(--border,#3b4261);
+  background:linear-gradient(180deg,rgba(122,162,247,.07),transparent);
+}
+.coding-summary-card .csum-badge{
+  font-size:11px;font-weight:700;letter-spacing:.02em;padding:3px 9px;border-radius:999px;
+}
+.coding-summary-card .csum-badge.changed{background:rgba(224,175,104,.16);color:#e0af68;border:1px solid rgba(224,175,104,.4)}
+.coding-summary-card .csum-badge.ok{background:rgba(158,206,106,.16);color:#9ece6a;border:1px solid rgba(158,206,106,.4)}
+.coding-summary-card .csum-badge.err{background:rgba(247,118,142,.16);color:#f7768e;border:1px solid rgba(247,118,142,.42)}
+.coding-summary-card .csum-verify{font-size:11px;font-weight:600}
+.coding-summary-card .csum-verify.ok{color:#9ece6a}
+.coding-summary-card .csum-verify.warn{color:#787c99}
+.coding-summary-card .csum-sec{padding:9px 13px;border-bottom:1px solid var(--border,#3b4261)}
+.coding-summary-card .csum-sec:last-child{border-bottom:0}
+.coding-summary-card .csum-lbl{
+  font-size:10px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;
+  color:var(--fg-dim,#565f89);margin-bottom:6px;
+}
+.coding-summary-card .csum-file{display:flex;align-items:baseline;gap:8px;
+  font-family:var(--mono,ui-monospace,Menlo,monospace);font-size:12.5px;padding:1.5px 0}
+.coding-summary-card .csum-mk{color:#9ece6a;flex:0 0 auto}
+.coding-summary-card .csum-path{color:#7dcfff;word-break:break-all}
+.coding-summary-card .csum-runbox{
+  background:var(--bg,#1a1b26);border:1px solid var(--border,#3b4261);border-radius:7px;
+  padding:8px 10px;font-family:var(--mono,ui-monospace,Menlo,monospace);font-size:12px;
+}
+.coding-summary-card .csum-url{margin-bottom:3px}
+.coding-summary-card .csum-url a{color:#7dcfff;text-decoration:none}
+.coding-summary-card .csum-url a:hover{text-decoration:underline}
+.coding-summary-card .csum-cwd{color:var(--fg-dim,#565f89)}
+.coding-summary-card .csum-note{color:var(--fg,#c0caf5)}
+.coding-summary-card .csum-source{padding:2px 0;word-break:break-word}
+.coding-summary-card .csum-source-tool{color:#bb9af7;font-weight:700}
+.coding-summary-card .csum-source-detail{color:var(--fg,#c0caf5)}
+html[data-theme="light"] .coding-summary-card{background:#fff}
+html[data-theme="light"] .coding-summary-card .csum-runbox{background:#f4f5fb}

package/template/claude-task-manager/public/index.html

@@ -4200,6 +4200,19 @@
   #tabbar-session-controls .session-toolbar {
     background: transparent; border-bottom: none; padding: 0; z-index: auto;
   }
+  /* Wall-E coding sessions hoist their whole `.walle-session-header` here (same
+     reparent as the Claude/Codex `.session-toolbar` above). Shed the full-width
+     band chrome — background, bottom border, 44px min-height, padding — so it
+     reads as an inline control cluster (cwd · msgs · model chip · nav · ⋯) on
+     the tab strip instead of a band. The inner `.walle-header-right` already
+     carries the chip/nav styling. */
+  #tabbar-session-controls .walle-session-header {
+    background: transparent; border-bottom: none; border-top: none;
+    padding: 0; min-height: 0; height: 100%; gap: 0; flex: 0 0 auto;
+  }
+  #tabbar-session-controls .walle-session-header .walle-header-right { margin-left: 0; }
+  /* The cwd · msgs meta is a touch smaller/dimmer on the dense tab strip. */
+  #tabbar-session-controls .walle-session-header .session-meta { font-size: 11px; }
   .session-toolbar-btn .tb-label { margin-left: 4px; }
   /* Compact density to match the approved mock: when merged onto the tab strip,
      Reflow shows icon-only and the view toggle abbreviates to Term | Conv. The
@@ -39903,7 +39916,7 @@ function _disposeSessionClientSurface(s) {
   try {
     const sid = (s && s._id) || (s && s.container && s.container.dataset && s.container.dataset.sessionId) || '';
     const slot = sid && document.getElementById('tabbar-session-controls');
-    const parked = slot && slot.querySelector(':scope > .session-toolbar[data-session-id="' + sid + '"]');
+    const parked = slot && slot.querySelector(':scope > .session-toolbar[data-session-id="' + sid + '"], #tabbar-session-controls > .walle-session-header[data-session-id="' + sid + '"]');
     if (parked) parked.remove();
   } catch {}
 }
@@ -43044,6 +43057,22 @@ function renderTabs(force) {
 // (model · view toggle · reflow · ⋯) onto the right edge of the tab strip so the
 // chrome reads as one row. In split view, restore each toolbar to its own pane.
 // Idempotent + cheap; safe to call from renderTabs / split layout changes.
+// A session's hoistable toolbar lives in a different container per agent type:
+//   - Claude/Codex/OpenCode: <.term-container data-session-id> > .session-toolbar
+//   - Wall-E coding:          <#walle-session-ID>             > .walle-session-header
+// These two helpers paper over that so the hoist logic is agent-agnostic and
+// Wall-E sessions get their controls on the tab strip exactly like the rest.
+function _hoistHomeContainer(sid) {
+  if (!sid) return null;
+  return document.querySelector('.term-container[data-session-id="' + sid + '"]')
+      || document.getElementById('walle-session-' + sid);
+}
+function _hoistToolbarIn(cont) {
+  if (!cont) return null;
+  return cont.querySelector(':scope > .session-toolbar')
+      || cont.querySelector(':scope > .walle-session-header');
+}
+
 function _syncTabbarSessionControls() {
   const slot = document.getElementById('tabbar-session-controls');
   if (!slot) return;
@@ -43055,9 +43084,9 @@ function _syncTabbarSessionControls() {
   // prefer its container's own child, else a copy already parked in the slot.
   let keep = null;
   if (activeId) {
-    const activeCont = document.querySelector('.term-container[data-session-id="' + activeId + '"]');
-    keep = (activeCont && activeCont.querySelector(':scope > .session-toolbar'))
-        || slot.querySelector(':scope > .session-toolbar[data-session-id="' + activeId + '"]');
+    keep = _hoistToolbarIn(_hoistHomeContainer(activeId))
+        || slot.querySelector(':scope > .session-toolbar[data-session-id="' + activeId + '"]')
+        || slot.querySelector(':scope > .walle-session-header[data-session-id="' + activeId + '"]');
   }
   // Evict every parked toolbar except the one we keep: restore it to its own pane if
   // that pane has no toolbar of its own, otherwise drop it. This clears both orphans
@@ -43067,8 +43096,8 @@ function _syncTabbarSessionControls() {
   Array.prototype.slice.call(slot.children).forEach((tb) => {
     if (tb === keep) return;
     const sid = tb && tb.dataset ? tb.dataset.sessionId : '';
-    const cont = sid ? document.querySelector('.term-container[data-session-id="' + sid + '"]') : null;
-    const paneHasOwnToolbar = !!(cont && cont.querySelector(':scope > .session-toolbar'));
+    const cont = _hoistHomeContainer(sid);
+    const paneHasOwnToolbar = !!_hoistToolbarIn(cont);
     if (cont && !paneHasOwnToolbar) cont.insertBefore(tb, cont.firstChild);
     else { try { slot.removeChild(tb); } catch {} }
   });
@@ -44437,9 +44466,9 @@ function showNewSessionModal() {
   // `custom`, which aren't LLM-branded surfaces.
   var agentDefs = [
     { id: 'claude:', name: 'Claude Code', sub: 'Anthropic', color: '#D97757', agent: 'claude', detect: 'claude' },
+    { id: 'codex:',  name: 'Codex', sub: 'OpenAI', color: '#22c55e', agent: 'codex', detect: 'codex' },
     { id: 'opencode:', name: 'OpenCode', sub: 'GLM 5.2', color: '#e0af68', agent: 'opencode', detect: 'opencode' },
     { id: 'walle:',  name: 'Wall-E', sub: 'Smart routing', color: '#f59e0b', agent: 'walle', detect: null },
-    { id: 'codex:',  name: 'Codex', sub: 'OpenAI', color: '#22c55e', agent: 'codex', detect: 'codex' },
     { id: 'cursor:', name: 'Cursor', sub: 'Anysphere', color: '#111827', accent: '#7aa2f7', agent: 'cursor', detect: 'cursor-agent' },
     { id: 'gemini:', name: 'Gemini CLI', sub: 'Google', color: '#3b82f6', agent: 'gemini', detect: 'gemini' },
     { id: 'shell:',  name: 'Shell', sub: 'Terminal', color: '#6b7280', icon: '$', detect: null },
@@ -52190,7 +52219,12 @@ function onDataChanged(msg) {
     // Reload current queue draft if viewing the same session
     const sid = getQpSessionId();
     if (sid) {
-      if (qpDraftSavePending(sid)) {
+      // Defer the reload while a save is in flight (avoid clobbering our own
+      // write) OR while an inline edit is open: loadQpDraftForSession resets
+      // qpEditingIdx and re-renders, which would close the editor mid-edit
+      // (e.g. right after pasting an image, whose upload echoes a draft-change
+      // broadcast back). The deferred reload runs when the edit ends.
+      if (qpDraftSavePending(sid) || qpEditingIdx >= 0) {
         qpDeferredDraftReloads.add(sid);
       } else {
         loadQpDraftForSession(sid);
@@ -54340,6 +54374,7 @@ function saveQpEdit(idx) {
   }
   qpEditingIdx = -1;
   renderQpItems();
+  qpProcessDeferredDraftReload();
 }
 
 async function syncQpItemToPrompt(promptId, title, content) {
@@ -54373,6 +54408,7 @@ function cancelQpEdit(idx) {
   }
   qpEditingIdx = -1;
   renderQpItems();
+  qpProcessDeferredDraftReload();
 }
 
 async function qpUploadImageBlob(blob, filename) {
@@ -54835,6 +54871,22 @@ function clearQpItems() {
   renderQpItems();
 }
 
+// Run any draft reload that was deferred while an inline edit was open. Draft
+// changes (our own image-paste save echo, or an external edit) are held back
+// during an edit so they can't reset qpEditingIdx and close the editor; this
+// flushes the held reload once the edit ends. A no-op while still editing, or
+// when a save is in flight (that save's completion runs the reload itself).
+function qpProcessDeferredDraftReload() {
+  if (qpEditingIdx >= 0) return;
+  const sid = qpCurrentSession;
+  if (!sid) return;
+  if (qpDraftSavePending(sid)) return;
+  if (qpDeferredDraftReloads.has(sid)) {
+    qpDeferredDraftReloads.delete(sid);
+    if (!qpDraftLoading) loadQpDraftForSession(sid);
+  }
+}
+
 function saveQpDraft() {
   const sessionId = qpCurrentSession;
   if (!sessionId) return Promise.resolve();
@@ -54871,6 +54923,12 @@ function saveQpDraft() {
       }
       qpDraftSavePendingCounts.delete(sessionId);
       if (qpDeferredDraftReloads.has(sessionId)) {
+        // Hold the deferred reload while an inline edit is open — reloading
+        // resets qpEditingIdx and re-renders, closing the editor mid-edit
+        // (the image-paste case: the upload's draft-save echo would otherwise
+        // close the editor). It runs from qpProcessDeferredDraftReload() once
+        // the edit ends.
+        if (qpEditingIdx >= 0) return;
         qpDeferredDraftReloads.delete(sessionId);
         if (sessionId === qpCurrentSession && !qpDraftLoading) loadQpDraftForSession(sessionId);
       }

package/template/claude-task-manager/public/js/message-renderer.js

@@ -979,6 +979,93 @@
       + '</div>';
   };
 
+  // ------------------------------------------------------------------
+  // Coding summary card — a DETERMINISTIC, actionable wrap-up pinned above the
+  // model's prose for a completed Wall-E coding turn. Data is composed server-side
+  // (coding-run-controller buildCodingSummary): status · changed files (absolute
+  // paths) · localhost preview URLs. The model's Fixed/Unsolved/next-step prose
+  // renders below in the normal message body. Shared by Conversation + Review so
+  // the two surfaces can't drift (HARD RULE). Read-only answers still get a
+  // lightweight envelope so the user can see that no files changed and which
+  // activity/source inputs the answer used.
+  const _CSUM_STATUS = {
+    completed_with_changes: { label: 'Changed', cls: 'changed' },
+    completed_no_changes: { label: 'No file changes', cls: 'ok' },
+    read_only_answer: { label: 'Answered', cls: 'ok' },
+    blocked: { label: 'Blocked', cls: 'err' },
+    failed: { label: 'Failed', cls: 'err' },
+  };
+  MR.renderCodingSummaryHtml = function (s) {
+    if (!s || typeof s !== 'object') return '';
+    const files = Array.isArray(s.changedFiles) ? s.changedFiles : [];
+    const urls = Array.isArray(s.previewUrls) ? s.previewUrls : [];
+    const isProblem = s.status === 'blocked' || s.status === 'failed';
+    const isReadOnly = s.status === 'read_only_answer';
+    const activity = s.activity && typeof s.activity === 'object' ? s.activity : {};
+    const sources = Array.isArray(activity.sources) ? activity.sources : [];
+    const toolCount = Number(activity.toolCount || 0);
+    // Nothing actionable → no card, except read-only Wall-E coding turns where
+    // the absence of file changes is itself the useful completion state.
+    if (!files.length && !urls.length && !isProblem && !isReadOnly) return '';
+    const st = _CSUM_STATUS[s.status] || { label: s.status || 'Done', cls: 'ok' };
+    const verify = s.status === 'completed_with_changes'
+      ? (s.verified ? '<span class="csum-verify ok">verified</span>' : '<span class="csum-verify warn">unverified</span>')
+      : '';
+    let html = '<div class="coding-summary-card" role="group" aria-label="Coding summary">'
+      + '<div class="csum-top">'
+      + '<span class="csum-badge ' + st.cls + '">' + escHtml(st.label) + '</span>'
+      + verify
+      + '</div>';
+    if (files.length) {
+      html += '<div class="csum-sec"><div class="csum-lbl">What changed · '
+        + files.length + (files.length === 1 ? ' file' : ' files') + '</div><div class="csum-files">';
+      for (const f of files) {
+        const p = f && (f.abs || f.path) ? (f.abs || f.path) : String(f || '');
+        html += '<div class="csum-file"><span class="csum-mk">•</span>'
+          + '<span class="csum-path">' + escHtml(p) + '</span></div>';
+      }
+      html += '</div></div>';
+    } else if (isReadOnly) {
+      html += '<div class="csum-sec"><div class="csum-lbl">What changed</div><div class="csum-runbox">'
+        + '<div class="csum-note">No files changed. Wall-E delivered an answer only.</div>'
+        + '</div></div>';
+    }
+    if (sources.length) {
+      html += '<div class="csum-sec"><div class="csum-lbl">Sources checked · '
+        + sources.length + (sources.length === 1 ? ' item' : ' items') + '</div><div class="csum-runbox">';
+      for (const source of sources) {
+        const tool = source && source.tool ? source.tool : 'tool';
+        const detail = source && source.detail ? source.detail : '';
+        html += '<div class="csum-source"><span class="csum-source-tool">' + escHtml(tool) + '</span>'
+          + (detail ? '<span class="csum-source-detail"> — ' + escHtml(detail) + '</span>' : '')
+          + '</div>';
+      }
+      if (toolCount > sources.length) {
+        html += '<div class="csum-cwd">+' + escHtml(String(toolCount - sources.length)) + ' additional activity '
+          + (toolCount - sources.length === 1 ? 'step' : 'steps') + '</div>';
+      }
+      html += '</div></div>';
+    } else if (isReadOnly && toolCount > 0) {
+      html += '<div class="csum-sec"><div class="csum-lbl">Activity checked</div><div class="csum-runbox">'
+        + '<div class="csum-note">' + escHtml(String(toolCount)) + ' activity '
+        + (toolCount === 1 ? 'step' : 'steps') + ' recorded.</div></div></div>';
+    }
+    if (urls.length) {
+      html += '<div class="csum-sec"><div class="csum-lbl">Run &amp; test</div><div class="csum-runbox">';
+      for (const u of urls) {
+        html += '<div class="csum-url">▸ <a href="' + escHtml(u) + '" target="_blank" rel="noopener noreferrer">'
+          + escHtml(u) + '</a></div>';
+      }
+      if (s.cwd) html += '<div class="csum-cwd">cwd: ' + escHtml(s.cwd) + '</div>';
+      html += '</div></div>';
+    } else if ((files.length || isReadOnly) && s.cwd) {
+      html += '<div class="csum-sec"><div class="csum-lbl">Where</div><div class="csum-runbox">'
+        + '<div class="csum-cwd">cwd: ' + escHtml(s.cwd) + '</div></div></div>';
+    }
+    html += '</div>';
+    return html;
+  };
+
   // ------------------------------------------------------------------
   // Tool cards: one collapsible card per tool/shell/patch/web-search call,
   // its result filled in (paired by metadata.callId at render time on the