@ra3orblade/swarm 0.5.0 → 0.7.0

package/web/app.js

@@ -45,7 +45,7 @@ document.addEventListener("keydown", (ev) => {
   window.swarmZoom(dir);
 });
 // `dirty`: a UI-side change (selection, view, filter) needs a render even when the daemon snapshot is unchanged.
-const state = { projects: [], sessions: [], worktrees: {}, processes: [], spend: null, incidents: [], allIncidents: null, incFilter: "open", tasks: null, gates: null, runs: [], taskFilter: "ready", resources: [], prs: [], seq: 0, sel: null, session: null, log: [], turns: [], view: "fleet", agentFilter: null, dirty: true };
+const state = { projects: [], sessions: [], worktrees: {}, processes: [], spend: null, incidents: [], allIncidents: null, incFilter: "open", tasks: null, gates: null, dispatch: null, questions: [], budget: null, runs: [], attribution: null, taskFilter: "ready", resources: [], prs: [], seq: 0, sel: null, session: null, log: [], turns: [], view: "fleet", agentFilter: null, dirty: true };
 
 const esc = (s) => String(s ?? "").replace(/[&<>"]/g, (c) => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;" })[c]);
 const ago = (iso) => { const d = (Date.now() - new Date(iso)) / 1000; return d < 60 ? `${d | 0}s` : d < 3600 ? `${(d / 60) | 0}m` : d < 86400 ? `${(d / 3600) | 0}h` : `${(d / 86400) | 0}d`; };
