create-pmos 0.38.7 → 0.39.0

package/workspace/public/pm/modes-live.js

@@ -156,6 +156,23 @@ export function portfolioList() {
   return [el('div', { style: 'padding:2px 0 8px' }, kids)];
 }
 
+/* ── the user guide (status-clarity R6): pages that ship with the app, opened read-only in a doc tab ───────────── */
+async function openGuide(pg) {
+  const ini = await import('./panel-initiatives.js');
+  ini.openTab({ id: 'guide:' + pg.page, kind: 'doc', title: pg.title || pg.page, guide: true, readonly: true, path: pg.page, slug: null, repo: state.product || null, role: 'GUIDE' });
+}
+export function guideList() {
+  const r = read('guide', '/api/guide');
+  const st = status(r, 'the guide');
+  if (st) return [st];
+  const pages = (r.data && r.data.pages) || [];
+  if (!pages.length) return [el('div', { style: NOTE, 'data-r18': 'guide-empty' }, iv('The guide has no pages in this install.'))];
+  return [el('div', { style: 'padding:2px 0 8px', 'data-r18': 'guide-list' },
+    el('div', { style: NOTE }, iv('How this workspace works. These pages ship with the app and are updated with it.')),
+    pages.map((pg) => el('button', { onClick: () => openGuide(pg), style: ROW, hover: 'background:var(--accent)', 'data-r18': 'guide-page', 'data-page': pg.page },
+      el('span', { style: 'font-size:12.5px' }, iv(pg.title)))))];
+}
+
 /* ── D71 — set up the recommended schedules for the selected repository, on a press ───────────── */
 let seedNote = null;
 function seedRow(set, label, hint) {
@@ -392,6 +409,25 @@ async function openSkillTab(sk) {
   const ini = await import('./panel-initiatives.js');
   ini.openTab({ id: 'skill:' + sk.id, kind: 'skill', title: sk.label || sk.skill || sk.id, skillId: sk.id, repo: state.product || null, slug: null, role: 'SKILL' });
 }
+/** The body of a conversation tab (panel 4): one recorded conversation, read-only. The text is the live session's, or
+ * the saved record once the session has ended; the line above it says where it is kept. */
+export function mountTranscriptTab(host, tab) {
+  const r = read('conv:' + tab.convId, '/api/transcript?id=' + encodeURIComponent(tab.convId || ''));
+  const st = status(r, 'this conversation');
+  const kids = [];
+  if (st) kids.push(st);
+  else {
+    const d = r.data;
+    kids.push(el('div', { 'data-r16': 'transcript-head', style: 'padding:12px 14px 4px;font-size:11.5px;color:var(--muted-foreground)' },
+      iv((d.live ? 'live — ' : 'ended — ') + (d.name || d.id) + (d.initiative ? ' · initiative ' + d.initiative : '') + (d.cut ? ' · the start was cut (long session)' : '') + ' · ' + (d.stored || ''))));
+    kids.push(el('button', { style: BTN, hover: 'color:var(--foreground)', 'data-r16': 'transcript-refresh', onClick: () => { reload('conv:' + tab.convId); setState({}); } }, 'refresh'));
+    kids.push(el('pre', { 'data-r16': 'transcript-text', style: 'margin:0;padding:10px 14px 18px;font-family:var(--mono);font-size:11.5px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--foreground)' },
+      iv(d.text && d.text.trim() ? d.text : '(this conversation recorded no text)')));
+  }
+  setChildren(host, [el('div', { style: 'flex:1;min-height:0;overflow-y:auto;background:var(--background);color:var(--foreground)' }, kids)]);
+  return host;
+}
+
 /** The body of a skill tab (panel 4). Rebuilt on each paint, like the task tab; the draft lives in `skillDraft`. */
 export function mountSkillTab(host, tab) {
   const body = el('div', { style: 'flex:1;min-height:0;overflow-y:auto;background:var(--background);color:var(--foreground)' }, skillDetailLive({ kind: 'skill', id: tab.skillId, tab: true }));
@@ -489,3 +525,138 @@ export function knowledgeLive() {
   if (!trees.length && !notes.length) kids.push(el('div', { style: NOTE }, iv('No knowledge bundle in this repository — a successful read of nothing.')));
   return [el('div', { style: 'padding:2px 0 8px' }, kids)];
 }
+
+/* ── D79 — validate the selected repository with TypeSafe's Jev, on a press ───────────────────────────────────
+ * Four things on one page, in the order the PM meets them: the key (never shown again once saved), this
+ * repository's consent switch (off until the PM turns it on), the plan (what would be sent, before anything
+ * is) and the findings. A finding is advice with a confidence; nothing here edits a file, and a verdict is not
+ * an acceptance. The key is typed into a password field and sent once; no route returns it. */
+let vNote = null;          // { tone: 'ok'|'bad'|'mut', text }
+let vPlan = null;          // the last plan, for the repository it was made for
+let vBusy = false;
+const vSay = (tone, text) => { vNote = { tone, text }; setState({}); };
+const vWs = () => (dataMod && state.product ? dataMod.wsOf(state.product) : null);
+const TONE = { bad: 'var(--destructive)', ok: 'var(--foreground)', mut: 'var(--muted-foreground)' };
+
+async function vSaveKey(input) {
+  const key = input && input.value ? input.value : '';
+  if (!key.trim()) { vSay('bad', 'type or paste the key first'); return; }
+  const out = await fetch('/api/typesafe/key', { method: 'PUT', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ key }) }).then(readJson).catch((e) => ({ ok: false, error: e.message }));
+  if (input) input.value = '';
+  reload('typesafe'); reload('vrepo');
+  vSay(out && out.ok ? 'ok' : 'bad', out && out.ok ? 'the key is saved on this machine and is not shown again' : ((out && out.error) || 'the key was not saved'));
+}
+async function vClearKey() {
+  const out = await fetch('/api/typesafe/key', { method: 'DELETE' }).then(readJson).catch((e) => ({ ok: false, error: e.message }));
+  reload('typesafe'); reload('vrepo'); vPlan = null;
+  vSay(out && out.ok ? 'ok' : 'bad', out && out.ok ? 'the key is removed; nothing will be sent' : ((out && out.error) || 'the key was not removed'));
+}
+async function vConsent(on) {
+  const ws = vWs(); if (!ws) return vSay('bad', 'select a repository first');
+  const out = await post('/api/validate/repo', { ws, consent: on });
+  reload('vrepo'); vPlan = null;
+  vSay(out && out.ok ? 'ok' : 'bad', out && out.ok ? (on ? 'validation is on for this repository' : 'validation is off; nothing from this repository will be sent') : ((out && out.error) || 'not saved'));
+}
+async function vExclude(text) {
+  const ws = vWs(); if (!ws) return;
+  const exclude = String(text || '').split(/[\n,]/).map((x) => x.trim()).filter(Boolean);
+  const out = await post('/api/validate/repo', { ws, exclude });
+  reload('vrepo'); vPlan = null;
+  vSay(out && out.ok ? 'ok' : 'bad', out && out.ok ? 'excluded paths saved (' + exclude.length + ')' : ((out && out.error) || 'not saved'));
+}
+async function vMakePlan() {
+  const ws = vWs(); if (!ws) return vSay('bad', 'select a repository first');
+  vBusy = true; vSay('mut', 'working out what would be sent …');
+  const out = await post('/api/validate/plan', { ws });
+  vBusy = false;
+  if (!out || out.ok === false) { vPlan = null; return vSay('bad', (out && out.error) || 'no plan'); }
+  vPlan = { ws, plan: out.plan }; vSay('mut', 'review the plan, then confirm to send');
+}
+async function vRun() {
+  if (!vPlan) return;
+  vBusy = true; vSay('mut', 'validating … this sends text to ' + vPlan.plan.host);
+  const out = await post('/api/validate/run', { ws: vPlan.ws, expect_requests: vPlan.plan.requests });
+  vBusy = false; vPlan = null; reload('vfind');
+  if (!out || out.ok === false) return vSay('bad', (out && out.error) || 'the run failed');
+  vSay(out.aborted ? 'bad' : 'ok', 'asked ' + out.asked + ' of ' + out.requests + ' · ' + out.raised + ' raised · ' + out.local_findings + ' local · ' + out.withheld + ' withheld · ' + out.failed + ' failed' + (out.aborted ? ' — ' + out.aborted : ''));
+}
+
+export function validateList() {
+  const kids = [];
+  const k = read('typesafe', '/api/typesafe');
+  const ws = vWs();
+  const rp = ws ? read('vrepo', '/api/validate/repo?ws=' + encodeURIComponent(ws)) : null;
+  const fd = ws ? read('vfind', '/api/validate/findings?ws=' + encodeURIComponent(ws)) : null;
+  kids.push(el('div', { style: NOTE, 'data-r19': 'intro' }, iv('Checks this repository\'s documents for reliability, coherence and freshness. Local checks run first and send nothing. Text that needs judgement goes to TypeSafe (Jev), only after you switch it on for this repository and confirm what will be sent. Findings are advice; nothing is edited.')));
+
+  // 1 · the key
+  kids.push(el('div', { style: LABEL }, iv('1 · TypeSafe key')));
+  const st = status(k, 'the key status');
+  if (st) kids.push(st);
+  else {
+    const present = k.data && k.data.key && k.data.key.present;
+    const src = k.data && k.data.key && k.data.key.source;
+    kids.push(el('div', { style: NOTE, 'data-r19': 'key-status' }, iv(present
+      ? 'A key is set (' + (src === 'environment' ? 'from the environment' : 'saved on this machine') + '). It is never shown again and is never given to a terminal.'
+      : 'No key is set. Without a key nothing is sent.')));
+    const input = el('input', { type: 'password', autocomplete: 'off', spellcheck: 'false', placeholder: present ? 'replace the key' : 'paste your TypeSafe key', 'data-r19': 'key-input',
+      style: 'flex:1;min-width:0;font-family:var(--mono);font-size:11px;padding:4px 8px;border:1px solid var(--border);background:var(--background);color:var(--foreground);min-height:28px' });
+    kids.push(el('div', { style: 'display:flex;gap:4px;padding:0 14px 6px' }, input,
+      el('button', { style: BTN, hover: 'color:var(--foreground)', 'data-r19': 'key-save', onClick: () => vSaveKey(input) }, 'save'),
+      present && src === 'settings' ? el('button', { style: BTN, hover: 'color:var(--destructive)', 'data-r19': 'key-remove', onClick: vClearKey }, 'remove') : null));
+  }
+
+  // 2 · this repository
+  kids.push(el('div', { style: LABEL }, iv('2 · this repository' + (state.product ? ' · ' + state.product : ''))));
+  if (!ws) kids.push(el('div', { style: NOTE }, iv('Select a repository first.')));
+  else {
+    const rs = status(rp, 'this repository\'s validation setting');
+    if (rs) kids.push(rs);
+    else {
+      const on = !!(rp.data && rp.data.consent);
+      kids.push(el('div', { style: 'display:flex;gap:8px;align-items:center;padding:4px 14px' },
+        el('span', { style: 'font-size:12px', 'data-r19': 'consent-state' }, iv(on ? 'validation is ON for this repository' : 'validation is OFF — nothing from this repository is sent')),
+        el('button', { style: BTN + ';margin-left:auto', hover: 'color:var(--foreground)', 'data-r19': 'consent-toggle', onClick: () => vConsent(!on) }, on ? 'turn off' : 'turn on')));
+      const ta = el('textarea', { rows: 2, placeholder: 'paths never sent, one per line (e.g. private/ or notes/*.md)', 'data-r19': 'exclude-input',
+        style: 'width:calc(100% - 28px);margin:4px 14px 0;font-family:var(--mono);font-size:10.5px;padding:4px 8px;border:1px solid var(--border);background:var(--background);color:var(--foreground)' }, (rp.data.exclude || []).join('\n'));
+      kids.push(ta, el('div', { style: 'padding:4px 14px 6px' }, el('button', { style: BTN, hover: 'color:var(--foreground)', 'data-r19': 'exclude-save', onClick: () => vExclude(ta.value) }, 'save excluded paths')));
+    }
+  }
+
+  // 3 · plan and run
+  kids.push(el('div', { style: LABEL }, iv('3 · validate')));
+  kids.push(el('div', { style: 'padding:4px 14px 6px;display:flex;gap:6px;align-items:center;flex-wrap:wrap' },
+    el('button', { style: BTN, hover: 'color:var(--foreground)', disabled: vBusy ? 'true' : null, 'data-r19': 'plan', onClick: vMakePlan }, 'show what would be sent'),
+    vPlan && vPlan.ws === ws ? el('button', { style: BTN + ';color:var(--foreground);border-color:var(--foreground)', hover: 'background:var(--accent)', disabled: vBusy ? 'true' : null, 'data-r19': 'run', onClick: vRun }, 'confirm and send ' + vPlan.plan.requests + ' request(s)') : null));
+  if (vPlan && vPlan.ws === ws) {
+    const p = vPlan.plan;
+    kids.push(el('div', { style: NOTE, 'data-r19': 'plan-text' },
+      iv(p.requests + ' request(s), about ' + p.characters.toLocaleString() + ' characters, to ' + p.host + '. ' + p.eligible + ' of ' + p.documents + ' documents eligible · ' + p.excluded + ' excluded · ' + p.local_findings + ' local finding(s) that send nothing.')));
+    if (p.withheld.length) kids.push(el('div', { style: NOTE + ';color:var(--destructive)', 'data-r19': 'withheld' }, iv('Withheld, matched a credential pattern, will NOT be sent: ' + p.withheld.map((w) => w.file + ' (' + w.rules.join(', ') + ')').join('; '))));
+    if (p.too_large.length) kids.push(el('div', { style: NOTE }, iv('Too large to send: ' + p.too_large.join(', '))));
+  }
+  if (vNote) kids.push(el('div', { 'data-r19': 'note', style: NOTE + ';color:' + (TONE[vNote.tone] || TONE.mut) }, iv(vNote.text)));
+
+  // 4 · findings
+  const fs0 = fd ? status(fd, 'the findings') : null;
+  const run = fd && fd.data ? fd.data.run : null;
+  kids.push(el('div', { style: LABEL }, iv('4 · findings' + (run ? ' · last run ' + String(run.at).replace('T', ' ').slice(0, 16) + ' · model ' + (run.model || 'none') : ''))));
+  if (fs0) kids.push(fs0);
+  else if (!run) kids.push(el('div', { style: NOTE, 'data-r19': 'no-run' }, iv('No validation has run for this repository.')));
+  else {
+    kids.push(el('div', { style: NOTE, 'data-r19': 'coverage' }, iv('Coverage: ' + run.asked + ' of ' + run.requests + ' request(s) answered · ' + run.withheld + ' withheld · ' + run.too_large + ' too large · ' + run.excluded + ' excluded · ' + run.failed + ' failed. A short list is not a clean bill: read this line first.')));
+    const list = fd.data.findings || [];
+    if (!list.length) kids.push(el('div', { style: NOTE }, iv('The run raised nothing.')));
+    for (const f of list) {
+      const unsure = f.label === 'for-your-judgement';
+      kids.push(el('button', { style: ROW, hover: 'background:var(--accent)', 'data-r19': 'finding', 'data-rule': f.rule, title: f.question || f.detail || '',
+        onClick: () => openDocIn(ws, f.file, state.product) },
+        el('span', { style: 'display:flex;gap:8px;align-items:baseline' },
+          el('span', { style: 'font-family:var(--mono);font-size:10px;color:' + (f.severity === 'high' ? 'var(--destructive)' : 'var(--muted-foreground)') }, iv(f.severity)),
+          el('span', { style: 'font-size:12px' }, iv(f.rule.replace(/-/g, ' '))),
+          el('span', { style: 'margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--muted-foreground)' }, iv(f.kind === 'judged' ? (unsure ? 'for your judgement · ' : '') + 'confidence ' + (f.confidence == null ? '—' : f.confidence.toFixed(2)) : f.sent ? 'sent' : 'local'))),
+        el('span', { style: 'display:block;font-size:11px;color:var(--muted-foreground);overflow:hidden;text-overflow:ellipsis;white-space:nowrap' }, iv(f.files.join(' ↔ ') + (f.detail ? ' — ' + f.detail : '')))));
+    }
+  }
+  return [el('div', { style: 'padding:2px 0 8px', 'data-r19': 'validate' }, kids)];
+}

