wisp-agents 0.21.0 → 0.22.0

package/web/js/features/launcher.js

@@ -1,5 +1,6 @@
 // The launcher: the box on top where tasks start. It picks where they run (this computer and/or
-// machines, a project in each), on what, and shows a placeholder card until the server answers.
+// machines), in which project (any of them runs anywhere), on what, and shows a placeholder card
+// until the server answers.
 
 import { esc } from '../md.js';
 import { plain } from '../mention-text.js';
@@ -18,7 +19,7 @@ import { feedbackCommand, isFeedback } from './feedback.js';
 import { connectMachine, offlineToast, openMachines } from './machines.js';
 import { mentionBox } from './mentions.js';
 import { askNotify } from './notify.js';
-import { MACHINE_STATE, machineById, placeName, placeOf, projectById, projectsAt, projectTitle } from './places.js';
+import { MACHINE_STATE, machineById, pathAt, placeName, placeOf, placesOf, projectById, projects, projectTitle } from './places.js';
 import { projectList } from './project-list.js';
 import { openProjects } from './projects.js';
 import { runnerPicker } from './runner-picker.js';
@@ -30,11 +31,16 @@ import { canLead, paintTeamBtn, teamEditor } from './team.js';
 // "No folder": a general ask with no project. The server gives it an empty scratch directory.
 const NO_FOLDER = 'none';
 const GENERAL = { id: null, name: 'General', path: '', color: 'slate', scratch: true };
-const projectOf = (k) => (launch.picks[k] === NO_FOLDER ? GENERAL : projectById(launch.picks[k]));
-// The place's other folders for the task (launch.also), and whether a project is in it at all.
-const alsoAt = (k) => launch.also[k] || [];
-const chosen = (k, id) => id === launch.picks[k] || alsoAt(k).includes(id);
-const ownPick = (k) => projectsAt(k).some((p) => p.id === launch.picks[k]);
+// One pick for every place the task runs on (launch.picks[''], see core/state.js): the project,
+// or No folder, or a repo still cloning; and the task's other folders (launch.also['']).
+// Nothing to pick (no projects yet) runs in No folder; the stored pick stays null, so the first
+// project to show up takes over (syncWhere).
+const storedPick = () => launch.picks[''];
+const pickId = () => storedPick() || NO_FOLDER;
+const projectOf = () => (pickId() === NO_FOLDER ? GENERAL : projectById(pickId()));
+const alsoIds = () => launch.also[''] || [];
+const chosen = (id) => id === pickId() || alsoIds().includes(id);
+const ownPick = () => !!projectById(pickId());
 const MOD = combo('').replace(/\+$/, ''); // ⌘ or Ctrl, for "⌘-click"
 // Project chips in the "in" row, at most, before the rest fold into "+N".
 const CHIPS = 5;
