create-pmos 0.18.0 → 0.19.0

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

@@ -146,20 +146,104 @@ export function closeTab(id) {
 /* The data layer's optional session-start hook. In fixture mode nothing is ever started; in real
  * mode the PTY is data.js's to create, and panel 4's part is only to show the tab for it. */
 let dataMod = null;
-import('./data.js').then((m) => { dataMod = m; }).catch(() => { dataMod = null; });
+/* The repaint matters: `syncPad` below cannot name a pad before this module exists, so the render
+ * that lands it is the render that first loads the PM's staged text. */
+import('./data.js').then((m) => { dataMod = m; setState({}); }).catch(() => { dataMod = null; });
+
+/**
+ * The next free `agent <n>`, counted against EVERY name the window can see — the server's live
+ * sessions, the ones started in this window, and the tabs already open — not just this page's
+ * counter.
+ *
+ * `startN` resets to 1 on every reload, and the name is what the terminal used to join on and what
+ * the tab id is built from. So after a reload the first `＋ session` proposed `agent 1`, which was
+ * already running from before the reload: the click attached to that old session instead of
+ * starting a new one, and a second click collided with its own tab id. Counting past what exists
+ * is what makes `＋ session` mean "a new one" again.
+ */
+function nextSessionName() {
+  let max = state.startN - 1;
+  const bump = (name) => {
+    const m = /^agent (\d+)$/.exec(String(name || ''));
+    if (m) max = Math.max(max, Number(m[1]));
+  };
+  for (const s of (state.sessions || [])) bump(s && s.name);
+  for (const k in (state.extraSess || {})) for (const s of (state.extraSess[k] || [])) bump(s && s.name);
+  for (const t of (state.tabs || [])) if (t && t.kind === 'term') bump(t.sess);
+  return { n: max + 1, name: 'agent ' + (max + 1) };
+}
+
+/* ── who is already in the tree this session would land in ───────────────────────────────────
+ *
+ * The workspace used to answer this AFTER the fact: it started the session, then wrote "2 sessions
+ * already running in this working tree" into the new pane. That sentence is true and arrives one
+ * step too late — the PM has already made the thing they might not have wanted, and the sentence
+ * names a count they cannot act on. Worse, the answer they usually want is not "start another"
+ * at all; it is "which of those is the one I was already working in?".
+ *
+ * So the same facts are computed BEFORE the spawn, from data the page already holds:
+ *   • the tree the new session would land in — data.js publishes it per registered workspace id
+ *     (`/api/workspaces` → `tree`), which is available even when that tree has no session yet;
+ *   • the live sessions in it — `state.sessions`, each row carrying the server's own `tree`,
+ *     `tree_role`, presented state and rendered label;
+ *   • what ending each one would cost — lib/tree-share's `endRisk`, the same module the server uses
+ *     for the pane advisory, so the two readings are one reading.
+ *
+ * Nothing is derived twice and nothing is guessed. When any input is missing — fixture mode, no
+ * workspace selected, a folder with no git, the shared module not loaded — this answers "nobody",
+ * and `＋ session` behaves exactly as it always did. A chooser that appears on a bad guess would be
+ * worse than no chooser.
+ */
+function treePeersNow() {
+  if (FIXTURE) return null;
+  const TS = typeof window !== 'undefined' ? window.PMOSTreeShare : null;
+  if (!TS) return null;
+  const ws = state.wsId || null;
+  const tree = ws && dataMod && typeof dataMod.treeOfWorkspace === 'function'
+    ? dataMod.treeOfWorkspace(ws) : null;
+  if (!tree) return null;                       // no git, or nothing selected — no index to share
+  const rows = Array.isArray(state.sessions) ? state.sessions : [];
+  // The map coTenants() keys on. Built from each row's OWN `tree`, which the server derived — the
+  // client never runs git and must not pretend to. The target workspace is added explicitly so a
+  // tree whose only registration has no session yet still resolves.
+  const treeOfWs = new Map([[ws, tree]]);
+  for (const r of rows) if (r && r.ws && !treeOfWs.has(r.ws)) treeOfWs.set(r.ws, r.tree || null);
+  const mates = TS.coTenants(rows, treeOfWs, tree, null);
+  if (!mates.length) return null;
+  // The declared writer, read off the row the server already marked rather than recomputed.
+  const held = rows.find((r) => r && r.tree === tree && r.tree_role === 'writer');
+  return {
+    tree,
+    branch: (dataMod && typeof dataMod.branchOfWorkspace === 'function' && dataMod.branchOfWorkspace(ws)) || null,
+    peers: mates.map((m) => TS.describeTenant(m, held ? held.id : null)),
+  };
+}
 
 /**
  * `＋ session` (line 2087): file a new session against the selected initiative and open its tab.
  * The session lands in `extraSess` — the prototype's own list of sessions started in this window —
  * and the terminal tab is opened in the callback, i.e. after the render that added it.
+ *
+ * `opts.force` skips the chooser. It is what the chooser's own "start another session here anyway"
+ * calls, so the guard is asked exactly once per click and a PM who has already answered the
+ * question is never asked it twice.
  */
-export function newSession(slug) {
+export function newSession(slug, opts) {
   const target = slug || selSlug();
   if (!target) return;
-  const n = state.startN;
-  const sess = { name: 'agent ' + n, st: 'working', label: 'working', profile: state.newSessProfile };
+  if (!(opts && opts.force)) {
+    const found = treePeersNow();
+    if (found) { setState({ startPrompt: { slug: target, ...found }, endConfirm: null }); return; }
+  }
+  const { n, name } = nextSessionName();
+  /* `spawn` is carried on the session and thence onto the tab: it is an INSTRUCTION to start a PTY,
+   * and it is the only thing that authorises one. Without it the terminal resolves by name, which
+   * is a question about what already exists, not a request for something new. */
+  const sess = { name, st: 'working', label: 'working', profile: state.newSessProfile, spawn: true };
   setState((s) => ({
     startN: n + 1,
+    startPrompt: null,
+    endConfirm: null,
     extraSess: { ...s.extraSess, [target]: [...(s.extraSess[target] || []), sess] },
   }), () => openTermTab(target, sess));
   if (!FIXTURE && dataMod && typeof dataMod.startSession === 'function') {
@@ -167,6 +251,25 @@ export function newSession(slug) {
   }
 }
 
+/** Join a session that is already running instead of starting one: open its tab, start nothing. */
+export function joinSession(slug, peer) {
+  if (!peer) return;
+  setState({ startPrompt: null, endConfirm: null }, () => openTermTab(slug, {
+    name: peer.name, st: peer.shown, profile: peer.profile || null,
+    /* The SERVER's id, and NO `spawn`. Both halves matter and they are the exact difference
+     * between joining and starting: `id` is the join, so the tab attaches to precisely the PTY the
+     * PM pointed at rather than matching by a name that repeats across repositories; the absent
+     * `spawn` is what withholds authorisation to create one. A peer described by
+     * treeShare.describeTenant always carries its id, so this is never a name-match in practice. */
+    id: peer.id || null,
+  }));
+}
+
+/** Dismiss the chooser without starting or joining anything. */
+export function dismissStartPrompt() {
+  setState({ startPrompt: null, endConfirm: null });
+}
+
 /** `⫽ split` / `⫽ unsplit` (lines 2088–2092). */
 export function toggleSplit() {
   setState((s) => {
@@ -198,19 +301,124 @@ const emptyState = el('div', {
   style: 'flex:1;display:grid;place-items:center;color:oklch(0.55 0.02 213);font-size:12.5px;padding:20px;text-align:center',
 }, "nothing open — click a task's output or an artifact, or ＋ session above");
 
-const panesRow = el('div', { style: 'flex:1;display:flex;min-height:0' });
+const panesRow = el('div', { style: 'flex:1;display:flex;min-height:0;min-width:0;overflow:hidden' });
 
 /* ── the scratchpad (lines 983–991) ──────────────────────────────────────────────────────────
  * One textarea, created once. Its text is written back as a CHILD TEXT NODE as well as a value,
  * because that is what the prototype's runtime does and the comparator reads text nodes — but only
  * when the two differ, so a repaint mid-sentence never moves the PM's caret.
+ *
+ * ── ONE PAD PER SESSION ─────────────────────────────────────────────────────────────────────
+ * The pad stages the next thing to type into a PARTICULAR agent, so it belongs to that agent's
+ * session. The four-panel port shipped it as one in-memory string for the whole page, which meant
+ * every terminal — in every repository, in every window — showed and overwrote the same buffer.
+ *
+ * The store is `state.scratchPads`, keyed by:
+ *   `sess:<server session id>` — a terminal tab bound to a live PTY. The id is the SERVER's, so two
+ *                                sessions both called `agent 1` in two repositories are two pads.
+ *   `ws:<workspace id>`        — everything else (a doc, a task, nothing open): the repository pad.
+ * That is exactly the key space `/api/scratchpad` already stores under — the endpoint has been
+ * per-session all along, and it is the client half that went missing. `state.scratchText` remains
+ * the text ON SCREEN, so the copy button, `⇥ send to terminal` and the fixture render are unchanged.
+ *
+ * FIXTURE MODE IS UNTOUCHED: no key, no fetch, one pad, the prototype's own placeholder. The offline
+ * demo path must make no network call, and the comparator must see the design's string.
  */
+const SCRATCH_PLACEHOLDER = FIXTURE
+  ? 'scratchpad — survives tab switches, dies with the page'
+  : 'scratchpad — one pad per session, saved on this machine';
+
 const scratchTa = el('textarea', {
-  placeholder: 'scratchpad — survives tab switches, dies with the page',
+  placeholder: SCRATCH_PLACEHOLDER,
   style: 'height:96px;background:oklch(0.11 0.004 228.8);color:#c4ccce;padding:10px 14px;font-family:var(--mono);font-size:12px',
-  onInput: (e) => setState({ scratchText: e.target.value }),
+  onInput: (e) => onScratchInput(e.target.value),
 });
 
+/* ── pad identity, loading and autosave ─────────────────────────────────────────────────────── */
+
+const padLoading = new Set();      // keys with a read in flight — one read per key, ever
+let padTimer = null;
+let padPending = null;             // {key, text} not yet written
+
+/** The pad the ACTIVE tab stages against, or null when it cannot be named yet. */
+function padKey() {
+  if (FIXTURE) return null;
+  const act = activeTab();
+  if (act && act.kind === 'term') {
+    const id = (termMod && typeof termMod.sessionIdOf === 'function')
+      ? termMod.sessionIdOf(act) : (act.sessionId || null);
+    // A terminal whose session has not resolved yet has no pad of its own YET. Null holds the
+    // drawer on whatever it was showing rather than flashing an empty pad and then SAVING it over
+    // the real one the moment the session lands.
+    return id ? 'sess:' + id : null;
+  }
+  return state.wsId ? 'ws:' + state.wsId : null;
+}
+
+/** Write the pending pad now. Called before leaving a pad, and when the page goes away. */
+function flushPad() {
+  if (padTimer) { clearTimeout(padTimer); padTimer = null; }
+  if (!padPending) return;
+  const { key, text } = padPending;
+  padPending = null;
+  if (dataMod && typeof dataMod.saveScratchpad === 'function') {
+    try { dataMod.saveScratchpad(key, text); } catch { /* the text stays in state either way */ }
+  }
+}
+
+function schedulePadSave(key, text) {
+  padPending = { key, text };
+  if (padTimer) clearTimeout(padTimer);
+  padTimer = setTimeout(flushPad, 500);      // one write per pause, not one per keystroke
+}
+
+function onScratchInput(text) {
+  if (FIXTURE) { setState({ scratchText: text }); return; }
+  const key = state.scratchKey;
+  setState((s) => ({
+    scratchText: text,
+    scratchPads: key ? { ...s.scratchPads, [key]: text } : s.scratchPads,
+  }));
+  if (key) schedulePadSave(key, text);
+}
+
+/**
+ * Bring the drawer onto the pad the active tab belongs to, reading it from the server the first
+ * time that pad is seen. Called at the top of every render; a no-op unless the pad CHANGED.
+ */
+function syncPad() {
+  if (FIXTURE || !dataMod) return;           // no data layer yet — retried on the next render
+  const key = padKey();
+  if (!key || key === state.scratchKey) return;
+  flushPad();                                // the pad being left is written before it is left
+  if (Object.prototype.hasOwnProperty.call(state.scratchPads, key)) {
+    setState({ scratchKey: key, scratchText: state.scratchPads[key] });
+    return;
+  }
+  setState({ scratchKey: key, scratchText: '' });
+  if (padLoading.has(key)) return;
+  padLoading.add(key);
+  const landed = (text) => {
+    padLoading.delete(key);
+    setState((s) => ({
+      scratchPads: { ...s.scratchPads, [key]: text },
+      // …and onto the screen only if this is still the pad on screen. A PM who switched tabs while
+      // the read was in flight must not have the arriving text land in the pad they moved to.
+      ...(s.scratchKey === key ? { scratchText: text } : {}),
+    }));
+  };
+  try { dataMod.loadScratchpad(key).then(landed, () => landed('')); }
+  catch { padLoading.delete(key); }
+}
+
+/* A pad edited in the last half-second is still worth keeping when the tab is closed or the machine
+ * sleeps. `pagehide` fires where `beforeunload` is unreliable (bfcache, mobile), and both are cheap. */
+if (typeof window !== 'undefined' && !FIXTURE) {
+  window.addEventListener('pagehide', flushPad);
+  window.addEventListener('beforeunload', flushPad);
+  document.addEventListener('visibilitychange', () => { if (document.hidden) flushPad(); });
+}
+
 const scratchCopyLabel = iv('⧉ copy');
 const scratchCopyBtn = el('button', {
   onClick: () => {
@@ -299,9 +507,117 @@ function copyActive() {
   setTimeout(() => setState({ copied: false }), 1200);
 }
 
+/* ── the ＋ session chooser ──────────────────────────────────────────────────────────────────
+ *
+ * Shown INSTEAD of a spawn when the working tree already has live sessions. It answers, in this
+ * order, the three questions the old one-line notice left the PM holding:
+ *
+ *   what is running?      — every peer named, with the sidebar's own word for its state, the
+ *                           agent's last words, and the writer claim where one is held.
+ *   is it safe to end?    — one sentence per peer from lib/tree-share's `endRisk`, worded from the
+ *                           EVIDENCE. Only `needs you` gets a plain "nothing is in flight"; quiet
+ *                           and maybe-blocked say, in as many words, that the workspace cannot
+ *                           tell — because a confident "safe" that discards a running turn is
+ *                           exactly the false confidence this repo calls a watermelon.
+ *   can I just use it?    — `open it`, which attaches a tab to that session and starts NOTHING.
+ *
+ * `end it` is the one destructive control on this surface and it is two clicks: the first arms it
+ * and the button says what will happen, the second sends it. Nothing else here can lose work.
+ *
+ * Rebuilt on each render, deliberately: it holds no PTY and no caret, so there is nothing for a
+ * persistent node to protect, and a chooser rebuilt from state cannot show a session that has
+ * since exited.
+ */
+const RISK_COLOR = {
+  'in-flight': 'var(--warning)',
+  settled: 'var(--success)',
+  unknown: 'var(--muted-foreground)',
+  gone: 'var(--muted-foreground)',
+};
+const CH_BTN = 'flex:none;font-family:var(--mono);font-size:10.5px;padding:4px 10px;min-height:26px;'
+  + 'background:oklch(1 0 0 / 6%);border:1px solid oklch(1 0 0 / 12%);color:oklch(0.85 0.01 214);white-space:nowrap';
+
+function peerRow(prompt, p) {
+  const armed = state.endConfirm === p.id;
+  return el('div', {
+    style: 'display:flex;gap:10px;align-items:flex-start;padding:8px 10px;border:1px solid oklch(1 0 0 / 10%);background:oklch(1 0 0 / 3%)',
+  },
+    el('span', { style: 'flex:none;font-size:9px;line-height:18px;color:' + RISK_COLOR[p.risk.level] }, '●'),
+    el('div', { style: 'flex:1;min-width:0;display:flex;flex-direction:column;gap:2px' },
+      el('div', { style: 'display:flex;gap:8px;align-items:baseline;flex-wrap:wrap' },
+        el('span', { style: 'font-family:var(--mono);font-size:11.5px;color:oklch(0.95 0.01 214)' }, iv(p.name)),
+        el('span', { style: 'font-family:var(--mono);font-size:10.5px;color:oklch(0.72 0.014 214)' }, iv(p.label)),
+        p.agent ? el('span', { style: 'font-family:var(--mono);font-size:10px;color:oklch(0.55 0.02 213)' }, iv(p.agent)) : null,
+        p.writer ? el('span', {
+          style: 'font-family:var(--mono);font-size:9.5px;color:var(--brand);border:1px solid oklch(1 0 0 / 12%);padding:1px 5px',
+        }, 'writer') : null,
+      ),
+      // The agent's own last words, when the workspace could read them. Absent rather than
+      // substituted: a placeholder here would be a claim about a session nobody read.
+      p.doing ? el('div', {
+        style: 'font-family:var(--mono);font-size:10.5px;color:oklch(0.62 0.02 213);overflow:hidden;text-overflow:ellipsis;white-space:nowrap',
+      }, iv(p.doing)) : null,
+      el('div', { style: 'font-size:11px;color:' + RISK_COLOR[p.risk.level] + ';line-height:1.45' }, iv(p.risk.why)),
+    ),
+    el('div', { style: 'flex:none;display:flex;gap:6px;align-items:center' },
+      el('button', {
+        onClick: () => joinSession(prompt.slug, p),
+        style: CH_BTN + ';color:var(--brand)', hover: CHIP_HOVER,
+      }, 'open it'),
+      el('button', {
+        onClick: () => {
+          if (!armed) { setState({ endConfirm: p.id }); return; }
+          if (termMod && typeof termMod.killSession === 'function') termMod.killSession(p.id);
+          setState({ endConfirm: null });
+        },
+        style: CH_BTN + (armed ? ';color:var(--destructive);border-color:var(--destructive)' : ''),
+        hover: CHIP_HOVER,
+      }, iv(armed ? 'end “' + p.name + '” — click again' : 'end it')),
+    ),
+  );
+}
+
+function startPromptBlock() {
+  const prompt = state.startPrompt;
+  if (!prompt) return null;
+  const peers = prompt.peers || [];
+  const n = peers.length;
+  return el('div', {
+    style: 'flex:none;max-height:52vh;overflow-y:auto;display:flex;flex-direction:column;gap:8px;'
+      + 'padding:12px 14px;border-bottom:1px solid oklch(1 0 0 / 10%);background:oklch(0.11 0.004 228.8)',
+  },
+    el('div', { style: 'display:flex;gap:8px;align-items:baseline;flex-wrap:wrap' },
+      el('span', { style: 'font-size:12.5px;color:oklch(0.95 0.01 214)' },
+        iv('⑂ ' + n + ' session' + (n === 1 ? '' : 's') + ' already running in this working tree')),
+      el('span', { style: 'font-family:var(--mono);font-size:10.5px;color:oklch(0.55 0.02 213);overflow-wrap:anywhere' },
+        iv(prompt.tree + (prompt.branch ? ' · ' + prompt.branch : ''))),
+    ),
+    el('div', { style: 'font-size:11.5px;color:oklch(0.72 0.014 214);line-height:1.5' },
+      iv('You would share one branch, one index and one set of files with '
+        + (n === 1 ? 'it' : 'them') + '. Open one instead, end one, or start another anyway.')),
+    peers.map((p) => peerRow(prompt, p)),
+    el('div', { style: 'display:flex;gap:6px;flex-wrap:wrap;padding-top:2px' },
+      el('button', {
+        onClick: () => newSession(prompt.slug, { force: true }),
+        style: CH_BTN, hover: CHIP_HOVER,
+      }, '＋ start another session here anyway'),
+      el('button', { onClick: () => dismissStartPrompt(), style: CH_BTN, hover: CHIP_HOVER }, 'cancel'),
+    ),
+    // The limit, where the PM meets the feature — never only in a comment. PMOS hosts the terminal;
+    // it does not sit between an agent and the files, and no button above changes that.
+    el('div', { style: 'font-size:10.5px;color:oklch(0.52 0.02 213);line-height:1.5' },
+      'Nothing here is enforced: PMOS hosts your agent’s terminal, it does not sit between it and '
+      + 'the files. To work in parallel for real, start on a new branch with its own folder (⑂).'),
+  );
+}
+
 /* ── pane hosts ────────────────────────────────────────────────────────────────────────────── */
 
-const PANE_STYLE = 'flex:1;min-width:0;display:flex;flex-direction:column;border-right:1px solid oklch(1 0 0 / 10%)';
+/* `min-height:0` is load-bearing, not tidiness. A pane is a flex COLUMN whose body declares
+ * `flex:1;overflow-y:auto` — and a flex item's automatic minimum is its content, so without this
+ * the pane grows to fit a long document instead of letting the document scroll inside it, and the
+ * growth escapes upward until the whole page scrolls. See the chain documented in pm/app.js. */
+const PANE_STYLE = 'flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;border-right:1px solid oklch(1 0 0 / 10%)';
 const paneHosts = new Map();          // tab id -> the pane element, kept for the tab's whole life
 
 function paneFor(tab) {
@@ -396,7 +712,13 @@ function tabNode(t, act, splitTab) {
   const bc = selected ? FX.TAB_COLORS.activeBorder : FX.TAB_COLORS.idleBorder;
   const color = act && act.id === t.id ? FX.TAB_COLORS.activeText : FX.TAB_COLORS.idleText;
   const dotColor = FX.TAB_COLORS.dot[t.kind] || FX.TAB_COLORS.dot.doc;
-  const meta = t.kind === 'term' ? 'session' : (t.kind === 'task' ? 'task' : t.role);
+  /* A terminal's sub-line names the SESSION IT IS ON, not the word "session". After a reload the PM
+   * could not tell which session a re-opened tab had landed on, and the answer was on screen
+   * nowhere; the server's id is the one identifier that does not repeat across repositories. The
+   * fixture render keeps the design's literal — the comparator reads this text node. */
+  const meta = t.kind === 'term'
+    ? ((!FIXTURE && t.sessionId) ? 'session ' + t.sessionId : 'session')
+    : (t.kind === 'task' ? 'task' : t.role);
 
   return el('div', {
     style: 'flex:none;display:flex;align-items:center;gap:8px;padding:0 10px;background:' + bg
@@ -433,6 +755,8 @@ function tabNode(t, act, splitTab) {
  * bar. The panes row renders even when nothing is open, exactly as the design does.
  */
 export function renderTabs(host) {
+  // Which pad the drawer is on is decided from the active tab, before anything is painted from it.
+  syncPad();
   const visTabs = visibleTabs();
   const act = visTabs.find((t) => t.id === state.active) || null;
   const splitTab = state.splitId
@@ -477,7 +801,12 @@ export function renderTabs(host) {
 
   setChildren(host, [
     tabBar,
-    visTabs.length === 0 ? emptyState : null,
+    // Above the panes and below the tab bar: the chooser is about the click that was just made in
+    // that bar, and putting it here leaves every open pane — and every live PTY — exactly where it
+    // was. Replacing the panes with it would re-parent a terminal, which is the quiet regression
+    // the persistent pane hosts exist to prevent.
+    startPromptBlock(),
+    visTabs.length === 0 && !state.startPrompt ? emptyState : null,
     panesRow,
     state.scratchOpen ? scratchBlock : null,
     bottomBar,

package/workspace/public/pm/state.js

@@ -38,18 +38,46 @@ function initial() {
     tabs: [], active: null, splitId: null,
     initLinks: {}, artLinks: {}, artSyncOpen: {}, artSyncState: {},
     extraSess: {}, termHist: {}, startN: 1, docEdits: {}, docModes: {},
+    /* `＋ session` into a working tree that already has sessions in it opens a CHOOSER instead of
+     * spawning (workspace-session-choice): `{slug, tree, branch, peers}` while it is open, null
+     * otherwise. `endConfirm` is the id of the one peer whose `end it` has been armed — a
+     * second click ends it, and anything else disarms. Neither is persisted: a chooser that
+     * reappeared on reload would be a question about a moment that has passed. */
+    startPrompt: null, endConfirm: null,
     col0: true, col1: true, col2: true, scratchOpen: false, scratchText: '', copied: false,
     flowsMap: null, schedList: null, agentList: null, memory: null,
     savedDocs: {}, scratchCopied: false,
+    /* The scratchpad is ONE PAD PER SESSION, not one per page (see panel-tabs.js). `scratchPads`
+     * holds every pad this window has loaded, keyed by the pad key the panel derives — `sess:<id>`
+     * for a terminal bound to a PTY, `ws:<id>` for the repository pad a non-terminal tab stages
+     * against. `scratchText` remains the text ON SCREEN, so every existing reader (the copy button,
+     * ⇥ send to terminal, the fixture render) is unchanged. `scratchKey` is which pad that is. */
+    scratchPads: {}, scratchKey: null,
   };
 }
 
 /* ── persistence ──────────────────────────────────────────────────────────────────────────────
- * Only the PM's *arrangement* is persisted — never content, never tabs, never a live session.
- * Each key carries its own validator. A stored value that fails its validator is DROPPED and the
- * rest of the record is still applied: "layout amnesia" in the PRD's failure-mode list means a
- * stale record from an older build throwing, or silently wiping a layout the PM is working in.
- * An unknown key is simply not read, so an older or newer schema costs nothing.
+ * The PM's *arrangement*, and — since the reload defect — WHICH VIEWS WERE OPEN. Never content,
+ * never a pad's text, never a live PTY: a tab is a view of a session the server owns, and what is
+ * stored here is the identity of the view, not the thing it looks at.
+ *
+ * Each key carries its own validator, and optionally a `pack` that decides what is WRITTEN. A
+ * stored value that fails its validator is DROPPED and the rest of the record is still applied:
+ * "layout amnesia" in the PRD's failure-mode list means a stale record from an older build
+ * throwing, or silently wiping a layout the PM is working in. An unknown key is simply not read,
+ * so an older or newer schema costs nothing.
+ *
+ * ── Why `tabs` is here, and why it was not ──────────────────────────────────────────────────
+ * It read "never tabs" because a tab was thought to be a live thing. It is not: the PTY lives in
+ * the server and survives both detach and a server restart (R7), so a window that forgot its tabs
+ * was not protecting anything — it was throwing away the only record of which sessions the PM had
+ * open. The PM then had to re-find them by hand, one click at a time, with no way to tell which
+ * session a re-opened tab had landed on. Restoring the views is what makes the surviving sessions
+ * visible again on reload.
+ *
+ * The stored tab is PACKED, not the live record: a whitelist of scalar fields, capped at 40 tabs.
+ * A doc tab's edited buffer, a task's derived prose, and anything a future field might carry stay
+ * out of localStorage by construction rather than by remembering to exclude them.
  */
 const isBool = (v) => typeof v === 'boolean';
 const isSlug = (v) => v === null || typeof v === 'string';
@@ -57,6 +85,28 @@ const isFlagMap = (v) =>
   !!v && typeof v === 'object' && !Array.isArray(v) &&
   Object.keys(v).every((k) => typeof k === 'string' && typeof v[k] === 'boolean');
 
+/* The only tab fields that are written. `sessionId` is the load-bearing one: it is the SERVER's own
+ * id, so a restored terminal re-attaches to exactly the PTY it was showing rather than re-running
+ * the name join — which is what made a reloaded tab land on a session the PM could not identify. */
+const TAB_FIELDS = ['id', 'kind', 'title', 'slug', 'repo', 'sess', 'sessionId', 'state', 'profile',
+  'path', 'role', 'phase', 'status'];
+const MAX_TABS = 40;
+
+function packTab(t) {
+  if (!t || typeof t !== 'object' || typeof t.id !== 'string' || typeof t.kind !== 'string') return null;
+  const out = {};
+  for (const k of TAB_FIELDS) {
+    const v = t[k];
+    if (v === null || typeof v === 'string' || typeof v === 'number' || typeof v === 'boolean') out[k] = v;
+  }
+  return out;
+}
+
+const isTabList = (v) =>
+  Array.isArray(v) && v.length <= MAX_TABS &&
+  v.every((t) => t && typeof t === 'object' && !Array.isArray(t)
+    && typeof t.id === 'string' && typeof t.kind === 'string');
+
 const PERSIST = {
   theme: (v) => v === 'dark' || v === 'light',
   col0: isBool, col1: isBool, col2: isBool,
@@ -65,6 +115,15 @@ const PERSIST = {
   sel: isSlug,
   collapsedGroups: isFlagMap,
   collapsedPhases: isFlagMap,
+  tabs: isTabList,
+  active: isSlug,
+  splitId: isSlug,
+  scratchOpen: isBool,
+};
+
+/** What is WRITTEN for a key, when it is not the live value verbatim. */
+const PACK = {
+  tabs: (v) => (Array.isArray(v) ? v.slice(0, MAX_TABS).map(packTab).filter(Boolean) : []),
 };
 
 /** The exact set of keys written to localStorage, in write order. */
@@ -84,13 +143,19 @@ function restore(target) {
     try { ok = PERSIST[k](saved[k]); } catch { ok = false; }
     if (ok) target[k] = saved[k];
   }
+  /* `active` and `splitId` name tabs. A record whose tab list was dropped (or that names a tab the
+   * list no longer holds) must not restore a pointer into nothing — panel 4 would render an empty
+   * pane and the PM would see a window with no tab selected and no way to guess why. */
+  const ids = new Set((target.tabs || []).map((t) => t.id));
+  if (!ids.has(target.active)) target.active = target.tabs.length ? target.tabs[target.tabs.length - 1].id : null;
+  if (!ids.has(target.splitId)) target.splitId = null;
   return target;
 }
 
 function persist() {
   if (FIXTURE) return;
   const out = {};
-  for (const k of persistKeys) out[k] = state[k];
+  for (const k of persistKeys) out[k] = PACK[k] ? PACK[k](state[k]) : state[k];
   try { localStorage.setItem(STORE_KEY, JSON.stringify(out)); } catch { /* quota / private mode */ }
 }
 

package/workspace/public/pm/tab-doc.js

@@ -148,7 +148,7 @@ function viewBody(text) {
   const fm = [];
   doc.fm.forEach((fp) => { fm.push(el('span', { style: FM_K }, iv(fp.k)), el('span', { style: FM_V }, iv(fp.v))); });
   return el('div', {
-    style: 'flex:1;overflow-y:auto;background:var(--background);color:var(--foreground);padding:20px 24px 60px;font-size:14px;line-height:1.65',
+    style: 'flex:1;min-height:0;overflow-y:auto;background:var(--background);color:var(--foreground);padding:20px 24px 60px;font-size:14px;line-height:1.65',
   },
     el('div', { style: 'max-width:72ch' },
       el('div', {
@@ -171,7 +171,7 @@ function viewBody(text) {
 
 function rawBody(text) {
   return el('div', {
-    style: 'flex:1;overflow-y:auto;background:var(--background);padding:14px 16px;font-family:var(--mono);font-size:12px;line-height:1.7',
+    style: 'flex:1;min-height:0;overflow-y:auto;background:var(--background);padding:14px 16px;font-family:var(--mono);font-size:12px;line-height:1.7',
   }, text.split('\n').map((l) => {
     const ln = FX.rawLine(l);
     return el('div', {
@@ -183,7 +183,7 @@ function rawBody(text) {
 function diffBody(raw, text, dirty) {
   const rows = dirty ? FX.diffLines(raw, text) : [FX.NO_DIFF_ROW];
   return el('div', {
-    style: 'flex:1;overflow-y:auto;background:var(--background);padding:14px 0;font-family:var(--mono);font-size:12px;line-height:1.7',
+    style: 'flex:1;min-height:0;overflow-y:auto;background:var(--background);padding:14px 0;font-family:var(--mono);font-size:12px;line-height:1.7',
   }, rows.map((dr) => el('div', {
     style: 'color:' + dr.c + ';background:' + dr.bg + ';padding:0 16px;white-space:pre-wrap;overflow-wrap:anywhere;min-height:1.2em',
   }, iv(dr.t))));
@@ -197,7 +197,7 @@ function editBox(tab) {
   let ta = boxes.get(tab.id);
   if (ta) return ta;
   ta = el('textarea', {
-    style: 'flex:1;background:var(--background);color:var(--foreground);padding:14px 16px;font-family:var(--mono);font-size:12px;line-height:1.7',
+    style: 'flex:1;min-height:0;background:var(--background);color:var(--foreground);padding:14px 16px;font-family:var(--mono);font-size:12px;line-height:1.7',
     onInput: (e) => {
       const v = e.target.value;
       saveErr.delete(tab.path);
@@ -253,7 +253,7 @@ export function mountDoc(host, tab) {
   const dirtyColor = err ? 'var(--destructive)' : (dirty ? 'var(--warning)' : 'var(--muted-foreground)');
 
   const modeBar = el('div', {
-    style: 'display:flex;gap:2px;align-items:center;padding:6px 10px;border-bottom:1px solid var(--border);background:var(--background)',
+    style: 'flex:none;display:flex;gap:2px;align-items:center;padding:6px 10px;border-bottom:1px solid var(--border);background:var(--background)',
   },
     modeBtns, saveBtn, revertBtn,
     el('span', { style: 'margin-left:auto;font-family:var(--mono);font-size:10px;color:' + dirtyColor }, iv(dirtyLabel)),

package/workspace/public/pm/tab-task.js

@@ -52,7 +52,7 @@ export function mountTask(host, tab) {
       'no artifact yet — produced when the agent runs this task');
 
   const body = el('div', {
-    style: 'flex:1;overflow-y:auto;background:var(--background);color:var(--foreground);padding:22px 26px 60px;font-size:14px;line-height:1.65',
+    style: 'flex:1;min-height:0;overflow-y:auto;background:var(--background);color:var(--foreground);padding:22px 26px 60px;font-size:14px;line-height:1.65',
   },
     el('div', { style: 'max-width:76ch' },
       el('div', { style: 'display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:5px' },