@3sln/trove 0.0.12 → 0.0.13

package/packages/web/src/platform/navigation.js

@@ -11,26 +11,40 @@ const RECENTS_KEY = 'trove.recents';
 const RECENTS_MAX = 12;
 
 export class NavigationService {
+  #state;
+
   constructor() {
-    this.state = {
+    this.#state = {
       stack: [{ kind: 'search' }], // [{kind:'search'}, {kind:'file', id, node, openerId}, …]
       activeTabId: null, // top file panel id (or null)
       activeFile: null, // top file panel node (or null)
       recents: loadRecents(),
     };
-    this.cell = cell(this.state);
+    this.cell = cell(this.#state);
+  }
+
+  /**
+   * The value, for whoever is about to decide something from it.
+   *
+   * The same door every slice offers. Actions read `.state` and queries read `.cell`, and
+   * the two are only equal by habit — bl/state.js says so, and says a resource has one
+   * value and one way to read it. `state` is also a public field on a service, which is one
+   * typo from `social.state.sidecar = null` bypassing the cell and notifying nothing.
+   */
+  get() {
+    return this.#state;
   }
 
   observe() {
     return this.cell;
   }
   #set(patch) {
-    this.state = { ...this.state, ...patch };
-    this.cell.setValue(this.state);
+    this.#state = { ...this.#state, ...patch };
+    this.cell.setValue(this.#state);
   }
 
   #top() {
-    return this.state.stack[this.state.stack.length - 1];
+    return this.#state.stack[this.#state.stack.length - 1];
   }
   /** The active file panel (top of the stack, if it's a file). */
   activeTab() {
@@ -61,25 +75,25 @@ export class NavigationService {
     if (reset) {
       stack = [{ kind: 'search' }, panel];
     } else {
-      const at = this.state.stack.findIndex((p) => p.kind === 'file' && p.id === node.id);
+      const at = this.#state.stack.findIndex((p) => p.kind === 'file' && p.id === node.id);
       if (at >= 0) {
         // Already open — jump back to it, but adopt the (possibly new) opener so
         // reopening with a different one actually switches the viewer.
-        stack = this.state.stack.slice(0, at + 1);
+        stack = this.#state.stack.slice(0, at + 1);
         stack[at] = panel;
       } else {
-        stack = [...this.state.stack, panel];
+        stack = [...this.#state.stack, panel];
       }
     }
     this.#pushRecent(node);
     this.#applyStack(stack);
   }
   back() {
-    if (this.state.stack.length <= 1) return;
+    if (this.#state.stack.length <= 1) return;
     try { history.back(); } catch { this.pop(); }
   }
   pop() {
-    if (this.state.stack.length > 1) this.#applyStack(this.state.stack.slice(0, -1), { history: false });
+    if (this.#state.stack.length > 1) this.#applyStack(this.#state.stack.slice(0, -1), { history: false });
   }
   /**
    * The node is GONE — drop it from everywhere this service holds a copy.
@@ -94,12 +108,12 @@ export class NavigationService {
    * round — a tile that leads nowhere is worse than one that is missing.
    */
   forget(id) {
-    const recents = this.state.recents.filter((r) => r.id !== id);
-    if (recents.length !== this.state.recents.length) {
+    const recents = this.#state.recents.filter((r) => r.id !== id);
+    if (recents.length !== this.#state.recents.length) {
       this.#set({ recents });
       saveRecents(recents);
     }
-    const stack = this.state.stack.filter((p) => !(p.kind === 'file' && p.id === id));
+    const stack = this.#state.stack.filter((p) => !(p.kind === 'file' && p.id === id));
     this.#applyStack(stack.length ? stack : [{ kind: 'search' }], { history: false });
   }
   /**
@@ -111,14 +125,14 @@ export class NavigationService {
    * list, which reads as the rename half-failing.
    */
   updateTabNode(node) {
-    const recents = this.state.recents.map((r) => (r.id === node.id
+    const recents = this.#state.recents.map((r) => (r.id === node.id
       ? { ...r, name: node.name, contentType: node.contentType || r.contentType }
       : r));
-    if (recents.some((r, i) => r !== this.state.recents[i])) {
+    if (recents.some((r, i) => r !== this.#state.recents[i])) {
       this.#set({ recents });
       saveRecents(recents);
     }
-    const stack = this.state.stack.map((p) => (p.kind === 'file' && p.id === node.id ? { ...p, node } : p));
+    const stack = this.#state.stack.map((p) => (p.kind === 'file' && p.id === node.id ? { ...p, node } : p));
     this.#applyStack(stack, { history: false });
   }
 
@@ -127,7 +141,7 @@ export class NavigationService {
     const top = this.#top();
     const n = top?.node;
     const entry = {
-      troveDepth: this.state.stack.length,
+      troveDepth: this.#state.stack.length,
       node: n ? { id: n.id, name: n.name, contentType: n.contentType, collectionId: n.collectionId } : null,
       openerId: top?.openerId || null,
     };
@@ -137,17 +151,17 @@ export class NavigationService {
   onPopState(e) {
     const s = e?.state || {};
     const depth = s.troveDepth || 1;
-    if (depth <= this.state.stack.length) {
-      this.#applyStack(this.state.stack.slice(0, depth), { history: false });
+    if (depth <= this.#state.stack.length) {
+      this.#applyStack(this.#state.stack.slice(0, depth), { history: false });
     } else if (s.node) {
-      this.#applyStack([...this.state.stack, { kind: 'file', id: s.node.id, node: s.node, openerId: s.openerId }], { history: false });
+      this.#applyStack([...this.#state.stack, { kind: 'file', id: s.node.id, node: s.node, openerId: s.openerId }], { history: false });
     }
   }
 
   #pushRecent(node) {
     if (!node) return;
     const entry = { id: node.id, name: node.name, contentType: node.contentType || '', collectionId: node.collectionId };
-    const recents = [entry, ...this.state.recents.filter((r) => r.id !== node.id)].slice(0, RECENTS_MAX);
+    const recents = [entry, ...this.#state.recents.filter((r) => r.id !== node.id)].slice(0, RECENTS_MAX);
     this.#set({ recents });
     saveRecents(recents);
   }

package/packages/web/src/platform/pickers.js

@@ -8,31 +8,51 @@
 // They were private to bl/commands.js, where the command handlers that used them lived.
 
 /**
- * Open a native file picker.
+ * Open a native file picker. Resolves with the chosen files, or `null` if cancelled.
  *
- * The hidden `<input>` is removed on selection AND on cancel — cancelling fires no
- * `change`, so cleanup also hangs off the next window focus (which the OS dialog returns)
- * to avoid leaking a growing pile of inputs.
+ * A PROMISE rather than a callback, because the action that opens the picker has to be able
+ * to wait for it. It could not before: `execute` returned while the OS dialog was still on
+ * screen, ngin released the leases in its `finally`, the feed emitted `complete` for an
+ * upload that had not begun, and the callback then used `engine` and `explorer` afterwards.
+ *
+ * SETTLING ON BOTH PATHS is the whole difficulty, and the reason this shape was not taken
+ * earlier: cancelling fires no `change` event at all. It is detected the only way the
+ * platform allows — the OS dialog returns focus to the window, and after a short grace the
+ * input still holds no files. Both paths go through `done`, and `resolve` is idempotent, so
+ * whichever happens first settles the promise and the other is a no-op. A picker that could
+ * fail to settle would hold its action's lease forever and never emit a terminal event,
+ * which is strictly worse than the early `complete` this replaces.
+ *
+ * The hidden `<input>` is removed on both paths too, so a cancelled picker does not leak
+ * one per attempt.
  */
-function pick(cb, configure) {
-  const input = document.createElement('input');
-  input.type = 'file';
-  configure(input);
-  input.style.display = 'none';
-  document.body.appendChild(input);
-  const cleanup = () => { input.remove(); window.removeEventListener('focus', onFocus); };
-  const onFocus = () => setTimeout(() => { if (!input.files.length) cleanup(); }, 300);
-  input.addEventListener('change', () => { cb(input.files); cleanup(); }, { once: true });
-  window.addEventListener('focus', onFocus);
-  input.click();
+function pick(configure) {
+  return new Promise((resolve) => {
+    const input = document.createElement('input');
+    input.type = 'file';
+    configure(input);
+    input.style.display = 'none';
+    document.body.appendChild(input);
+    const done = (files) => {
+      resolve(files);
+      input.remove();
+      window.removeEventListener('focus', onFocus);
+    };
+    const onFocus = () => setTimeout(() => { if (!input.files.length) done(null); }, 300);
+    input.addEventListener('change', () => done(input.files), { once: true });
+    window.addEventListener('focus', onFocus);
+    input.click();
+  });
 }
 
-export function pickFiles(cb) {
-  pick((files) => cb(files), (input) => { input.multiple = true; });
+/** @returns {Promise<FileList|null>} */
+export function pickFiles() {
+  return pick((input) => { input.multiple = true; });
 }
 
-export function pickZip(cb) {
-  pick((files) => cb(files[0]), (input) => { input.accept = '.zip,application/zip'; });
+/** @returns {Promise<File|null>} */
+export function pickZip() {
+  return pick((input) => { input.accept = '.zip,application/zip'; }).then((files) => files?.[0] ?? null);
 }
 
 /** Hand a URL to the browser as a download. */

package/packages/web/src/platform/pluginHost.js

@@ -57,7 +57,10 @@ export class PluginHost {
       destroyFrame: (frame) => this.frames.destroy(frame),
       // Dispatched, not called: opening a file from a docked plugin frame is the same
       // intent as opening one from the drive, and the engine should see both.
-      openFile: (node, openerId) => this.platform.dispatch?.(new OpenInPanelAction(node, openerId)),
+      // Not `dispatch?.()`. An unwired seam here silently drops a docked frame's
+      // open-file, which is exactly the shape server/src/index.js records as having turned
+      // a sweep into a permanent no-op.
+      openFile: (node, openerId) => this.platform.dispatch(new OpenInPanelAction(node, openerId)),
       onChange: () => this.#emit(),
     });
     this.frames = new FrameManager({ media: this.media, dock: this.dock });

package/packages/web/src/platform/pluginRpc.js

@@ -11,6 +11,10 @@
 import { networkEndpoints, canExecuteCommand, displayName } from './pluginPackage.js';
 import { isAllowedUrl } from './pluginNet.js';
 import { isSourceModule } from './pluginModules.js';
+// pluginHost.js already imports actions to build this router, so this widens an existing
+// edge rather than creating one — and it removes the third seam assigned onto `platform`
+// after construction, which is the shape that makes the resource graph not the whole story.
+import { OpenPluginPanelAction } from '../bl/actions.js';
 import { contribUri, parseContribUri } from '@3sln/trove/core/plugins/identity.js';
 import { assertSafePluginSql } from '@3sln/trove/core/plugins/sql.js';
 
@@ -143,7 +147,48 @@ export class PluginRpcRouter {
         { sort: params.sort, order: params.order, limit: params.limit, cursor: params.cursor },
       );
       case 'files:stat': return cap('files'), this.platform.api.stat(params.id);
-      case 'files:downloadUrl': return cap('files'), { url: this.platform.api.downloadUrl(params.id) };
+
+      // BYTES, by range. `files:read` answers text, which for an audiobook or any other
+      // container is not slow, it is corrupt — and `files:downloadUrl` used to hand out a
+      // bare route URL carrying no authorization, which an opaque-origin sandbox cannot
+      // make good on: no cookies, no `Authorization` header, a 401 on any drive that
+      // authenticates. So this is how a viewer gets bytes at all.
+      //
+      // Half-open `[start, end)`, and through `fileChunks` rather than the API directly:
+      // a pinned file answers from disk, a file being kept offline contributes what it
+      // fetches, and a file nobody asked to keep leaves nothing behind. See fileChunks.js.
+      case 'files:bytes': {
+        cap('files');
+        const r = await this.platform.fileChunks.read(params.id, { start: params.start, end: params.end });
+        // Transferred rather than copied: a 4 MiB chunk crossing by structured clone twice
+        // per read is the difference between a seek and a stutter.
+        return { bytes: r.bytes.buffer, etag: r.etag, total: r.total };
+      }
+
+      // Keeping a file offline, which is a DIFFERENT act from reading it — see
+      // fileChunks.js. Until `start` is called, ranging over a file stores nothing.
+      case 'files:offline:start': return cap('files'), this.platform.fileChunks.start(params.id);
+      case 'files:offline:status': return cap('files'), this.platform.fileChunks.status(params.id);
+      case 'files:offline:cancel': return cap('files'), (this.platform.fileChunks.cancel(params.id), { ok: true });
+      case 'files:offline:remove': return cap('files'), this.platform.fileChunks.remove(params.id).then(() => ({ ok: true }));
+
+      /**
+       * A URL a media element can load on its own.
+       *
+       * The one place a host URL deliberately crosses into the sandbox, and it is minted —
+       * it carries its own grant and expires, which is exactly what `platform/mediaUrls.js`
+       * exists for: "URLs for things that cannot send a header … an <img src>, a <video
+       * src>". The rule it bends is that plugins hold only opaque handles; the reason is
+       * that `<audio src>` is the only way to stream a progressive MP4 without a
+       * fragmenter, because MSE refuses one and a Blob has to be whole before it can
+       * become an object URL. A viewer that can range-read for chapters and stream for
+       * playback needs both, and this is the streaming half.
+       */
+      case 'files:mediaUrl': {
+        cap('files');
+        const { url, expiresAt } = await this.platform.mediaUrls.url(params.id, { op: params.op || 'media' });
+        return { url, expiresAt };
+      }
       case 'files:index': {
         cap('indexer');
         const ns = parseContribUri(params.indexerId) ? params.indexerId : contribUri(record.manifest, params.indexerId || 'default');
@@ -174,7 +219,7 @@ export class PluginRpcRouter {
       case 'ui:showPanel':
         cap('ui');
         record.hasUi = true;
-        this.platform.openPluginPanel(pid);
+        this.platform.dispatch(new OpenPluginPanelAction(pid));
         this.onChange();
         return { ok: true };
 

package/packages/web/src/platform/spatialNav.js

@@ -59,7 +59,7 @@ export class SpatialNavigationService {
   /** Follow the viewport: arrows are remapped only while the TV layout is showing. */
   install() {
     if (this.viewport) effect(this.viewport.observe(), (vp) => this.setActive(vp.mode === 'tv'));
-    this.setActive(this.viewport?.state?.mode === 'tv');
+    this.setActive(this.viewport?.get().mode === 'tv');
     return this;
   }
 

package/packages/web/src/platform/viewport.js

@@ -29,6 +29,8 @@ export function looksLikeTv(ua = '', width = 0) {
 }
 
 export class ViewportService {
+  #state;
+
   /**
    * @param {object} [deps]
    * @param {Window} [deps.window] the window to measure and listen to
@@ -40,11 +42,17 @@ export class ViewportService {
     // A URL override outranks the setting: it is how someone checks the phone layout on
     // a laptop, and how the e2e suite drives each shell without a device farm.
     this.urlOverride = readUrlOverride(win);
-    this.state = this.#measure();
-    this.cell = cell(this.state);
+    this.#state = this.#measure();
+    this.cell = cell(this.#state);
     this._onResize = () => this.refresh();
   }
 
+  /** The value, for whoever is about to decide something from it. See bl/state.js: one
+   *  value, one way to read it — a public `state` field is a second, writable door. */
+  get() {
+    return this.#state;
+  }
+
   observe() {
     return this.cell;
   }
@@ -58,7 +66,7 @@ export class ViewportService {
      // stopped returning something with `.subscribe` it would have become a silent
      // no-op and the viewport would have stopped following its own setting.
     if (this.settings) effect(this.settings.observe(), () => this.refresh());
-    this.#publish(this.state);
+    this.#publish(this.#state);
     return this;
   }
 
@@ -69,10 +77,10 @@ export class ViewportService {
 
   refresh() {
     const next = this.#measure();
-    const same = next.mode === this.state.mode && next.width === this.state.width
-      && next.height === this.state.height && next.coarse === this.state.coarse;
+    const same = next.mode === this.#state.mode && next.width === this.#state.width
+      && next.height === this.#state.height && next.coarse === this.#state.coarse;
     if (same) return;
-    this.state = next;
+    this.#state = next;
     this.#publish(next);
     this.cell.setValue(next);
   }

package/packages/web/src/platform/voiceSearch.js

@@ -17,6 +17,8 @@ import { cell } from '../runtime.js';
 import { canTranscribeLocally, localAvailability, installLocal, listen } from './voice.js';
 
 export class VoiceSearchService {
+  #state;
+
   /**
    * @param {object} deps
    * @param {object} deps.notifications
@@ -25,21 +27,27 @@ export class VoiceSearchService {
     this.notifications = notifications;
     this.settings = settings;
     this.session = null;
-    this.state = { supported: canTranscribeLocally(), status: 'unknown', listening: false };
-    this.cell = cell(this.state);
+    this.#state = { supported: canTranscribeLocally(), status: 'unknown', listening: false };
+    this.cell = cell(this.#state);
+  }
+
+  /** The value, for whoever is about to decide something from it. See bl/state.js: one
+   *  value, one way to read it — a public `state` field is a second, writable door. */
+  get() {
+    return this.#state;
   }
 
   observe() {
     return this.cell;
   }
   #set(patch) {
-    this.state = { ...this.state, ...patch };
-    this.cell.setValue(this.state);
+    this.#state = { ...this.#state, ...patch };
+    this.cell.setValue(this.#state);
   }
 
   /** Ask once whether an on-device language pack is ready, and remember the answer. */
   async refresh() {
-    if (!this.state.supported) return 'unavailable';
+    if (!this.#state.supported) return 'unavailable';
     const status = await localAvailability(this.#lang());
     this.#set({ status });
     return status;
@@ -51,7 +59,7 @@ export class VoiceSearchService {
 
   /** Can we offer a microphone button right now? */
   canListen() {
-    return this.state.supported && (this.state.status === 'available' || this.state.status === 'downloadable');
+    return this.#state.supported && (this.#state.status === 'available' || this.#state.status === 'downloadable');
   }
 
   /**
@@ -66,9 +74,9 @@ export class VoiceSearchService {
     // Focus AFTER the surface has rendered — the input does not exist yet on the frame
     // that opened it.
     await this.focusInput();
-    if (!this.state.supported) return { listening: false, reason: 'unsupported' };
+    if (!this.#state.supported) return { listening: false, reason: 'unsupported' };
 
-    const status = this.state.status === 'unknown' ? await this.refresh() : this.state.status;
+    const status = this.#state.status === 'unknown' ? await this.refresh() : this.#state.status;
     if (status === 'downloadable') {
       // Pressing the button IS the consent to fetch it; nothing downloads before that.
       this.notifications?.info('Downloading the on-device voice model — this happens once.');
@@ -125,7 +133,7 @@ export class VoiceSearchService {
   openSearchSurface() {
     const wb = this.workbench;
     if (!wb) return;
-    const onLauncher = wb.state.activity === 'home' && !wb.nav?.state?.activeTabId;
+    const onLauncher = wb.state.activity === 'home' && !wb.nav?.get?.().activeTabId;
     if (onLauncher) wb.closeSearchModal?.();
     else wb.openSearchModal();
   }

package/packages/web/src/platform/whenclause.js

@@ -7,11 +7,14 @@
 // parentheses, string/number/boolean literals. Expressions are parsed once into
 // a predicate function and cached, so evaluation on every keydown is cheap.
 //
-// The compiled predicate carries `.keys`: every context key the expression names. That is
-// what lets a clause be WATCHED rather than polled — see ContextRegistry#watch, which
-// derives a cell over exactly those keys, so a clause about `view.active` stops recomputing
-// every time the selection changes. Collected while parsing because that is the only place
-// the distinction between a key and a literal is known.
+// Every clause is evaluated against the WHOLE context snapshot, which is what the palette,
+// the keybindings and the openers all do. A per-clause subscription layer lived here once —
+// the parser collected the keys an expression named and ContextRegistry derived a cell over
+// exactly those — and nothing ever used it, while `evaluate` over the snapshot did all the
+// work. If per-clause reactivity is ever wanted (a palette that becomes its own region is
+// the case for it), the lexer already sees the key/literal distinction in one pass, so it
+// is ~25 lines to bring back. Shipping both halves and using neither is the one thing that
+// was not defensible.
 //
 // A key is either a core context key (`view.active`, `explorer.hasSelection`) or a
 // contribution URI naming a plugin's `register` — `trove+contrib:acme.com/docs/busy`.
@@ -25,16 +28,10 @@ export function compileWhen(expr) {
   if (cache.has(expr)) return cache.get(expr);
   let fn;
   try {
-    const parser = new Parser(expr);
-    fn = parser.parseExpression();
-    // The keys this clause reads. Frozen: it is shared by every caller through the cache.
-    fn.keys = Object.freeze([...parser.keys]);
+    fn = new Parser(expr).parseExpression();
   } catch (err) {
     console.warn(`Invalid when clause: "${expr}" — ${err.message}`);
     fn = () => false;
-    // A clause that could not be parsed depends on nothing, so watching it yields a cell
-    // that is constantly false rather than one that never settles.
-    fn.keys = Object.freeze([]);
   }
   cache.set(expr, fn);
   return fn;
@@ -44,11 +41,6 @@ export function evaluateWhen(expr, ctx) {
   return compileWhen(expr)(ctx || {});
 }
 
-/** Every context key `expr` names — `[]` for a constant or unparseable clause. */
-export function keysOf(expr) {
-  return compileWhen(expr).keys ?? [];
-}
-
 // Note the `trove+contrib:` alternative comes before the regex-literal one: a URI's
 // slashes would otherwise start a /…/ literal and swallow the rest of the expression.
 const TOKEN = /\s*(=~|==|!=|>=|<=|&&|\|\||[()!<>]|trove\+contrib:[A-Za-z0-9_./-]+|\/(?:\\.|[^/])*\/[a-z]*|'(?:\\.|[^'])*'|"(?:\\.|[^"])*"|[A-Za-z0-9_.:-]+)/y;
@@ -58,7 +50,6 @@ class Parser {
     this.src = src;
     this.tokens = this.#lex(src);
     this.pos = 0;
-    this.keys = new Set();
   }
   #lex(src) {
     const out = [];
@@ -155,7 +146,6 @@ class Parser {
       return () => s;
     }
     // A context key.
-    this.keys.add(t);
     return (c) => c[t];
   }
 }

package/packages/web/src/runtime.js

@@ -16,8 +16,7 @@
 //
 // `PENDING` is how a cell says "no value yet" — `watch` renders its placeholder
 // instead of calling the builder. An error is reported by THROWING from
-// `getValue()`, which `watch` renders as its error view. Both matter for
-// `fromAsync` below, which is the only shape of ours the module does not ship.
+// `getValue()`, which `watch` renders as its error view.
 
 import * as dodo from '@3sln/dodo';
 import {
@@ -32,42 +31,8 @@ export {
   fromObservable, toObservable, effect, isCell, readCell, PENDING,
 };
 
-/**
- * A cell backed by one async call: `PENDING` until it settles, the value after,
- * and a throw from `getValue()` if it rejects — which is exactly the vocabulary
- * `watch`'s `placeholder` and `error` options are written against.
- *
- * The work starts on the first listener, not at construction, so building one
- * for a view that is never rendered costs nothing. It runs ONCE: a cell that
- * refetched every time its last watcher went away and came back would reload a
- * document on every remount.
- */
-export function fromAsync(work) {
-  let state = { status: 'idle' };
-  return connectable(
-    (notify) => {
-      if (state.status === 'idle') {
-        state = { status: 'running' };
-        Promise.resolve()
-          .then(work)
-          .then(
-            (value) => { state = { status: 'done', value }; notify(); },
-            (error) => { state = { status: 'failed', error }; notify(); },
-          );
-      }
-      // Nothing to disconnect: a promise cannot be un-awaited, and the result is
-      // kept so a later listener reads it rather than starting again.
-      return () => {};
-    },
-    () => {
-      if (state.status === 'failed') throw state.error;
-      return state.status === 'done' ? state.value : PENDING;
-    },
-  );
-}
-
 /** The reactive API as one object, for `platform.reactive` (and plugin-facing code). */
 export const reactive = {
   watch, cell, derive, constant, mapCell, connectable,
-  fromObservable, fromAsync, toObservable, effect, isCell, readCell, PENDING,
+  fromObservable, toObservable, effect, isCell, readCell, PENDING,
 };

package/packages/web/src/ui/activate.js

@@ -13,10 +13,26 @@
 // file from the search modal opens it and then closes the modal. Sequencing them here keeps
 // that out of the item.
 
+import { runAction } from '../dispatch.js';
+
 /**
+ * Run an item's actions, one genuinely finished before the next begins.
+ *
+ * The loop used to be a bare `ui.engine.dispatch(action)` under a comment claiming it
+ * sequenced them — `dispatch` returns a feed and schedules the body, so it fired them all
+ * at once. Nothing was visibly broken, because the lists touched independent slices, but
+ * bl/launcher.js already emits `[SetLaunchQueryAction, FilterAction]` and the comment was
+ * telling the next reader that a read-after-write pair here would be safe.
+ *
+ * The same shape and the same stop-on-failure rule as CommandService.execute, which is the
+ * other implementation of "run this item's list of actions".
+ *
  * @param {object} ui
  * @param {{actions?: object[]}} item
  */
-export function activate(ui, item) {
-  for (const action of item?.actions || []) ui.engine.dispatch(action);
+export async function activate(ui, item) {
+  for (const action of item?.actions || []) {
+    const settled = await runAction(ui.engine, action);
+    if (settled?.type !== 'complete') break;
+  }
 }

package/packages/web/src/ui/components/activityPanel.js

@@ -98,7 +98,7 @@ function issueRow(issue, ui) {
 
 export default function activityPanel(state, ui) {
   const act = state.act || { tasks: [], issues: [] };
-  if (!act.open) return null;
+  if (!state.overlay.activityPanel) return null;
   const running = act.tasks.filter((t) => t.status === 'running');
   const recent = act.tasks.filter((t) => t.status !== 'running');
 

package/packages/web/src/ui/components/adminView.js

@@ -19,7 +19,7 @@
 import { dd } from '../../runtime.js';
 import { watchQuery } from '../../bl/watchQuery.js';
 import { grantsFor } from '../../bl/queries.js';
-import { icon } from '../icon.js';
+import { activate } from '../activate.js';
 import { bytes } from '../format.js';
 import { ExecCommandAction, SetGrantAction } from '../../bl/actions.js';
 
@@ -97,12 +97,9 @@ function collectionsSection(state, ui) {
   // where the second only means anything after the first has landed. Fired concurrently,
   // "Rotate key…" opened Settings and was then thrown back to home by the switch that had
   // not finished yet. Same shape as platform/commands.js, which got this right first.
-  const run = (actions) => async () => {
-    for (const action of actions) {
-      const settled = await ui.engine.dispatch(action).next(['complete', 'error', 'abort']);
-      if (settled?.type !== 'complete') break;
-    }
-  };
+  // The same "run this item's list of actions" as every menu item and list row — one
+  // implementation, in ui/activate.js, rather than a third spelling of the loop here.
+  const run = (actions) => () => activate(ui, { actions });
   return div({ className: 'group' },
     h3('Collections'),
     p({ className: 'sub' }, 'What exists on this drive, where its bytes live, and which key seals it.'),

package/packages/web/src/ui/components/editorArea.js

@@ -13,7 +13,16 @@ import { NavigateBackAction, OpenInPanelAction, ShowDialogAction, ShowHomeAction
 
 const { div, span, button } = dd;
 
-const openerFns = new Map(); // `${panelId}:${openerId}` -> stable render fn
+/**
+ * `${panelId}:${openerId}` -> stable render fn.
+ *
+ * dodo identifies an alias by the FUNCTION, so a fresh one per render would rebuild it
+ * every pass and take the <audio> with it. Module scope is safe here in a way it was not
+ * for the keybindings region, and the difference is the key: a panel id is minted by
+ * `newId()` and is unique across every workbench on the page, so two shells cannot collide
+ * and hand each other's `ui` to a render. `pruneOpeners` bounds it to the live stack.
+ */
+const openerFns = new Map();
 
 export default function editorArea(state, ui) {
   const wb = state.wb;