@@ -45,25 +51,25 @@ let filterSeen = null;
 function syncWhere() {
   launch.where = launch.where.filter((k, i) => (!k || machineById(k)) && launch.where.indexOf(k) === i);
   if (!launch.where.length) launch.where = [''];
-  // Filtering the feed to a project points the launcher at it (its machine joins if it wasn't picked).
-  // One that's already in the task (as its first folder or another) leaves the selection as it is.
+  // Picks saved per place, from before every project ran everywhere: the first place's carries on.
+  if (!('' in launch.picks) && launch.picks[launch.where[0]]) launch.picks[''] = launch.picks[launch.where[0]];
+  if (!launch.also[''] && launch.also[launch.where[0]]) launch.also[''] = launch.also[launch.where[0]];
+  for (const k of Object.keys(launch.picks)) if (k) delete launch.picks[k];
+  for (const k of Object.keys(launch.also)) if (k) delete launch.also[k];
+  // Filtering the feed to a project points the launcher at it. One that's already in the task
+  // (as its first folder or another) leaves the selection as it is.
   const f = S.filter !== 'all' && S.filter !== filterSeen && projectById(S.filter);
   filterSeen = S.filter;
-  if (f) {
-    if (!launch.where.includes(placeOf(f))) launch.where = [placeOf(f)];
-    if (!chosen(placeOf(f), f.id)) {
-      launch.picks[placeOf(f)] = f.id;
-      delete launch.also[placeOf(f)];
-    }
-  } else if (projectById(launch.project) && !Object.values(launch.picks).includes(launch.project)) launch.picks[placeOf(projectById(launch.project))] ??= launch.project;
-  for (const k of launch.where) if (launch.picks[k] !== NO_FOLDER && !cloneById(launch.picks[k]) && !projectsAt(k).some((p) => p.id === launch.picks[k])) launch.picks[k] = projectsAt(k)[0]?.id || null;
-  // Other folders only go with a project (not No folder or a clone), and only that place's projects.
-  for (const k of Object.keys(launch.also)) {
-    const ids = ownPick(k) ? launch.also[k].filter((id, i, a) => id !== launch.picks[k] && a.indexOf(id) === i && projectsAt(k).some((p) => p.id === id)) : [];
-    if (ids.length) launch.also[k] = ids;
-    else delete launch.also[k];
-  }
-  launch.project = launch.picks[launch.where[0]] || null;
+  if (f && !chosen(f.id)) {
+    launch.picks[''] = f.id;
+    delete launch.also[''];
+  } else if (!storedPick() && projectById(launch.project)) launch.picks[''] = launch.project;
+  if (storedPick() !== NO_FOLDER && !cloneById(storedPick()) && !projectById(storedPick())) launch.picks[''] = projects()[0]?.id || null;
+  // Other folders only go with a project (not No folder or a clone).
+  const ids = ownPick() ? alsoIds().filter((id, i, a) => id !== pickId() && a.indexOf(id) === i && projectById(id)) : [];
+  if (ids.length) launch.also[''] = ids;
+  else delete launch.also[''];
+  launch.project = storedPick() || null;
 }
 
 export function renderLauncher() {
@@ -264,10 +270,10 @@ export function renderLauncher() {
       ta.dispatchEvent(new Event('input'));
       return feedbackCommand(prompt, { restore: () => !ta.value && ((ta.value = prompt), ta.dispatchEvent(new Event('input'))) });
     }
-    // One run per place picked under "Run on", each in the project picked for it.
-    const targets = launch.where.map((k) => ({ k, m: k ? machineById(k) : null, project: projectOf(k), clone: cloneById(launch.picks[k]), also: ownPick(k) ? alsoAt(k).map(projectById).filter(Boolean) : [] }));
-    const unset = targets.find((t) => !t.project && !t.clone);
-    if (unset) return openProjects({ focusAdd: true, machine: unset.k || null });
+    // One run per place picked under "Run on", all in the picked project: a place that has no
+    // checkout of it yet gets one first (the server clones it there).
+    const targets = launch.where.map((k) => ({ k, m: k ? machineById(k) : null, project: projectOf(), clone: cloneById(pickId()), also: ownPick() ? alsoIds().map(projectById).filter(Boolean) : [] }));
+    if (!targets[0].project && !targets[0].clone) return openProjects({ focusAdd: true });
     const off = targets.find((t) => t.m && t.m.state !== 'online');
     if (off) return offlineToast(off.k);
     if (needsSetup()) return nudgeSetup();
@@ -286,7 +292,8 @@ export function renderLauncher() {
     const cmp = compare;
     const runner = { agent: agent?.id || 'claude', model: curModel, effort: curEffort };
     // A repo still cloning gets a stand-in project; its card says so until the clone lands.
-    const pending = targets.map((t) => addPending(prompt, t.project ? t : { ...t, project: { id: t.clone.id, name: t.clone.name, path: '', color: 'slate' } }, runner, t.clone && `Cloning ${t.clone.label}`));
+    const fetching = (t) => t.k && [t.project, ...t.also].some((p) => p && !p.scratch && !pathAt(p, t.k)); // not on that machine yet
+    const pending = targets.map((t) => addPending(prompt, t.project ? t : { ...t, project: { id: t.clone.id, name: t.clone.name, path: '', color: 'slate' } }, runner, t.clone ? `Cloning ${t.clone.label}` : fetching(t) ? `Cloning ${t.project.name} on ${placeName(t.k)}` : undefined));
     if (cmp.length) (compare = []), paintCompare();
     ta.value = '';
     S.drafts.delete('home');
@@ -313,7 +320,7 @@ export function renderLauncher() {
         targets.map((t) =>
           api('/sessions', {
             method: 'POST',
-            body: { prompt, cwd: t.project.scratch ? undefined : t.project.path, also: t.also.length ? t.also.map((p) => p.path) : undefined, scratch: t.project.scratch || undefined, machine: t.k || undefined, groupId, agent: runner.agent, mode: curMode, model: runner.model, effort: runner.effort, attachments, worktree: S.config.defaults.worktree === 'off' && !cmp.length ? false : undefined, compare: cmp.length ? cmp : undefined, subagents: team.length && canLead(runner.agent) ? team : undefined },
+            body: { prompt, cwd: t.project.scratch ? undefined : t.project.path, also: t.also.length ? t.also.map((p) => p.path) : undefined, scratch: t.project.scratch || undefined, machine: t.k, groupId, agent: runner.agent, mode: curMode, model: runner.model, effort: runner.effort, attachments, worktree: S.config.defaults.worktree === 'off' && !cmp.length ? false : undefined, compare: cmp.length ? cmp : undefined, subagents: team.length && canLead(runner.agent) ? team : undefined },
           }),
         ),
       );
@@ -367,52 +374,56 @@ export function renderLauncher() {
   });
 }
 