package/workspace/public/pm/modes.js

@@ -1044,6 +1044,8 @@ const LISTS = {
   skills: () => (FIXTURE ? skillsList() : LIVE.skillsLive()),
   knowledge: () => (FIXTURE ? knowledgeList() : LIVE.knowledgeLive()),
   portfolio: () => (FIXTURE ? [] : LIVE.portfolioList()),
+  guide: () => (FIXTURE ? [] : LIVE.guideList()),
+  validate: () => (FIXTURE ? [] : LIVE.validateList()),
   agent: agentsList,
   connect: connectList,
   memory: () => (FIXTURE ? memoryList() : LIVE.memoryLive()),
@@ -1060,6 +1062,29 @@ const BODIES = {
   intg: intgBody,
 };
 
+/* WHERE EACH THING OPENS (column-layout). A list or a directory (memory, skills, knowledge, scheduled tasks, focus,
+ * portfolio, the guide, the initiatives themselves) is drawn in the navigation column, under the repository list. A
+ * detail (an initiative, a skill, a schedule, a memory item) is drawn in the detail column. This table is the rule;
+ * a mode or a detail kind that is not in it is a failing test, so a new one has to say which column it opens in. */
+export const MODE_PLACE = {
+  lists: { product: 'navigation', focus: 'navigation', scheduled: 'navigation', workflow: 'navigation', skills: 'navigation',
+    knowledge: 'navigation', portfolio: 'navigation', guide: 'navigation', validate: 'navigation', agent: 'navigation', connect: 'navigation', memory: 'navigation' },
+  details: { init: 'detail', flow: 'detail', sched: 'detail', skill: 'detail', know: 'detail', agent: 'detail', mem: 'detail',
+    prof: 'detail', intg: 'detail', addprod: 'detail', bind: 'detail', new: 'detail', none: 'detail' },
+};
+/* WHAT A ROW IN EACH LIST OPENS, as the live app does it today. An initiative (from the board, the portfolio or the focus
+ * queue) opens in the detail column. A file-like row (a skill, a knowledge note, a guide page) opens in a TAB, like any
+ * other document, so it can sit beside a terminal. A schedule and a memory entry are acted on inside the list itself. */
+export const ROW_OPENS = {
+  product: 'detail', portfolio: 'detail', focus: 'detail',
+  skills: 'tab', knowledge: 'tab', guide: 'tab', validate: 'tab',
+  scheduled: 'list', memory: 'list',
+};
+/** The column a list mode opens in: always `navigation`. `null` for a mode this table does not know. */
+export const placeOfMode = (mode) => MODE_PLACE.lists[mode] || null;
+/** The column a detail kind opens in: always `detail`. `null` for a kind this table does not know. */
+export const placeOfDetail = (kind) => MODE_PLACE.details[kind] || null;
+
 /** Is `mode` one this module renders? `product` belongs to panel-initiatives.js. */
 export function hasMode(mode) {
   return Object.prototype.hasOwnProperty.call(LISTS, mode);

package/workspace/public/pm/next-step-ui.js

@@ -0,0 +1,185 @@
+/**
+ * next-step-ui.js — next-step-actions. What a next-step row can DO, drawn under the row.
+ *
+ * The act on each item (`it.act.type`) comes from the server; this module only draws it and carries out the PM's presses:
+ *   open       → the file the step names, in a document tab
+ *   session    → switch to the running session
+ *   work       → PREPARE (a read-only plan), then GO (start exactly that plan)
+ *   gate       → words only: acceptance and the contract approval are the PM's own act, so there is no button
+ *   lifecycle  → reopen
+ * After a session started from a step has ended, REVIEW shows what changed and takes the PM's verdict.
+ *
+ * Nothing here starts a session except the GO press, and GO sends the hash of the plan the PM was shown, so a prompt that
+ * changed in the meantime is refused by the server.
+ */
+import { el } from './dom.js';
+import { state, setState, FIXTURE } from './state.js';
+
+let dataMod = null;
+const dataReady = import('./data.js').then((m) => { dataMod = m; }).catch(() => { dataMod = null; });
+let iniMod = null;
+import('./panel-initiatives.js').then((m) => { iniMod = m; }).catch(() => { iniMod = null; });
+
+const LAB = 'font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-foreground)';
+const BTN = 'font-family:var(--mono);font-size:10px;padding:2px 7px;background:var(--secondary);border:1px solid var(--border);color:var(--foreground);cursor:pointer;min-height:24px';
+const GO = 'font-family:var(--mono);font-size:10.5px;padding:3px 10px;background:var(--brand);border:1px solid var(--brand);color:oklch(0.987 0.002 197.1);cursor:pointer;min-height:26px';
+const iv = (t) => el('span', null, t == null ? '' : String(t));
+
+/* per-item UI state, keyed by item id: { loading, plan, judgment, profile, note, summary } */
+const ui = Object.create(null);
+let profileList = null;
+const touch = () => setState((s) => ({ nsTick: (s.nsTick || 0) + 1 }));
+const slot = (id) => (ui[id] = ui[id] || { judgment: false, profile: '' });
+
+async function prepare(slug, it) {
+  const u = slot(it.id);
+  u.loading = true; u.note = null; touch();
+  await dataReady;
+  if (profileList === null) { const r = await dataMod.nextStepProfiles(); profileList = (r && r.profiles) || []; }
+  const out = await dataMod.nextStepPost('prepare', { initiative_id: slug, item_id: it.id, agent: 'claude', profile: u.profile || undefined, judgment: u.judgment });
+  u.loading = false;
+  u.plan = out && out.ok ? out : null;
+  if (!out || out.ok === false) u.note = { tone: 'bad', text: (out && out.error) || 'could not prepare' };
+  touch();
+}
+async function go(slug, it) {
+  const u = slot(it.id); const pl = u.plan;
+  if (!pl || !pl.prompt_sha) return;
+  u.loading = true; u.note = null; touch();
+  const out = await dataMod.nextStepPost('go', { initiative_id: slug, item_id: it.id, agent: 'claude', profile: u.profile || undefined, judgment: u.judgment, confirm: true, prompt_sha: pl.prompt_sha });
+  u.loading = false;
+  if (!out || out.ok === false) { u.note = { tone: 'bad', text: (out && out.error) || 'nothing was started' }; if (out && out.prompt_sha) u.plan = null; touch(); return; }
+  u.plan = null; u.note = { tone: 'ok', text: 'started — ' + (out.notice || out.plan.why || 'the session is running') };
+  if (iniMod && out.session) iniMod.openTerm(slug, { id: out.session.id, name: out.session.name, st: 'working' });
+  await dataMod.refreshInitiative(slug);
+  touch();
+}
+async function review(slug, it, verdict) {
+  const u = slot(it.id);
+  let note = '';
+  if (verdict === 'send-back') {
+    note = typeof window !== 'undefined' && window.prompt ? window.prompt('Send “' + (it.key || it.text) + '” back — what should change? (one line)', '') : '';
+    if (note === null || !String(note).trim()) return;
+  }
+  const out = await dataMod.nextStepPost('review', { session_id: it.run.session_id, verdict, note: String(note).trim() });
+  u.note = out && out.ok ? { tone: 'ok', text: verdict === 'accept' ? 'step accepted — the initiative is not accepted by this' : 'sent back with your note' } : { tone: 'bad', text: (out && out.error) || 'not recorded' };
+  await dataMod.refreshInitiative(slug);
+  touch();
+}
+async function loadSummary(it) {
+  const u = slot(it.id);
+  u.summary = { loading: true }; touch();
+  await dataReady;
+  const out = await dataMod.nextStepSummary(it.run.session_id);
+  u.summary = out && out.ok ? out : { error: (out && out.error) || 'could not read the session' };
+  touch();
+}
+
+const row = (kids) => el('div', { style: 'display:flex;gap:5px;flex-wrap:wrap;align-items:center;margin-top:3px' }, kids);
+const noteLine = (n) => (n ? el('span', { 'data-r21': 'note', style: 'font-size:11px;color:' + (n.tone === 'bad' ? 'var(--destructive)' : 'var(--muted-foreground)') }, iv(n.text)) : null);
+
+function planPanel(slug, it) {
+  const u = slot(it.id); const pl = u.plan;
+  if (!pl) return null;
+  if (pl.refused) {
+    return el('div', { 'data-r21': 'plan-refused', style: 'margin-top:4px;padding:6px 8px;border:1px solid var(--destructive);font-size:11.5px;line-height:1.5;color:var(--foreground)' },
+      el('span', { style: LAB + ';color:var(--destructive)' }, 'not now'), el('div', null, iv(pl.refused.why)));
+  }
+  const prof = (profileList || []);
+  const opt = (v, t, cur) => el('option', { value: v, selected: v === cur ? 'selected' : null }, t);
+  const where = pl.plan.plan === 'new-worktree' ? 'creates branch ' + pl.plan.branch + ' in its own folder' : pl.plan.plan === 'reuse-worktree' ? 'reuses the folder for ' + (pl.plan.branch || 'the initiative branch') : pl.plan.why;
+  const kids = [
+    el('span', { style: LAB }, 'plan — nothing has been created'),
+    el('div', { 'data-r21': 'plan-where', style: 'font-size:11.5px;line-height:1.5' }, iv(where + (pl.plan.dir ? ' · ' + pl.plan.dir : ''))),
+    pl.existing_sessions && pl.existing_sessions.length
+      ? el('div', { 'data-r21': 'plan-existing', style: 'font-size:11px;color:var(--muted-foreground)' }, iv('already running on this initiative: ' + pl.existing_sessions.map((x) => x.name).join(', ') + ' — go starts another one'))
+      : null,
+    pl.sources && pl.sources.length
+      ? el('div', { 'data-r21': 'plan-sources', style: 'font-size:11px;color:var(--muted-foreground)' }, iv('read-only sources it may name: ' + pl.sources.map((x) => x.label).join(', ')))
+      : el('div', { 'data-r21': 'plan-sources', style: 'font-size:11px;color:var(--muted-foreground)' }, iv(u.profile ? 'the profile declares no source that suits this step' : 'no profile chosen, so no outside source is named')),
+    el('div', { style: 'display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:11px' },
+      el('label', { style: 'display:flex;gap:4px;align-items:center' }, iv('profile'),
+        el('select', { 'data-r21': 'plan-profile', style: 'font-family:var(--mono);font-size:10.5px;background:var(--secondary);color:var(--foreground);border:1px solid var(--border)',
+          onChange: (e) => { u.profile = e.target.value; prepare(slug, it); } }, [opt('', 'none', u.profile), ...prof.map((p) => opt(p.id, p.label || p.id, u.profile))])),
+      el('label', { style: 'display:flex;gap:4px;align-items:center' },
+        el('input', { type: 'checkbox', 'data-r21': 'plan-judgment', checked: u.judgment ? 'checked' : null, onChange: (e) => { u.judgment = !!e.target.checked; prepare(slug, it); } }),
+        iv('use the Typesafe skill for categorising, scoring and yes/no'))),
+    el('div', { 'data-r21': 'plan-judgment-note', style: 'font-size:11px;color:' + (pl.judgment.on ? 'var(--warning)' : 'var(--muted-foreground)') }, iv(pl.judgment.note)),
+    el('span', { style: LAB + ';padding-top:4px' }, 'the exact first input the session will get'),
+    el('pre', { 'data-r21': 'plan-prompt', style: 'font-family:var(--mono);font-size:10.5px;line-height:1.5;white-space:pre-wrap;padding:6px 8px;background:var(--secondary);border:1px solid var(--border);margin:0;max-height:240px;overflow:auto' }, iv(pl.prompt)),
+    el('div', { 'data-r21': 'plan-budget', style: 'font-size:11px;color:' + (pl.budget.allowed ? 'var(--muted-foreground)' : 'var(--destructive)') },
+      iv(pl.budget.allowed ? `${pl.budget.running} of ${pl.budget.limits.concurrent} prepared sessions running · ${pl.budget.startedToday} of ${pl.budget.limits.perDay} started today` : pl.budget.reason)),
+    row([
+      el('button', { 'data-r21': 'go', style: GO + (pl.budget.allowed && !u.loading ? '' : ';opacity:.5'), disabled: pl.budget.allowed && !u.loading ? null : 'disabled', onClick: () => go(slug, it),
+        title: 'starts a session with exactly the input above. It proposes only: it will not push, send, accept or merge.' }, u.loading ? '…' : 'go — start the session'),
+      el('button', { 'data-r21': 'cancel', style: BTN, onClick: () => { u.plan = null; touch(); } }, 'cancel'),
+    ]),
+  ];
+  return el('div', { 'data-r21': 'plan', style: 'margin-top:4px;padding:6px 8px;border:1px solid var(--border);display:flex;flex-direction:column;gap:3px' }, kids);
+}
+
+function reviewPanel(slug, it) {
+  const u = slot(it.id); const s = u.summary; const run = it.run;
+  if (!run) return null;
+  const done = run.review;
+  const head = [];
+  // The record was read when the initiative was selected; the live session list is newer. A run the record calls live is
+  // ended as soon as the session list says the session has exited.
+  const cs = (state.sessions || []).find((x) => x && x.id === run.session_id);
+  const ended = run.state === 'ended' || !!(cs && cs.shown === 'exited');
+  if (!ended) {
+    head.push(el('span', { 'data-r21': 'run-live', style: 'font-size:11px;color:var(--muted-foreground)' }, iv('a session started from this step is running')));
+    head.push(el('button', { 'data-r21': 'switch', style: BTN, onClick: () => iniMod && iniMod.openTerm(slug, { id: run.session_id, name: it.key + ' · ' + slug }) }, 'switch to it'));
+  } else {
+    head.push(el('span', { 'data-r21': 'run-ended', style: 'font-size:11px;color:var(--muted-foreground)' }, iv('the session started from this step has ended')));
+    head.push(el('button', { 'data-r21': 'review-open', style: BTN, onClick: () => loadSummary(it) }, s ? 'refresh review' : 'review what it did'));
+  }
+  if (done) head.push(el('span', { 'data-r21': 'verdict', style: 'font-family:var(--mono);font-size:10px;color:' + (done.verdict === 'accept' ? 'var(--brand)' : 'var(--warning)') }, iv((done.verdict === 'accept' ? 'accepted' : 'sent back') + (done.note ? ' — ' + done.note : ''))));
+  const kids = [row(head)];
+  if (s && s.loading) kids.push(el('div', { style: 'font-size:11px;color:var(--muted-foreground)' }, 'reading …'));
+  if (s && s.error) kids.push(el('div', { 'data-r21': 'review-error', style: 'font-size:11px;color:var(--destructive)' }, iv(s.error)));
+  if (s && s.ok) {
+    kids.push(el('span', { style: LAB + ';padding-top:3px' }, 'changed on ' + (s.branch || 'its branch') + ' against trunk · ' + s.files.length));
+    kids.push(s.files_error ? el('div', { 'data-r21': 'review-files-error', style: 'font-size:11px;color:var(--destructive)' }, iv('could not be read — ' + s.files_error))
+      : s.files.length ? el('div', { 'data-r21': 'review-files', style: 'display:flex;flex-direction:column' }, s.files.map((f) => el('span', { style: 'font-family:var(--mono);font-size:10.5px;color:var(--muted-foreground)' }, iv(f.status + ' ' + f.path))))
+        : el('div', { 'data-r21': 'review-files', style: 'font-size:11px;color:var(--muted-foreground);font-style:italic' }, 'no file changed on the branch'));
+    kids.push(el('span', { style: LAB + ';padding-top:3px' }, 'the end of the conversation'));
+    kids.push(el('pre', { 'data-r21': 'review-tail', style: 'font-family:var(--mono);font-size:10.5px;white-space:pre-wrap;padding:6px 8px;background:var(--secondary);border:1px solid var(--border);margin:0;max-height:160px;overflow:auto' }, iv(s.tail || '(empty)')));
+    const j = s.judgments || { valid: [], invalid: [] };
+    if (j.valid.length || j.invalid.length) {
+      kids.push(el('span', { style: LAB + ';padding-top:3px' }, 'judgments the session reported'));
+      for (const v of j.valid) kids.push(el('div', { 'data-r21': 'judgment-ok', style: 'font-size:11px' }, iv(v.kind + ' · ' + v.question + ' → ' + (v.kind === 'yesno' ? (v.answer ? 'yes' : 'no') : v.kind === 'score' ? v.score : v.label))));
+      for (const v of j.invalid) kids.push(el('div', { 'data-r21': 'judgment-bad', style: 'font-size:11px;color:var(--destructive)' }, iv('rejected (' + v.error + '): ' + v.line)));
+    }
+    kids.push(row([
+      el('button', { 'data-r21': 'verdict-accept', style: GO, onClick: () => review(slug, it, 'accept'), title: 'accepts this step only; the initiative is accepted at the Acceptance Gate' }, 'accept the step'),
+      el('button', { 'data-r21': 'verdict-back', style: BTN, onClick: () => review(slug, it, 'send-back') }, 'send it back…'),
+    ]));
+  }
+  return el('div', { 'data-r21': 'review', style: 'margin-top:4px;padding:6px 8px;border:1px solid var(--border);display:flex;flex-direction:column;gap:2px' }, kids);
+}
+
+/** The controls and panels for one next-step item; null in fixture mode or when the item has no act. */
+export function stepActions(product, slug, it) {
+  if (FIXTURE || !it || !it.act) return null;
+  const a = it.act; const u = slot(it.id);
+  const btns = [];
+  if (a.type === 'work') {
+    btns.push(el('button', { 'data-r21': 'prepare', style: BTN, onClick: () => prepare(slug, it), title: 'shows the plan and the exact prompt. Nothing is created or started.' }, u.loading && !u.plan ? '…' : 'prepare'));
+  } else if (a.type === 'session' && a.sessionId) {
+    btns.push(el('button', { 'data-r21': 'switch', style: BTN, onClick: () => iniMod && iniMod.openTerm(slug, { id: a.sessionId, name: it.text }) }, 'switch to it'));
+  } else if (a.type === 'lifecycle') {
+    btns.push(el('button', { 'data-r21': 'reopen', style: BTN, onClick: async () => { await dataReady; await dataMod.setLifecycle(product, slug, 'active', ''); await dataMod.refreshInitiative(slug); touch(); } }, 'reopen'));
+  } else if (a.type === 'gate') {
+    btns.push(el('span', { 'data-r21': 'gate-note', style: 'font-size:11px;color:var(--muted-foreground);font-style:italic' }, iv('yours to do — ' + a.why)));
+  }
+  if (a.path && (a.type === 'open' || a.type === 'work')) {
+    btns.push(el('button', { 'data-r21': 'open', style: BTN, onClick: () => iniMod && iniMod.openDoc(slug, a.path, 'FILE'), title: a.path }, a.type === 'open' ? 'open ' + a.path.split('/').pop() : 'open file'));
+  }
+  if (a.type === 'open') btns.push(el('span', { 'data-r21': 'gate-note', style: 'font-size:11px;color:var(--muted-foreground);font-style:italic' }, iv('yours to do — ' + a.why)));
+  const out = [];
+  if (btns.length || u.note) out.push(row([...btns, noteLine(u.note)]));
+  const pp = planPanel(slug, it); if (pp) out.push(pp);
+  const rp = reviewPanel(slug, it); if (rp) out.push(rp);
+  return out.length ? el('div', { 'data-r21': 'actions', 'data-act': a.type }, out) : null;
+}

package/workspace/public/pm/panel-detail.js

@@ -55,6 +55,8 @@ import * as FX from './fixture.js';
 import { openDoc, openTab, openTerm, fileNewModel } from './panel-initiatives.js';
 import { addProductBody } from './panel-repos.js';
 import { lifecycleRow } from './lifecycle.js';
+import { statusBanner, lifecycleNotes } from './status-banner.js';
+import { stepActions } from './next-step-ui.js';
 import { boardOf, records, currentProduct } from './board-read.js';
 
 /* ── the prototype's small helpers ─────────────────────────────────────────────────────────── */
@@ -989,6 +991,118 @@ function realSyncPanel(slug, a, key, dest) {
   );
 }
 
+/* ── NEXT STEPS TO DONE (initiative-surface-batch R4) ─────────────────────────────────────────
+ * The whole remaining path, in order, from the ladder, the ledgers and the sessions — derived on the server
+ * (lib/next-steps.js), never written by a model. Each item names the fact it was read from; the first is
+ * marked. A stopped initiative says so, and an accepted one says nothing remains. */
+function nextStepsBlock(slug, rec) {
+  const ns = rec && rec.nextSteps;
+  if (FIXTURE || !ns) return null;
+  const TONE = { blocked: 'var(--destructive)', current: 'var(--brand)', pending: 'var(--muted-foreground)', unknown: 'var(--destructive)' };
+  const rowFor = (it) => el('div', { 'data-r16': 'next-item', 'data-first': it.first ? '1' : '0', 'data-kind': it.kind, 'data-owner': it.owner || '', 'data-id': it.id || '',
+    style: 'display:grid;grid-template-columns:22px 1fr;gap:8px;padding:6px 0;border-bottom:1px solid var(--border)' + (it.held ? ';opacity:.6' : '') },
+    el('span', { style: 'font-family:var(--mono);font-size:11px;color:' + (TONE[it.status] || 'var(--muted-foreground)') }, iv(String(it.n))),
+    el('div', { style: 'min-width:0;display:flex;flex-direction:column;gap:2px' },
+      el('div', { style: 'display:flex;gap:7px;align-items:baseline;flex-wrap:wrap' },
+        el('span', { style: 'font-size:12.5px;color:var(--foreground)' }, iv(it.text)),
+        it.first ? el('span', { 'data-r16': 'next-first', style: 'font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--brand)' }, 'next') : null,
+        it.status === 'blocked' ? el('span', { style: 'font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--destructive)' }, 'blocked') : null,
+        it.held ? el('span', { style: 'font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-foreground)' }, 'after reopening') : null),
+      el('div', { style: 'font-size:11.5px;line-height:1.5;color:var(--foreground)' }, iv(it.action)),
+      it.why && it.why !== it.action ? el('div', { style: 'font-size:11px;line-height:1.5;color:var(--muted-foreground)' }, iv(it.why)) : null,
+      el('div', { style: 'font-family:var(--mono);font-size:10px;color:var(--muted-foreground)' }, iv('from: ' + it.source)),
+      stepActions(repoOf(slug), slug, it)));
+  // Yours / Mine (status-clarity R3): the same ordered list, split by who acts. The number keeps its place in the whole path.
+  const all = ns.items || [];
+  const SEC = 'font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;padding:6px 0 2px;';
+  const part = (owner, label, tone, empty) => {
+    const mine = all.filter((it) => it.owner === owner);
+    return el('div', { 'data-r18': 'steps-' + owner },
+      el('div', { 'data-r18': 'steps-heading', style: SEC + 'color:' + tone }, label + ' · ' + mine.length),
+      mine.length ? mine.map(rowFor) : el('div', { style: 'font-size:11.5px;color:var(--muted-foreground);font-style:italic;padding:2px 0' }, empty));
+  };
+  const rows = all.length ? [
+    part('pm', 'yours', 'var(--brand)', 'nothing is waiting on you right now'),
+    part('agent', 'mine (the agent’s)', 'var(--muted-foreground)', 'nothing is waiting on the agent'),
+  ] : [];
+  return el('div', { 'data-r16': 'next-steps', style: 'padding:8px 14px;border-top:1px solid var(--border)' },
+    el('div', { style: 'font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-foreground);padding-bottom:4px' }, 'next steps to done'),
+    el('div', { 'data-r16': 'next-summary', style: 'font-size:12px;line-height:1.5;color:var(--foreground);padding-bottom:4px' }, iv(ns.summary || '')),
+    rows);
+}
+
+/* Conversations and git files, listed with the document artifacts (R5, R6). A conversation opens a read-only
+ * transcript tab; the row says where it is stored. A file read from git is marked as such and opens read-only
+ * (gitFileRow): it is evidence of what changed, so the tab offers no edit or save. */
+function openConversation(slug, c) {
+  const ini = iniModLazy;
+  if (!ini || typeof ini.openTab !== 'function') return;
+  ini.openTab({ id: 'conv:' + c.id, kind: 'transcript', title: c.name || c.id, convId: c.id, repo: repoOf(slug) || null, slug: slug || null, role: 'CONVERSATION' });
+}
+let iniModLazy = null;
+import('./panel-initiatives.js').then((m) => { iniModLazy = m; }).catch(() => { iniModLazy = null; });
+
+function conversationsBlock(slug, rec) {
+  if (FIXTURE) return null;
+  const cs = rec.convs || [];
+  const LAB = 'font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-foreground)';
+  const kids = cs.map((c) => el('button', { onClick: () => openConversation(slug, c), 'data-r16': 'conv-row', 'data-id': c.id,
+    style: 'display:flex;gap:8px;align-items:center;width:100%;padding:4px 6px;margin:0 -6px;min-width:0;min-height:30px', hover: 'background:var(--accent)',
+    title: 'a recorded conversation — read-only; kept in the runtime state directory on this machine, not in the repository' },
+    el('span', { style: 'flex:none;width:52px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--info)' }, 'talk'),
+    el('span', { style: 'font-family:var(--mono);font-size:10px;color:var(--foreground);overflow:hidden;text-overflow:ellipsis;white-space:nowrap' }, iv(c.name || c.id)),
+    el('span', { style: 'margin-left:auto;flex:none;font-family:var(--mono);font-size:10px;color:var(--muted-foreground)' },
+      iv((c.live ? 'live' : c.state === 'exited' ? 'ended' : 'saved') + (c.saved ? ' · ' + String(c.saved).slice(0, 10) : '')))));
+  return el('div', { 'data-r16': 'conversations', style: 'display:flex;flex-direction:column;gap:2px' },
+    el('span', { style: LAB + ';padding-top:4px' }, 'conversations · ' + cs.length),
+    cs.length ? kids : el('span', { 'data-r16': 'conv-empty', style: 'font-size:11.5px;color:var(--muted-foreground);font-style:italic' },
+      'none — no session is bound to this initiative. A session on its branch, or one you bind, is recorded here and kept after it ends.'),
+    cs.length ? el('span', { style: 'font-size:10.5px;color:var(--muted-foreground)' }, 'stored in this machine’s runtime state directory — not in the repository, never sent anywhere') : null);
+}
+
+/* A file read from git opens in a read-only doc tab (status-clarity R5). Text, markdown and html open anywhere. A
+ * file that exists only on the initiative's own branch is read through git from that branch, so it opens the branch's
+ * copy and never the trunk's. An image, PDF or workbook opens only from the checked-out tree. Anything else says why it
+ * cannot be previewed instead of failing on click. */
+const READ_FROM_BRANCH = new Set(['markdown', 'text', 'html']);
+function gitFileRow(slug, f, it) {
+  const branchOnly = it.where === 'branch';
+  const readable = READ_FROM_BRANCH.has(it.kind) || (!branchOnly && (it.kind === 'image' || it.kind === 'pdf' || it.kind === 'sheet'));
+  const tip = it.commits + ' commit' + (it.commits === 1 ? '' : 's') + ', last ' + it.last + (branchOnly ? ' · only on ' + (f.branch || 'the initiative branch') : '');
+  const STYLE = 'font-family:var(--mono);font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;';
+  if (!readable) {
+    const why = branchOnly ? 'this kind of file cannot be previewed from a branch' : 'binary or unknown file type — it cannot be previewed here';
+    return el('span', { 'data-r16': 'git-file', 'data-open': '0', title: tip + ' · ' + why, style: STYLE + 'color:var(--muted-foreground)' },
+      iv(it.path + '  — cannot be previewed'));
+  }
+  return el('button', { 'data-r16': 'git-file', 'data-open': '1', 'data-where': it.where || 'head', title: tip + ' · opens read-only',
+    onClick: () => openDoc(slug, it.path, 'FILE', null, { readonly: true, ref: branchOnly ? (f.branch || null) : null }),
+    style: STYLE + 'color:var(--foreground);text-align:left;min-height:22px;padding:1px 4px;margin:0 -4px', hover: 'background:var(--accent)' }, iv(it.path));
+}
+
+function gitFilesBlock(slug, rec) {
+  if (FIXTURE) return null;
+  const f = rec.gitFiles;
+  const LAB = 'font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-foreground)';
+  if (!f) return null;
+  if (f.ok === false) {
+    return el('div', { 'data-r16': 'git-files', style: 'display:flex;flex-direction:column;gap:2px' },
+      el('span', { style: LAB + ';padding-top:4px' }, 'files from git'),
+      el('span', { 'data-r16': 'git-error', style: 'font-size:11.5px;color:var(--destructive)' }, 'could not be read — ' + (f.reason || 'git did not answer')));
+  }
+  const groups = {};
+  for (const it of f.items || []) (groups[it.group] = groups[it.group] || []).push(it);
+  const order = ['code', 'tests', 'documents', 'other'].filter((g) => groups[g]);
+  return el('div', { 'data-r16': 'git-files', style: 'display:flex;flex-direction:column;gap:2px' },
+    el('span', { style: LAB + ';padding-top:4px' }, 'files from git · ' + (f.total || 0) + (f.via && f.via.length ? ' · via ' + f.via.join(', ') : '')),
+    order.length ? order.map((g) => el('div', { style: 'display:flex;flex-direction:column;gap:1px' },
+      el('span', { style: 'font-family:var(--mono);font-size:10px;color:var(--info);padding-top:2px' }, g + ' · ' + groups[g].length),
+      groups[g].map((it) => gitFileRow(slug, f, it))))
+      : el('span', { 'data-r16': 'git-empty', style: 'font-size:11.5px;color:var(--muted-foreground);font-style:italic' },
+        'none — git shows no commit naming this initiative and no initiative/<id> branch with changes'),
+    f.truncated ? el('span', { style: 'font-size:10.5px;color:var(--muted-foreground)' }, 'showing the first 200 of ' + f.total) : null);
+}
+
 function artifactsRow(slug, rec) {
   const arts = rec.arts || [];
   return el('div', { style: 'display:grid;grid-template-columns:76px 1fr;gap:10px;padding:8px 14px' },
@@ -998,6 +1112,8 @@ function artifactsRow(slug, rec) {
       arts.length === 0
         ? el('span', { style: 'font-size:11.5px;color:var(--muted-foreground);font-style:italic' }, 'none filed')
         : null,
+      conversationsBlock(slug, rec),
+      gitFilesBlock(slug, rec),
     ),
   );
 }
@@ -1038,7 +1154,8 @@ function initBody(slug) {
   }
 
   out.push(headerBlock(slug, rec.tag || '', rec.pills || [], rec.crumb || null, lanePicker(slug, rec)));
-  { const lc = lifecycleRow(repoOf(slug), slug); if (lc) out.push(lc); }
+  { const sb = statusBanner(repoOf(slug), slug, rec); if (sb) out.push(sb); }
+  { const lc = lifecycleRow(repoOf(slug), slug); if (lc) { out.push(lc); const ln = lifecycleNotes(rec); if (ln) out.push(ln); } }
 
   if (rec.noLadder) {
     const ansC = FX.TONE[(rec.answer && rec.answer.tone) || 'info'] || FX.C.mut;
@@ -1050,6 +1167,9 @@ function initBody(slug) {
   const sess = sessionsBlock(slug);
   if (sess) out.push(sess);
 
+  const nextB = nextStepsBlock(slug, rec);
+  if (nextB) out.push(nextB);
+
   const phases = phaseBlock(slug, rec);
   if (phases) out.push(phases);