create-pmos 0.55.0 → 0.55.2

package/workspace/public/pm/components.css

@@ -2120,6 +2120,144 @@
   }
 }
 
+/* 0.55.1 — the dock's sessions, grouped by initiative (dock-sessions.js). The side list, then the strip on top. */
+.fr-ds-group {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  padding-top: 8px;
+}
+.fr-ds-head {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  min-height: 28px;
+  padding-left: 6px;
+}
+.fr-ds-head__title {
+  flex: 1;
+  min-width: 0;
+  margin: 0;
+  overflow: hidden;
+  color: var(--muted-foreground);
+  font-size: 11px;
+  font-weight: 600;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.fr-ds-row {
+  gap: 2px;
+  padding: 2px 0 2px 6px;
+  border: 1px solid transparent;
+  background: transparent;
+}
+.fr-ds-row[data-front="true"] {
+  border-color: var(--border);
+  background: var(--card);
+}
+.fr-ds-confirm {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 4px;
+  padding: 6px;
+  border: 1px solid var(--destructive);
+}
+.fr-ds-confirm__text {
+  flex: 1 1 100%;
+  min-width: 0;
+  font-size: 12px;
+}
+.fr-ds-confirm--strip .fr-ds-confirm__text {
+  flex: none;
+}
+.fr-ds-confirm--strip {
+  flex: none;
+  flex-wrap: nowrap;
+  align-self: center;
+  padding: 0 6px;
+}
+.fr-ds-foot {
+  display: flex;
+  justify-content: flex-end;
+  gap: 4px;
+  margin-top: auto;
+  padding-top: 8px;
+  border-top: 1px solid var(--border);
+}
+.fr-ds-note {
+  margin: 0;
+  padding: 8px 6px;
+  color: var(--muted-foreground);
+  font-size: 12px;
+}
+.fr-ds-error {
+  margin: 0;
+  color: var(--destructive);
+  font-size: 12px;
+}
+.fr-ds-error:empty {
+  display: none;
+}
+.fr-ds-on {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+.fr-ds-starts {
+  display: flex;
+  flex-direction: column;
+}
+.fr-ds-starts[aria-busy="true"] {
+  opacity: 0.6;
+  pointer-events: none;
+}
+.fr-ds-starts__head {
+  margin: 8px 0 4px;
+  color: var(--muted-foreground);
+  font-size: 12px;
+  font-weight: 600;
+}
+.fr-ds-groupbox {
+  flex: none;
+  align-self: center;
+}
+.fr-ds-select {
+  max-width: 160px;
+  min-height: 28px;
+  font-size: 12px;
+}
+.fr-ds-chip {
+  flex: none;
+  align-self: center;
+  max-width: 160px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.fr-ds-push {
+  margin-left: auto;
+  align-self: center;
+}
+.fr-ds-tool {
+  align-self: center;
+}
+.fr-ds-select:focus-visible,
+.fr-ds-chip:focus-visible {
+  outline: 2px solid color-mix(in oklab, var(--ring) 50%, var(--foreground));
+  outline-offset: 1px;
+}
+@media (pointer: coarse) {
+  .fr-ds-head,
+  .fr-ds-select,
+  .fr-ds-chip {
+    min-height: 44px;
+  }
+  .fr-ds-row {
+    min-height: 48px;
+  }
+}
+
 /* -- layouts · .td- Today (Run 3, slice 3B) -- */
 .td-board {
   display: flex;
@@ -2172,6 +2310,7 @@
 }
 .td-day__hello { flex: 0 1 220px; min-width: 0; overflow: hidden; text-overflow: ellipsis; font-size: 14px; color: var(--foreground); white-space: nowrap; }
 .td-day__dim { color: var(--muted-foreground); }
+.td-day__warn { color: var(--warning); }
 .td-day__mono { font-family: var(--mono); font-variant-numeric: tabular-nums; font-size: 12px; }
 .td-day__steps { display: flex; flex-wrap: wrap; gap: 2px; list-style: none; margin: 0; padding: 0; }
 .td-day__ts { gap: 6px; padding: 0 6px; letter-spacing: 0.04em; color: var(--muted-foreground); }

package/workspace/public/pm/data.js

@@ -1321,6 +1321,14 @@ export async function bindSessionInitiative(id, initiative) {
   return out || { ok: false, error: 'the workspace server did not answer' };
 }
 
+/** 0.55.1 — the dock's ⋯ sheet: rename a session and set its type of work (`workType` null clears it). Labels only. */
+export async function setSessionMeta(id, patch) {
+  if (FIXTURE) return { ok: false, error: 'fixture mode has no server' };
+  const out = await postJson('/api/session/meta', { id, ...(patch || {}) });
+  if (out && out.ok) setTimeout(pollSessions, 200);
+  return out || { ok: false, error: 'the workspace server did not answer' };
+}
+
 /* ── the scratchpad ─────────────────────────────────────────────────────────────────────────────
  * The pad is PER SESSION, and the server has always stored it that way: `/api/scratchpad` is keyed
  * by the server-issued session id (workspace-scoped, one file per session, deleted with it). What

package/workspace/public/pm/dock-sessions.js

@@ -0,0 +1,373 @@
+/* pm/dock-sessions.js — the dock's sessions, grouped by initiative (0.55.1).
+ *
+ * The dock used to list tabs. A tab says nothing about what its session is for, so the PM could not tell which agent was
+ * working on which initiative, and ending a session, naming it or starting one on a branch took a trip to a separate sheet.
+ * This module is the dock's list of the repository's SESSIONS:
+ *
+ *   railNodes(repo, otherRows)     the side list: one group per initiative, then "Not linked", then "Scheduled", then the
+ *                                  open tabs that are not sessions (documents, skills, views) under "Open"
+ *   stripNodes(repo, otherNodes)   the strip on top: a group select, the group's sessions as chips, ＋ and ✕
+ *   listedSessionIds(repo)         the sessions the list shows, so the caller does not draw their tabs twice
+ *   openNewSessionSheet(repo, {initiative})
+ *                                  the one new-session sheet: name, initiative, where it runs, and how it starts
+ *
+ * The initiative of a session is the one it recorded (spawn or the PM's word), else the one its branch names
+ * (initiative/<id>). A session started by a schedule is in "Scheduled" whatever it is for. Ending a session asks in the row;
+ * when it was the last live session on its own working copy, the toast offers to remove that copy (the branch is kept; the
+ * server refuses unsaved work and says why). Live mode only.
+ */
+import { el } from './dom.js';
+import { state, setState } from './state.js';
+import { boardOf } from './board-read.js';
+import { button, iconButton, row, field, sheet, toast } from './primitives.js';
+import { COPY } from './frame-copy.js';
+import { sessionDefaults, loadSkills } from './dock.js';
+
+let dataMod = null; let termMod = null; let iniMod = null; let tabsMod = null;
+import('./data.js').then((m) => { dataMod = m; }).catch(() => { dataMod = null; });
+import('./tab-term.js').then((m) => { termMod = m; }).catch(() => { termMod = null; });
+import('./panel-initiatives.js').then((m) => { iniMod = m; }).catch(() => { iniMod = null; });
+import('./panel-tabs.js').then((m) => { tabsMod = m; }).catch(() => { tabsMod = null; });
+
+const C = () => COPY.dock.ds;
+export const WORK_TYPES = Object.freeze(['research', 'prototype', 'prd', 'build', 'review', 'report', 'general']);
+const isEnded = (s) => s.state === 'exited' || s.shown === 'exited';
+const typeLabel = (t) => (t && C().types[t]) || null;
+
+/** The type of work a skill starts, read from its id, name and label. Anything unrecognised is general work. */
+export function typeOfSkill(sk) {
+  const k = [sk && sk.id, sk && sk.skill, sk && sk.label].filter(Boolean).join(' ').toLowerCase();
+  if (/triage|review/.test(k)) return 'review';
+  if (/requirement|prd|spec/.test(k)) return 'prd';
+  if (/research|discover/.test(k)) return 'research';
+  if (/proto/.test(k)) return 'prototype';
+  if (/build|implement|code/.test(k)) return 'build';
+  if (/report|brief|biweekly/.test(k)) return 'report';
+  return 'general';
+}
+
+/* ── reading the sessions ─────────────────────────────────────────────────────────────────────────────────────────── */
+
+const treesOf = (repo) => (dataMod && typeof dataMod.productTrees === 'function' && repo ? dataMod.productTrees(repo) : []);
+const titleOf = (slug) => { const r = state.records && state.records[slug]; return (r && r.tag) || slug; };
+
+function initiativeOf(s, trees) {
+  if (s.initiative) return s.initiative;
+  const t = trees.find((x) => x.ws === s.ws);
+  return (t && t.initiative) || null;
+}
+
+/** Every session that runs in one of this repository's working trees, in the server's order. */
+function sessionsOfRepo(repo, trees) {
+  const in_ = new Set(trees.map((t) => t.ws));
+  return (Array.isArray(state.sessions) ? state.sessions : []).filter((s) => s && in_.has(s.ws));
+}
+
+/** [{ key, title, initiative, scheduled, sessions }]: initiatives in board order, then Not linked, then Scheduled. */
+export function groupsOf(repo) {
+  const trees = treesOf(repo);
+  const order = ((boardOf() || {})[repo] || []).flatMap((g) => g.slugs || []);
+  const rank = (slug) => { const i = order.indexOf(slug); return i < 0 ? order.length : i; };
+  const by = new Map(); const none = []; const sched = [];
+  for (const s of sessionsOfRepo(repo, trees)) {
+    if (String(s.origin || '').startsWith('schedule:')) { sched.push(s); continue; }
+    const i = initiativeOf(s, trees);
+    if (!i) { none.push(s); continue; }
+    if (!by.has(i)) by.set(i, []);
+    by.get(i).push(s);
+  }
+  const out = [...by.keys()].sort((a, b) => rank(a) - rank(b) || a.localeCompare(b))
+    .map((i) => ({ key: 'i:' + i, title: titleOf(i), initiative: i, scheduled: false, sessions: by.get(i) }));
+  if (none.length) out.push({ key: 'none', title: C().notLinked, initiative: null, scheduled: false, sessions: none });
+  if (sched.length) out.push({ key: 'sched', title: C().scheduled, initiative: null, scheduled: true, sessions: sched });
+  return out;
+}
+
+export function listedSessionIds(repo) {
+  return new Set(groupsOf(repo).flatMap((g) => g.sessions.map((s) => s.id)));
+}
+
+const frontTab = () => (state.tabs || []).find((t) => t.id === state.active) || null;
+function frontSessionId() {
+  const t = frontTab();
+  return t && t.kind === 'term' ? t.sessionId || null : null;
+}
+
+/** Bring a session to the front: its open tab when it has one, else a new tab on that exact process. */
+export function openSession(s) {
+  const t = (state.tabs || []).find((x) => x.kind === 'term' && x.sessionId === s.id);
+  if (t) { setState({ active: t.id }); return; }
+  if (iniMod) iniMod.openTerm(null, { id: s.id, name: s.name, st: isEnded(s) ? 'exited' : 'working', profile: s.profile_id || null });
+}
+
+function metaOf(s, trees) {
+  const parts = [typeLabel(s.work_type) || C().types.general];
+  if (isEnded(s)) parts.push(C().ended);
+  const t = trees.find((x) => x.ws === s.ws);
+  // the branch is named when the session is not on main, unless it is the initiative's own (the group already says that)
+  const own = t && t.initiative && t.initiative === initiativeOf(s, trees);
+  if (t && !t.main && !own) parts.push('⑂ ' + (t.branch || 'detached'));
+  return parts.join(' · ');
+}
+
+/* ── ending a session ─────────────────────────────────────────────────────────────────────────────────────────────── */
+
+async function endSession(repo, s) {
+  if (!dataMod) return;
+  // Which tabs are on this session, read BEFORE asking: once the server drops it, a tab re-joins by name and stops saying.
+  const tabIds = tabsMod && typeof tabsMod.tabIdsOfSession === 'function' ? tabsMod.tabIdsOfSession(s.id) : [];
+  const t = treesOf(repo).find((x) => x.ws === s.ws) || null;
+  const othersLive = (state.sessions || []).some((x) => x && x.id !== s.id && x.ws === s.ws && !isEnded(x));
+  let out = await dataMod.removeSessionById(s.id);
+  // "asked it to end, not exited yet": the process is going. Ask again a few times rather than make the PM press twice;
+  // a session that is gone by then ("no such session") has ended.
+  for (let i = 0; i < 5 && out && out.ok !== false && out.removed === false; i++) {
+    await new Promise((r) => setTimeout(r, 600));
+    const again = await dataMod.removeSessionById(s.id);
+    out = again && again.ok === false && /no such session/.test(again.error || '') ? { ok: true, removed: true } : again;
+  }
+  setState({ dsEnding: null });
+  if (!out || out.ok === false) { toast({ text: (out && out.error) || C().endFailed, tone: 'error' }); return; }
+  if (out.removed !== false && tabsMod && typeof tabsMod.closeTabsById === 'function') tabsMod.closeTabsById(tabIds);
+  if (t && !t.main && !othersLive) {
+    toast({ text: C().endedTree(s.name, t.branch || 'detached'), actionLabel: C().removeCopy, timeout: 12000, onAction: () => removeCopy(t) });
+  } else {
+    toast({ text: out.removed === false ? (out.note || C().endedOne(s.name)) : C().endedOne(s.name) });
+  }
+}
+
+async function removeCopy(t) {
+  const out = dataMod ? await dataMod.removeWorktree(t.ws, t.dir) : null;
+  if (out && out.ok !== false) {
+    toast({ text: C().copyRemoved(t.branch || 'detached') });
+    if (typeof dataMod.refreshTrees === 'function') dataMod.refreshTrees();
+  } else {
+    toast({ text: C().copyKept((out && out.error) || C().refused), tone: 'error', timeout: 10000 });
+  }
+}
+
+function confirmNode(repo, s, cls) {
+  return el('div', { class: cls, role: 'group', 'aria-label': C().endAsk(s.name), 'data-ds-confirm': s.id },
+    el('span', { class: 'fr-ds-confirm__text' }, C().endAsk(s.name)),
+    button({ label: C().endYes, variant: 'danger', size: 'sm', onClick: () => endSession(repo, s), attrs: { 'data-ds': 'end-yes' } }),
+    button({ label: C().cancel, variant: 'ghost', size: 'sm', onClick: () => setState({ dsEnding: null }), attrs: { 'data-ds': 'end-no' } }));
+}
+
+/* ── the ⋯ sheet: name, initiative, type of work ──────────────────────────────────────────────────────────────────── */
+
+function initiativeOptions(repo) {
+  const slugs = [...new Set(((boardOf() || {})[repo] || []).flatMap((g) => g.slugs || []))];
+  return slugs.map((slug) => ({ value: slug, label: titleOf(slug) === slug ? slug : titleOf(slug) + ' (' + slug + ')' }));
+}
+
+function retitleTabs(id, name) {
+  setState((st) => ({ tabs: (st.tabs || []).map((t) => (t.kind === 'term' && t.sessionId === id ? { ...t, title: name } : t)) }));
+}
+
+export function openMetaSheet(repo, s) {
+  const opts = initiativeOptions(repo);
+  if (s.initiative && !opts.some((o) => o.value === s.initiative)) opts.unshift({ value: s.initiative, label: s.initiative });
+  const nameF = field({ label: C().name, value: s.name, attrs: { 'data-ds': 'meta-name' } });
+  const iniF = field({ label: C().initiative, kind: 'select', value: s.initiative || '', options: [{ value: '', label: C().noInitiative }, ...opts], attrs: { 'data-ds': 'meta-initiative' } });
+  const typeF = field({ label: C().type, kind: 'select', value: s.work_type || '', attrs: { 'data-ds': 'meta-type' },
+    options: [{ value: '', label: C().noType }, ...WORK_TYPES.map((w) => ({ value: w, label: C().types[w] }))] });
+  const err = el('p', { class: 'fr-ds-error', role: 'alert' });
+  let busy = false;
+  const save = async () => {
+    if (busy || !dataMod) return;
+    busy = true; err.textContent = '';
+    const patch = {};
+    const nm = nameF.control.value.trim();
+    if (nm && nm !== s.name) patch.name = nm;
+    const wt = typeF.control.value || null;
+    if (wt !== (s.work_type || null)) patch.workType = wt;
+    if (Object.keys(patch).length) {
+      const o = await dataMod.setSessionMeta(s.id, patch);
+      if (!o || o.ok === false) { err.textContent = (o && o.error) || C().saveFailed; busy = false; return; }
+      if (patch.name) retitleTabs(s.id, o.name || patch.name);
+    }
+    const ni = iniF.control.value || null;
+    if (ni !== (s.initiative || null)) {
+      const o = await dataMod.bindSessionInitiative(s.id, ni);
+      if (!o || o.ok === false) { err.textContent = (o && o.error) || C().saveFailed; busy = false; return; }
+    }
+    sh.close();
+  };
+  const sh = sheet({
+    title: C().metaTitle, sub: s.name, body: [nameF, iniF, typeF, err], attrs: { 'data-ds': 'meta' },
+    actions: [
+      button({ label: C().cancel, variant: 'ghost', onClick: () => sh.close() }),
+      button({ label: C().save, variant: 'primary', onClick: save, attrs: { 'data-ds': 'meta-save' } }),
+    ],
+  });
+  return sh;
+}
+
+/* ── the new-session sheet ────────────────────────────────────────────────────────────────────────────────────────── */
+
+function uniqueName(base) {
+  const taken = new Set((state.sessions || []).filter((s) => s && !isEnded(s)).map((s) => s.name));
+  if (!taken.has(base)) return base;
+  for (let i = 2; ; i += 1) if (!taken.has(base + ' ' + i)) return base + ' ' + i;
+}
+
+/**
+ * One sheet, one list. "On" defaults to Automatic: the server's start policy picks the tree (the initiative's own working
+ * copy on initiative/<id>, made the first time, or the main tree when there is no initiative). An existing tree or a new
+ * branch can be chosen instead. A press on Blank session or on a skill starts it at once.
+ */
+export function openNewSessionSheet(repo, preset) {
+  const trees = treesOf(repo);
+  const main = trees.find((t) => t.main) || trees[0] || null;
+  const ws = main ? main.ws : (dataMod && dataMod.wsOf ? dataMod.wsOf(repo) : null);
+  const d = sessionDefaults();
+  const m = { initiative: (preset && preset.initiative) || '', on: 'auto', busy: false };
+
+  const nameF = field({ label: C().name, placeholder: C().namePh, attrs: { 'data-ds': 'new-name' } });
+  const opts = initiativeOptions(repo);
+  if (m.initiative && !opts.some((o) => o.value === m.initiative)) opts.unshift({ value: m.initiative, label: m.initiative });
+  const forF = field({ label: C().forLabel, kind: 'select', value: m.initiative, attrs: { 'data-ds': 'new-for' },
+    options: [{ value: '', label: C().noInitiative }, ...opts], onCommit: (v) => { m.initiative = v; paintOn(); } });
+  const branchF = field({ label: C().branchName, placeholder: 'feature/…', attrs: { 'data-ds': 'new-branch' } });
+  const onHost = el('div', { class: 'fr-ds-on' });
+  const err = el('p', { class: 'fr-ds-error', role: 'alert' });
+  const list = el('div', { class: 'fr-ds-starts', 'data-ds': 'starts' });
+
+  const autoWhere = () => {
+    if (!m.initiative) return C().mainTree(main && main.branch);
+    const b = 'initiative/' + m.initiative;
+    return trees.some((t) => t.branch === b) ? '⑂ ' + b : C().newFolder(b);
+  };
+  function paintOn() {
+    const options = [{ value: 'auto', label: C().auto(autoWhere()) },
+      ...trees.map((t) => ({ value: 'ws:' + t.ws, label: t.main ? C().mainTree(t.branch) : '⑂ ' + (t.branch || 'detached') })),
+      { value: 'new', label: C().newBranch }];
+    const onF = field({ label: C().on, kind: 'select', value: m.on, options, attrs: { 'data-ds': 'new-on' }, onCommit: (v) => { m.on = v; paintOn(); } });
+    onHost.replaceChildren(onF, m.on === 'new' ? branchF : '');
+  }
+
+  async function go(sk) {
+    if (m.busy) return;
+    if (!termMod || !ws) { err.textContent = C().refused; return; }
+    err.textContent = '';
+    const typed = nameF.control.value.trim();
+    const base = (sk ? (sk.label || sk.skill || sk.id) : (d.cli === 'claude' ? 'Claude' : 'Shell')) + (m.initiative ? ' · ' + m.initiative : '');
+    const name = typed || uniqueName(base);
+    const common = {
+      name, agent: sk ? 'claude' : d.cli, initiative: m.initiative || null, profile: null,
+      skill: sk ? sk.id : null, workType: sk ? typeOfSkill(sk) : 'general',
+      tier: !sk && d.cli === 'claude' && d.tier !== 'auto' ? d.tier : null,
+    };
+    let opts;
+    if (m.on === 'auto') opts = { ...common, start: true, ws };
+    else if (m.on === 'new') {
+      const b = branchF.control.value.trim();
+      if (!b) { err.textContent = C().needBranch; return; }
+      opts = { ...common, ws, branch: b, createBranch: true, isolate: true };
+    } else opts = { ...common, ws: m.on.slice(3), branch: null, createBranch: false, isolate: null };
+    m.busy = true; list.setAttribute('aria-busy', 'true');
+    const res = await termMod.requestSpawn(opts);
+    m.busy = false; list.removeAttribute('aria-busy');
+    if (!res || !res.ok) { err.textContent = (res && res.error) || C().refused; return; }
+    sh.close();
+    if (iniMod) iniMod.openTerm(null, { id: res.id, name, st: 'working', profile: null });
+    if (dataMod && typeof dataMod.startSession === 'function') dataMod.startSession(null, null);
+    // a session that shares its working tree with a running one is told so: their edits land in the same files
+    if (res.notice && /already running/.test(res.notice)) toast({ text: res.notice, timeout: 12000 });
+  }
+
+  function paintStarts(got) {
+    const rows = [row({ title: C().blank, meta: [C().blankMeta(d.cli, d.tier)], onOpen: () => go(null), attrs: { class: 'fr-ds-start', 'data-ds-start': 'blank' } })];
+    for (const sk of (got && got.list) || []) {
+      rows.push(row({ title: sk.label || sk.skill || sk.id, meta: [C().types[typeOfSkill(sk)]], onOpen: () => go(sk),
+        attrs: { class: 'fr-ds-start', 'data-ds-start': sk.id } }));
+    }
+    const note = !got ? C().skillsLoading : (got.error ? COPY.dock.skillsUnread : (got.list && got.list.length ? null : COPY.dock.noSkills));
+    list.replaceChildren(el('h3', { class: 'fr-ds-starts__head' }, C().startHead), ...rows, note ? el('p', { class: 'fr-ds-note' }, note) : '');
+  }
+
+  paintOn();
+  paintStarts(null);
+  loadSkills(ws).then((got) => paintStarts(got || { list: [], error: true }), () => paintStarts({ list: [], error: true }));
+  const sh = sheet({
+    title: m.initiative ? C().newFor(titleOf(m.initiative)) : C().newTitle, sub: C().newSub,
+    body: [nameF, forF, onHost, err, list], attrs: { 'data-ds': 'new' },
+  });
+  return sh;
+}
+
+/* ── the side list ────────────────────────────────────────────────────────────────────────────────────────────────── */
+
+function sessionRow(repo, s, trees, front) {
+  if (state.dsEnding === s.id) return confirmNode(repo, s, 'fr-ds-confirm');
+  return row({
+    title: s.name, meta: [metaOf(s, trees)], onOpen: () => openSession(s), openLabel: C().open(s.name),
+    trail: [
+      iconButton({ icon: 'ellipsis', ariaLabel: C().more(s.name), onClick: () => openMetaSheet(repo, s), attrs: { 'data-ds': 'more' } }),
+      iconButton({ icon: 'x', ariaLabel: C().end(s.name), onClick: () => setState({ dsEnding: s.id }), attrs: { 'data-ds': 'end' } }),
+    ],
+    attrs: { class: 'fr-ds-row', 'data-ds-session': s.id, 'data-front': front ? 'true' : 'false' },
+  });
+}
+
+function groupHead(repo, g) {
+  return el('div', { class: 'fr-ds-head', 'data-ds-group': g.key },
+    el('h3', { class: 'fr-ds-head__title', title: g.initiative || g.title }, g.title),
+    g.scheduled ? '' : iconButton({ icon: 'plus', ariaLabel: g.initiative ? C().newFor(g.title) : C().newTitle,
+      onClick: () => openNewSessionSheet(repo, { initiative: g.initiative }), attrs: { 'data-ds': 'group-new' } }));
+}
+
+/** The side list's nodes: the session groups, then "Open" with the caller's rows for the tabs that are not sessions. */
+export function railNodes(repo, otherRows) {
+  const trees = treesOf(repo);
+  const front = frontSessionId();
+  const out = [];
+  const groups = groupsOf(repo);
+  for (const g of groups) {
+    out.push(el('section', { class: 'fr-ds-group', 'data-ds-section': g.key }, groupHead(repo, g),
+      ...g.sessions.map((s) => sessionRow(repo, s, trees, s.id === front))));
+  }
+  if (otherRows && otherRows.length) {
+    out.push(el('section', { class: 'fr-ds-group', 'data-ds-section': 'open' },
+      el('div', { class: 'fr-ds-head' }, el('h3', { class: 'fr-ds-head__title' }, C().openTabs)), ...otherRows));
+  }
+  if (!groups.length && !(otherRows && otherRows.length)) out.push(el('p', { class: 'fr-ds-note' }, C().none));
+  return out;
+}
+
+/* ── the strip on top ─────────────────────────────────────────────────────────────────────────────────────────────── */
+
+/** The strip's nodes: the group select, the chips of that group, then ＋ and ✕. `otherNodes` are the non-session tabs. */
+export function stripNodes(repo, otherNodes) {
+  const trees = treesOf(repo);
+  const groups = groupsOf(repo).map((g) => ({ key: g.key, title: g.title, sessions: g.sessions, initiative: g.initiative }));
+  if (otherNodes && otherNodes.length) groups.push({ key: 'open', title: C().openTabs, sessions: null });
+  const front = frontSessionId();
+  const ft = frontTab();
+  const frontKey = front ? (groups.find((g) => g.sessions && g.sessions.some((s) => s.id === front)) || {}).key : (ft ? 'open' : null);
+  const sel = groups.find((g) => g.key === state.dsGroup) ? state.dsGroup : (groups.find((g) => g.key === frontKey) ? frontKey : (groups[0] && groups[0].key));
+  const g = groups.find((x) => x.key === sel) || null;
+  const ending = front && state.dsEnding === front ? (state.sessions || []).find((s) => s && s.id === front) : null;
+
+  const out = [];
+  if (groups.length) {
+    out.push(el('div', { class: 'fr-ds-groupbox' }, field({ label: C().group, hideLabel: true, kind: 'select', value: sel || '', attrs: { 'data-ds': 'group', class: 'fr-ds-select' },
+      options: groups.map((x) => ({ value: x.key, label: x.title + ' (' + (x.sessions ? x.sessions.length : otherNodes.length) + ')' })),
+      onCommit: (v) => setState({ dsGroup: v, dsEnding: null }) })));
+  } else out.push(el('span', { class: 'fr-ds-note' }, C().none));
+  if (ending) out.push(confirmNode(repo, ending, 'fr-ds-confirm fr-ds-confirm--strip'));
+  else if (g && g.sessions) {
+    for (const s of g.sessions) {
+      const on = s.id === front;
+      out.push(button({ label: s.name, variant: on ? 'outline' : 'ghost', size: 'sm', onClick: () => openSession(s),
+        attrs: { class: 'fr-ds-chip', 'data-ds-session': s.id, 'aria-pressed': on ? 'true' : 'false', title: s.name + ' · ' + metaOf(s, trees) } }));
+    }
+  } else if (g) out.push(...otherNodes);
+  out.push(iconButton({ icon: 'plus', ariaLabel: g && g.initiative ? C().newFor(g.title) : C().newTitle,
+    onClick: () => openNewSessionSheet(repo, { initiative: g && g.initiative }), attrs: { 'data-ds': 'strip-new', 'data-fr': 'session', class: 'fr-ds-push' } }));
+  out.push(iconButton({ icon: 'x', ariaLabel: C().endFront, attrs: { 'data-ds': 'strip-end', class: 'fr-ds-tool' }, onClick: () => {
+    if (front) setState({ dsEnding: front, dsGroup: frontKey || null });
+    else if (ft && tabsMod) tabsMod.closeTab(ft.id);
+  } }));
+  return out;
+}

package/workspace/public/pm/dock.js

@@ -11,9 +11,8 @@
  *   foldButton({ fold })                  the control in the open dock's strip that folds it back to the rail
  *   focusButton({ toggle }) / paintFocus(b, on)
  *                                         Focus: the dock takes the whole window, and Exit focus gives the page back (0.53.1)
- *   sessionMenuButton({ newSession, withOptions, openSkill, ws })
- *                                         "＋ Session": New session, Session with options, then the skills to start
- *                                         from (R10: Skills start from the dock's ＋session menu; the Skills view goes)
+ *   sessionMenuButton({ open, ws })      "＋ Session": opens the new-session sheet (dock-sessions.js): a blank
+ *                                         session or a skill to start from (R10; one list since 0.55.1)
  *   sessionDefaults() / setSessionDefaults(patch)
  *                                         the default CLI and model that Settings sets and the session menu applies
  *
@@ -24,7 +23,8 @@
 import { el } from './dom.js';
 import { FIXTURE } from './state.js';
 import { pmGet } from './http.js';
-import { button, iconButton, menu } from './primitives.js';
+import { button, iconButton } from './primitives.js';
+import { icon } from './icons.js';
 import { COPY } from './frame-copy.js';
 
 /* ── the default CLI and model ────────────────────────────────────────────────────────────────────────────────────── */
@@ -103,23 +103,21 @@ const endDrag = () => { if (drag) { drag.g.removeAttribute('data-dragging'); dra
 window.addEventListener('pointerup', endDrag);
 window.addEventListener('pointercancel', endDrag);
 
-const focusLabels = new WeakMap();   // the Focus control -> its label node
+/* 0.55.1: icon only (the PM asked for no label): maximize-2 to focus, minimize-2 to leave; the name is the aria-label. */
 export function focusButton({ toggle } = {}) {
-  const label = el('span', null, COPY.dock.focus);
-  const b = button({ label, variant: 'ghost', size: 'sm',
-    attrs: { class: 'fr-dock-focus', 'data-fr': 'dock-focus', 'aria-pressed': 'false', title: COPY.dock.focusTitle, 'aria-keyshortcuts': 'Meta+Shift+J Control+Shift+J' },
-    onClick: () => toggle && toggle() });
-  focusLabels.set(b, label);
-  return b;
+  return iconButton({ icon: 'maximize-2', ariaLabel: COPY.dock.focusTitle, onClick: () => toggle && toggle(),
+    attrs: { class: 'fr-dock-focus', 'data-fr': 'dock-focus', 'aria-pressed': 'false', 'aria-keyshortcuts': 'Meta+Shift+J Control+Shift+J' } });
 }
 /** Show the Focus control's state: pressed while the dock has the whole window. */
 export function paintFocus(b, on) {
   if (!b) return;
-  const label = focusLabels.get(b);
-  const text = on ? COPY.dock.unfocus : COPY.dock.focus;
-  if (label && label.textContent !== text) label.textContent = text;
+  const name = on ? 'minimize-2' : 'maximize-2';
+  const cur = b.querySelector('[data-icon]');
+  if (!cur || cur.getAttribute('data-icon') !== name) b.replaceChildren(icon(name));
   b.setAttribute('aria-pressed', on ? 'true' : 'false');
-  b.title = on ? COPY.dock.unfocusTitle : COPY.dock.focusTitle;
+  const label = on ? COPY.dock.unfocusTitle : COPY.dock.focusTitle;
+  b.setAttribute('aria-label', label);
+  b.title = label;
 }
 
 export function foldButton({ fold } = {}) {
@@ -131,7 +129,7 @@ export function foldButton({ fold } = {}) {
 const skillsByWs = new Map();   // ws -> { at, list | null, error }
 const SKILLS_TTL = 60000;
 
-function loadSkills(ws) {
+export function loadSkills(ws) {
   const key = ws || '';
   const have = skillsByWs.get(key);
   if (have && (have.pending || Date.now() - have.at < SKILLS_TTL)) return have.pending || Promise.resolve(have);
@@ -148,28 +146,14 @@ function loadSkills(ws) {
 }
 
 /**
- * The dock's "＋ Session" control. A press opens a menu: New session (the one-click start, or the options form when the
- * default CLI is not the shell, because only the form can start another CLI), Session with options, and one item per
- * skill of the repository. A skill opens in its own tab in the dock, where it is read and started.
+ * The dock's "＋ Session" control (0.55.1: one press, one sheet). The sheet (dock-sessions.js) holds the name, the
+ * initiative, where it runs, and the list to start from: a blank session or one of the repository's skills.
  */
-export function sessionMenuButton({ newSession, withOptions, openSkill, ws } = {}) {
+export function sessionMenuButton({ open, ws } = {}) {
   if (!FIXTURE) loadSkills(ws);
-  const b = button({
-    label: COPY.dock.session, variant: 'outline', size: 'sm', icon: 'plus', iconEnd: 'chevron-down',
-    attrs: { class: 'fr-session', 'data-fr': 'session', 'aria-haspopup': 'menu', 'aria-label': COPY.dock.sessionMenu },
-    onClick: async () => {
-      const got = FIXTURE ? null : await loadSkills(ws);
-      const d = sessionDefaults();
-      const items = [
-        { label: COPY.dock.newSession, onSelect: () => (d.cli === 'shell' ? newSession && newSession() : withOptions && withOptions(d)) },
-        { label: COPY.dock.withOptions, onSelect: () => withOptions && withOptions(d) },
-        { sep: true },
-      ];
-      const list = got && got.list ? got.list : [];
-      if (!list.length) items.push({ label: got && got.error ? COPY.dock.skillsUnread : COPY.dock.noSkills, onSelect: () => {} });
-      for (const sk of list) items.push({ label: COPY.dock.skillsHead + ': ' + (sk.label || sk.skill || sk.id), onSelect: () => openSkill && openSkill(sk) });
-      menu({ anchor: b, items, ariaLabel: COPY.dock.sessionMenu });
-    },
+  return button({
+    label: COPY.dock.session, variant: 'outline', size: 'sm', icon: 'plus',
+    attrs: { class: 'fr-session', 'data-fr': 'session', 'aria-haspopup': 'dialog', 'aria-label': COPY.dock.sessionMenu },
+    onClick: () => open && open(),
   });
-  return b;
 }