-// No folder everywhere picked: no git repo, so no worktree either; the toggle would only mislead.
+// No folder: no git repo, so no worktree either; the toggle would only mislead.
 function paintScratch() {
   const wt = $('#launcher #wtBtn');
-  if (wt) wt.hidden = launch.where.every((k) => launch.picks[k] === NO_FOLDER);
+  if (wt) wt.hidden = pickId() === NO_FOLDER;
 }
 
 export function renderLaunchChips() {
   const box = $('#launcher .l-projects');
   if (!box) return;
   syncWhere();
-  const multi = launch.where.length > 1;
-  // One group per place: its name (unless it's only this computer), its projects, a way to add one.
-  const group = (k) => {
-    const m = k && machineById(k);
-    const list = projectsAt(k);
-    const off = m && m.state !== 'online';
-    const label = k || multi ? `<span class="lp-gl ${off ? 'off' : ''}" title="${esc(k ? `${m?.target} · ${MACHINE_STATE[m?.state] || ''}` : 'This computer')}">${icon(k ? 'server' : 'laptop')}${esc(placeName(k))}${off ? `<button class="link xs" data-connect="${k}">${m.state === 'connecting' || m.state === 'reconnecting' ? 'connecting…' : 'Connect'}</button>` : ''}</span>` : '';
-    // A repo still cloning: picked, with a spinner, until the real project replaces it.
-    const cloning = clones
-      .filter((c) => (c.where || '') === k)
-      .map((c) => `<button class="lp-chip cloning ${c.id === launch.picks[k] ? 'on' : ''}" data-id="${c.id}" data-k="${k}" title="Cloning ${esc(c.label)}…"><span class="orb live"></span>${esc(c.name)}<span class="lp-note">cloning…</span></button>`)
-      .join('');
-    // Tens of projects: the most recent few as chips (the picks always among them), the rest one
-    // search away behind "+N". fitChips() then folds more into it if the row would wrap.
-    const max = multi ? 3 : CHIPS;
-    const picked = list.filter((p) => chosen(k, p.id));
-    const rest = list.filter((p) => !chosen(k, p.id)).slice(0, Math.max(0, max - picked.length));
-    const shown = list.filter((p) => picked.includes(p) || rest.includes(p));
-    // A task can span several of the place's projects: ⌘-click a chip, or its + badge, to add it;
-    // the × on a picked one leaves it out again.
-    const own = ownPick(k);
-    const several = own && alsoAt(k).length > 0;
-    const badge = (p) =>
-      chosen(k, p.id)
-        ? several ? `<span class="lp-also x" data-also="${p.id}" title="Leave ${esc(p.name)} out of this task">${icon('x')}</span>` : ''
-        : own ? `<span class="lp-also" data-also="${p.id}" title="Also work in ${esc(p.name)} (${MOD}-click)">${icon('plus')}</span>` : '';
-    const tip = (p) => `${projectTitle(p)}${several && p.id === launch.picks[k] ? '\nThe agent starts here' : ''}${own && !chosen(k, p.id) ? `\n${MOD}-click to work in it too` : ''}`;
-    const chips = cloning + shown.map((p) => `<button class="lp-chip c-${p.color} ${chosen(k, p.id) ? 'on' : ''}" data-id="${p.id}" data-k="${k}" title="${esc(tip(p))}"><i class="p-dot"></i>${esc(p.name)}${badge(p)}</button>`).join('');
-    const more = list.length > 1 ? `<button class="lp-chip more" data-more="${k}" data-total="${list.length}" title="All ${list.length} projects${k ? ` on ${esc(placeName(k))}` : ''}" aria-haspopup="dialog"><span class="lp-more-n"></span>${icon('search')}</button>` : '';
-    const add = list.length || cloning
-      ? `<button class="lp-chip add" data-add="${k}" title="Another folder${k ? ` on ${esc(placeName(k))}` : ''}">${icon('folder')}${multi || list.length > max ? '' : 'Other folder…'}</button>`
-      : `<button class="lp-chip add" data-add="${k}">${icon('folder')}${k ? `Pick a project on ${esc(placeName(k))}…` : 'Choose a folder…'}</button>`;
-    const none = `<button class="lp-chip none ${launch.picks[k] === NO_FOLDER ? 'on' : ''}" data-id="${NO_FOLDER}" data-k="${k}" title="No folder: a general ask, with no project and no worktree. The agent gets an empty scratch directory.">${icon('spark')}<span>No folder</span></button>`;
-    return `<span class="lp-group">${label}${chips}${more}${none}${add}</span>`;
+  const list = projects();
+  const pick = pickId();
+  // A machine picked under "Run on" but not connected: it says so, with a way to connect.
+  const offline = launch.where
+    .map(machineById)
+    .filter((m) => m && m.state !== 'online')
+    .map((m) => `<span class="lp-gl off" title="${esc(`${m.target} · ${MACHINE_STATE[m.state] || ''}`)}">${icon('server')}${esc(m.name)}<button class="link xs" data-connect="${m.id}">${m.state === 'connecting' || m.state === 'reconnecting' ? 'connecting…' : 'Connect'}</button></span>`)
+    .join('');
+  // A repo still cloning: picked, with a spinner, until the real project replaces it.
+  const cloning = clones
+    .map((c) => `<button class="lp-chip cloning ${c.id === pick ? 'on' : ''}" data-id="${c.id}" title="Cloning ${esc(c.label)}${c.where ? ` on ${esc(placeName(c.where))}` : ''}…"><span class="orb live"></span>${esc(c.name)}<span class="lp-note">cloning…</span></button>`)
+    .join('');
+  // Tens of projects: the most recent few as chips (the picks always among them), the rest one
+  // search away behind "+N". fitChips() then folds more into it if the row would wrap.
+  const picked = list.filter((p) => chosen(p.id));
+  const rest = list.filter((p) => !chosen(p.id)).slice(0, Math.max(0, CHIPS - picked.length));
+  const shown = list.filter((p) => picked.includes(p) || rest.includes(p));
+  // A task can span several projects: ⌘-click a chip, or its + badge, to add it; the × on a
+  // picked one leaves it out again.
+  const own = ownPick();
+  const several = own && alsoIds().length > 0;
+  const badge = (p) =>
+    chosen(p.id)
+      ? several ? `<span class="lp-also x" data-also="${p.id}" title="Leave ${esc(p.name)} out of this task">${icon('x')}</span>` : ''
+      : own ? `<span class="lp-also" data-also="${p.id}" title="Also work in ${esc(p.name)} (${MOD}-click)">${icon('plus')}</span>` : '';
+  // Machines picked that have no checkout of it yet: the first run there clones it.
+  const missing = (p) => launch.where.filter((k) => k && !pathAt(p, k)).map(placeName);
+  const tip = (p) => {
+    const m = missing(p);
+    return `${projectTitle(p)}${m.length ? `\nwisp clones it on ${m.join(', ')} for this task` : ''}${several && p.id === pick ? '\nThe agent starts here' : ''}${own && !chosen(p.id) ? `\n${MOD}-click to work in it too` : ''}`;
   };
-  box.innerHTML = `<span class="l-in">in</span>${launch.where.map(group).join('')}`;
+  const chips = cloning + shown.map((p) => `<button class="lp-chip c-${p.color} ${chosen(p.id) ? 'on' : ''}" data-id="${p.id}" title="${esc(tip(p))}"><i class="p-dot"></i>${esc(p.name)}${badge(p)}</button>`).join('');
+  const more = list.length > 1 ? `<button class="lp-chip more" data-more="1" data-total="${list.length}" title="All ${list.length} projects" aria-haspopup="dialog"><span class="lp-more-n"></span>${icon('search')}</button>` : '';
+  // Another folder goes on the one machine picked, if that's all it runs on.
+  const addOn = launch.where.length === 1 ? launch.where[0] : '';
+  const add = list.length || cloning
+    ? `<button class="lp-chip add" data-add="${addOn}" title="Another folder${addOn ? ` on ${esc(placeName(addOn))}` : ''}">${icon('folder')}${list.length > CHIPS ? '' : 'Other folder…'}</button>`
+    : `<button class="lp-chip add" data-add="${addOn}">${icon('folder')}${addOn ? `Pick a project on ${esc(placeName(addOn))}…` : 'Choose a folder…'}</button>`;
+  const none = `<button class="lp-chip none ${pick === NO_FOLDER ? 'on' : ''}" data-id="${NO_FOLDER}" title="No folder: a general ask, with no project and no worktree. The agent gets an empty scratch directory.">${icon('spark')}<span>No folder</span></button>`;
+  box.innerHTML = `<span class="l-in">in</span><span class="lp-group">${chips}${more}${none}${add}${offline}</span>`;
   fitChips(box);
   fitRow ??= new ResizeObserver(([e]) => {
     if (e.contentRect.width === fitRow.w) return; // its own folding only changes the height
@@ -423,19 +434,19 @@ export function renderLaunchChips() {
   paintScratch();
   // A plain pick makes it the task's only folder; `add` (⌘-click, the + badge) adds it to the
   // folders or takes it out. Leaving out the first folder hands its place to the next one.
-  const pick = (k, id, { add = false } = {}) => {
-    const also = alsoAt(k);
-    if (add && ownPick(k) && projectById(id)) {
-      if (id !== launch.picks[k]) launch.also[k] = also.includes(id) ? also.filter((x) => x !== id) : [...also, id];
+  const choose = (id, { add = false } = {}) => {
+    const also = alsoIds();
+    if (add && ownPick() && projectById(id)) {
+      if (id !== pickId()) launch.also[''] = also.includes(id) ? also.filter((x) => x !== id) : [...also, id];
       else if (also.length) {
-        launch.picks[k] = also[0];
-        launch.also[k] = also.slice(1);
+        launch.picks[''] = also[0];
+        launch.also[''] = also.slice(1);
       }
     } else {
-      launch.picks[k] = id;
-      delete launch.also[k];
+      launch.picks[''] = id;
+      delete launch.also[''];
     }
-    if (k === launch.where[0]) launch.project = launch.picks[k];
+    launch.project = storedPick();
     saveLaunch();
     paintScratch();
     renderLaunchRecipes();
@@ -443,33 +454,31 @@ export function renderLaunchChips() {
   box.onclick = (e) => {
     const chip = e.target.closest('.lp-chip[data-id]');
     if (chip) {
-      const k = chip.dataset.k;
-      pick(k, chip.dataset.id, { add: !!e.target.closest('[data-also]') || e.metaKey || e.ctrlKey || e.shiftKey });
+      choose(chip.dataset.id, { add: !!e.target.closest('[data-also]') || e.metaKey || e.ctrlKey || e.shiftKey });
       renderLaunchChips(); // the + and × badges follow the picks
       return;
     }
     const more = e.target.closest('[data-more]');
     if (more) {
-      const k = more.dataset.more;
       return projectList(more, {
-        projects: projectsAt(k),
-        current: launch.picks[k],
+        projects: projects(),
+        current: pickId(),
         // Each row's + adds it to the task (or takes it out) and leaves the list open.
-        also: ownPick(k) && {
-          has: (id) => chosen(k, id),
+        also: ownPick() && {
+          has: (id) => chosen(id),
           toggle: (id) => {
-            pick(k, id, { add: true });
+            choose(id, { add: true });
             renderLaunchChips();
           },
         },
-        label: `Projects on ${placeName(k)}`,
+        label: 'Projects',
         extras: [
           { id: NO_FOLDER, label: 'No folder', icon: 'spark' },
-          { id: '+add', label: k ? `Another folder on ${placeName(k)}…` : 'Other folder…', icon: 'folder' },
+          { id: '+add', label: addOn ? `Another folder on ${placeName(addOn)}…` : 'Other folder…', icon: 'folder' },
         ],
         onPick: (id) => {
-          if (id === '+add') return openProjects({ focusAdd: true, machine: k || null });
-          pick(k, id);
+          if (id === '+add') return openProjects({ focusAdd: true, machine: addOn || null });
+          choose(id);
           renderLaunchChips(); // the pick joins the chips
           $('#prompt')?.focus();
         },
@@ -499,7 +508,6 @@ function fitChips(box) {
       $('.lp-more-n', more).textContent = `+${n}`;
     };
     paint();
-    if (launch.where.length > 1) continue;
     const wraps = () => {
       const kids = [...g.children].filter((x) => !x.hidden && x.offsetParent);
       if (!kids.length) return false; // not laid out (a launcher painted over, or folded into the dock)
@@ -543,12 +551,12 @@ function whereMenu(anchor) {
       return `<button class="wm-row ${on ? 'on' : ''}" data-k="${k}" role="menuitemcheckbox" aria-checked="${on}">
         <span class="wm-check">${icon('check')}</span>
         <span class="wm-icon">${icon(k ? 'server' : 'laptop')}${m ? `<i class="dot ${st === 'online' ? 'ok' : st === 'error' ? 'bad' : ''}"></i>` : ''}</span>
-        <span class="wm-name"><b>${esc(placeName(k))}</b><small>${m ? esc(st === 'online' ? m.target : `${m.target} · ${MACHINE_STATE[st]}`) : `${projectsAt('').length} project${projectsAt('').length === 1 ? '' : 's'}`}</small></span>
+        <span class="wm-name"><b>${esc(placeName(k))}</b><small>${m ? esc(st === 'online' ? m.target : `${m.target} · ${MACHINE_STATE[st]}`) : 'Where wisp runs'}</small></span>
         ${m && st === 'online' && ready.length ? `<span class="wm-agents">${ready.map((a) => `<span class="model-logo">${harnessLogo(a.id)}</span>`).join('')}</span>` : ''}
         <span class="wm-only" data-only="${k}" title="Only here">only</span>
       </button>`;
     };
-    box.innerHTML = `<div class="wm-h">Run on <small>pick several to run in parallel</small></div>
+    box.innerHTML = `<div class="wm-h">Run on <small>pick several to run in parallel · any project runs anywhere</small></div>
       ${row('', null)}${S.machines.map((m) => row(m.id, m)).join('')}
       <div class="wm-sep"></div>
       <button data-a="add">${icon('plus')}${S.machines.length ? 'Add a machine…' : 'Add a machine to run on another computer…'}</button>
@@ -676,10 +684,12 @@ function addPending(prompt, { project: p, m, also = [] }, { agent, model, effort
 
 // A launch from a dialog (rerun, recipes): the dialog closes and a placeholder shows in Working
 // at once; the real session replaces it, or it disappears and the error is thrown on.
-export async function launchBehind({ prompt, cwd, runner }, request) {
-  const sum = S.config.projects.find((p) => p.path === cwd);
+// machine: where it runs ('' = this computer), else where the folder is.
+export async function launchBehind({ prompt, cwd, runner, machine }, request) {
+  const sum = S.config.projects.find((p) => placesOf(p).some((k) => pathAt(p, k) === cwd));
   const project = sum || { path: cwd, name: cwd.split('/').filter(Boolean).pop() || cwd, id: null, color: 'slate' };
-  const ghost = addPending(prompt, { project, m: project.machine ? machineById(project.machine) : null }, runner);
+  const k = machine ?? placeOf(project);
+  const ghost = addPending(prompt, { project, m: k ? machineById(k) : null }, runner, k && sum && !pathAt(sum, k) ? `Cloning ${sum.name} on ${placeName(k)}` : undefined);
   if (S.filter !== 'all' && S.filter !== project.id) {
     S.filter = 'all';
     save('wisp.filter', S.filter);

package/web/js/features/place-menu.js

@@ -0,0 +1,44 @@
+// "Runs on" for one task: pick this computer or a machine for a follow-up or a rerun. The
+// launcher's own menu (several places at once) is whereMenu in launcher.js.
+
+import { esc } from '../md.js';
+import * as bus from '../core/bus.js';
+import { $, el, icon } from '../core/dom.js';
+import { S } from '../core/state.js';
+import { popover } from '../ui/popover.js';
+import { MACHINE_STATE, machineById, placeName } from './places.js';
+
+// One place for a follow-up or a rerun: this computer or a machine. from: where the task is now.
+// locked: why it can't move right now (a running task), shown instead of a choice.
+export function placeMenu(anchor, { title, current, from, note = '', locked = '' }, pick) {
+  if ($('.menu.place-menu')) return $('.menu.place-menu').close();
+  const box = el(`<div class="menu where-menu place-menu" role="menu"></div>`);
+  const paint = () => {
+    const row = (k) => {
+      const m = k ? machineById(k) : null;
+      const st = m ? m.state : 'online';
+      const on = k === current;
+      const sub = k === from ? 'Where it is now' : m ? (st === 'online' ? m.target : `${m.target} · ${MACHINE_STATE[st]}`) : 'Where wisp runs';
+      return `<button class="wm-row ${on ? 'on' : ''}" data-k="${k}" role="menuitemradio" aria-checked="${on}" ${locked && k !== from ? 'disabled' : ''}>
+        <span class="wm-check">${icon('check')}</span>
+        <span class="wm-icon">${icon(k ? 'server' : 'laptop')}${m ? `<i class="dot ${st === 'online' ? 'ok' : st === 'error' ? 'bad' : ''}"></i>` : ''}</span>
+        <span class="wm-name"><b>${esc(placeName(k))}</b><small>${esc(sub)}</small></span>
+      </button>`;
+    };
+    box.innerHTML = `<div class="wm-h">${esc(title)}</div>${locked || note ? `<p class="wm-note ${locked ? 'warn' : ''}">${esc(locked || note)}</p>` : ''}${row('')}${S.machines.map((m) => row(m.id)).join('')}`;
+  };
+  box.onclick = (e) => {
+    const r = e.target.closest('.wm-row:not([disabled])');
+    if (!r) return;
+    shut();
+    pick(r.dataset.k);
+  };
+  paint();
+  const shut = popover(box, { anchor, onClose: () => anchor.setAttribute('aria-expanded', 'false') });
+  bus.on('machines', paint, { node: box });
+  anchor.setAttribute('aria-expanded', 'true');
+  const r = anchor.getBoundingClientRect();
+  const h = box.offsetHeight;
+  box.style.left = `${Math.max(8, Math.min(r.left, innerWidth - box.offsetWidth - 8))}px`;
+  box.style.top = `${r.bottom + 6 + h > innerHeight - 8 ? Math.max(8, r.top - h - 6) : r.bottom + 6}px`;
+}

package/web/js/features/places.js

@@ -1,5 +1,6 @@
-// Projects and machines: the places a task can run. A project is a folder, on this computer or on a
-// machine (another computer running its own wisp, reached over SSH).
+// Projects and machines: the places a task can run. A project is one repo, and runs on every place:
+// it was added on one (path, machine), and wisp clones it onto the others the first time a task
+// runs there (copies: { [machine id | 'here']: path }; server/services/places.js).
 
 import { esc } from '../md.js';
 import { icon } from '../core/dom.js';
@@ -20,17 +21,26 @@ export function projectLabel(s) {
 }
 export const placeName = (k) => (k ? machineById(k)?.name || 'machine' : 'This computer');
 export const recentFirst = (a, b) => (b.lastUsedAt || b.addedAt) - (a.lastUsedAt || a.addedAt);
-export const projectsAt = (k) => S.config.projects.filter((p) => placeOf(p) === k).sort(recentFirst);
+// Every project, on every place: one that isn't on a place yet gets cloned there on first use.
+export const projects = () => [...S.config.projects].sort(recentFirst);
+// The project's folder on place k, or '' when wisp still has to put it there.
+export const pathAt = (p, k) => (placeOf(p) === k ? p.path : p?.copies?.[k || 'here'] || '');
+// The places that have a checkout of it: where it was added first.
+export const placesOf = (p) => (p ? [placeOf(p), ...Object.keys(p.copies || {}).map((k) => (k === 'here' ? '' : k))].filter((k, i, a) => a.indexOf(k) === i && (!k || machineById(k))) : []);
 
 // A machine runs its own wisp; this one signs in over SSH, tunnels to it and shows its sessions
-// as <id>@<machine>. Projects can live on a machine; launching in one runs the agent there.
+// as <id>@<machine>. Any project runs there; the launch clones it there first if it has to.
 export const machineById = (id) => S.machines.find((m) => m.id === id);
 const machineOnline = (id) => machineById(id)?.state === 'online';
 export const MACHINE_STATE = { online: 'Online', connecting: 'Connecting…', reconnecting: 'Reconnecting…', error: 'Couldn’t connect', off: 'Not connected' };
+// Where it is: "~/code/app", "on devbox: /srv/app", plus the other places that have it.
 export const projectTitle = (p) => {
   if (!p) return '';
+  const tilde = (x) => (S.config.home && x.startsWith(S.config.home) ? `~${x.slice(S.config.home.length)}` : x);
   const m = p.machine && machineById(p.machine);
-  return m ? `${p.path} on ${m.name}${m.state === 'online' ? '' : ' (not connected)'}` : p.path;
+  const first = m ? `${p.path} on ${m.name}${m.state === 'online' ? '' : ' (not connected)'}` : tilde(p.path);
+  const also = placesOf(p).slice(1).map(placeName);
+  return also.length ? `${first}\nAlso checked out on ${also.join(', ')}` : first;
 };
 
 export function machinePill(mt) {

package/web/js/features/projects.js

@@ -13,7 +13,7 @@ import { feedToTop, renderFeed } from './feed.js';
 import { renderLaunchChips } from './launcher.js';
 import { loadConfig } from './live.js';
 import { connectMachine, openMachines } from './machines.js';
-import { inProject, MACHINE_STATE, machineById, placeOf, projectById, projectTitle, recentFirst } from './places.js';
+import { inProject, MACHINE_STATE, machineById, pathAt, placeName, placesOf, projectById, projectTitle, recentFirst } from './places.js';
 import { projectList } from './project-list.js';
 
 // Project filter chips in the top bar before the rest fold into "+N".
@@ -203,8 +203,8 @@ export async function openProjects({ focusAdd = false, machine = null, host } =
         : `Clones <b>${esc(repoLabel(v))}</b> into <button class="link" data-a="clonedir" title="Change where repos are cloned">${esc(tilde(S.config.cloneDir || '~/code'))}/${esc(repoName(v))}</button>. You can write the task while it clones.`;
     else
       hint.innerHTML = m
-        ? `Folders on <b>${esc(m.name)}</b>, or a repo URL to clone there. Agents run there, in its own worktrees; you follow along here.`
-        : 'Paste a GitHub URL and wisp clones it for you. Or run <code>wisp add</code> inside any folder: it is added automatically.';
+        ? `Folders on <b>${esc(m.name)}</b>, or a repo URL to clone there. You don’t need to add a project here that you already have: every project runs on ${esc(m.name)}, and wisp clones it there the first time.`
+        : `Paste a GitHub URL and wisp clones it for you. Or run <code>wisp add</code> inside any folder: it is added automatically.${S.machines.length ? ' Projects run on your machines too: wisp clones them there when a task needs it.' : ''}`;
   };
   // Change the clone folder in place: the hint turns into a small path field.
   $('.hint', node).addEventListener('click', (e) => {
@@ -255,13 +255,13 @@ export async function openProjects({ focusAdd = false, machine = null, host } =
     input.focus();
   });
 
-  // A new project becomes the launcher's pick for its place.
+  // A new project becomes the launcher's pick; added on a machine, the task runs there.
   const picked = async (proj) => {
     await loadConfig();
-    launch.picks[placeOf(proj)] = proj.id;
-    delete launch.also[placeOf(proj)];
-    if (!launch.where.includes(placeOf(proj))) launch.where = [placeOf(proj)];
-    if (placeOf(proj) === launch.where[0]) launch.project = proj.id;
+    launch.picks[''] = proj.id;
+    delete launch.also[''];
+    launch.project = proj.id;
+    if (!launch.where.includes(where || '')) launch.where = [where || ''];
     saveLaunch();
     renderLaunchChips();
   };
@@ -332,9 +332,9 @@ export async function openProjects({ focusAdd = false, machine = null, host } =
 
   const list = () => {
     const box = $('#plist', node);
-    const projects = S.config.projects.filter((p) => (p.machine || null) === where);
+    // Every project, wherever it was added: each runs on every place. Its row says where it's checked out.
+    const projects = [...S.config.projects].sort(recentFirst);
     const pending = clones
-      .filter((j) => j.where === where)
       .map(
         (j) => `<div class="prow cloning"><span class="swatch"><span class="orb live"></span></span>
           <div class="prow-main"><b class="pname">${esc(repoName(j.url))}</b><span class="ppath">Cloning ${esc(repoLabel(j.url))}…</span></div></div>`,
@@ -345,15 +345,17 @@ export async function openProjects({ focusAdd = false, machine = null, host } =
         projects
           .map((p) => {
             const n = [...S.sessions.values()].filter((s) => inProject(s, p.id)).length;
+            const at = placesOf(p);
+            const spots = at.map((k) => `<span class="pplace" title="${esc(k ? `${pathAt(p, k)} on ${placeName(k)}` : pathAt(p, k))}">${icon(k ? 'server' : 'laptop')}${esc(placeName(k))}</span>`).join('');
             return `<div class="prow c-${p.color}" data-id="${p.id}">
               <button class="swatch" title="Change colour"><i class="p-dot"></i></button>
-              <div class="prow-main"><input class="pname" value="${esc(p.name)}"><span class="ppath">${esc(tilde(p.path))}</span></div>
+              <div class="prow-main"><input class="pname" value="${esc(p.name)}"><span class="ppath">${S.machines.length ? spots : esc(tilde(p.path))}</span></div>
               <span class="pcount">${n} session${n === 1 ? '' : 's'}</span>
               <button class="icon-btn premove" title="Remove from wisp (files untouched)">${icon('trash')}</button>
             </div>`;
           })
           .join('')
-      : `<p class="muted">No projects ${where ? `on ${esc(here()?.name || '')} ` : ''}yet. Add a folder above, or pick one below.</p>`;
+      : `<p class="muted">No projects yet. Add a folder above, or pick one below.</p>`;
     $$('.prow[data-id]', box).forEach((row) => {
       const id = row.dataset.id;
       const p = projectById(id);

package/web/js/features/settings.js

@@ -20,6 +20,8 @@ import { openPhone, phoneSummary } from './phone.js';
 import { machinesSummary } from './places.js';
 import { AUTO_GOALS, harnessLogo } from './runners.js';
 import { INSTALLABLE, installHarness, isInstalling } from './setup.js';
+import { clearPicks } from './transcript.js';
+import { repaintViews } from './turns.js';
 import { openUsage } from './usage.js';
 
 // A sidebar of sections and one pane at a time, like every other app's settings. Big lists
@@ -80,6 +82,9 @@ export function openSettings(opts) {
             ${row('Worktree per task', 'Each task gets its own branch from origin/main, in git repos', '<button class="switch" id="wtDefault" role="switch"></button>')}
             ${row('Auto-fix PR conflicts', 'Without waiting for a click on Fix conflicts: when a shipped PR conflicts with its base, the task merges the base in, resolves it and pushes', '<button class="switch" id="fixConflicts" role="switch"></button>')}
           </div>
+          <div class="sx-group">
+            ${row('Full transcript', 'Every message and step the agent took, with its presentation at the end. Any one card switches with its Transcript button or <kbd>V</kbd>', '<button class="switch" id="txDefault" role="switch"></button>')}
+          </div>
         </section>
         <section class="sx-pane" data-pane="notifications">
           <div class="sx-group">
@@ -116,7 +121,7 @@ export function openSettings(opts) {
           <div class="sx-group">
             ${row('Machines', '<span class="machines-hint"></span>', '<button class="ghost sm" id="openMachines">Manage</button>')}
           </div>
-          <p class="hint">Also in the top bar, and in Projects: add folders on a machine, then launch there like anywhere else.</p>
+          <p class="hint">Also in the top bar. Every project runs on every machine: pick one under Run on and wisp clones the project there the first time. A follow-up or a rerun can move a task to another one.</p>
         </section>
         <section class="sx-pane" data-pane="memory">
           <div class="sx-group">
@@ -308,6 +313,9 @@ export function openSettings(opts) {
     });
     if (!saved) return;
     paintWt();
+    renderLauncher();
+  };
+  paintWt();
   const fc = $('#fixConflicts', node);
   const paintFc = () => fc.setAttribute('aria-checked', S.config.defaults.fixConflicts === 'on');
   fc.onclick = async () => {
@@ -321,9 +329,22 @@ export function openSettings(opts) {
     }
   };
   paintFc();
-    renderLauncher();
+  // The transcript switch flips every open card at once; a refused save flips them back.
+  const tx = $('#txDefault', node);
+  const paintTx = () => tx.setAttribute('aria-checked', S.config.defaults.transcript === 'on');
+  const setTx = (v) => {
+    S.config.defaults.transcript = v;
+    clearPicks();
+    paintTx();
+    repaintViews();
   };
-  paintWt();
+  tx.onclick = async () => {
+    const was = S.config.defaults.transcript || 'off';
+    setTx(was === 'on' ? 'off' : 'on');
+    const saved = await tryApi(() => api('/config', { method: 'PATCH', body: { defaults: { transcript: S.config.defaults.transcript } } }));
+    if (!saved) setTx(was);
+  };
+  paintTx();
   // Auto: goal, exploring and allowed harnesses here; the full record in its own view.
   const paintAuto = async () => {
     const r = await api('/router').catch(() => null);