create-pmos 0.37.0 → 0.38.0

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

@@ -0,0 +1,371 @@
+/* modes-live.js — the drawer modes that render SERVER data in live mode (overhaul-r4).
+ *
+ * modes.js renders the prototype's seeded lists, and in live mode those lists start empty and every
+ * edit is a client-only setState (seedOr). R1 hid the three modes with no server behind them; this
+ * module gives the other three their server truth, and adds the portfolio:
+ *
+ *   portfolio  — GET /api/portfolio: every registered repository's initiatives, grouped by domain
+ *                then repository, freshness stated, unread repositories listed; a report bar that
+ *                writes a weekly / OKR / query report into the hub (POST /api/reports, a PM press).
+ *   scheduled  — GET /api/schedules; run / delete through the existing routes.
+ *   skills     — GET /api/skills; a row with a file opens it.
+ *   knowledge  — GET /api/library's knowledge trees (OKF, skills, build-skills); a row opens it.
+ *
+ * Every list states its read: loading, failed (with the reason), or a successful read of nothing.
+ * Fixture mode never reaches this module (modes.js routes here only when !FIXTURE).
+ */
+import { el } from './dom.js';
+import { state, setState } from './state.js';
+
+const iv = (v) => el('span', null, v === null || v === undefined ? '' : String(v));
+const LABEL = 'padding:10px 14px 4px;font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-foreground)';
+const ROW = 'display:block;width:100%;padding:7px 14px;min-height:40px;text-align:left;border-bottom:1px solid oklch(1 0 0 / 5%)';
+const BTN = 'font-family:var(--mono);font-size:10.5px;padding:3px 9px;border:1px solid var(--border);color:var(--muted-foreground);min-height:26px';
+const NOTE = 'padding:8px 14px;font-size:11.5px;color:var(--muted-foreground);line-height:1.5';
+
+/* one cached read per endpoint; `reload(key)` drops it so the next render refetches */
+const cache = new Map();
+function read(key, url) {
+  const hit = cache.get(key);
+  if (hit && (hit.state !== 'ok' || Date.now() - hit.at < 15000)) return hit;
+  if (!hit || hit.state === 'ok') {
+    const next = { state: hit ? hit.state : 'loading', data: hit ? hit.data : null, at: hit ? hit.at : 0 };
+    cache.set(key, next);
+    fetch(url).then((r) => r.json()).then(
+      (data) => { cache.set(key, { state: data && data.ok === false ? 'error' : 'ok', data, error: data && data.error, at: Date.now() }); setState({}); },
+      (e) => { cache.set(key, { state: 'error', error: (e && e.message) || String(e), at: Date.now() }); setState({}); },
+    );
+    return next;
+  }
+  return hit;
+}
+const reload = (key) => cache.delete(key);
+const post = (url, body) => fetch(url, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(body) })
+  .then((r) => r.json()).catch((e) => ({ ok: false, error: (e && e.message) || String(e) }));
+function status(r, what) {
+  if (r.state === 'loading' && !r.data) return el('div', { style: NOTE }, iv('reading ' + what + ' …'));
+  if (r.state === 'error') return el('div', { style: NOTE + ';color:var(--destructive)' }, iv(what + ' could not be read — ' + (r.error || 'error')));
+  return null;
+}
+async function openDocIn(ws, path, repo) {
+  const ini = await import('./panel-initiatives.js');
+  const tree = ws ? { ws, branch: null, linked: true } : null;
+  if (repo && repo !== state.product) {
+    const repos = await import('./panel-repos.js');
+    repos.selectRepo(repo);
+  }
+  ini.openDoc(null, path, 'FILE', tree);
+}
+
+/* ── portfolio ──────────────────────────────────────────────────────────────────────────────── */
+let reportNote = null;
+async function writeReport(kind) {
+  let q = '';
+  if (kind === 'query') {
+    q = typeof window !== 'undefined' && window.prompt ? window.prompt('Report on initiatives matching:', state.q || '') : '';
+    if (!q || !q.trim()) return;
+  }
+  reportNote = { tone: 'mut', text: 'writing the ' + kind + ' report …' };
+  setState({});
+  const out = await post('/api/reports', { kind, q });
+  if (!out || out.ok === false) { reportNote = { tone: 'bad', text: (out && out.error) || 'the report was not written' }; setState({}); return; }
+  reportNote = { tone: 'ok', text: 'written to ' + out.path + (out.unread && out.unread.length ? ' · not fully read: ' + out.unread.join(', ') : '') };
+  const pf = cache.get('portfolio');
+  const hubName = pf && pf.data && pf.data.hub ? pf.data.hub.name : null;
+  await openDocIn(out.ws, out.path, hubName);
+  // selecting the hub to open the report switches to its initiatives; stay on the portfolio, where
+  // the PM pressed the button and where the note saying what was written is shown
+  reload('portfolio');
+  setState({ mode: 'portfolio', col1: true });
+}
+
+async function land(row) {
+  const repos = await import('./panel-repos.js');
+  repos.selectRepo(row.repo);
+  setState({ sel: row.id, mode: 'product', detail: { kind: 'init' }, col2: true });
+}
+
+export function portfolioList() {
+  const r = read('portfolio', '/api/portfolio');
+  const kids = [];
+  kids.push(el('div', { style: 'display:flex;gap:4px;flex-wrap:wrap;padding:8px 14px 4px', 'data-r4': 'report-bar' },
+    el('span', { style: 'font-family:var(--mono);font-size:10px;color:var(--muted-foreground);align-self:center;margin-right:4px' }, 'report →'),
+    ['weekly', 'okr', 'query'].map((k) => el('button', { onClick: () => writeReport(k), style: BTN, hover: 'color:var(--foreground)', 'data-r4': 'report-' + k }, iv(k === 'okr' ? 'OKR' : k))),
+    el('button', { onClick: () => { reload('portfolio'); setState({}); }, style: BTN + ';margin-left:auto', hover: 'color:var(--foreground)', title: 'read again' }, '↻')));
+  if (reportNote) kids.push(el('div', { 'data-r4': 'report-note', style: NOTE + ';color:' + (reportNote.tone === 'bad' ? 'var(--destructive)' : 'var(--muted-foreground)') }, iv(reportNote.text)));
+  const st = status(r, 'the portfolio');
+  if (st) return [...kids, st];
+  const pf = r.data || { repos: [], rows: [] };
+  if (!pf.hub) kids.push(el('div', { style: NOTE }, iv('No hub yet — reports need a portfolio.yaml in your PM repository (D-3).')));
+  const q = String(state.q || '').trim().toLowerCase();
+  const rows = (pf.rows || []).filter((x) => !q || [x.id, x.title, x.group, x.repo, x.domain].some((v) => v && String(v).toLowerCase().includes(q)));
+  // coverage first: what was read, how fresh, and what was NOT read
+  kids.push(el('div', { style: LABEL }, iv('coverage · ' + (pf.repos || []).length + ' repositories')));
+  for (const rp of pf.repos || []) {
+    const s = rp.error ? 'NOT READ — ' + rp.error : rp.pending ? 'board pending — stages arriving' : rp.stale ? 'stale · as of ' + String(rp.as_of).slice(11, 16) : 'fresh · as of ' + String(rp.as_of || '').slice(11, 16);
+    kids.push(el('div', { 'data-r4': 'coverage', style: 'padding:2px 14px;font-family:var(--mono);font-size:10.5px;color:' + (rp.error ? 'var(--destructive)' : 'var(--muted-foreground)') },
+      iv(rp.name + (rp.domain ? ' (' + rp.domain + ')' : '') + ' · ' + rp.count + ' · ' + s)));
+  }
+  // then the initiatives, domain › repository
+  const byDomain = new Map();
+  for (const x of rows) {
+    const d = x.domain || 'no domain declared';
+    if (!byDomain.has(d)) byDomain.set(d, new Map());
+    const m = byDomain.get(d);
+    if (!m.has(x.repo)) m.set(x.repo, []);
+    m.get(x.repo).push(x);
+  }
+  for (const [dom, repos] of [...byDomain.entries()].sort((a, b) => a[0].localeCompare(b[0]))) {
+    kids.push(el('div', { style: LABEL + ';color:var(--foreground)', 'data-r4': 'domain' }, iv('domain · ' + dom)));
+    for (const [repo, list] of repos) {
+      kids.push(el('div', { style: LABEL + ';padding-top:4px' }, iv(repo + ' · ' + list.length)));
+      for (const x of list) {
+        const stage = x.accepted ? 'accepted' : x.stage || 'not derived';
+        kids.push(el('button', { onClick: () => land(x), style: ROW, hover: 'background:var(--accent)', 'data-r4': 'row', 'data-id': x.id, 'data-repo': x.repo },
+          el('span', { style: 'display:flex;gap:8px;align-items:baseline' },
+            el('span', { style: 'font-family:var(--mono);font-size:12px' }, iv('#' + x.id)),
+            el('span', { style: 'margin-left:auto;font-family:var(--mono);font-size:10px;color:' + (x.blocked ? 'var(--destructive)' : 'var(--muted-foreground)') }, iv(stage + (x.blocked ? ' ✗' : '') + (x.sessions ? ' · ● ' + x.sessions : '')))),
+          el('span', { style: 'display:block;font-size:11px;color:var(--muted-foreground);overflow:hidden;text-overflow:ellipsis;white-space:nowrap' }, iv(x.group + (x.next ? ' — next: ' + x.next : '')))));
+      }
+    }
+  }
+  if (!rows.length) kids.push(el('div', { style: NOTE }, iv(q ? 'no initiative matches "' + q + '"' : 'no initiatives in the repositories that were read')));
+  return [el('div', { style: 'padding:2px 0 8px' }, kids)];
+}
+
+/* ── D71 — set up the recommended schedules for the selected repository, on a press ───────────── */
+let seedNote = null;
+function seedRow(set, label, hint) {
+  const product = state.product;
+  const note = seedNote && seedNote.set === set ? seedNote.text : null;
+  return el('div', { 'data-r7': 'seed-' + set, style: 'padding:8px 14px;border-bottom:1px solid var(--border)' },
+    el('button', { style: BTN, hover: 'color:var(--foreground)', title: hint, onClick: async () => {
+      const data = await import('./data.js');
+      const ws = product ? data.wsOf(product) : null;
+      if (!ws) { seedNote = { set, text: 'select a repository first' }; setState({}); return; }
+      const out = await post('/api/schedules/seed', { ws, set });
+      seedNote = { set, text: !out || out.ok === false ? ((out && out.error) || 'not set up')
+        : out.created.length ? 'scheduled: ' + out.created.map((c) => c.name + ' (' + c.cadence + ' ' + c.time + ')').join(', ')
+          : 'nothing to add — ' + out.kept.map((k) => k.skill + ': ' + k.why).join('; ') };
+      reload('schedules'); setState({});
+    } }, label),
+    note ? el('span', { style: 'display:block;font-size:11px;color:var(--muted-foreground);margin-top:4px' }, iv(note)) : null);
+}
+
+/* ── R11 — schedule ONE special report: what it is for, a date and a time ─────────────────────── */
+let specialNote = null;
+function specialRow() {
+  return el('div', { 'data-r11': 'special', style: 'padding:8px 14px;border-bottom:1px solid var(--border)' },
+    el('button', { style: BTN, hover: 'color:var(--foreground)', title: 'a one-off report: say what it is for and when you want the draft; it runs once',
+      onClick: async () => {
+        const product = state.product;
+        const d = await import('./data.js');
+        const ws = product ? d.wsOf(product) : null;
+        if (!ws) { specialNote = 'select a repository first'; setState({}); return; }
+        const what = typeof window !== 'undefined' && window.prompt ? window.prompt('What is the special report for? Who reads it, what period or topic, roughly how long?') : null;
+        if (!what || !what.trim()) return;
+        const dflt = new Date(Date.now() + 86400000).toISOString().slice(0, 10);
+        const date = window.prompt('Which day should the draft be ready? (YYYY-MM-DD)', dflt);
+        if (!date) return;
+        const time = window.prompt('At what time? (HH:MM, this machine\'s clock)', '07:30');
+        if (!time) return;
+        const out = await post('/api/schedules', { ws, name: 'Special report — ' + what.trim().slice(0, 40), cadence: 'once', date: date.trim(), time: time.trim(), skill: 'report-special', task: 'report-special', args: what.trim() });
+        specialNote = out && out.ok ? 'scheduled once for ' + date.trim() + ' at ' + time.trim() + ' — it fires only while the workspace is running' : ((out && out.error) || 'not scheduled');
+        reload('schedules'); setState({});
+      } }, 'schedule a special report'),
+    specialNote ? el('span', { 'data-r11': 'special-note', style: 'display:block;font-size:11px;color:var(--muted-foreground);margin-top:4px' }, iv(specialNote)) : null);
+}
+
+/* ── scheduled ──────────────────────────────────────────────────────────────────────────────── */
+export function scheduledLive() {
+  const r = read('schedules', '/api/schedules?all=1');
+  const st = status(r, 'the schedules');
+  if (st) return [st];
+  const list = (r.data && r.data.schedules) || [];
+  const kids = [seedRow('requirements', 'set up daily requirement gathering', 'schedules the gather-requirements skill daily at 07:30 for the selected repository; notes are filed in that repository'),
+    seedRow('reports', 'set up report drafts (daily · weekly · bi-weekly · monthly)', 'schedules the four report skills for the selected repository; each follows your own definition and files a draft in that repository. A special report is run on demand.'),
+    seedRow('skills', 'set up weekly skill discovery', 'schedules the skill-discover skill weekly (Wednesday 09:00) for the selected repository; it files candidates for you to read and never approves them'),
+    seedRow('memory', 'set up weekly memory grooming', 'schedules the memory-groom skill weekly (Monday 08:00) for the selected repository; it proposes changes and never makes them'),
+    specialRow()];
+  for (const s of list) {
+    const name = s.label || s.name || s.task || s.skill || s.id;
+    const cadence = (s.cadence || '') + (s.day ? ' ' + s.day : '') + (s.time ? ' at ' + s.time : '');
+    kids.push(el('div', { style: ROW, 'data-r4': 'schedule' },
+      el('span', { style: 'display:flex;gap:8px;align-items:baseline' },
+        el('span', { style: 'font-size:12.5px' }, iv(name)),
+        el('span', { style: 'margin-left:auto;font-family:var(--mono);font-size:10.5px;color:var(--muted-foreground)' }, iv(s.enabled === false ? 'disabled' : cadence))),
+      el('span', { style: 'display:block;font-family:var(--mono);font-size:10.5px;color:var(--muted-foreground)' },
+        iv('next ' + (s.next ? String(s.next).slice(0, 16).replace('T', ' ') : '—') + ' · last ' + (s.lastRun ? String(s.lastRun).slice(0, 16).replace('T', ' ') : 'never'))),
+      el('span', { style: 'display:flex;gap:4px;margin-top:4px' },
+        el('button', { onClick: async () => { await post('/api/schedules/run', { id: s.id }); reload('schedules'); setState({}); }, style: BTN, hover: 'color:var(--foreground)', 'data-r4': 'run' }, 'run now'),
+        el('button', { onClick: async () => {
+          if (typeof window !== 'undefined' && window.confirm && !window.confirm('Delete the schedule "' + name + '"?')) return;
+          await post('/api/schedules/delete', { id: s.id }); reload('schedules'); setState({});
+        }, style: BTN, hover: 'color:var(--destructive)', 'data-r4': 'delete' }, 'delete'))));
+  }
+  if (!list.length) kids.push(el('div', { style: NOTE }, iv('No scheduled tasks — a successful read of nothing.')));
+  return [el('div', { style: 'padding:6px 0' }, kids)];
+}
+
+/* ── memory (D72) — the repository's curated memory, for real ─────────────────────────────────── */
+let memNote = null;
+async function memWs() { const d = await import('./data.js'); return state.product ? d.wsOf(state.product) : null; }
+async function memDo(body) {
+  const ws = await memWs();
+  if (!ws) { memNote = 'select a repository first'; setState({}); return; }
+  const out = await post('/api/memory', { ws, ...body });
+  memNote = out && out.ok ? (out.staged ? 'held for approval' : null) : ((out && out.error) || 'not saved');
+  if (out && !out.ok && out.entries && out.entries.length) memNote += ' — current entries: ' + out.entries.map((e) => '“' + e.text.slice(0, 40) + '”').join(', ');
+  reload('memory'); setState({});
+}
+const ask = (q, v) => (typeof window !== 'undefined' && window.prompt ? window.prompt(q, v || '') : null);
+let dataMod = null;
+import('./data.js').then((m) => { dataMod = m; setState({}); }).catch(() => { dataMod = null; });
+export function memoryLive() {
+  const wsId = dataMod && state.product ? dataMod.wsOf(state.product) : null;
+  const ws = wsId || 'none';
+  if (!wsId) return [el('div', { style: NOTE }, iv(state.product ? 'reading the repository …' : 'select a repository to see its memory'))];
+  const r = read('memory:' + ws, '/api/memory?ws=' + encodeURIComponent(wsId));
+  const st = status(r, 'the memory');
+  const kids = [];
+  const d = r.data || {};
+  const actions = el('div', { style: 'display:flex;gap:4px;flex-wrap:wrap;padding:8px 14px 4px', 'data-r9': 'memory-bar' },
+    el('button', { style: BTN, hover: 'color:var(--foreground)', 'data-r9': 'add', onClick: () => { const t = ask('Add to repository memory (one short fact):'); if (t && t.trim()) memDo({ op: 'add', target: 'memory', text: t.trim() }); } }, '＋ memory'),
+    el('button', { style: BTN, hover: 'color:var(--foreground)', 'data-r9': 'add-user', onClick: () => { const t = ask('Add about you (a preference or how you work):'); if (t && t.trim()) memDo({ op: 'add', target: 'user', text: t.trim() }); } }, '＋ about me'),
+    el('button', { style: BTN, hover: 'color:var(--foreground)', 'data-r9': 'wire', title: 'add a block to this repository\'s CLAUDE.md so each session reads the memory at start',
+      onClick: async () => { const w = await memWs(); const out = w ? await post('/api/memory/wire', { ws: w }) : null; memNote = out && out.ok ? (out.changed ? 'CLAUDE.md now imports the memory' : 'already wired') : ((out && out.error) || 'not wired'); reload('memory:' + ws); setState({}); } },
+    d.wired ? 'wired ✓' : 'wire into CLAUDE.md'),
+    el('button', { style: BTN + ';margin-left:auto', hover: 'color:var(--foreground)', 'data-r9': 'approval', title: 'when on, writes by an agent wait here for your approval',
+      onClick: async () => { const w = await memWs(); if (!w) return; await post('/api/memory/config', { ws: w, write_approval: !(d.config && d.config.write_approval) }); reload('memory:' + ws); setState({}); } },
+    'approval ' + (d.config && d.config.write_approval ? 'on' : 'off')));
+  kids.push(actions);
+  if (memNote) kids.push(el('div', { 'data-r9': 'note', style: NOTE + ';color:var(--destructive)' }, iv(memNote)));
+  if (st) return [...kids, st];
+  for (const t of ['memory', 'user']) {
+    const u = (d.usage || {})[t] || { used: 0, limit: 0, percent: 0 };
+    kids.push(el('div', { style: LABEL, 'data-r9': 'usage-' + t }, iv((t === 'memory' ? 'repository memory' : 'about you') + ' · ' + u.percent + '% · ' + u.used + '/' + u.limit)));
+    const es = (d.entries || []).filter((e) => e.target === t);
+    if (!es.length) kids.push(el('div', { style: NOTE }, iv('Nothing recorded yet.')));
+    for (const e of es) {
+      kids.push(el('div', { style: ROW, 'data-r9': 'entry', 'data-id': e.id },
+        el('span', { style: 'display:block;font-size:12px;line-height:1.45' }, iv(e.text)),
+        el('span', { style: 'display:block;font-family:var(--mono);font-size:10px;color:var(--muted-foreground);margin-top:2px' },
+          iv([e.confidence, e.stale ? 'stale' : null, e.source ? 'source ' + e.source : null, e.by, String(e.at).slice(0, 10)].filter(Boolean).join(' · '))),
+        el('span', { style: 'display:flex;gap:4px;margin-top:4px' },
+          e.confidence === 'unconfirmed' ? el('button', { style: BTN, hover: 'color:var(--foreground)', 'data-r9': 'confirm', onClick: () => memDo({ op: 'confirm', target: t, old: e.text }) }, 'confirm') : null,
+          el('button', { style: BTN, hover: 'color:var(--foreground)', 'data-r9': 'edit', onClick: () => { const nt = ask('Edit this entry:', e.text); if (nt && nt.trim() && nt.trim() !== e.text) memDo({ op: 'replace', target: t, old: e.text, text: nt.trim() }); } }, 'edit'),
+          el('button', { style: BTN, hover: 'color:var(--destructive)', 'data-r9': 'remove', onClick: () => { if (window.confirm && !window.confirm('Remove this entry?')) return; memDo({ op: 'remove', target: t, old: e.text }); } }, 'remove'))));
+    }
+  }
+  if ((d.pending || []).length) {
+    kids.push(el('div', { style: LABEL + ';color:var(--foreground)', 'data-r9': 'pending-label' }, iv('waiting for your approval · ' + d.pending.length)));
+    for (const p of d.pending) {
+      kids.push(el('div', { style: ROW, 'data-r9': 'pending', 'data-eid': p.eid },
+        el('span', { style: 'display:block;font-size:12px' }, iv(p.op + ' · ' + (p.text || p.id))),
+        el('span', { style: 'display:block;font-family:var(--mono);font-size:10px;color:var(--muted-foreground)' }, iv(p.by + ' · ' + String(p.at).slice(0, 16).replace('T', ' '))),
+        el('span', { style: 'display:flex;gap:4px;margin-top:4px' },
+          el('button', { style: BTN, hover: 'color:var(--foreground)', 'data-r9': 'approve', onClick: () => memDo({ op: 'approve', ref: p.eid }) }, 'approve'),
+          el('button', { style: BTN, hover: 'color:var(--destructive)', 'data-r9': 'reject', onClick: () => memDo({ op: 'reject', ref: p.eid }) }, 'reject'))));
+    }
+  }
+  if ((d.blocked || []).length) {
+    kids.push(el('div', { style: LABEL + ';color:var(--destructive)', 'data-r9': 'blocked-label' }, iv('blocked by the scan · ' + d.blocked.length)));
+    for (const b of d.blocked) kids.push(el('div', { style: NOTE, 'data-r9': 'blocked' }, iv(b.reason + ' · ' + b.by + ' · ' + String(b.at).slice(0, 10) + ' · not shown to any session')));
+  }
+  kids.push(el('div', { style: NOTE }, iv('Sessions read this once, when they start. Unconfirmed items are included and labelled. It travels with the repository when you Sync.')));
+  return [el('div', { style: 'padding:2px 0 8px' }, kids)];
+}
+
+/* ── skills ─────────────────────────────────────────────────────────────────────────────────── */
+let candNote = null; const openText = new Map();
+async function candDo(ws, body) {
+  const out = await post('/api/skills/decide', { ws, ...body });
+  candNote = out && out.ok ? (out.note || null) : ((out && out.error) || 'not done');
+  if (out && out.ok && body.op === 'read') openText.set(body.id + '@' + body.sha, out);
+  reload('skillcands:' + ws); reload('skills:' + ws); setState({});
+  return out;
+}
+function candidatesBlock(wsId) {
+  if (!wsId) return [];
+  const r = read('skillcands:' + wsId, '/api/skills/candidates?ws=' + encodeURIComponent(wsId));
+  const d = r.data || {};
+  const rows = d.candidates || [];
+  const kids = [el('div', { style: LABEL + ';color:var(--foreground)', 'data-r13': 'cands-label' }, iv('found or generated · ' + rows.length + ' · none runs until you approve it'))];
+  if (candNote) kids.push(el('div', { 'data-r13': 'cand-note', style: NOTE }, iv(candNote)));
+  if (r.state === 'error') kids.push(el('div', { style: NOTE + ';color:var(--destructive)' }, iv('the candidates could not be read — ' + (r.error || ''))));
+  if (!rows.length && r.state !== 'error') kids.push(el('div', { style: NOTE }, iv('No candidates yet. Set up weekly discovery, or ask for skills to be generated from your repeated work.')));
+  for (const c of rows) {
+    const key = c.id + '@' + c.sha; const shown = openText.get(key);
+    const soft = (c.scan && c.scan.soft) || [];
+    kids.push(el('div', { style: ROW, 'data-r13': 'cand', 'data-id': c.id, 'data-state': c.state + (c.running ? ':running' : '') },
+      el('span', { style: 'display:flex;gap:8px;align-items:baseline' },
+        el('span', { style: 'font-family:var(--mono);font-size:12px' }, iv(c.id)),
+        el('span', { style: 'margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--muted-foreground)' }, iv(c.running ? 'approved · running' : c.state + (c.approved ? ' (approved here)' : '')))),
+      el('span', { style: 'display:block;font-size:11px;color:var(--muted-foreground)' }, iv(c.why)),
+      el('span', { style: 'display:block;font-family:var(--mono);font-size:10px;color:var(--muted-foreground)' },
+        iv([c.origin, c.license, c.author, c.source_url, '#' + c.sha12].filter(Boolean).join(' · '))),
+      soft.length ? el('span', { 'data-r13': 'findings', style: 'display:block;font-size:10.5px;color:var(--destructive)' }, iv('flagged: ' + soft.map((f) => f.rule + ' (line ' + f.line + ')').join(', '))) : null,
+      (c.ignored_keys || []).length ? el('span', { style: 'display:block;font-size:10.5px;color:var(--muted-foreground)' }, iv('its own ' + c.ignored_keys.join(', ') + ' will be ignored — it runs as an agent skill on claude')) : null,
+      c.collides ? el('span', { style: 'display:block;font-size:10.5px;color:var(--destructive)' }, iv('a skill with this name already exists and wins over it')) : null,
+      el('span', { style: 'display:flex;gap:4px;margin-top:4px;flex-wrap:wrap' },
+        el('button', { style: BTN, hover: 'color:var(--foreground)', 'data-r13': 'read', onClick: () => { if (shown) { openText.delete(key); setState({}); } else candDo(wsId, { op: 'read', id: c.id, sha: c.sha }); } }, shown ? 'hide the text' : 'read it'),
+        c.state === 'quarantined' && !c.running ? el('button', { style: BTN, hover: 'color:var(--foreground)', 'data-r13': 'approve', disabled: c.read ? null : 'disabled', title: c.read ? 'approve exactly this text, on this machine' : 'open the full text first',
+          onClick: async () => {
+            let ack = false;
+            if (c.needs_license_ack) { ack = !!(window.confirm && window.confirm('Its licence is "' + c.license + '". Have you read it, and do you accept it?')); if (!ack) return; }
+            await candDo(wsId, { op: 'approve', id: c.id, sha: c.sha, ack_license: ack });
+          } }, 'approve') : null,
+        c.state === 'quarantined' ? el('button', { style: BTN, hover: 'color:var(--destructive)', 'data-r13': 'reject', onClick: () => { const why = window.prompt ? window.prompt('Why reject “' + c.id + '”? (optional)', '') : ''; if (why === null) return; candDo(wsId, { op: 'reject', id: c.id, sha: c.sha, reason: why }); } }, 'reject') : null,
+        (c.running || c.approved) && c.state === 'quarantined' ? el('button', { style: BTN, hover: 'color:var(--destructive)', 'data-r13': 'retire', onClick: () => candDo(wsId, { op: 'retire', id: c.id, sha: c.sha, reason: 'retired by the PM' }) }, 'retire') : null),
+      shown ? el('pre', { 'data-r13': 'text', style: 'white-space:pre-wrap;overflow-wrap:anywhere;font-family:var(--mono);font-size:11px;line-height:1.5;background:var(--secondary);border:1px solid var(--border);padding:8px;margin:6px 0 0;max-height:320px;overflow:auto' }, iv(shown.text)) : null));
+  }
+  return kids;
+}
+export function skillsLive() {
+  const wsId = dataMod && state.product ? dataMod.wsOf(state.product) : null;
+  const r = read('skills:' + (wsId || ''), '/api/skills' + (wsId ? '?ws=' + encodeURIComponent(wsId) : ''));
+  const st = status(r, 'the skills');
+  if (st) return [st];
+  const list = (r.data && r.data.skills) || [];
+  const kids = list.map((sk) => el('div', { style: ROW, 'data-r4': 'skill' },
+    el('span', { style: 'display:flex;gap:8px;align-items:baseline' },
+      el('span', { style: 'font-family:var(--mono);font-size:12px' }, iv(sk.label || sk.skill || sk.id)),
+      el('span', { style: 'margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--muted-foreground)' }, iv(sk.source))),
+    el('span', { style: 'display:block;font-size:11px;color:var(--muted-foreground)' }, iv(sk.description))));
+  if (!list.length) kids.push(el('div', { style: NOTE }, iv('No skills — a successful read of nothing.')));
+  return [el('div', { style: 'padding:6px 0' }, [...kids, ...candidatesBlock(wsId)])];
+}
+
+/* ── knowledge ──────────────────────────────────────────────────────────────────────────────── */
+function flatten(node, out, depth) {
+  for (const d of node.docs || []) out.push({ path: d.path, name: d.name, depth });
+  if (depth < 3) for (const sub of node.dirs || []) { out.push({ dir: sub.name || sub.path, depth }); flatten(sub, out, depth + 1); }
+  return out;
+}
+export function knowledgeLive() {
+  const ws = state.wsId || '';
+  const r = read('library:' + ws, '/api/library?ws=' + encodeURIComponent(ws));
+  const st = status(r, 'the knowledge');
+  if (st) return [st];
+  const trees = (r.data && r.data.knowledge) || [];
+  const kids = [el('div', { style: NOTE }, iv('This repository\'s knowledge: the OKF bundle, skills and build-skills. Open a document to read it.'))];
+  for (const t of trees) {
+    kids.push(el('div', { style: LABEL }, iv(t.path || t.name || 'knowledge')));
+    for (const it of flatten(t, [], 0)) {
+      if (it.dir) { kids.push(el('div', { style: 'padding:3px 14px 1px ' + (14 + it.depth * 12) + 'px;font-family:var(--mono);font-size:10px;color:var(--muted-foreground)' }, iv(it.dir + '/'))); continue; }
+      kids.push(el('button', { onClick: () => openDocIn(null, it.path), style: 'display:block;width:100%;text-align:left;padding:4px 14px 4px ' + (20 + it.depth * 12) + 'px;font-family:var(--mono);font-size:11.5px', hover: 'background:var(--accent)', 'data-r4': 'know' }, iv(it.name)));
+    }
+  }
+  // R11 — the notes PMOS and its agents wrote here (requirement notes, report drafts and definitions, memory).
+  const notes = (r.data && r.data.notes) || [];
+  if (notes.length) kids.push(el('div', { style: NOTE, 'data-r11': 'notes-intro' }, iv('Notes PMOS and your agents wrote in this repository — requirement notes, report drafts and definitions, memory.')));
+  for (const t of notes) {
+    kids.push(el('div', { style: LABEL, 'data-r11': 'notes-label' }, iv(t.path || t.name || 'notes')));
+    for (const it of flatten(t, [], 0)) {
+      if (it.dir) { kids.push(el('div', { style: 'padding:3px 14px 1px ' + (14 + it.depth * 12) + 'px;font-family:var(--mono);font-size:10px;color:var(--muted-foreground)' }, iv(it.dir + '/'))); continue; }
+      kids.push(el('button', { onClick: () => openDocIn(null, it.path), 'data-r11': 'note', style: 'display:block;width:100%;text-align:left;padding:4px 14px 4px ' + (20 + it.depth * 12) + 'px;font-family:var(--mono);font-size:11px;min-height:26px' }, iv(it.name || it.path)));
+    }
+  }
+  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)];
+}