@@ -129,13 +129,25 @@ async function refresh() {
   const txt = await (await fetch("/v1/state")).text();
   const same = txt === lastSnap;
   if (!same) { lastSnap = txt; Object.assign(state, JSON.parse(txt)); }
-  if (!state.version) fetch("/v1/health").then((r) => r.json()).then((h) => { state.version = h.version; }).catch(() => {});
+  if (!state.version) fetch("/v1/health").then((r) => r.json()).then((h) => { state.version = h.version; maybeWhatsNew(); }).catch(() => {});
   let prsChanged = false;
   if (state.view === "prs" && !state.session) {
     const prs = await (await fetch("/v1/prs")).json().catch(() => state.prs ?? []);
     prsChanged = JSON.stringify(prs) !== JSON.stringify(state.prs);
     state.prs = prs;
   }
+  let attrChanged = false;
+  if (state.view === "spend" && state.sel && !state.session) {
+    const [a, bd] = await Promise.all([
+      fetch(`/v1/attribution?project=${encodeURIComponent(state.sel)}`).then((r) => r.json()).catch(() => state.attribution),
+      fetch(`/v1/budget?project=${encodeURIComponent(state.sel)}`).then((r) => r.json()).catch(() => state.budget),
+    ]);
+    attrChanged = JSON.stringify(a) !== JSON.stringify(state.attribution) || JSON.stringify(bd) !== JSON.stringify(state.budget);
+    state.attribution = a; state.budget = bd;
+  } else if (state.view === "spend" && !state.sel) {
+    if (state.attribution) attrChanged = true;
+    state.attribution = null;
+  }
   let runsChanged = false;
   const openSpawned = state.session && state.sessions.find((x) => x.id === state.session)?.kind === "spawned";
   if (openSpawned || (state.view === "board" && !state.session) || (state.view === "fleet" && !state.session)) {
@@ -145,12 +157,13 @@ async function refresh() {
   }
   let tasksChanged = false;
   if (state.view === "board" && state.sel && !state.session) {
-    const [t, g] = await Promise.all([
+    const [t, g, d] = await Promise.all([
       fetch(`/v1/tasks?project=${encodeURIComponent(state.sel)}`).then((r) => r.json()).catch(() => state.tasks),
       fetch(`/v1/gates?project=${encodeURIComponent(state.sel)}`).then((r) => r.json()).catch(() => state.gates),
+      fetch(`/v1/dispatch?project=${encodeURIComponent(state.sel)}`).then((r) => r.json()).catch(() => state.dispatch),
     ]);
-    tasksChanged = JSON.stringify(t) !== JSON.stringify(state.tasks) || JSON.stringify(g) !== JSON.stringify(state.gates);
-    state.tasks = t; state.gates = g;
+    tasksChanged = JSON.stringify(t) !== JSON.stringify(state.tasks) || JSON.stringify(g) !== JSON.stringify(state.gates) || JSON.stringify(d) !== JSON.stringify(state.dispatch);
+    state.tasks = t; state.gates = g; state.dispatch = d;
   }
   let incChanged = false;
   if (state.view === "incidents" && !state.session) {
@@ -159,9 +172,9 @@ async function refresh() {
     incChanged = JSON.stringify(inc) !== JSON.stringify(state.allIncidents);
     state.allIncidents = inc;
   }
-  if (!same || prsChanged || incChanged || tasksChanged || runsChanged || state.dirty || Date.now() - lastRenderAt > 30_000) schedule();
+  if (!same || prsChanged || incChanged || tasksChanged || runsChanged || attrChanged || state.dirty || Date.now() - lastRenderAt > 30_000) schedule();
 }
-const VIEWS = ["fleet", "board", "incidents", "prs", "timeline", "spend", "stats"];
+const VIEWS = ["fleet", "board", "incidents", "prs", "timeline", "spend", "stats", "search"];
 // restore last view + project selection (persisted UI state)
 {
   const v = localStorage.getItem("swarm.view");
@@ -186,6 +199,7 @@ function render() {
   if (state.session) renderSession();
   else if (state.view === "spend") renderSpend();
   else if (state.view === "stats") { loadStats(); renderStats(); } // loadStats is a no-op while the cache is fresh
+  else if (state.view === "search") renderSearch();
   else if (state.view === "timeline") renderTimeline();
   else if (state.view === "board") renderBoard();
   else if (state.view === "incidents") renderIncidentsView();
@@ -278,8 +292,8 @@ projectsEl.addEventListener("dragend", () => {
 // Fleet data-grid columns (sortable/resizable/reorderable/filterable via table.js).
 const FLEET_COLS = [
   { key: "project", label: "project", width: 104, get: (s) => projName(s.projectId), cell: (s) => esc(projName(s.projectId)) },
-  { key: "agent", label: "agent", width: 76, get: (s) => agentLabel(s.agent), cell: (s) => agentBadge(s.agent) },
-  { key: "session", label: "session", width: 236, get: (s) => s.title ?? s.id, cell: (s) => `${kindIcon(s)}<b>${esc(s.title ?? s.id.slice(0, 8))}</b>${s.subagents ? ` <span class="badge acc">${s.subagents} Sub</span>` : ""}` },
+  { key: "agent", label: "agent", width: 84, cls: "td-badge", get: (s) => agentLabel(s.agent), cell: (s) => agentBadge(s.agent) },
+  { key: "session", label: "session", width: 236, get: (s) => s.title ?? s.id, cell: (s) => `${kindIcon(s)}<b>${esc(s.title ?? s.id.slice(0, 8))}</b>${s.subagents ? ` <span class="badge acc">${s.subagents} Sub</span>` : ""}${(state.questions ?? []).some((q) => q.sessionId === s.id) ? ' <span class="badge warn" title="This agent asked a question only a human can answer — open the session">Asking</span>' : ""}` },
   { key: "branch", label: "branch", width: 134, get: (s) => s.branch ?? "", cell: (s) => `<span class="br">${esc(s.branch ?? "")}</span>` },
   { key: "now", label: "now", flex: true, get: (s) => s.last, cell: (s) => `<span class="now" title="${esc(s.last)}">${esc(s.state === "waiting" ? (s.lastText ? s.lastText.split("\n")[0] : s.last) : s.last)}</span>` },
   { key: "model", label: "model", width: 96, get: (s) => model(s.model), cell: (s) => `<span class="br">${esc(model(s.model))}${s.models > 1 ? ` <span class="faint">+${s.models - 1}</span>` : ""}</span>` },
@@ -356,7 +370,7 @@ function renderPRs() {
 
 // ---------- board (coordination: claims, worktrees, incidents)
 function renderBoard() {
-  const parts = [renderTasks(), renderGates(), renderProcesses(), renderResources(), renderClaims(), renderWorktrees(), renderIncidents()].filter(Boolean);
+  const parts = [renderTasks(), renderDispatch(), renderGates(), renderProcesses(), renderResources(), renderClaims(), renderWorktrees(), renderIncidents()].filter(Boolean);
   $("#main").innerHTML = parts.length
     ? parts.join("").replace(/^(<h2) class="mt-sec"/, "$1") // first section needs no top gap
     : `<div class="empty">${PX.idle()}Nothing on the board.<br>Tasks, processes, claims, worktrees, and incidents appear here.</div>`;
@@ -397,7 +411,64 @@ function renderIncidents() {
     });
 }
 
+// M4.6: rule dry-run — replay this project's history under chosen modes; nothing is recorded.
+const RULE_IDS = ["pattern_kill", "shared_tree", "destructive_git", "protected_ports", "no_foreign_worktree", "claim_required_to_write"];
+const dry = { modes: {}, report: null, busy: false };
+async function openDryRun() {
+  if (!state.sel) return alert("Pick a project in the sidebar first — the dry-run replays one project's history.");
+  dry.modes = {}; dry.report = null;
+  await runDryRun();
+}
+async function runDryRun() {
+  dry.busy = true; renderDryRun();
+  const q = new URLSearchParams({ project: state.sel, ...dry.modes });
+  dry.report = await fetch(`/v1/rules/dryrun?${q}`).then((r) => r.json()).catch((e) => ({ ok: false, error: String(e) }));
+  dry.busy = false; renderDryRun();
+}
+function renderDryRun() {
+  const r = dry.report;
+  const sel = (id) => {
+    const cur = dry.modes[id] ?? r?.modes?.[id] ?? "ask";
+    return `<label class="dr-rule"><span class="br">${id}</span><select data-drmode="${id}">${["ask", "deny", "off"].map((m) => `<option value="${m}" ${m === cur ? "selected" : ""}>${m}</option>`).join("")}</select>${r ? `<span class="dim">ask <b>${r.byRule[id].ask}</b> · deny <b>${r.byRule[id].deny}</b></span>` : ""}</label>`;
+  };
+  const flaky = (r?.flaky ?? []).map((f) => `<div class="dr-flaky"><code>${esc(f.display)}</code><div class="dim" style="font-size:var(--fs-sm)">${esc(f.suggestion)} · ${f.sessions} session${f.sessions === 1 ? "" : "s"}</div></div>`).join("");
+  const hits = (r?.hits ?? []).slice(-40).reverse().map((h) => `<tr><td class="dim">${hhmm(h.ts)}</td><td><span class="br">${esc(h.rule)}</span></td><td>${h.action}</td><td><code>${esc(h.display)}</code></td><td class="dim">${h.completed ? "ran" : ""}</td></tr>`).join("");
+  $("#picker").innerHTML = `<div class="pk wn" role="dialog" aria-modal="true">
+    <div class="pk-h">${ic("shield", 15)}<b>Rule dry-run</b><span class="dim" style="margin-left:8px">${esc(projName(state.sel))}</span><span class="grow"></span><button id="pkCancel" title="Close">${ic("x", 14)}</button></div>
+    <div class="pk-b">
+      <p class="dim" style="font-size:var(--fs-sm)">Replays this project's recorded tool calls through the rules under the modes below — what <em>would</em> have been asked or denied. Nothing is recorded; change a mode and re-run to try a rule before switching it on in <code>.swarm.toml</code>.</p>
+      <div class="dr-rules">${RULE_IDS.map(sel).join("")}</div>
+      ${dry.busy ? '<p class="dim">replaying…</p>' : r?.error ? `<p class="dim">${esc(r.error)}</p>` : r ? `
+      <div class="date">${r.evaluated} of ${r.calls} calls evaluated · ${r.hits.length}${r.hits.length >= 200 ? "+" : ""} hits</div>
+      <h4>Flaky signals <span class="dim">rules that keep asking about something that is then allowed anyway</span></h4>
+      ${flaky || '<p class="dim" style="font-size:var(--fs-sm)">None — every rule that fired stuck.</p>'}
+      <h4>Would have fired <span class="dim">newest first, last 40</span></h4>
+      ${hits ? `<div style="overflow-x:auto"><table class="plain"><tbody>${hits}</tbody></table></div>` : '<p class="dim" style="font-size:var(--fs-sm)">Nothing — these modes are silent on this history.</p>'}` : ""}
+    </div>
+    <div class="pk-f"><span class="grow"></span><button id="drRun" ${dry.busy ? "disabled" : ""}>Re-run</button><button id="pkCancel">Close</button></div>
+  </div>`;
+}
+
 // ---------- incidents view (M2.3): the denied-action feed, with ack
+// M4.3: turn an incident into a .swarm.toml rule + a CLAUDE.md lesson, both copyable.
+function codifyIncident(seq) {
+  const i = (state.allIncidents ?? []).find((x) => x.seq === Number(seq));
+  if (!i?.suggestion) return;
+  const sg = i.suggestion;
+  $("#picker").innerHTML = `<div class="pk wn" role="dialog" aria-modal="true">
+    <div class="pk-h">${ic("shield", 15)}<b>Codify</b><span class="grow"></span><button id="pkCancel" title="Close">${ic("x", 14)}</button></div>
+    <div class="pk-b">
+      <h3>${esc(sg.title)}</h3>
+      <div class="date">from a <span class="br">${esc(i.rule)}</span> incident${i.count > 1 ? ` \u00b7 seen ${i.count}\u00d7` : ""}</div>
+      ${sg.toml ? `<h4>.swarm.toml <a href="#" class="cbtn" data-copy-toml="${seq}">${ic("copy", 12)} copy</a></h4><pre class="snip" id="toml-${seq}">${esc(sg.toml)}</pre>` : ""}
+      <h4>CLAUDE.md lesson <a href="#" class="cbtn" data-copy-lesson="${seq}">${ic("copy", 12)} copy</a></h4>
+      <pre class="snip" id="lesson-${seq}">- ${esc(sg.lesson)}</pre>
+      ${sg.toml ? '<p class="dim" style="font-size:var(--fs-sm)">Merge the block into the repo\'s <code>.swarm.toml</code>; the daemon picks it up within ~30s.</p>' : '<p class="dim" style="font-size:var(--fs-sm)">No config rule fits this one \u2014 the lesson is the takeaway.</p>'}
+    </div>
+    <div class="pk-f"><span class="grow"></span><button id="pkCancel">Close</button></div>
+  </div>`;
+}
+
 function renderIncidentsView() {
   const all = state.allIncidents;
   const rows = (all ?? []).filter((i) => !state.sel || i.projectId === state.sel);
@@ -408,14 +479,14 @@ function renderIncidentsView() {
   const rules = [...byRule.entries()].sort((a, b) => b[1] - a[1]).map(([r, n]) => `<span class="br">${esc(r)}</span> <b>${n}</b>`).join(" · ");
   $("#main").innerHTML =
     `<h2>Incidents <span>${all === null ? "loading…" : `${open} open · ${rows.length} shown`} · every ask/deny the rules made${rules ? ` · ${rules}` : ""}</span></h2>` +
-    `<div class="chips">${chip("open", "Open")}${chip("all", "All")}${open ? `<span class="chip" data-ackall="1" title="Mark every open incident${state.sel ? " in this project" : ""} as seen">Ack all <b>${open}</b></span>` : ""}</div>` +
+    `<div class="chips">${chip("open", "Open")}${chip("all", "All")}${open ? `<span class="chip" data-ackall="1" title="Mark every open incident${state.sel ? " in this project" : ""} as seen">Ack all <b>${open}</b></span>` : ""}${state.sel ? `<span class="chip" id="dryrun" title="Replay this project's history under different rule modes">${ic("shield", 12)} Dry-run rules</span>` : ""}</div>` +
     (rows.length
       ? dataTable({
           id: "incidents-feed",
           columns: incidentColumns(true),
           rows,
           leading: { width: 24, cell: incidentDot },
-          trailing: { width: 44, cell: ackLink },
+          trailing: { width: 120, cell: (i) => `${i.suggestion ? `<a href="#" data-codify="${i.seq}" title="Turn this into a rule / lesson">${ic("shield", 12)} Codify</a> ` : ""}${ackLink(i)}` },
           rowAttrs: () => "",
           rerender: touch,
         })
@@ -528,15 +599,16 @@ function renderTasks() {
     { key: "state", label: "state", width: 150, get: (t) => (t.claimedBy ? 0 : t.ready ? 1 : t.status === "active" ? 2 : t.status === "done" ? 4 : 3), cell: st },
     ...(hasGates ? [{ key: "gates", label: "gates", width: 170, get: (t) => (t.gates ?? []).filter((g) => g.verdict === "pass").length, cell: (t) => gateChips(t.gates ?? []) }] : []),
   ];
-  return `<h2 class="mt-sec">Tasks <span>${ready.length} ready · ${all.length} in ${esc(state.tasks.source)}</span></h2>` +
-    `<div class="chips">${chip("ready", "Ready", ready.length)}${chip("open", "Open", all.filter((t) => t.status !== "done").length)}${chip("all", "All", all.length)}</div>` +
+  const srcLabel = state.tasks.source === "github" ? "GitHub Issues" : state.tasks.source === "linear" ? "Linear" : state.tasks.source;
+  return `<h2 class="mt-sec">Tasks <span>${ready.length} ready · ${all.length} in ${esc(srcLabel)}${state.tasks.error ? ` · <span class="badge warn" title="${esc(state.tasks.error)}">${ic("warning", 12)} ${esc(state.tasks.error)}</span>` : ""}</span></h2>` +
+    `<div class="chips">${chip("ready", "Ready", ready.length)}${chip("open", "Open", all.filter((t) => t.status !== "done").length)}${chip("all", "All", all.length)}${ready.length ? `<span class="chip" id="dispatch" title="Claim a worktree per ready task and spawn a run in each, ${state.dispatch?.config?.max_parallel ?? 2} at a time">${ic("play", 12)} Dispatch</span>` : ""}</div>` +
     (rows.length
       ? dataTable({
           id: "tasks",
           columns: cols,
           rows,
           leading: { width: 24, cell: (t) => `<span class="s ${t.claimedBy ? "active" : t.ready ? "waiting" : "idle"}"></span>` },
-          trailing: { width: 120, cell: (t) => (t.ready ? `<a href="#" data-run="${esc(t.id)}" title="Claim and spawn claude -p in a worktree">${ic("play", 12)} Run</a> · <a href="#" data-claim="${esc(t.id)}" title="Claim into a fresh worktree">Claim</a>` : t.claimedBy ? `<a href="#" data-run="${esc(t.id)}" title="Spawn claude -p in the held worktree">${ic("play", 12)} Run</a>` : "") },
+          trailing: { width: 170, cell: (t) => (t.ready ? `<a href="#" data-run="${esc(t.id)}" title="Claim and spawn claude -p in a worktree">${ic("play", 12)} Run</a> · <a href="#" data-claim="${esc(t.id)}" title="Claim into a fresh worktree">Claim</a>` : t.claimedBy ? `<a href="#" data-run="${esc(t.id)}" title="Spawn claude -p in the held worktree">${ic("play", 12)} Run</a>${(state.gates?.executable ?? []).length ? ` · <a href="#" data-gaterun="${esc(t.id)}" title="Execute the repo's [gates.<name>] cmd gates in this task's worktree: ${esc((state.gates.executable ?? []).join(", "))}">${ic("check", 12)} Gates</a>` : ""}` : "") },
           rowAttrs: () => "",
           rerender: touch,
         })
@@ -593,19 +665,71 @@ function renderWorktrees() {
     { key: "head", label: "head", width: 90, get: (w) => w.head, cell: (w) => `<span class="br">${esc(w.head)}</span>` },
     { key: "path", label: "path", flex: true, get: (w) => w.path, cell: (w) => `<span class="now" title="${esc(w.path)}">${esc(short(w.path))}</span>` },
     { key: "state", label: "state", width: 170, get: (w) => w.dirty * 1000 + w.ahead, cell: (w) => `${badge(w.dirty, "Dirty", "warn")}${badge(w.ahead, "Unpushed", "acc")}${w.dirty === 0 && w.ahead <= 0 ? '<span class="badge">Clean</span>' : ""}` },
+    { key: "drift", label: "drift", width: 120, get: (w) => (w.main ? -1 : w.behind), cell: (w) => (w.main ? "" : w.merged ? '<span class="badge" title="This branch is already in the main checkout\'s branch">Merged</span>' : w.behind > 0 ? `<span class="badge warn" title="Commits on the main checkout\'s branch this worktree lacks">${w.behind} behind</span>` : w.behind === 0 ? '<span class="badge">Up to date</span>' : '<span class="dim">—</span>') },
     { key: "sessions", label: "sessions", width: 160, get: (w) => inside(w).length, cell: (w) => inside(w).map((x) => `<a href="#" data-s="${x.id}">${esc(x.title ?? x.id.slice(0, 8))}</a>`).join(", ") || '<span class="dim">—</span>' },
   ].filter((c) => !(c.key === "project" && state.sel));
-  return `<h2 class="mt-sec">Worktrees <span>${rows.length}</span></h2>` +
+  const heldBy = new Map(state.claims ? state.claims.filter((c) => c.state === "held").map((c) => [c.worktree, c.task]) : []);
+  const actions = (w) => {
+    const key = `${w.projectId}:${w.path}`;
+    const open = `<a href="#" data-wtopen="${esc(key)}" title="Open this worktree (editor / file manager; [worktree] open in .swarm.toml)">${ic("arrow-square-out", 12)} Open</a>`;
+    if (w.main) return open;
+    const diff = ` · <a href="#" data-wtdiff="${esc(key)}" title="What this worktree changed vs the main checkout's branch">${ic("folders", 12)} Diff</a>`;
+    const pr = w.branch && !w.merged ? ` · <a href="#" data-wtpr="${esc(key)}" title="Push the branch and open a PR prefilled from the task, handoff, gates and files">${ic("git-pull-request", 12)} PR</a>` : "";
+    if (heldBy.has(w.path)) return `${open}${diff}${pr}`;
+    return `${open}${diff}${pr} · <a href="#" data-wtrm="${esc(key)}" title="${w.dirty > 0 || w.ahead > 0 ? "Refuses while dirty / unpushed (you can force)" : "git worktree remove"}">${ic("trash", 12)} Remove</a>`;
+  };
+  const gcBtn = state.sel ? ` <a href="#" class="nav" id="wtgc" title="Find worktrees whose branch is merged or whose claim is gone">${ic("trash", 12)} Collect stale</a>` : "";
+  const newBtn = state.sel ? ` <a href="#" class="nav" id="wtnew" title="Create a task-less worktree (spike, review checkout)">${ic("plus", 12)} New worktree</a>` : "";
+  return `<h2 class="mt-sec hrow">Worktrees <span>${rows.length}</span>${newBtn}${gcBtn}</h2>` +
     dataTable({
       id: "worktrees",
       columns: cols,
       rows,
       leading: { width: 24, cell: (w) => `<span class="s ${inside(w).length ? "active" : w.dirty > 0 ? "waiting" : "ended"}"></span>` },
-      trailing: { width: 34, cell: () => "" },
+      trailing: { width: 230, cell: actions },
+      rerender: touch,
+    });
+}
+
+// ---------- dispatch (M7.5)
+function renderDispatch() {
+  const d = state.dispatch;
+  if (!state.sel || !d?.entries?.length) return "";
+  const rows = d.entries;
+  const oc = (e) => e.state === "queued" ? '<span class="badge">Queued</span>'
+    : e.state === "running" ? '<span class="badge acc">Running</span>'
+    : e.outcome === "done" ? '<span class="badge ok">Done</span>'
+    : e.outcome === "stopped" ? '<span class="badge">Stopped</span>'
+    : `<span class="badge warn">${esc(e.outcome ?? "?")}</span>`;
+  const cols = [
+    { key: "task", label: "task", width: 90, get: (e) => e.task, cell: (e) => `<b>${esc(e.task)}</b>` },
+    { key: "title", label: "title", flex: true, get: (e) => e.title, cell: (e) => esc(e.title) },
+    { key: "state", label: "state", width: 110, get: (e) => (e.state === "running" ? 0 : e.state === "queued" ? 1 : 2), cell: oc },
+    { key: "cost", label: "cost", width: 70, num: true, get: (e) => e.costUsd ?? -1, cell: (e) => (e.costUsd != null ? usd(e.costUsd) : '<span class="dim">—</span>') },
+    { key: "detail", label: "detail", width: 360, get: (e) => e.detail ?? "", cell: (e) => `<span class="dim" title="${esc(e.detail ?? "")}">${esc(e.detail ?? "")}</span>` },
+  ];
+  const running = rows.filter((e) => e.state === "running").length, queued = rows.filter((e) => e.state === "queued").length;
+  return `<h2 class="mt-sec hrow">Dispatch <span>${running} running · ${queued} queued · cap ${d.config?.max_parallel ?? 2}</span><a href="#" class="nav" id="dispatchClear" title="Drop queued tasks and clear finished rows (running ones keep going)">${ic("trash", 12)} Clear</a></h2>` +
+    dataTable({
+      id: "dispatch",
+      columns: cols,
+      rows,
+      leading: { width: 24, cell: (e) => `<span class="s ${e.state === "running" ? "active" : e.state === "queued" ? "waiting" : e.outcome === "done" ? "ended" : "waiting"}"></span>` },
+      trailing: { width: 90, cell: (e) => (e.sessionId ? `<a href="#" data-s="${esc(e.sessionId)}">session</a>` : "") },
       rerender: touch,
     });
 }
 
+// 0.7.0: the project's [budget] ceiling against what it spent
+function budgetKpi(kpi) {
+  const b = state.sel ? state.budget : null;
+  if (!b?.status) return state.sel ? kpi("budget", "—", "no [budget] in .swarm.toml") : "";
+  const s = b.status;
+  const pct = Math.round(s.pct * 100);
+  const cls = s.level === "exceeded" ? "warn" : s.level === "warn" ? "acc" : "";
+  return kpi(`${s.kind} budget`, `<span class="${cls}">${pct}%</span>`, `${usd(s.spent)} of ${usd(s.limit)} · past it: ${b.config.on_exceed}`);
+}
+
 // ---------- spend
 function renderSpend() {
   const sp = state.spend;
@@ -655,7 +779,7 @@ function renderSpend() {
   const hm = sp.hourly.filter(inSel).map((c) => ({ dow: c.dow, hour: c.hour, v: c.cost ?? 0 }));
   $("#main").innerHTML =
     `<h2>Spend <span>${state.sel ? esc(projName(state.sel)) : "all projects"}</span>${rangeChips}</h2>
-     <div class="kpis">${kpi("today", usd(todayCost), `${todayTurns} turns`)}${kpi(`${N}-day total`, usd(total14), `${activeDays} active day${activeDays === 1 ? "" : "s"}`)}${kpi("today vs avg", prevDays ? `${todayCost >= avg ? "+" : ""}${(((todayCost - avg) / avg) * 100).toFixed(0)}%` : "—", prevDays ? `vs ${usd(avg)} / active day` : "no earlier days to compare")}${kpi("agents", agents.length, agents.map(agentLabel).join(" · ") || "—")}</div>
+     <div class="kpis">${kpi("today", usd(todayCost), `${todayTurns} turns`)}${kpi(`${N}-day total`, usd(total14), `${activeDays} active day${activeDays === 1 ? "" : "s"}`)}${kpi("today vs avg", prevDays ? `${todayCost >= avg ? "+" : ""}${(((todayCost - avg) / avg) * 100).toFixed(0)}%` : "—", prevDays ? `vs ${usd(avg)} / active day` : "no earlier days to compare")}${kpi("agents", agents.length, agents.map(agentLabel).join(" · ") || "—")}${budgetKpi(kpi)}</div>
      <div class="chart-card"><h3>Daily cost · last ${N} days <span>stacked by agent</span></h3>${viz.stackedColumns(days, series)}${agents.length > 1 ? viz.legend(agents) : ""}</div>
      <div class="cols">
        <div class="chart-card" style="margin:0"><h3>When the agents work <span>cost by weekday × hour · last 4 weeks · local time</span></h3>${viz.heatmap(hm)}</div>
@@ -664,9 +788,55 @@ function renderSpend() {
      <div class="cols mt-sec"><div><h2>By project · today <span>${usd(sumBy(filt(sp.byProjectToday), (x) => x.cost))}</span></h2>${tbl(filt(sp.byProjectToday), "project", projName)}
      <h2 class="mt-sec">By project · all time</h2>${tbl(filt(sp.byProjectAll), "project", projName)}</div>
      <div>${byAgentToday ? `<h2>By model · today</h2>${tbl(sp.byModelToday, "model", model)}` : ""}<h2 style="${byAgentToday ? "margin-top:18px" : ""}">By model · all time</h2>${tbl(sp.byModelAll, "model", model)}</div></div>
+     ${renderAttribution()}
      <p class="dim" style="margin-top:var(--gap-sec)">Costs use list prices (static table, refreshed from LiteLLM when online; override in <code>~/.swarm/pricing.json</code>). Cache reads are the bulk of "ctx". Sessions on a subscription plan still show what the tokens would cost at API rates.</p>`;
 }
 
+// M4.2: cost attributed to tasks (via each claim's worktree) + a context re-processing signal.
+// Only meaningful with a project selected.
+function renderAttribution() {
+  const a = state.attribution;
+  if (!state.sel || !a) return "";
+  const parts = [];
+  if (a.byTask?.length) {
+    parts.push(`<h2 class="mt-sec">By task <span>${usd(sumBy(a.byTask, (t) => t.cost))} across ${a.byTask.length} task${a.byTask.length === 1 ? "" : "s"} · attributed by worktree</span></h2>` +
+      dataTable({
+        id: "spend-task",
+        columns: [
+          { key: "task", label: "task", width: 150, get: (t) => t.task, cell: (t) => `<b>${esc(t.task)}</b>` },
+          { key: "owner", label: "owner", width: 120, get: (t) => t.owner || "", cell: (t) => esc(t.owner || "—") },
+          { key: "cost", label: "cost", width: 88, num: true, get: (t) => t.cost, cell: (t) => usd(t.cost) },
+          { key: "output", label: "out", width: 84, num: true, get: (t) => t.output, cell: (t) => tok(t.output) },
+          { key: "sessions", label: "sessions", width: 84, num: true, get: (t) => t.sessions, cell: (t) => String(t.sessions) },
+          { key: "turns", label: "turns", width: 64, num: true, get: (t) => t.turns, cell: (t) => String(t.turns) },
+          { key: "worktree", label: "worktree", flex: true, get: (t) => t.worktree, cell: (t) => `<span class="now dim" title="${esc(t.worktree)}">${esc(short(t.worktree))}</span>` },
+        ],
+        rows: a.byTask,
+        leading: { width: 20, cell: () => "" },
+        trailing: { width: 8, cell: () => "" },
+        rerender: touch,
+      }));
+  }
+  if (a.contextBudget?.length) {
+    parts.push(`<h2 class="mt-sec">Context budget <span>sessions re-processing the most context · a high reuse % is a lot of re-reading</span></h2>` +
+      dataTable({
+        id: "spend-ctx",
+        columns: [
+          { key: "title", label: "session", flex: true, get: (r) => r.title ?? r.id, cell: (r) => `<a href="#" data-s="${r.id}">${esc(r.title ?? r.id.slice(0, 8))}</a>` },
+          { key: "reuse", label: "reuse", width: 90, num: true, get: (r) => r.reuse, cell: (r) => `<span class="${r.reuse > 0.9 ? "br" : "dim"}">${(r.reuse * 100).toFixed(0)}%</span>` },
+          { key: "cacheRead", label: "context re-read", width: 120, num: true, get: (r) => r.cacheRead, cell: (r) => tok(r.cacheRead) },
+          { key: "cost", label: "cost", width: 88, num: true, get: (r) => r.cost, cell: (r) => usd(r.cost) },
+          { key: "turns", label: "turns", width: 64, num: true, get: (r) => r.turns, cell: (r) => String(r.turns) },
+        ],
+        rows: a.contextBudget,
+        leading: { width: 20, cell: () => "" },
+        trailing: { width: 8, cell: () => "" },
+        rerender: touch,
+      }));
+  }
+  return parts.join("");
+}
+
 // ---------- stats
 // Heavier than the 5s snapshot, so it has its own endpoint: fetched when the view opens (per project
 // scope), then refreshed at most every 30s while the view stays open.
@@ -685,6 +855,34 @@ const big = (n) => (n >= 1e9 ? `${(n / 1e9).toFixed(2)}B` : n >= 1e6 ? `${(n / 1
 const toolName = (t) => String(t).replace(/^mcp__([^_]+(?:_[^_]+)*)__/, "$1 · ").replace(/^plugin_/, "");
 const pct = (a, b) => (b ? `${((100 * a) / b).toFixed(0)}%` : "—");
 const dur = (ms) => (ms < 3600e3 ? `${Math.round(ms / 60e3)}m` : ms < 86400e3 ? `${(ms / 3600e3).toFixed(1)}h` : `${(ms / 86400e3).toFixed(1)}d`);
+// ---------- search view (M4.5): memory over Swarm's own data — handoffs, incidents, gates, what sessions said
+const srch = { q: "", kind: "", hits: null, t: 0 };
+function renderSearch() {
+  const chip = (k, label) => `<span class="chip ${srch.kind === k ? "on" : ""}" data-skind="${k}">${label}</span>`;
+  const mark = (s) => esc(s).replace(/\u0001/g, "<mark>").replace(/\u0002/g, "</mark>");
+  const link = (h) => h.kind === "session" ? `data-s="${esc(h.ref)}"` : h.sessionId ? `data-s="${esc(h.sessionId)}"` : "";
+  const hits = (srch.hits ?? []).map((h) => `<div class="hit"><div class="ht"><span class="badge">${esc(h.kind)}</span><b>${esc(h.title)}</b>${h.task ? `<span class="br">${esc(h.task)}</span>` : ""}<span class="grow"></span>${!state.sel ? `<span class="dim">${esc(projName(h.projectId))} · </span>` : ""}<span class="dim">${ago(h.ts)}</span>${link(h) ? `<a href="#" ${link(h)} title="Open the session">${ic("arrow-right", 12)}</a>` : ""}</div><div class="hs">${mark(h.snippet)}</div></div>`).join("");
+  const had = document.activeElement?.id === "srchQ" ? { pos: document.activeElement.selectionStart } : null;
+  $("#main").innerHTML =
+    `<h2>Search <span>Swarm's own memory${state.sel ? ` · ${esc(projName(state.sel))}` : " · all projects"} — handoffs, incidents, gates, what sessions said. Never your code.</span></h2>` +
+    `<div class="srch"><input id="srchQ" type="search" placeholder="pkill, login form, kind:incident git reset, task:M1.2 …" value="${esc(srch.q)}" autocomplete="off"></div>` +
+    `<div class="chips">${chip("", "All")}${chip("handoff", "Handoffs")}${chip("incident", "Incidents")}${chip("gate", "Gates")}${chip("session", "Sessions")}</div>` +
+    (srch.hits === null ? `<div class="empty">${PX.idle()}Type to search. Words are AND-ed, the last one is a prefix; quote a phrase; <code>kind:</code> and <code>task:</code> filter.</div>`
+      : hits || `<div class="empty">${PX.idle()}Nothing in memory matches <b>${esc(srch.q)}</b>.</div>`);
+  if (had) { const i = $("#srchQ"); i.focus(); i.setSelectionRange(had.pos, had.pos); }
+}
+async function runSearch() {
+  if (!srch.q.trim()) { srch.hits = null; return renderSearch(); }
+  const q = new URLSearchParams({ q: srch.q, limit: "50" });
+  if (state.sel) q.set("project", state.sel);
+  if (srch.kind) q.set("kind", srch.kind);
+  const mine = ++srch.t;
+  const j = await fetch(`/v1/memory?${q}`).then((r) => r.json()).catch(() => ({ hits: [] }));
+  if (mine !== srch.t) return;
+  srch.hits = j.hits ?? [];
+  if (state.view === "search" && !state.session) renderSearch();
+}
+document.addEventListener("input", (ev) => { if (ev.target.id === "srchQ") { srch.q = ev.target.value; clearTimeout(srch.db); srch.db = setTimeout(runSearch, 150); } });
 function renderStats() {
   const st = statsCache.key === (state.sel ?? "") ? statsCache.data : null;
   const scope = state.sel ? esc(projName(state.sel)) : "all projects";
@@ -852,7 +1050,69 @@ function sessionStream() {
 }
 // True when `rows` only extends the rows already in #log (same session, same prefix) → append, don't rebuild.
 const isAppend = (rows) => logRendered && rows.length >= logRendered.length && logRendered.every((k, n) => rows[n].key === k);
+// M4.1 session replay: step through a session's tool calls, one at a time, with full input/output
+// (lazy-fetched from /v1/events/:seq). replayState holds the current step; nav by buttons or ←/→.
+const replay = { steps: [], i: 0, cache: new Map() };
+// M4.4: resume where this died — the daemon builds the prompt from the handoff + tail; we just confirm.
+async function resumeDead() {
+  const id = state.session; if (!id) return;
+  const plan = await fetch(`/v1/sessions/${encodeURIComponent(id)}/resume`).then((r) => r.json());
+  if (!plan.ok) return alert(plan.error);
+  if (!confirm(`Resume ${plan.task}${plan.owner ? ` as ${plan.owner}` : ""}?\n\n${plan.prompt.slice(0, 900)}${plan.prompt.length > 900 ? "…" : ""}`)) return;
+  const r = await fetch(`/v1/sessions/${encodeURIComponent(id)}/resume`, { method: "POST", headers: { "content-type": "application/json" }, body: "{}" }).then((x) => x.json());
+  if (!r.ok) return alert(r.error);
+  openSession(r.run.sessionId);
+}
+function openReplay() {
+  replay.steps = state.log.filter((e) => e.type === "tool.requested").map((e) => ({ seq: e.seq, tool: e.payload?.tool ?? "tool", summary: e.payload?.summary ?? "" }));
+  replay.i = 0;
+  replay.cache.clear();
+  if (!replay.steps.length) { alert("No tool calls in this session yet."); return; }
+  renderReplay();
+}
+async function renderReplay() {
+  const n = replay.steps.length;
+  const step = replay.steps[replay.i];
+  let detail = replay.cache.get(step.seq);
+  if (!detail) {
+    // the request event (full input) and the paired completed event (output), both by seq
+    const req = await fetch(`/v1/events/${step.seq}`).then((r) => r.json()).catch(() => null);
+    const done = state.log.find((e) => e.type === "tool.completed" && e.seq > step.seq && e.payload?.summary === step.summary);
+    const res = done ? await fetch(`/v1/events/${done.seq}`).then((r) => r.json()).catch(() => null) : null;
+    detail = { input: req?.payload?.toolInput ?? null, output: res?.payload?.toolResponse ?? null, ts: req?.ts };
+    replay.cache.set(step.seq, detail);
+  }
+  const j = (v) => (v == null ? "" : typeof v === "string" ? v : JSON.stringify(v, null, 2));
+  $("#picker").innerHTML = `<div class="pk wn rp" role="dialog" aria-modal="true">
+    <div class="pk-h">${ic("play", 15)}<b>Replay</b><span class="dim" style="margin-left:8px">${step.tool}</span><span class="grow"></span><span class="dim" style="font-size:var(--fs-sm)">${replay.i + 1} / ${n}${detail.ts ? ` · ${hhmm(detail.ts)}` : ""}</span><button id="pkCancel" title="Close">${ic("x", 14)}</button></div>
+    <div class="pk-b">
+      <div class="dim now" style="font-family:var(--mono);font-size:var(--fs-sm);margin-bottom:8px">${esc(step.summary)}</div>
+      <h4>input</h4><pre class="snip">${esc(j(detail.input)) || '<span class="dim">—</span>'}</pre>
+      <h4>output</h4><pre class="snip">${detail.output != null ? esc(j(detail.output)).slice(0, 4000) : '<span class="dim">(no result captured)</span>'}</pre>
+    </div>
+    <div class="pk-f"><button id="rpPrev" ${replay.i === 0 ? "disabled" : ""}>${ic("arrow-left", 12)} Prev</button><span class="grow"></span><input id="rpRange" type="range" min="0" max="${n - 1}" value="${replay.i}" style="flex:1;max-width:280px"><span class="grow"></span><button class="primary" id="rpNext" ${replay.i >= n - 1 ? "disabled" : ""}>Next ${ic("arrow-right", 12)}</button></div>
+  </div>`;
+}
+function replayGo(delta) {
+  const n = replay.steps.length;
+  replay.i = Math.max(0, Math.min(n - 1, replay.i + delta));
+  renderReplay();
+}
+
 // Spawned sessions get a stdin box while their run is live (M3.3); interactive ones are told where to type.
+// M7.7: questions this session is waiting on a human for
+function questionCards(s) {
+  const qs = (state.questions ?? []).filter((q) => q.sessionId === s.id);
+  if (!qs.length) return "";
+  return `<h4>waiting on you</h4>${qs.map((q) => `<div class="perm"><div class="perm-t">${ic("warning", 13)} <b>Question #${q.id}</b>${q.task ? `<span class="dim"> · ${esc(q.task)}</span>` : ""}</div><div class="perm-c">${esc(q.text)}</div><div class="perm-b">${(q.options ?? []).map((o) => `<button class="ok" data-qanswer="${q.id}" data-text="${esc(o)}">${esc(o)}</button>`).join("")}<button data-qanswer="${q.id}">Answer…</button></div></div>`).join("")}`;
+}
+async function answerQuestion(id, preset) {
+  const text = preset ?? prompt(`Answer to question #${id}:`);
+  if (!text) return;
+  const r = await fetch(`/v1/questions/${id}/answer`, { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ text, by: "dashboard" }) }).then((x) => x.json());
+  if (!r.ok) alert(r.error);
+  return refresh();
+}
 function stdinBox(s) {
   if (s.kind !== "spawned") return "";
   const run = (state.runs ?? []).find((r) => r.sessionId === s.id);
@@ -872,6 +1132,8 @@ async function sendStdin() {
 }
 document.addEventListener("click", (ev) => {
   if (ev.target.closest("#stdinSend")) return sendStdin();
+  const qa = ev.target.closest("[data-qanswer]");
+  if (qa) { ev.preventDefault(); return answerQuestion(Number(qa.dataset.qanswer), qa.dataset.text); }
   const a = ev.target.closest("[data-perm-allow]"), d = ev.target.closest("[data-perm-deny]");
   const key = a?.dataset.permAllow || d?.dataset.permDeny;
   if (key) {
@@ -894,7 +1156,7 @@ function renderSession() {
   const subTurns = state.turns.filter((x) => x.sidechain || x.agentId);
   const STAT_ICON = { cost: "coin", model: "robot", turns: "arrows-clockwise", "tool calls": "wrench", output: "chart-bar", context: "rows", started: "clock", "last seen": "eye", "subagent turns": "tree-structure" };
   const stat = (k, v) => `<div class="stat"><span>${ic(STAT_ICON[k] ?? "list-bullets", 13)}${k}</span><b>${v}</b></div>`;
-  const head = `<h2 class="hrow"><a class="back" href="#" id="back">${ic("arrow-left", 13)}back</a> ${esc(projName(s.projectId))} · <span class="s ${s.state}"></span> ${kindIcon(s)}${agentBadge(s.agent)}<b>${esc(s.title ?? s.id.slice(0, 8))}</b> <span>${esc(short(s.cwd))}${s.branch ? ` · ${esc(s.branch)}` : ""} · ${s.state}</span></h2>`;
+  const head = `<h2 class="hrow"><a class="back" href="#" id="back">${ic("arrow-left", 13)}back</a> ${esc(projName(s.projectId))} · <span class="s ${s.state}"></span> ${kindIcon(s)}${agentBadge(s.agent)}<b>${esc(s.title ?? s.id.slice(0, 8))}</b> <span>${esc(short(s.cwd))}${s.branch ? ` · ${esc(s.branch)}` : ""} · ${s.state}</span><a href="#" class="nav" id="replay" style="margin-left:auto" title="Step through this session's tool calls">${ic("play", 13)} Replay</a>${(state.worktrees[s.projectId] ?? []).some((w) => !w.main && (s.cwd === w.path || s.cwd.startsWith(`${w.path}/`))) ? `<a href="#" class="nav" id="sessDiff" title="What this session's worktree changed">${ic("folders", 13)} Diff</a>` : ""}${s.state === "ended" ? `<a href="#" class="nav" id="resumeDead" title="Spawn a run that picks up this session's task from its handoff + last actions">${ic("reload", 13)} Resume where it died</a>` : ""}</h2>`;
   const side = `<div class="stats">
     ${stat("cost", usd(s.costUsd))}${stat("model", esc(model(s.model)) || "—")}${stat("turns", s.turns)}${stat("tool calls", s.toolCalls)}
     ${stat("output", `${tok(t.output)}${t.thinking ? `<small> · ${tok(t.thinking)} thinking</small>` : ""}`)}${stat("context", `${tok(ctx)}<small> · ${ctx ? ((100 * t.cacheRead) / ctx).toFixed(0) : 0}% cached</small>`)}
@@ -904,6 +1166,7 @@ function renderSession() {
     <h4>tokens</h4>${viz.compositionBar([{ label: "cache read", v: t.cacheRead }, { label: "cache write", v: t.cacheWrite }, { label: "input", v: t.input }, { label: "thinking", v: t.thinking }, { label: "output", v: t.output }])}
     ${state.turns.length > 1 ? `<h4>cost per turn</h4>${viz.turnStrip(state.turns, { height: 54 })}` : ""}
     <h4>tools</h4>${tools.length ? viz.hbars(tools.slice(0, 8).map(([k, v]) => [k.replace(/^mcp__[a-z0-9-]+__/i, ""), v])) : '<span class="dim">None yet</span>'}
+    ${questionCards(s)}
     ${s.transcriptPath ? `<h4>transcript</h4><div class="dim mono" style="word-break:break-all">${ic("file-text", 12)} ${esc(short(s.transcriptPath))}</div>` : ""}`;
   if (logEl && isAppend(rows)) {
     // Same session, rows only appended: patch header + sidebar, append the new rows — #log keeps its
@@ -969,12 +1232,84 @@ function menuSpec(kind, d) {
       { label: "Refresh pricing", icon: "arrows-clockwise", caption: "LiteLLM", run: async () => { const r = await fetch("/v1/pricing/refresh", { method: "POST" }); if (!r.ok) console.warn("pricing refresh failed", r.status); refresh(); } },
       { label: "Copy dashboard URL", icon: "copy", run: () => copy(location.origin) },
       { divider: true },
+      { label: "Desktop notifications", icon: "bell", pressed: notifyOn(), caption: notifyOn() ? "on" : "off", run: () => { notifyOn() ? disableNotifications() : enableNotifications(); $("#settings").blur(); } },
+      { label: "What's New", icon: "star", caption: `v${state.version ?? "?"}`, run: () => whatsNew() },
       { label: "Documentation", icon: "book-open", caption: "getswarm", run: () => window.open("https://getswarm.vercel.app/docs/", "_blank") },
       { label: "Send feedback", icon: "comment-text", caption: "GitHub issue", run: () => window.open(feedbackUrl(), "_blank") },
     ] };
   }
   return null;
 }
+// M4.7 desktop notifications: native notifications (web Notification API — works in the browser and
+// the desktop app's webview) for the things you'd want to walk away and be pinged about — a spawned
+// run waiting on a permission, and a claim orphaned with unfinished work. Clicking opens the spot to
+// act. Off until enabled from the settings menu (which requests OS permission). Quiet while focused.
+const NOTIFY_KEY = "swarm.notify";
+const notifyOn = () => { try { return localStorage.getItem(NOTIFY_KEY) === "on"; } catch { return false; } };
+async function enableNotifications() {
+  if (!("Notification" in window)) { alert("This browser doesn't support notifications."); return; }
+  const perm = Notification.permission === "granted" ? "granted" : await Notification.requestPermission();
+  if (perm !== "granted") { alert("Notifications were blocked. Allow them for this site in your browser/OS settings."); return; }
+  try { localStorage.setItem(NOTIFY_KEY, "on"); } catch {}
+  new Notification("Swarm notifications on", { body: "You'll be pinged when a run needs a permission or a claim is orphaned." });
+}
+function disableNotifications() { try { localStorage.setItem(NOTIFY_KEY, "off"); } catch {} }
+let lastNotifyAt = 0;
+function notifyForEvent(ev) {
+  if (!notifyOn() || !("Notification" in window) || Notification.permission !== "granted") return;
+  if (!document.hidden && ev.type !== "permission.requested" && ev.type !== "question.asked") return; // only prompts that block an agent interrupt while you're looking
+  const now = Date.now();
+  if (now - lastNotifyAt < 1500) return; // don't stack
+  const p = ev.payload || {};
+  let title, body, onClick;
+  if (ev.type === "permission.requested") {
+    title = `Permission needed: ${p.tool ?? "tool"}`;
+    body = `${p.display ?? ""}
+${p.reason ?? ""}`.slice(0, 180);
+    onClick = () => { if (ev.sessionId) openSession(ev.sessionId); };
+  } else if (ev.type === "question.asked") {
+    title = "An agent has a question";
+    body = `${p.task ? `${p.task}: ` : ""}${p.text ?? ""}`.slice(0, 180);
+    onClick = () => { if (ev.sessionId) openSession(ev.sessionId); };
+  } else if (ev.type === "claim.orphaned") {
+    title = "Claim orphaned";
+    body = `${p.task ?? "a task"} — its lease expired with unfinished work in the worktree.`;
+    onClick = () => { state.view = "board"; state.sel = ev.projectId || state.sel; state.session = null; refresh(); };
+  } else return;
+  lastNotifyAt = now;
+  const n = new Notification(title, { body, tag: `swarm-${ev.type}-${ev.sessionId ?? ev.seq}` });
+  n.onclick = () => { window.focus(); onClick?.(); n.close(); };
+}
+
+// What's New: release notes for the running version, from window.RELEASE_NOTES (release-notes.js).
+// The desktop menu calls window.swarmWhatsNew; the settings menu calls whatsNew(); it also opens
+// itself once after an upgrade (localStorage remembers the last version the user saw).
+function releaseNotesFor(version) {
+  const all = window.RELEASE_NOTES || {};
+  if (version && all[version]) return { version, ...all[version] };
+  const latest = Object.keys(all)[0];
+  return latest ? { version: latest, ...all[latest] } : null;
+}
+function whatsNew(version) {
+  const n = releaseNotesFor(version || state.version);
+  if (!n) return;
+  try { localStorage.setItem("swarm.seenVersion", n.version); } catch {}
+  $("#picker").innerHTML = `<div class="pk wn" role="dialog" aria-modal="true">
+    <div class="pk-h">${ic("star", 15)}<b>What's New</b><span class="grow"></span><button id="pkCancel" title="Close">${ic("x", 14)}</button></div>
+    <div class="pk-b"><h3>Swarm ${esc(n.version)}</h3>${n.date ? `<div class="date">${esc(n.date)}</div>` : ""}${n.html}</div>
+    <div class="pk-f"><span class="grow"></span><a href="https://getswarm.vercel.app/changelog" target="_blank" rel="noopener" style="align-self:center;color:var(--dim);font-size:var(--fs-sm)">Full changelog →</a><button id="pkCancel">Close</button></div>
+  </div>`;
+}
+window.swarmWhatsNew = (v) => whatsNew(v);
+// auto-open once per version, but never on the very first run (nothing to compare against)
+function maybeWhatsNew() {
+  if (!state.version || !window.RELEASE_NOTES) return;
+  let seen; try { seen = localStorage.getItem("swarm.seenVersion"); } catch {}
+  if (seen === state.version) return;
+  if (!seen) { try { localStorage.setItem("swarm.seenVersion", state.version); } catch {} return; }
+  if (releaseNotesFor(state.version)) whatsNew(state.version);
+}
+
 // Star nudge: once a month at most, never on first open, dismissable for good. Pure localStorage —
 // nothing leaves the machine; clicking Star just opens the repo in a browser.
 const STAR = { key: "swarm.star", firstAfterMs: 2 * 86_400_000, everyMs: 30 * 86_400_000 };
@@ -1030,7 +1365,7 @@ document.addEventListener("contextmenu", (ev) => {
 
 // ---------- events
 document.addEventListener("click", async (ev) => {
-  const t = ev.target.closest("[data-menu],#settings,#feedback,[data-id],[data-s],#back,[data-view],.chip,[data-tl],[data-days],[data-sdays],[data-release],[data-forcerelease],[data-resrelease],[data-merge],[data-ack],[data-ackall],[data-inc],[data-task-filter],[data-claim],[data-procstop],[data-run],[data-runstop]");
+  const t = ev.target.closest("[data-menu],#settings,#feedback,[data-id],[data-s],#back,[data-view],.chip,[data-tl],[data-days],[data-sdays],[data-release],[data-forcerelease],[data-resrelease],[data-merge],[data-ack],[data-ackall],[data-inc],[data-task-filter],[data-claim],[data-procstop],[data-run],[data-runstop],[data-wtopen],[data-wtrm],[data-wtdiff],[data-wtpr],[data-dffile],#prGo,#sessDiff,#wtnew,#wtgc,[data-gaterun],#dispatch,#dispatchGo,#dispatchClear");
   if (!t) return;
   if (t.dataset.menu) { ev.preventDefault(); ev.stopPropagation(); return openMenu(t.dataset.menu, t, t.dataset); }
   if (t.id === "settings") { ev.preventDefault(); return openMenu("settings", t, {}); }
@@ -1050,6 +1385,80 @@ document.addEventListener("click", async (ev) => {
     if (!r.ok) alert(r.error); else state.tasks = null;
     return refresh();
   }
+  if (t.dataset.wtopen) {
+    ev.preventDefault();
+    const i = t.dataset.wtopen.indexOf(":");
+    const r = await fetch("/v1/worktrees/open", { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ projectId: t.dataset.wtopen.slice(0, i), worktree: t.dataset.wtopen.slice(i + 1) }) }).then((x) => x.json());
+    if (!r.ok) alert(r.error);
+    return;
+  }
+  if (t.dataset.wtdiff) { ev.preventDefault(); const i = t.dataset.wtdiff.indexOf(":"); return openDiffDrawer(t.dataset.wtdiff.slice(0, i), t.dataset.wtdiff.slice(i + 1)); }
+  if (t.dataset.wtpr) { ev.preventDefault(); const i = t.dataset.wtpr.indexOf(":"); return openPrDrawer(t.dataset.wtpr.slice(0, i), t.dataset.wtpr.slice(i + 1)); }
+  if (t.dataset.dffile !== undefined) { ev.preventDefault(); return loadDiffFile(t.dataset.dffile); }
+  if (t.id === "prGo") { ev.preventDefault(); return submitPr(); }
+  if (t.id === "sessDiff") {
+    ev.preventDefault();
+    const s = state.sessions.find((x) => x.id === state.session);
+    if (!s) return;
+    const w = (state.worktrees[s.projectId] ?? []).find((x) => !x.main && (s.cwd === x.path || s.cwd.startsWith(`${x.path}/`)));
+    return w ? openDiffDrawer(s.projectId, w.path) : null;
+  }
+  if (t.dataset.wtrm) {
+    ev.preventDefault();
+    const i = t.dataset.wtrm.indexOf(":");
+    const projectId = t.dataset.wtrm.slice(0, i), worktree = t.dataset.wtrm.slice(i + 1);
+    const rm = (force) => fetch("/v1/worktrees/remove", { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ projectId, worktree, force }) }).then((x) => x.json());
+    if (!confirm(`Remove worktree ${short(worktree)}?`)) return;
+    const r = await rm(false);
+    if (!r.ok && (r.refused === "dirty" || r.refused === "unpushed")) {
+      if (confirm(`${r.error}\n\nRemove anyway (discards the work)?`)) await rm(true);
+    } else if (!r.ok) alert(r.error);
+    state.worktrees[projectId] = null;
+    return refresh();
+  }
+  if (t.id === "wtnew") {
+    ev.preventDefault();
+    const name = prompt("Worktree name (folder under ~/.swarm/worktrees/<project>/; branch wt/<name>):");
+    if (!name) return;
+    const r = await fetch("/v1/worktrees", { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ projectId: state.sel, name }) }).then((x) => x.json());
+    if (!r.ok) alert(r.error);
+    state.worktrees[state.sel] = null;
+    return refresh();
+  }
+  if (t.id === "wtgc") {
+    ev.preventDefault();
+    const r = await fetch("/v1/worktrees/gc", { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ projectId: state.sel }) }).then((x) => x.json());
+    if (!r.candidates.length) return alert("Nothing to collect — no merged branches or released claims with a worktree left behind.");
+    const lines = r.candidates.map((c) => `${c.removable ? "•" : "✗"} ${c.branch ?? "(detached)"} — ${c.why}${c.blocker ? ` (blocked: ${c.blocker})` : ""}`).join("\n");
+    const n = r.candidates.filter((c) => c.removable).length;
+    if (!n) return alert(`Stale worktrees, none removable without force:\n\n${lines}`);
+    if (!confirm(`Stale worktrees:\n\n${lines}\n\nRemove the ${n} removable one${n === 1 ? "" : "s"}?`)) return;
+    await fetch("/v1/worktrees/gc", { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ projectId: state.sel, apply: true }) });
+    state.worktrees[state.sel] = null;
+    return refresh();
+  }
+  if (t.id === "dispatch") { ev.preventDefault(); return openDispatchDrawer(); }
+  if (t.id === "dispatchGo") { ev.preventDefault(); return submitDispatch(); }
+  if (t.id === "dispatchClear") {
+    ev.preventDefault();
+    await fetch("/v1/dispatch", { method: "DELETE", headers: { "content-type": "application/json" }, body: JSON.stringify({ projectId: state.sel }) });
+    state.dispatch = null;
+    return refresh();
+  }
+  if (t.dataset.gaterun) {
+    ev.preventDefault();
+    const task = t.dataset.gaterun;
+    t.textContent = "running…";
+    const r = await fetch("/v1/gates/run", { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ projectId: state.sel, task }) }).then((x) => x.json());
+    if (!r.started?.length) alert(r.error ?? r.skipped?.[0]?.reason ?? "nothing ran");
+    else alert(`${task}: ${r.runs.map((x) => `${x.verdict === "pass" ? "✓" : "✗"} ${x.gate} — ${x.rubric}`).join("\n")}${r.skipped.length ? `\n\nskipped: ${r.skipped.map((x) => `${x.gate} (${x.reason})`).join(", ")}` : ""}`);
+    state.tasks = null;
+    return refresh();
+  }
+  if (t.dataset.codify) { ev.preventDefault(); return codifyIncident(t.dataset.codify); }
+  if (t.id === "dryrun") { ev.preventDefault(); return openDryRun(); }
+  if (t.dataset.skind !== undefined) { ev.preventDefault(); srch.kind = t.dataset.skind; return runSearch().then(renderSearch); }
+  if (t.id === "drRun") { ev.preventDefault(); return runDryRun(); }
   if (t.dataset.inc) { state.incFilter = t.dataset.inc; state.allIncidents = null; return refresh(); }
   if (t.dataset.ack) {
     ev.preventDefault(); ev.stopPropagation();
@@ -1094,6 +1503,8 @@ document.addEventListener("click", async (ev) => {
     return fetch(`/v1/resources/${encodeURIComponent(t.dataset.resrelease)}?${q}`, { method: "DELETE" }).then(refresh);
   }
   if (t.id === "back") { ev.preventDefault(); state.session = null; return touch(); }
+  if (t.id === "replay") { ev.preventDefault(); return openReplay(); }
+  if (t.id === "resumeDead") { ev.preventDefault(); return resumeDead(); }
   if (t.dataset.s) { ev.preventDefault(); return openSession(t.dataset.s); }
   if (t.dataset.id !== undefined) { state.sel = t.dataset.id || null; localStorage.setItem("swarm.sel", state.sel ?? ""); state.session = null; state.tasks = null; state.dirty = true; return refresh(); }
 });
@@ -1145,6 +1556,7 @@ function openRunDrawer(taskId) {
         <label>model<input id="rnModel" placeholder="default" value="${esc(last.model ?? "")}"></label>
         <label>max turns<input id="rnTurns" type="number" min="1" placeholder="∞" value="${esc(last.turns ?? "")}"></label>
       </div>
+      <label>profile<select id="rnProfile" title="full: every tool · no-edits: commands but no file edits · read-only: read and search only">${["full", "no-edits", "read-only"].map((m) => opt(m, last.profile ?? "full")).join("")}</select></label>
       <div class="dim" style="font-size:var(--fs-sm)">Claims <b>${esc(taskId)}</b> (or reuses your held worktree) and spawns <code>claude -p</code> there. The session appears in Fleet; steer it from its page.</div>
     </div>
     <div class="pk-f"><span class="grow"></span><button id="rnCancel">Cancel</button><button class="primary" id="rnGo" data-task="${esc(taskId)}">${ic("play", 13)} Run</button></div>
@@ -1154,11 +1566,11 @@ function openRunDrawer(taskId) {
 async function submitRun(taskId) {
   const prompt = $("#rnPrompt")?.value.trim();
   if (!prompt) return alert("A prompt is required.");
-  const mode = $("#rnMode")?.value, model = $("#rnModel")?.value.trim(), turns = $("#rnTurns")?.value;
-  localStorage.setItem("swarm.runOpts", JSON.stringify({ mode, model, turns }));
+  const mode = $("#rnMode")?.value, model = $("#rnModel")?.value.trim(), turns = $("#rnTurns")?.value, profile = $("#rnProfile")?.value;
+  localStorage.setItem("swarm.runOpts", JSON.stringify({ mode, model, turns, profile }));
   closePicker();
   const r = await fetch("/v1/runs", { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({
-    projectId: state.sel, task: taskId, prompt, owner: "dashboard", permissionMode: mode, model: model || undefined, maxTurns: turns ? Number(turns) : undefined,
+    projectId: state.sel, task: taskId, prompt, owner: "dashboard", permissionMode: mode, model: model || undefined, maxTurns: turns ? Number(turns) : undefined, profile: profile && profile !== "full" ? profile : undefined,
   }) }).then((x) => x.json());
   if (!r.ok) return alert(r.error);
   state.tasks = null;
@@ -1166,6 +1578,102 @@ async function submitRun(taskId) {
   openSession(r.run.sessionId);
 }
 
+// ---------- dispatch drawer (M7.5)
+function openDispatchDrawer() {
+  const ready = (state.tasks?.tasks ?? []).filter((t) => t.ready);
+  const cfg = state.dispatch?.config ?? {};
+  const last = (() => { try { return JSON.parse(localStorage.getItem("swarm.runOpts") || "{}"); } catch { return {}; } })();
+  const opt = (v, cur) => `<option value="${v}" ${v === cur ? "selected" : ""}>${v || "default"}</option>`;
+  $("#picker").innerHTML = `<div class="pk" role="dialog" aria-modal="true">
+    <div class="pk-h">${ic("play", 15)}<b>Dispatch</b><span class="dim now" style="flex:1;margin-left:8px">${ready.length} ready task${ready.length === 1 ? "" : "s"}</span></div>
+    <div class="pk-b">
+      <div class="df-files" style="max-height:30vh">${ready.map((t) => `<label style="display:flex;gap:8px;padding:4px 8px;align-items:center"><input type="checkbox" class="dpTask" value="${esc(t.id)}" checked style="width:auto"><b>${esc(t.id)}</b><span class="pa dim">${esc(t.title)}</span></label>`).join("")}</div>
+      <div class="row">
+        <label>at a time<input id="dpPar" type="number" min="1" max="16" value="${cfg.max_parallel ?? 2}"></label>
+        <label>permission mode<select id="dpMode">${["acceptEdits", "auto", "plan", "dontAsk", "manual", "bypassPermissions"].map((m) => opt(m, cfg.permission_mode ?? last.mode ?? "acceptEdits")).join("")}</select></label>
+        <label>max turns<input id="dpTurns" type="number" min="1" placeholder="∞" value="${esc(cfg.max_turns ?? last.turns ?? "")}"></label>
+      </div>
+      <label>profile<select id="dpProfile">${["full", "no-edits", "read-only"].map((m) => opt(m, cfg.profile ?? "full")).join("")}</select></label>
+      <div class="dim" style="font-size:var(--fs-sm)">Each task gets its own claim + worktree and a <code>claude -p</code> run told to work there, run the gates, hand off and open a PR. The rest queue until a slot frees. Swarm derives the outcome from gates and PRs — a task is never flipped done by an agent.</div>
+    </div>
+    <div class="pk-f"><span class="grow"></span><button id="pkClose">Cancel</button><button class="primary" id="dispatchGo">${ic("play", 13)} Dispatch</button></div>
+  </div>`;
+  $("#pkClose")?.addEventListener("click", closePicker);
+}
+async function submitDispatch() {
+  const tasks = [...document.querySelectorAll(".dpTask:checked")].map((i) => i.value);
+  if (!tasks.length) return alert("Pick at least one task.");
+  const prof = $("#dpProfile")?.value;
+  const body = { projectId: state.sel, tasks, maxParallel: Number($("#dpPar")?.value) || undefined, permissionMode: $("#dpMode")?.value, maxTurns: Number($("#dpTurns")?.value) || undefined, profile: prof && prof !== "full" ? prof : undefined, owner: "dashboard" };
+  closePicker();
+  const r = await fetch("/v1/dispatch", { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify(body) }).then((x) => x.json());
+  if (!r.ok) return alert(r.error);
+  if (r.rejected?.length) alert(`Not dispatched:\n${r.rejected.map((x) => `${x.id} — ${x.reason}`).join("\n")}`);
+  state.tasks = null; state.dispatch = null;
+  return refresh();
+}
+
+// ---------- worktree diff + PR drawers (M7.3)
+const diffState = { projectId: null, worktree: null, base: null, files: [] };
+function colorPatch(patch) {
+  return esc(patch).split("\n").map((l) => {
+    const c = l.startsWith("+++") || l.startsWith("---") ? "m" : l.startsWith("@@") ? "h" : l.startsWith("+") ? "a" : l.startsWith("-") ? "d" : l.startsWith("diff ") ? "m" : "";
+    return c ? `<span class="${c}">${l}</span>` : l;
+  }).join("\n");
+}
+async function openDiffDrawer(projectId, worktree) {
+  const q = new URLSearchParams({ project: projectId, worktree });
+  const d = await fetch(`/v1/worktrees/diff?${q}`).then((x) => x.json());
+  if (d.error) return alert(d.error);
+  Object.assign(diffState, { projectId, worktree: d.worktree, base: d.base, files: d.files });
+  const files = d.files.map((f) => `<a href="#" data-dffile="${esc(f.path)}"><span class="st">${esc(f.status)}</span><span class="pa" title="${esc(f.path)}">${esc(f.path)}</span>${f.added >= 0 ? `<span class="pl">+${f.added}</span><span class="mi">−${f.deleted}</span>` : '<span class="dim">bin</span>'}</a>`).join("");
+  $("#picker").innerHTML = `<div class="pk wide" role="dialog" aria-modal="true">
+    <div class="pk-h">${ic("folders", 15)}<b>Diff</b><span class="dim now" style="flex:1;margin-left:8px">${esc(short(d.worktree))} · vs ${esc(d.baseRef ?? "HEAD")} · ${d.commits.length} commit${d.commits.length === 1 ? "" : "s"} · ${d.files.length} file${d.files.length === 1 ? "" : "s"}${d.dirty ? ' · <span class="badge warn">dirty</span>' : ""}</span></div>
+    <div class="pk-b">
+      ${d.commits.length ? `<div class="dim" style="font-size:var(--fs-sm)">${d.commits.slice(0, 8).map(esc).join("<br>")}${d.commits.length > 8 ? `<br>… ${d.commits.length - 8} more` : ""}</div>` : ""}
+      ${d.files.length ? `<div class="df-files">${files}</div><pre class="df-patch" id="dfPatch"><span class="m">select a file — or view everything below</span></pre>` : '<div class="empty">Nothing changed.</div>'}
+    </div>
+    <div class="pk-f">${d.files.length ? `<a href="#" class="nav" data-dffile="">${ic("folders", 12)} Whole diff</a>` : ""}<span class="grow"></span><button id="pkClose">Close</button></div>
+  </div>`;
+  $("#pkClose")?.addEventListener("click", closePicker);
+}
+async function loadDiffFile(file) {
+  const q = new URLSearchParams({ project: diffState.projectId, worktree: diffState.worktree });
+  if (file) q.set("file", file); else q.set("patch", "1");
+  for (const a of document.querySelectorAll(".df-files a")) a.classList.toggle("on", a.dataset.dffile === file);
+  const el = $("#dfPatch"); if (el) el.innerHTML = '<span class="m">loading…</span>';
+  const d = await fetch(`/v1/worktrees/diff?${q}`).then((x) => x.json());
+  if (el) el.innerHTML = d.patch ? colorPatch(d.patch) : '<span class="m">(empty)</span>';
+}
+async function openPrDrawer(projectId, worktree) {
+  const q = new URLSearchParams({ project: projectId, worktree });
+  const d = await fetch(`/v1/prs/draft?${q}`).then((x) => x.json());
+  if (!d.ok) return alert(d.error);
+  $("#picker").innerHTML = `<div class="pk" role="dialog" aria-modal="true">
+    <div class="pk-h">${ic("git-pull-request", 15)}<b>Open PR</b><span class="dim now" style="flex:1;margin-left:8px">${esc(d.task)} · ${esc(d.worktree.branch ?? "")}${d.diff.dirty ? ' · <span class="badge warn">uncommitted changes — commit first</span>' : ""}</span></div>
+    <div class="pk-b">
+      <label>title<input id="prTitle" value="${esc(d.title)}"></label>
+      <label>body<textarea id="prBody" style="min-height:220px">${esc(d.body)}</textarea></label>
+      <label style="display:flex;gap:8px;align-items:center"><input type="checkbox" id="prDraft" style="width:auto"> draft</label>
+      <div class="dim" style="font-size:var(--fs-sm)">Pushes <code>${esc(d.worktree.branch ?? "")}</code> to origin and runs <code>gh pr create</code> / <code>glab mr create</code> with your local login. Swarm never commits for you.</div>
+    </div>
+    <div class="pk-f"><span class="grow"></span><button id="pkClose">Cancel</button><button class="primary" id="prGo" data-project="${esc(projectId)}" data-worktree="${esc(d.worktree.path)}" ${d.diff.dirty ? "disabled" : ""}>${ic("git-pull-request", 13)} Open PR</button></div>
+  </div>`;
+  $("#pkClose")?.addEventListener("click", closePicker);
+}
+async function submitPr() {
+  const b = $("#prGo"); if (!b) return;
+  const projectId = b.dataset.project, worktree = b.dataset.worktree;
+  const title = $("#prTitle")?.value.trim(), body = $("#prBody")?.value, draft = $("#prDraft")?.checked;
+  b.disabled = true; b.textContent = "opening…";
+  const r = await fetch("/v1/prs/open", { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ projectId, worktree, title, body, draft }) }).then((x) => x.json());
+  if (!r.ok) { b.disabled = false; b.textContent = "Open PR"; return alert(r.error); }
+  closePicker();
+  state.prs = [];
+  await refresh();
+  if (r.url) window.open(r.url, "_blank");
+}
+
 async function openPicker(focusPath = false) {
   await pickerGo("");
   if (focusPath) { const i = $("#pkPath"); if (i) { i.focus(); i.select(); } }
@@ -1194,13 +1702,21 @@ $("#picker").addEventListener("click", (ev) => {
   if (ev.target.id === "picker" || ev.target.closest("#pkCancel")) return closePicker();
   const go = ev.target.closest("[data-go]");
   if (go) return void pickerGo(go.dataset.go);
+  const ctoml = ev.target.closest("[data-copy-toml]"), cles = ev.target.closest("[data-copy-lesson]");
+  if (ctoml) { ev.preventDefault(); copy($(`#toml-${ctoml.dataset.copyToml}`)?.textContent); ctoml.lastChild.textContent = " copied"; return; }
+  if (cles) { ev.preventDefault(); copy($(`#lesson-${cles.dataset.copyLesson}`)?.textContent); cles.lastChild.textContent = " copied"; return; }
+  if (ev.target.closest("#rpPrev")) return replayGo(-1);
+  if (ev.target.closest("#rpNext")) return replayGo(1);
   if (ev.target.closest("#rnCancel")) return closePicker();
   const rnGo = ev.target.closest("#rnGo"); if (rnGo) return submitRun(rnGo.dataset.task);
   if (ev.target.closest("#pkAdd")) { const p = $("#pkPath")?.value.trim() || picker.path; closePicker(); addProject(p); }
 });
+$("#picker").addEventListener("input", (ev) => { if (ev.target.id === "rpRange") { replay.i = Number(ev.target.value); renderReplay(); } });
+$("#picker").addEventListener("change", (ev) => { if (ev.target.dataset?.drmode) { dry.modes[ev.target.dataset.drmode] = ev.target.value; } });
 $("#picker").addEventListener("keydown", (ev) => {
   if (ev.key === "Enter" && ev.target.id === "pkPath") { ev.preventDefault(); pickerGo(ev.target.value.trim()); }
   if (ev.key === "Enter" && (ev.metaKey || ev.ctrlKey) && ev.target.id === "rnPrompt") { ev.preventDefault(); submitRun($("#rnGo")?.dataset.task); }
+  if ((ev.key === "ArrowRight" || ev.key === "ArrowLeft") && $(".rp")) { ev.preventDefault(); replayGo(ev.key === "ArrowRight" ? 1 : -1); }
 });
 document.addEventListener("keydown", (ev) => { if (ev.key === "Escape" && $("#picker").innerHTML) closePicker(); });
 
@@ -1228,9 +1744,10 @@ function connect() {
       if (state.log.length > LOG_CAP) state.log.shift();
       schedule();
     }
+    if (fresh) notifyForEvent(ev);
     pollSoon();
   };
-  for (const t of ["session.started", "session.ended", "prompt.submitted", "tool.requested", "tool.completed", "subagent.started", "subagent.stopped", "agent.text", "session.notification", "incident.opened", "claim.acquired", "claim.released", "resource.acquired", "resource.released", "resource.reaped", "process.started", "process.exited", "gate.recorded", "claim.orphaned", "claim.renewed", "permission.requested", "permission.resolved"]) es.addEventListener(t, onAny);
+  for (const t of ["session.started", "session.ended", "prompt.submitted", "tool.requested", "tool.completed", "subagent.started", "subagent.stopped", "agent.text", "session.notification", "incident.opened", "claim.acquired", "claim.released", "resource.acquired", "resource.released", "resource.reaped", "process.started", "process.exited", "gate.recorded", "claim.orphaned", "claim.renewed", "worktree.bootstrapped", "worktree.created", "worktree.removed", "pr.opened", "question.asked", "question.answered", "dispatch.queued", "dispatch.started", "dispatch.finished", "permission.requested", "permission.resolved"]) es.addEventListener(t, onAny);
 }
 refresh().then(() => {
   const sid = new URLSearchParams(location.search).get("session");