@oddessentials/agent-guild 0.33.2 → 0.35.0

package/web/app.js

@@ -315,9 +315,87 @@ function autostartRun(autostart) {
   return `Last ran at sign-in on ${at}, but the session manager did not start.${autostart.log ? ` See ${autostart.log}.` : ''}`;
 }
 
-/** The manager's sign-in setting; hidden when the manager has none. */
+const STARTUP_MODES = ['off', 'sign-in', 'boot'];
+const STARTUP_OFF_NOTE = 'The session manager starts when you run agent-guild open, and stops when you stop it or the computer shuts down.';
+const startupTime = (iso) => new Date(iso).toLocaleString([], { dateStyle: 'medium', timeStyle: 'short' });
+
+/** What the boot service is doing, as systemd reports it, and how loudly to say it. */
+function startupBootStatus(boot) {
+  const s = boot?.state;
+  if (!s) return { text: '', outcome: '' };
+  const on = (iso) => (iso ? ` on ${startupTime(iso)}` : '');
+  const text = {
+    running: `Running under systemd${s.since ? ` since ${startupTime(s.since)}` : ''}.`,
+    other: `systemd is running a different session manager (process ${s.pid}), not this one.`,
+    starting: 'systemd is starting the session manager…',
+    pending: 'Saved. This session manager was started without systemd; systemd takes over at its next restart or when the computer starts.',
+    stopped: 'systemd has stopped the session manager; it starts again when the computer starts.',
+    'port-in-use': `Did not start${on(s.at)}: another session manager was using port ${s.port}.`,
+    failed: `Stopped after failing to start${on(s.at)}. Its log says why:`,
+  }[s.kind] || '';
+  const linger = boot.linger ? '' : ' Until you allow it to run without a sign-in, it starts when you first sign in, not when the computer starts. Run this once as an administrator:';
+  const failed = s.kind === 'failed' || s.kind === 'port-in-use';
+  return { text: `${text}${linger}`, outcome: failed ? 'failed' : boot.linger ? 'started' : 'warn' };
+}
+
+/** Commands the state names as the next step, each with a Copy button. */
+function renderStartupCommands(commands = []) {
+  const box = $('startup-commands');
+  box.replaceChildren(...commands.map((command) => {
+    const row = document.createElement('div');
+    row.className = 'command';
+    const pre = document.createElement('pre');
+    pre.textContent = command;
+    const copy = document.createElement('button');
+    copy.className = 'btn';
+    copy.type = 'button';
+    copy.textContent = 'Copy';
+    copy.title = 'Copy the command';
+    copy.addEventListener('click', () => copyText(command, 'the command'));
+    row.append(pre, copy);
+    return row;
+  }));
+  box.hidden = commands.length === 0;
+}
+
+/** Linux: one choice of off, sign-in or boot, with what the chosen one is doing now. */
+function renderStartupModes(autostart) {
+  const { mode, boot } = autostart;
+  for (const value of STARTUP_MODES) {
+    const input = $(`startup-${value}`);
+    input.checked = value === mode;
+    input.disabled = !autostart.available || (value === 'boot' && !boot?.available);
+  }
+  let note;
+  let run = { text: '', outcome: '' };
+  if (mode === 'both') {
+    note = 'A sign-in entry and the systemd service are both on. Choose one.';
+  } else if (mode === 'boot') {
+    note = boot.reason || boot.note;
+    run = startupBootStatus(boot);
+  } else if (mode === 'sign-in') {
+    note = autostart.reason || autostart.note || AUTOSTART_NOTE;
+    run = { text: autostartRun(autostart), outcome: autostart.lastRun?.outcome ?? 'none' };
+  } else {
+    note = STARTUP_OFF_NOTE;
+  }
+  // Why the boot choice is greyed out, whichever mode is chosen.
+  if (boot && !boot.available && mode !== 'boot') run = { text: boot.reason, outcome: '' };
+  $('autostart-note').textContent = note;
+  $('autostart-run').textContent = run.text;
+  $('autostart-run').hidden = !run.text;
+  $('autostart-run').dataset.outcome = run.outcome;
+  renderStartupCommands(mode === 'boot' || mode === 'both' ? boot?.commands : []);
+}
+
+/** The manager's startup setting; hidden when the manager has none. */
 function renderAutostart(autostart) {
   $('autostart-choice').hidden = !autostart;
+  const modes = Boolean(autostart?.mode);
+  $('autostart-single').hidden = modes;
+  $('startup-modes').hidden = !modes;
+  if (modes) return renderStartupModes(autostart);
+  renderStartupCommands([]);
   $('autostart').checked = Boolean(autostart?.enabled);
   $('autostart').disabled = !autostart?.available;
   $('autostart-note').textContent = autostart?.reason || autostart?.note || AUTOSTART_NOTE;
@@ -327,10 +405,16 @@ function renderAutostart(autostart) {
   $('autostart-run').dataset.outcome = autostart?.enabled ? autostart.lastRun?.outcome ?? 'none' : '';
 }
 
+/** Every startup control, disabled while a read or change is in flight. */
+function disableStartup() {
+  $('autostart').disabled = true;
+  for (const value of STARTUP_MODES) $(`startup-${value}`).disabled = true;
+}
+
 async function loadAutostart({ afterChange = false } = {}) {
   if (!state.connected || (autostartChanging && !afterChange)) return;
   const request = ++autostartRequest;
-  $('autostart').disabled = true;
+  disableStartup();
   try {
     const { autostart } = await api('GET', '/autostart');
     if (request === autostartRequest) renderAutostart(autostart);
@@ -342,14 +426,14 @@ async function loadAutostart({ afterChange = false } = {}) {
   }
 }
 
-async function changeAutostart(input) {
+/** Sends one change, shows what the manager reports after it, and reads back the actual state when it fails. */
+async function sendStartup(body) {
   if (autostartChanging) return;
   autostartChanging = true;
   ++autostartRequest;
-  const enabled = input.checked;
-  input.disabled = true;
+  disableStartup();
   try {
-    renderAutostart((await api('PUT', '/autostart', { enabled })).autostart);
+    renderAutostart((await api('PUT', '/autostart', body)).autostart);
   } catch (err) {
     if (err instanceof AuthError) showAuth(err.message);
     else {
@@ -362,6 +446,14 @@ async function changeAutostart(input) {
   }
 }
 
+function changeAutostart(input) {
+  return sendStartup({ enabled: input.checked });
+}
+
+function changeStartup(input) {
+  return sendStartup({ mode: input.value });
+}
+
 function changeSound(input) {
   save(SOUND_KEY, input.checked ? 'on' : null);
   prepareSounds();
@@ -1695,10 +1787,43 @@ function creditsNote(usage) {
   return [note];
 }
 
+/** The same rounding the meter prints as "N% left". */
+function usageLeft(usedPercent) {
+  return Math.max(0, Math.round(100 - usedPercent));
+}
+
+/**
+ * true when every window explicitly reads 0% left.
+ * false when the account is logged in without that reading.
+ * null when there is no reading to count, including a signed-out account.
+ */
+function accountUsageSpent(usage) {
+  if (!usage || usage.signedIn === false) return null;
+  const windows = Array.isArray(usage.windows) ? usage.windows : [];
+  const readable = !usage.error && windows.length > 0 && windows.every((w) => typeof w.usedPercent === 'number' && Number.isFinite(w.usedPercent));
+  if (!readable) return usage.signedIn === true ? false : null;
+  if (typeof usage.credits === 'number' && Number.isFinite(usage.credits) && usage.credits > 0) return false;
+  return windows.every((w) => usageLeft(w.usedPercent) === 0);
+}
+
+/** The portrait is spent only when every logged-in account explicitly reads 0% left. */
+function cardUsageSpent(provider, usageByAccount) {
+  if (!provider?.available || !provider.usageSource) return false;
+  const accounts = provider.accounts?.length ? provider.accounts : [{ id: 'default' }];
+  let spent = false;
+  for (const account of accounts) {
+    const reading = accountUsageSpent(usageByAccount.get(`${provider.id}/${account.id}`));
+    if (reading === false) return false;
+    if (reading === true) spent = true;
+  }
+  return spent;
+}
+
 function renderUsage(card, provider) {
   const host = card.querySelector('.usage');
   const account = selectedAccount(provider);
   const usage = usageFor(provider, account);
+  card.classList.toggle('spent', cardUsageSpent(provider, state.usage));
   renderTier(card, provider, provider.usageSource ? usage : null);
   const start = card.querySelector('.new');
   const unsigned = Boolean(provider.available && usage?.signedIn === false);
@@ -1716,7 +1841,7 @@ function renderUsage(card, provider) {
   }
   host.replaceChildren(...usage.windows.map((w) => {
     const node = $('meter-template').content.firstElementChild.cloneNode(true);
-    const left = Math.max(0, Math.round(100 - w.usedPercent));
+    const left = usageLeft(w.usedPercent);
     node.classList.toggle('low', left <= 25 && left > 10);
     node.classList.toggle('empty', left <= 10);
     node.querySelector('.meter-label').textContent = w.label;
@@ -4082,8 +4207,11 @@ function renderGitHubViews() {
   const ready = Boolean(state.github && githubAccount() && !githubAccount().needsSignIn);
   $('github-clone-into').hidden = !ready || shown !== 'repos';
   const running = Boolean(viewData('actions')?.value?.running);
+  const outage = viewData('actions')?.value?.service ?? null;
   $('github-running').hidden = !running;
-  $('github-view-actions').setAttribute('aria-label', running ? 'Actions, a workflow is running' : 'Actions');
+  $('github-outage').hidden = !outage;
+  $('github-view-actions').setAttribute('aria-label', ['Actions', outage && `GitHub Actions ${SERVICE_STATES[outage.status]}`, running && 'a workflow is running'].filter(Boolean).join(', '));
+  $('github-view-actions').title = outage ? `GitHub Actions ${SERVICE_STATES[outage.status]}` : '';
   renderPickerList();
   if (shown === 'issues') renderIssues();
   else if (shown === 'actions') renderRuns();
@@ -4346,6 +4474,22 @@ function runLabel(run) {
   return String(run.status === 'completed' && run.conclusion ? run.conclusion : run.status).replaceAll('_', ' ');
 }
 
+const SERVICE_STATES = {
+  degraded_performance: 'is degraded',
+  partial_outage: 'has a partial outage',
+  major_outage: 'has a major outage',
+  under_maintenance: 'is under maintenance',
+};
+
+/** GitHub's status page says Actions is not healthy: runs may wait for a runner or be cancelled. */
+function serviceNote(service) {
+  if (!service) return null;
+  const line = el('p', 'github-service-note', `GitHub Actions ${SERVICE_STATES[service.status]}. Runs may wait for a runner or be cancelled. `);
+  if (service.incident) line.append(keyed(externalLink(service.incident.name, service.incident.url), 'incident'), ' · ');
+  line.append(keyed(externalLink('GitHub Status', service.url), 'status-page'));
+  return line;
+}
+
 function renderRuns() {
   const panel = $('github-runs');
   if (!githubPick.repo) return redraw(panel, [noRepoNote('Actions runs')]);
@@ -4358,6 +4502,7 @@ function renderRuns() {
   });
   redraw(panel, [
     viewTools('actions'),
+    serviceNote(slot?.value?.service),
     banner,
     viewStatus('actions', slot?.value && !runs.length ? 'No workflow runs yet.' : null),
     rows.length ? el('div', 'history-list', ...rows) : null,
@@ -4596,6 +4741,7 @@ function upsertSession(session) {
 
 function dropSession(id) {
   state.sessions.delete(id);
+  state.environmentUI?.sessionRemoved(id);
   const view = state.views.get(id);
   const pane = state.panes.indexOf(id);
   if (pane !== -1) closePane(pane, { focusTerminal: paneNodes[pane].contains(document.activeElement) });
@@ -6064,6 +6210,7 @@ $('settings-menu').addEventListener('change', (e) => {
   else if (e.target.name === 'sound') changeSound(e.target);
   else if (e.target.name === 'voice') changeVoice(e.target);
   else if (e.target.name === 'autostart') changeAutostart(e.target);
+  else if (e.target.name === 'startup') changeStartup(e.target);
 });
 /**
  * Runs `opened` once a menu shows and `closed` once it hides. Chrome skips the toggle event of a menu
@@ -6203,6 +6350,13 @@ publishTopbarHeight();
 applyDockLayout();
 
 state.remoteAccessUI = createRemoteAccessUI({ api, getToken: () => state.token, isConnected: () => state.connected, onAuthError: showAuth });
-state.environmentUI = createEnvironmentUI({ api, onAuthError: showAuth, isAuthError: (err) => err instanceof AuthError });
+state.environmentUI = createEnvironmentUI({
+  api, onAuthError: showAuth, isAuthError: (err) => err instanceof AuthError,
+  workingFolder: () => $('cwd').value.trim(),
+  sessions: () => [...state.sessions.values()].map((session) => ({
+    id: session.id, name: session.name, tool: session.provider?.tool || '', cwd: session.cwd || '', multiplexer: Boolean(session.multiplexer),
+  })),
+});
+$('cwd').addEventListener('input', () => { if ($('environment').open) state.environmentUI.sync(); });
 state.token = readTokenFromHash() || load(TOKEN_KEY);
 boot();

package/web/environment.js

@@ -1,11 +1,23 @@
 const STATES = { pending: 'Not checked', not_found: 'Not found', unavailable: 'Runtime unavailable', failed: 'Probe failed' };
+const PIN_STATES = { configured: 'Configured', unreadable: 'Unreadable', invalid: 'Invalid' };
+const SCOPES = [
+  ['manager', 'Manager', 'Manager environment'],
+  ['project', 'This project', 'Project pins'],
+  ['session', 'Existing session', 'Session spawn environment'],
+  ['launch', 'New shell', 'New shell launch PATH'],
+];
 
 export function runtimeValue(row) { return row.status === 'ok' ? row.version : STATES[row.status] || 'Probe failed'; }
 
-export function createEnvironmentUI({ api, onAuthError, isAuthError = () => false, document = globalThis.document }) {
+export function createEnvironmentUI({
+  api, onAuthError, isAuthError = () => false, document = globalThis.document,
+  workingFolder = () => '', sessions = () => [],
+} = {}) {
   const $ = (id) => document.getElementById(id);
   const dialog = $('environment');
-  let data = null, request = 0, pending = false, online = false, managerPid = null, error = '', openerId = null;
+  let manager = null, current = null, scope = 'manager', request = 0, pending = false, online = false, managerPid = null, error = '', openerId = null;
+  let projectFolder = '', visibleProject = '', sessionId = '';
+  const slots = new Map();
   const element = (tag, text, className) => {
     const node = document.createElement(tag);
     if (text !== undefined) node.textContent = text;
@@ -15,13 +27,13 @@ export function createEnvironmentUI({ api, onAuthError, isAuthError = () => fals
 
   function renderSummary(host) {
     const values = host.querySelector('.environment-values');
-    const found = (data?.runtimes || []).filter((row) => row.status === 'ok');
+    const found = (manager?.runtimes || []).filter((row) => row.status === 'ok');
     values.replaceChildren(...found.flatMap((row) => [element('dt', row.label), element('dd', row.version)]));
     const note = host.querySelector('.environment-note');
-    note.textContent = error ? 'Environment check unavailable'
-      : data?.refreshing ? data.checkedAt ? 'Refreshing · showing previous check' : 'Checking environment…'
-        : data?.error ? data.error
-          : !data ? 'Not checked' : !found.length ? 'No runtime versions verified' : 'Manager environment';
+    note.textContent = error && scope === 'manager' ? 'Environment check unavailable'
+      : manager?.refreshing ? manager.checkedAt ? 'Refreshing · showing previous check' : 'Checking environment…'
+        : manager?.error ? manager.error
+          : !manager ? 'Not checked' : !found.length ? 'No runtime versions verified' : 'Manager environment';
   }
 
   function rowElement(row) {
@@ -42,52 +54,225 @@ export function createEnvironmentUI({ api, onAuthError, isAuthError = () => fals
     return node;
   }
 
+  function pinElement(row) {
+    const node = element('section', undefined, 'environment-row');
+    const head = element('div', undefined, 'environment-row-head');
+    head.append(element('strong', row.label), element('span', PIN_STATES[row.status] || 'Invalid'));
+    node.append(head);
+    node.append(element('p', row.source, 'environment-detail'));
+    if (row.version) node.append(element('code', row.version, 'environment-path'));
+    if (row.detail) node.append(element('p', row.detail, 'environment-detail'));
+    return node;
+  }
+
+  function showRuntimes(rows) {
+    $('environment-runtimes').hidden = false;
+    $('environment-runtimes').replaceChildren(...(rows || []).map(rowElement));
+    $('environment-pins').hidden = true;
+    $('environment-pins').replaceChildren();
+  }
+
+  function activeSnapshot() {
+    if (scope === 'manager') return manager;
+    const folder = workingFolder();
+    if (scope === 'project') {
+      if (!folder || folder !== projectFolder || !visibleProject || current?.cwd !== visibleProject) return null;
+      return current?.scope === 'project' ? current : null;
+    }
+    if (scope === 'session' && current?.sessionId !== sessionId) return null;
+    return current?.scope === scope ? current : null;
+  }
+
   function render() {
+    const listed = sessions();
+    if (scope === 'session' && !listed.some((session) => session.id === sessionId)) {
+      sessionId = listed[0]?.id || '';
+      current = slots.get(`session:${sessionId}`) || null;
+    }
     for (const host of document.querySelectorAll('.environment-summary:not([hidden])')) renderSummary(host);
-    $('environment-refresh').disabled = !online || pending || Boolean(data?.refreshing);
-    $('environment-refresh').textContent = pending || data?.refreshing ? 'Checking…' : 'Refresh';
-    $('environment-status').textContent = error || (data?.refreshing
-      ? data.checkedAt ? 'Refreshing. Previous results remain visible.' : 'Checking the manager environment…'
-      : data?.error || (data?.checkedAt ? `Last checked ${new Date(data.checkedAt).toLocaleString()}` : 'Not checked yet.'));
-    $('environment-runtimes').replaceChildren(...(data?.runtimes || []).map(rowElement));
-    const tools = data?.tools || [];
-    $('environment-tools').replaceChildren(...tools.map((tool) => {
-      const node = element('section', undefined, 'environment-row');
-      node.append(element('strong', `${tool.label} · Detected`), element('code', tool.path, 'environment-path'));
-      return node;
-    }));
-    $('environment-tools-empty').hidden = Boolean(tools.length);
-    $('environment-tools-empty').textContent = data?.refreshing ? 'Checking…' : data?.error ? 'Tool discovery did not finish.' : 'No supported tools detected.';
-    $('environment-manager-node').textContent = data?.managerNode
+    const data = activeSnapshot();
+    const title = SCOPES.find(([id]) => id === scope)?.[2] || 'Manager environment';
+    $('environment-title').textContent = title;
+    $('environment-host').textContent = data?.host || manager?.host ? `On ${data?.host || manager.host}` : 'On the computer running Agent Guild';
+    for (const [id] of SCOPES) {
+      const button = $(`environment-scope-${id}`);
+      button.ariaPressed = String(id === scope);
+    }
+    const folder = workingFolder();
+    $('environment-intro').textContent = scope === 'project'
+      ? 'Configured versions in this folder. A pin is not proof the runtime is installed.'
+      : scope === 'session'
+        ? 'The PATH this manager passed to the session. Startup files that ran afterward are not included.'
+        : scope === 'launch'
+          ? 'A new session receives this PATH. The shell may then run its startup files.'
+          : 'Versions available to the manager. Shell profiles, projects and existing sessions can use different versions.';
+    $('environment-python-note').hidden = scope !== 'manager';
+    $('environment-folder').hidden = scope !== 'project';
+    $('environment-folder').textContent = folder ? `Folder: ${data?.cwd || folder}` : 'Choose a working folder.';
+    $('environment-session-label').hidden = scope !== 'session';
+    $('environment-session').hidden = scope !== 'session';
+    if (scope === 'session') {
+      const select = $('environment-session');
+      const same = select.children.length === listed.length && listed.every((session, index) => select.children[index]?.value === session.id);
+      if (!same) {
+        select.replaceChildren(...listed.map((session) => {
+          const option = element('option', `${session.name || session.tool || 'Session'} · ${session.cwd || 'unknown folder'}`);
+          option.value = session.id;
+          return option;
+        }));
+      }
+      select.value = sessionId;
+    }
+    const refreshing = Boolean(data?.refreshing);
+    const blocked = scope === 'project' ? !folder : scope === 'session' ? !sessionId : false;
+    $('environment-refresh').disabled = !online || pending || refreshing || blocked;
+    $('environment-refresh').textContent = pending || refreshing ? 'Checking…' : 'Refresh';
+    $('environment-status').textContent = error || (blocked && scope === 'project' ? 'Choose a working folder.'
+      : blocked ? 'No sessions.'
+        : scope === 'project' && folder !== projectFolder ? 'Refresh to read this folder.'
+          : data?.refreshing ? data.checkedAt ? 'Refreshing. Previous results remain visible.' : scope === 'project' ? 'Reading pin files…' : 'Checking…'
+            : data?.error ? data.error
+              : data?.stale ? data.detail || 'These pins may be out of date. Refresh to read the folder again.'
+                : data?.availability === 'unavailable' ? data.detail
+                  : pending && data?.checkedAt ? 'Refreshing. Previous results remain visible.'
+                    : data?.checkedAt ? `Last checked ${new Date(data.checkedAt).toLocaleString()}`
+                      : 'Not checked yet.');
+    const tools = scope === 'project' || data?.availability === 'unavailable' ? [] : (data?.tools || []);
+    const showTools = scope !== 'project' && data?.availability !== 'unavailable';
+    $('environment-tools-heading').hidden = !showTools;
+    $('environment-tools-note').hidden = !showTools;
+    $('environment-tools').hidden = !showTools;
+    $('environment-tools-empty').hidden = !showTools;
+    if (scope === 'project' && data && folder === projectFolder) {
+      $('environment-runtimes').hidden = true;
+      $('environment-runtimes').replaceChildren();
+      $('environment-pins').hidden = false;
+      $('environment-pins').replaceChildren(...(data.pins.length ? data.pins.map(pinElement) : [element('p', data.refreshing ? 'Reading pin files…' : 'No version pins in this folder.', 'environment-detail')]));
+    } else if (scope === 'session' && data?.availability === 'unavailable') {
+      showRuntimes([]);
+    } else if (data && (scope !== 'project' || folder === projectFolder)) {
+      showRuntimes(data.runtimes);
+    } else {
+      showRuntimes([]);
+    }
+    if (showTools) {
+      $('environment-tools').replaceChildren(...tools.map((tool) => {
+        const node = element('section', undefined, 'environment-row');
+        node.append(element('strong', `${tool.label} · Detected`), element('code', tool.path, 'environment-path'));
+        return node;
+      }));
+      $('environment-tools-empty').hidden = Boolean(tools.length);
+      $('environment-tools-empty').textContent = data?.refreshing ? 'Checking…' : data?.error ? 'Tool discovery did not finish.' : 'No supported tools detected.';
+    }
+    $('environment-manager-node').hidden = scope !== 'manager';
+    $('environment-manager-node').textContent = scope === 'manager' && data?.managerNode
       ? `Agent Guild is running on Node.js ${data.managerNode.version} (${data.managerNode.path}).` : '';
+    if (scope === 'session' && data?.availability === 'ok' && data.spawnCwd) {
+      $('environment-manager-node').hidden = false;
+      $('environment-manager-node').textContent = `Spawn folder: ${data.spawnCwd}`;
+    }
+    if (scope === 'launch' && data?.detail) {
+      $('environment-manager-node').hidden = false;
+      $('environment-manager-node').textContent = data.detail;
+    }
+  }
+
+  function remember(snapshot) {
+    if (!snapshot?.scope) return false;
+    if (snapshot.scope === 'project') {
+      const previous = slots.get(`project:${snapshot.cwd}`);
+      if (previous && snapshot.revision < previous.revision) return false;
+      slots.set(`project:${snapshot.cwd}`, snapshot);
+      if (snapshot.cwd !== visibleProject) return false;
+      current = snapshot;
+      return true;
+    }
+    if (snapshot.scope === 'session') {
+      // Each session has its own revisions. Cache background updates without
+      // changing the selected session's results or clearing its request error.
+      const key = `session:${snapshot.sessionId}`;
+      const previous = slots.get(key);
+      if (previous && snapshot.revision < previous.revision) return false;
+      slots.set(key, snapshot);
+      if (scope !== 'session' || snapshot.sessionId !== sessionId) return false;
+      current = snapshot;
+      return true;
+    }
+    const previous = slots.get(snapshot.scope);
+    if (previous && snapshot.revision < previous.revision) return false;
+    slots.set(snapshot.scope, snapshot);
+    if (snapshot.scope === 'manager') manager = snapshot;
+    if (snapshot.scope === scope) current = snapshot;
+    return true;
   }
 
   function updated(snapshot) {
-    if (!online || !snapshot || snapshot.scope !== 'manager') return;
-    if (data && snapshot.revision < data.revision) return;
-    data = snapshot;
+    if (!online || !remember(snapshot)) return;
     error = '';
     render();
   }
 
+  function requestFor(refresh) {
+    if (scope === 'manager') return refresh ? ['POST', '/environment/refresh', {}] : ['GET', '/environment'];
+    if (scope === 'project') {
+      const cwd = workingFolder();
+      if (cwd !== projectFolder) visibleProject = '';
+      projectFolder = cwd;
+      if (!cwd) return null;
+      return refresh
+        ? ['POST', '/environment/refresh', { scope: 'project', cwd }]
+        : ['GET', `/environment?scope=project&cwd=${encodeURIComponent(cwd)}`];
+    }
+    if (scope === 'session') {
+      if (!sessionId) return null;
+      return refresh
+        ? ['POST', '/environment/refresh', { scope: 'session', id: sessionId }]
+        : ['GET', `/environment?scope=session&id=${encodeURIComponent(sessionId)}`];
+    }
+    return refresh ? ['POST', '/environment/refresh', { scope: 'launch' }] : ['GET', '/environment?scope=launch'];
+  }
+
   async function load(refresh = false) {
-    if (!online || pending) return;
-    const current = ++request;
+    if (!online) return;
+    const spec = requestFor(refresh);
+    if (!spec) { error = ''; pending = false; render(); return; }
+    const currentRequest = ++request;
     pending = true;
     error = '';
     render();
     try {
-      const snapshot = await api(refresh ? 'POST' : 'GET', refresh ? '/environment/refresh' : '/environment', refresh ? {} : undefined);
-      if (current === request) updated(snapshot);
+      const snapshot = await api(...spec);
+      if (currentRequest !== request) return;
+      if (snapshot?.scope === 'project') visibleProject = snapshot.cwd;
+      updated(snapshot);
     } catch (err) {
-      if (current !== request) return;
+      if (currentRequest !== request) return;
       if (isAuthError(err)) onAuthError?.(err.message);
-      else error = 'Could not read the manager environment. Try Refresh.';
+      else error = err.message || 'Could not read this environment. Try Refresh.';
     } finally {
-      if (current === request) { pending = false; render(); }
+      if (currentRequest === request) { pending = false; render(); }
+    }
+  }
+
+  function choose(next) {
+    if (scope === next && next !== 'session') return;
+    scope = next;
+    error = '';
+    if (next === 'session') {
+      const listed = sessions();
+      if (!listed.some((session) => session.id === sessionId)) sessionId = listed[0]?.id || '';
     }
+    current = slots.get(next === 'session' ? `session:${sessionId}` : next) || null;
+    render();
+    load(false);
   }
 
+  for (const [id] of SCOPES) $(`environment-scope-${id}`).addEventListener('click', () => choose(id));
+  $('environment-session').addEventListener('change', () => {
+    sessionId = $('environment-session').value;
+    current = slots.get(`session:${sessionId}`) || null;
+    load(false);
+  });
   $('environment-close').addEventListener('click', () => dialog.close());
   $('environment-refresh').addEventListener('click', () => load(true));
   dialog.addEventListener('click', (event) => { if (event.target === dialog) dialog.close(); });
@@ -100,8 +285,11 @@ export function createEnvironmentUI({ api, onAuthError, isAuthError = () => fals
   return {
     updated,
     connected(pid) {
-      if (pid !== managerPid) { data = null; managerPid = pid; }
-      request++; pending = false; online = true;
+      if (pid !== managerPid) {
+        manager = null; current = null; slots.clear(); managerPid = pid; scope = 'manager';
+        visibleProject = ''; projectFolder = ''; sessionId = '';
+      }
+      request++; pending = false; online = true; error = '';
       load();
     },
     disconnected() {
@@ -110,6 +298,20 @@ export function createEnvironmentUI({ api, onAuthError, isAuthError = () => fals
       render();
     },
     close() { openerId = null; dialog.close(); this.disconnected(); },
+    sync() { render(); },
+    sessionRemoved(id) {
+      // Paint stays free of requests. The session list is already updated, so one
+      // check of the next session starts here instead of on every repaint.
+      if (!$('environment').open || scope !== 'session') return;
+      const selected = sessionId === id;
+      if (!selected) { render(); return; }
+      const listed = sessions();
+      sessionId = listed[0]?.id || '';
+      current = slots.get(sessionId ? `session:${sessionId}` : '') || null;
+      error = '';
+      if (!sessionId || !online) { render(); return; }
+      load(false);
+    },
     renderCard(card, provider) {
       const host = card.querySelector('.environment-summary');
       host.hidden = !Array.isArray(provider.shells);
@@ -118,6 +320,9 @@ export function createEnvironmentUI({ api, onAuthError, isAuthError = () => fals
       button.dataset.muxFocus = `${provider.id}:environment`;
       button.addEventListener('click', () => {
         openerId = provider.id;
+        scope = 'manager';
+        current = manager;
+        error = '';
         render();
         if (!dialog.open) dialog.showModal();
       });