package/workspace/public/pm/modes.js

@@ -48,6 +48,7 @@ import { state, setState, FIXTURE } from './state.js';
 import * as FX from './fixture.js';
 import { openDoc, openTerm } from './panel-initiatives.js';
 import { boardOf, records, currentProduct } from './board-read.js';
+import * as LIVE from './modes-live.js';   // overhaul-r4: server-backed renderers, live mode only
 
 /* ── the prototype's small helpers ─────────────────────────────────────────────────────────── */
 
@@ -1037,13 +1038,15 @@ function intgBody(det) {
 
 const LISTS = {
   focus: focusList,
-  scheduled: scheduledList,
+  // overhaul-r4: in live mode these three render their server routes; the fixture keeps the prototype's
+  scheduled: () => (FIXTURE ? scheduledList() : LIVE.scheduledLive()),
   workflow: workflowList,
-  skills: skillsList,
-  knowledge: knowledgeList,
+  skills: () => (FIXTURE ? skillsList() : LIVE.skillsLive()),
+  knowledge: () => (FIXTURE ? knowledgeList() : LIVE.knowledgeLive()),
+  portfolio: () => (FIXTURE ? [] : LIVE.portfolioList()),
   agent: agentsList,
   connect: connectList,
-  memory: memoryList,
+  memory: () => (FIXTURE ? memoryList() : LIVE.memoryLive()),
 };
 
 const BODIES = {

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

@@ -54,6 +54,7 @@ import { state, setState, FIXTURE } from './state.js';
 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 { boardOf, records, currentProduct } from './board-read.js';
 
 /* ── the prototype's small helpers ─────────────────────────────────────────────────────────── */
@@ -271,7 +272,24 @@ function sessionsBlock(slug) {
 
 /* ── 1 · HEADER — slug, tag, pills (lines 338–346) ──────────────────────────────────────────── */
 
-function headerBlock(name, tag, pills) {
+/* overhaul-r2 B3 — the breadcrumb, under the pills. Gaps are drawn muted and italic and SAY what is
+ * missing; they are never an empty slot. The KR's baseline → target line and a domain's standing
+ * goal sit beneath it, because "which metric does this move?" is the question the crumb answers. */
+function crumbBlock(c) {
+  if (!c || !c.parts || !c.parts.length) return null;
+  const kids = [];
+  c.parts.forEach((pt, i) => {
+    if (i) kids.push(el('span', { style: 'color:var(--muted-foreground)' }, ' › '));
+    kids.push(el('span', { title: pt.k, style: pt.gap ? 'font-style:italic;color:var(--muted-foreground)' : 'color:var(--foreground)' }, iv(pt.v)));
+  });
+  return el('div', { 'data-r2': 'crumb', style: 'margin-top:8px;font-size:11.5px;line-height:1.5' },
+    el('div', null, kids),
+    c.line ? el('div', { 'data-r2': 'kr-line', style: 'font-family:var(--mono);font-size:10.5px;color:var(--muted-foreground);margin-top:3px' }, iv('measure · ' + c.line)) : null,
+    c.goal ? el('div', { 'data-r2': 'domain-goal', style: 'font-size:11px;color:var(--muted-foreground);margin-top:3px' }, iv('standing goal · ' + c.goal)) : null,
+  );
+}
+
+function headerBlock(name, tag, pills, crumb) {
   return el('div', { style: 'padding:13px 14px 11px;border-bottom:1px solid var(--border)' },
     el('div', { style: 'font-family:var(--mono);font-size:15px;font-weight:600;letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap' }, iv(name)),
     el('div', { style: 'font-size:12px;color:var(--muted-foreground);margin-top:2px' }, iv(tag)),
@@ -279,6 +297,7 @@ function headerBlock(name, tag, pills) {
       pills.map((pl) => el('span', {
         style: 'font-family:var(--mono);font-size:10px;padding:2px 6px;background:var(--secondary);border:1px solid var(--border);color:' + pl.c,
       }, iv(pl.t)))),
+    crumbBlock(crumb),
   );
 }
 
@@ -982,7 +1001,8 @@ function initBody(slug) {
     return out;
   }
 
-  out.push(headerBlock(slug, rec.tag || '', rec.pills || []));
+  out.push(headerBlock(slug, rec.tag || '', rec.pills || [], rec.crumb || null));
+  { const lc = lifecycleRow(repoOf(slug), slug); if (lc) out.push(lc); }
 
   if (rec.noLadder) {
     const ansC = FX.TONE[(rec.answer && rec.answer.tone) || 'info'] || FX.C.mut;

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

@@ -265,9 +265,15 @@ export function openTerm(slug, sess) {
   });
 }
 
-export function openDoc(slug, path, role) {
+export function openDoc(slug, path, role, tree) {
+  /* `tree` — the line of work a search hit came from (overhaul-r1 R1.3). A hit on a LINKED worktree
+   * opens a tab that carries that tree's `ws` and `branch`, under its own id, so it is read from and
+   * saved to that tree and can sit beside the main tree's copy of the same path. A main-tree hit
+   * opens exactly the tab it always did. */
+  const linked = !!(tree && tree.ws && tree.linked);
   openTab({
-    id: 'doc:' + path, kind: 'doc', title: path.split('/').pop(), slug,
+    id: 'doc:' + (linked ? tree.ws + ':' : '') + path, kind: 'doc', title: path.split('/').pop(), slug,
+    ...(linked ? { ws: tree.ws, branch: tree.branch || null } : {}),
     /* A file opened from the FOLDER search belongs to no initiative, so `slugProduct()` has no
      * answer for it — and `panel-tabs.visibleTabs` shows a tab whose repo is `undefined` in EVERY
      * repository, which would hang this workspace's file in another one's tab strip and read its
@@ -522,15 +528,20 @@ function dataModule() {
   return null;
 }
 
+/* overhaul-r4 B2 — "all repositories": the same box, widened to every registered repository. The
+ * cache is keyed by scope too, so the two answers never mix. */
+const scopeKey = (q) => (state.searchAll ? 'all\u0000' : '') + q;
 function requestFiles(q) {
-  fileWanted = q;
+  const key = scopeKey(q);
+  const all = !!state.searchAll;
+  fileWanted = key;
   if (fileTimer) clearTimeout(fileTimer);
   fileTimer = setTimeout(() => {
     fileTimer = null;
     const mod = dataModule();
     if (!mod || typeof mod.searchFiles !== 'function') return;
-    const asked = q;
-    Promise.resolve(mod.searchFiles(asked)).then(
+    const asked = key;
+    Promise.resolve(mod.searchFiles(q, undefined, all)).then(
       (r) => {
         if (fileWanted !== asked) return;                      // the PM has typed past this query
         fileCache.set(asked, (r && r.ok === false)
@@ -539,6 +550,8 @@ function requestFiles(q) {
             hits: (r && r.hits) || [], truncated: !!(r && r.truncated),
             contentTruncated: !!(r && r.content_truncated),
             scanned: (r && r.scanned) || 0, contentScanned: (r && r.content_scanned) || 0, error: null,
+            trees: Array.isArray(r && r.trees) ? r.trees : [],
+            repos: Array.isArray(r && r.repos) ? r.repos : null,
           });
         if (fileCache.size > 40) fileCache.delete(fileCache.keys().next().value);
         setState({});
@@ -555,12 +568,34 @@ function requestFiles(q) {
 /** The result for `q`, or null while nothing has come back yet. Kicks the fetch off on a miss. */
 function fileResults(q) {
   if (!q || FIXTURE) return null;
-  if (fileCache.has(q)) return fileCache.get(q);
+  if (fileCache.has(scopeKey(q))) return fileCache.get(scopeKey(q));
   requestFiles(q);
   return null;
 }
 
-const fileLabel = (h) => 'file · ' + (h.kind || 'file') + (h.match === 'content' ? ' · line ' + h.line : '');
+/* overhaul-r1 R1.2 — every hit names its line of work. A hit merged across trees (identical
+ * content) names every branch; a hit from a linked worktree names its branch with `⑂`; a hit only
+ * on the main tree of a repository with no linked trees says nothing extra. */
+const isLinked = (ws) => !!(dataMod && typeof dataMod.isLinkedTree === 'function' && dataMod.isLinkedTree(ws));
+const hitTree = (h) => (h && h.ws ? { ws: h.ws, branch: h.branch || null, linked: isLinked(h.ws) } : null);
+function branchTag(h) {
+  const bs = Array.isArray(h.branches) ? h.branches.filter(Boolean) : [];
+  if (bs.length > 1) return ' · on ' + bs.join(', ');
+  if (h.ws && isLinked(h.ws)) return ' · ⑂ ' + (h.branch || 'detached');
+  return '';
+}
+/* A hit from ANOTHER repository (all-repositories scope) selects that repository first, then opens
+ * the file from the hit's own tree, so it is read where it was found. */
+async function openHit(h) {
+  if (h.repo && h.repo !== state.product) {
+    const repos = await import('./panel-repos.js');
+    repos.selectRepo(h.repo);
+    openDoc(null, h.path, 'FILE', h.ws ? { ws: h.ws, branch: h.branch || null, linked: true } : null);
+    return;
+  }
+  openDoc(null, h.path, 'FILE', hitTree(h));
+}
+const fileLabel = (h) => (h.repo && state.searchAll ? h.repo + ' · ' : '') + 'file · ' + (h.kind || 'file') + (h.match === 'content' ? ' · line ' + h.line : '') + branchTag(h);
 
 function fileHitNode(h) {
   const where = h.dir ? h.dir + '/' : '';
@@ -575,7 +610,7 @@ function fileHitNode(h) {
     );
   }
   return el('button', {
-    onClick: () => openDoc(null, h.path, 'FILE'),
+    onClick: () => openHit(h),
     style: 'display:block;width:100%;padding:6px 12px;min-height:40px;text-align:left',
     hover: 'background:var(--accent)',
     title: h.path,
@@ -593,10 +628,17 @@ function fileHitNode(h) {
 export function fileHitsBlock(q) {
   if (!q || FIXTURE) return null;
   const r = fileResults(q);
+  const scope = state.searchAll ? 'files in every repository' : 'files in this folder';
   const head = (text, tone) => el('div', {
-    style: 'padding:4px 12px 4px;font-family:var(--mono);font-size:10px;letter-spacing:.12em;'
+    style: 'display:flex;gap:8px;align-items:center;padding:4px 12px 4px;font-family:var(--mono);font-size:10px;letter-spacing:.12em;'
       + 'text-transform:uppercase;color:' + (tone || 'var(--muted-foreground)') + ';border-bottom:1px solid var(--border)',
-  }, iv(text));
+  }, iv(String(text).replace(/^files in this folder/, scope)),
+    // overhaul-r4 B2 — widen the same search to every registered repository
+    el('button', {
+      onClick: () => setState((st) => ({ searchAll: !st.searchAll })),
+      style: 'margin-left:auto;letter-spacing:0;text-transform:none;font-size:10px;padding:1px 6px;border:1px solid var(--border);color:var(--muted-foreground)',
+      hover: 'color:var(--foreground)', 'data-r4': 'search-all', title: 'search every registered repository',
+    }, iv((state.searchAll ? '☑' : '☐') + ' all repositories')));
 
   if (!r) return el('div', { 'data-pm-files': '' }, head('files in this folder · searching…'));
   if (r.error) {
@@ -608,8 +650,11 @@ export function fileHitsBlock(q) {
    * conclude from an empty list. `contentTruncated` means every file was NAMED and some bodies
    * were not read, which is the ordinary state of any repository holding a lock file. Folding the
    * second into the first would light the serious flag permanently and thereby retire it. */
+  // overhaul-r1 R1.4: with several lines of work, say WHICH walk was cut short
+  const cut = (r.trees || []).length > 1 ? (r.trees || []).filter((t) => t.truncated).map((t) => t.branch || 'detached') : [];
+  const lines = (r.trees || []).length > 1 ? ' across ' + r.trees.length + ' lines of work' : '';
   const bound = r.truncated
-    ? ' · BOUNDED — files beyond the walk limit were not looked at'
+    ? ' · BOUNDED — files beyond the walk limit were not looked at' + (cut.length ? ' (on ' + cut.join(', ') + ')' : '')
     : (r.contentTruncated ? ' · all ' + r.scanned + ' names searched; ' + r.contentScanned + ' bodies read' : '');
 
   if (!r.hits.length) {
@@ -620,7 +665,7 @@ export function fileHitsBlock(q) {
         ? 'no match in the ' + r.scanned + ' files searched — the walk was BOUNDED, more were not looked at'
         : 'no file matches — a successful read of nothing' + (r.contentTruncated ? bound : ''))));
   }
-  const kids = [head('files in this folder · ' + r.hits.length + ' of ' + r.scanned + ' searched' + bound)];
+  const kids = [head('files in this folder · ' + r.hits.length + ' of ' + r.scanned + ' searched' + lines + bound)];
   for (const h of r.hits) kids.push(fileHitNode(h));
   return el('div', { 'data-pm-files': '' }, kids);
 }