@monster-orange/den 0.4.23 → 0.4.24

package/CHANGELOG.md

@@ -4,6 +4,32 @@ All notable changes to Den are documented here. Each release lists the
 config and manifest changes a distribution must make to move to it under
 **Migrations**.
 
+## [0.4.24] - 2026-11-10
+
+### Fixed
+
+- **Visit opens in Safari (D27).** Visit, in the service panel and the
+  rail's ↗, is now a real link (`target=_blank`) instead of a button that
+  called `window.open`, which Safari's popup blocker stopped. The panel
+  also holds its 5 s repaint while a pointer is down in it, so a click
+  is never lost to a repaint between press and release.
+- **Signing in from another machine (D29).** On an unclaimed Den with
+  `web.owner_github` set, "Sign in as @login" is the primary button. The
+  button that only works on the Den machine says so: "On <host> itself:
+  connect GitHub". With only `web.allowed_github_org`, the page says to
+  open it on that machine, or to set `web.owner_github`.
+- **Rotation overrides are picked by name (D30).** Settings › Agents ›
+  Rotation's Add override form has searchable pickers (type to filter,
+  arrow keys, Enter) for the agent, persona, workspace or service, and a
+  choice for each value, never a typed id. The overrides table shows
+  names; an override for something that is gone is greyed, with Remove.
+  At 375 px the table stacks into cards, so no word breaks mid-letter.
+- **doctor, where it runs.** In login mode (as installed), the server and
+  session host in the desktop session show ℹ, not ⚠. An older session
+  host still serving, with the service's own host standing by, is ℹ
+  "Nothing to do", not "unknown ✓". The version-manager node warning at
+  `service install` prints once, for the web job.
+
 ## [0.4.23] - 2026-11-10
 
 ### Added

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@monster-orange/den",
-  "version": "0.4.23",
+  "version": "0.4.24",
   "description": "Den: a local multi-repo dev orchestrator, HTTPS edge and E2E harness",
   "type": "module",
   "bin": {

package/service/install.sh

@@ -110,8 +110,9 @@ pick_node() {
   done
   # Warn when installing; `print` writes the plist and nothing else.
   if [ "${1:-}" = install ]; then
-    echo "⚠ the service will run $node, a version manager's node: it stops starting" >&2
-    echo "  when that version is removed. Re-run install after switching, or set DEN_SERVICE_NODE." >&2
+    echo "⚠ the web job will run $node, a version manager's node: it stops starting" >&2
+    echo "  when that version is removed (the session host runs Den's own copy of node)." >&2
+    echo "  Re-run install after switching, or set DEN_SERVICE_NODE." >&2
   fi
   echo "$node"
 }
@@ -165,7 +166,8 @@ host_exe() { # $1 node
 }
 
 write_plist() { # $1 = output file, $2 = web|host, $3 = mode
-  NODE="$(pick_node "$MODE")"
+  # Warned once, for the web job: the host job runs Den's node copy.
+  NODE="$(pick_node "$([ "$2" = web ] && echo "$MODE")")"
   TSX="$(find_tsx)" || { echo "✗ tsx not installed: run npm ci in $DIST" >&2; exit 1; }
   local exe="$NODE" label="$LABEL" log="web.log"
   if [ "$2" = host ]; then

package/src/ui/cli/agent-ops.ts

@@ -3369,6 +3369,71 @@ export async function resumeOrRelaunch(
 }
 
 /** D28: the rotation settings, and agent `agent`'s effective values. */
+/** D30: what the rotation overrides can name, with names to show. */
+export interface RotationChoices {
+  agents: { id: string; name: string; workspace?: string; state: string }[];
+  personas: { id: string; name: string; category: string }[];
+  workspaces: { id: string; name: string }[];
+  services: { id: string; name: string; workspace: string }[];
+}
+
+/**
+ * D30: the overrides form's pickers: every agent (its name, workspace and
+ * state), persona (name and category), workspace and workspace service.
+ * Never starts a session host to ask (a stopped one: agents from their
+ * records). A part that can't be read is empty, not an error.
+ */
+export async function rotationChoices(
+  d: AgentsResolved,
+  workspaces: string[],
+): Promise<RotationChoices> {
+  let sessions: SessionInfo[] = [];
+  try {
+    const c = await d.connectExisting();
+    try {
+      sessions = c ? await c.list() : [];
+    } finally {
+      c?.close();
+    }
+  } catch {
+    sessions = [];
+  }
+  const records = listRecords(d.stateDir());
+  const agents = agentRows(sessions, records, d.stateDir())
+    .filter((r) => r.agent)
+    .map((r) => ({
+      id: r.agent,
+      name: r.displayName || r.sessionTitle || r.agent,
+      ...(r.workspace ? { workspace: r.workspace } : {}),
+      state: r.state,
+    }));
+  let personaList: RotationChoices["personas"] = [];
+  try {
+    personaList = listPersonas(d).map((p) => ({
+      id: p.id,
+      name: p.displayName ? `${p.displayName} (${p.id})` : p.id,
+      category: p.category,
+    }));
+  } catch {
+    personaList = [];
+  }
+  const services: RotationChoices["services"] = [];
+  for (const ws of workspaces)
+    try {
+      for (const sv of d.workspaceServices(ws))
+        if (!services.some((x) => x.id === sv.address))
+          services.push({ id: sv.address, name: sv.address, workspace: ws });
+    } catch {
+      /* a workspace whose services can't be read: none */
+    }
+  return {
+    agents,
+    personas: personaList,
+    workspaces: workspaces.map((w) => ({ id: w, name: w })),
+    services,
+  };
+}
+
 export function rotationSettings(
   d: AgentsResolved,
   agent?: string,

package/src/ui/cli/doctor-command.ts

@@ -69,11 +69,13 @@ import { printJson } from "./json-out.js";
 import { ownerCheck, ownerLine } from "./doctor-owner.js";
 import {
   formatWhere,
+  launchdJobPid,
   serviceJobState,
   whereRows,
   type WhereDeps,
   type WhereRow,
 } from "./doctor-where.js";
+import { hostLabel } from "./service-command.js";
 
 export interface DoctorRow {
   kind: string;
@@ -420,6 +422,8 @@ export async function defaultWhereDeps(): Promise<WhereDeps> {
       try {
         return {
           launchd: c.hostLaunchd,
+          pid: c.hostPid,
+          startedAt: c.hostStartedAt || undefined,
           access: await c.access().catch(() => null),
         };
       } finally {
@@ -438,6 +442,24 @@ export async function defaultWhereDeps(): Promise<WhereDeps> {
         return null;
       }
     },
+    hostJob: () => {
+      try {
+        const { label } = readWebServiceConfig(
+          cfg(),
+          getDistRoot(),
+          os.homedir(),
+        );
+        const host = hostLabel(label);
+        const job = serviceJobState(
+          host,
+          os.homedir(),
+          process.getuid?.() ?? 0,
+        );
+        return job?.state === "loaded" ? launchdJobPid(job.domain, host) : null;
+      } catch {
+        return null;
+      }
+    },
   };
 }
 
@@ -445,7 +467,8 @@ export async function defaultWhereDeps(): Promise<WhereDeps> {
 export function whereCheck(r: WhereRow): OnboardCheck {
   return {
     id: `where:${r.what.replace(" ", "-")}`,
-    status: r.status,
+    // info is as chosen: not a problem.
+    status: r.status === "info" ? "ok" : r.status,
     detail: `${r.session}${r.detail ? `: ${r.detail}` : ""}`,
   };
 }

package/src/ui/cli/doctor-where.ts

@@ -41,15 +41,22 @@ export interface WhereDeps {
   /** The running session host's; null when none runs. */
   host: () => Promise<{
     launchd: string | null;
+    /** The pid that answers on the socket. */
+    pid?: number;
+    /** When it started (ISO). */
+    startedAt?: string;
     access?: { exe: string; fullDiskAccess: boolean | null } | null;
   } | null>;
   service: () => ServiceJob | null;
+  /** The service's own host job's pid (it may stand by), or null. */
+  hostJob?: () => number | null;
 }
 
 export interface WhereRow {
   what: "server" | "session host" | "full disk access" | "service";
   session: string;
-  status: "ok" | "warn";
+  /** info: as chosen, worth knowing (login mode ends at logout). */
+  status: "ok" | "info" | "warn";
   detail?: string;
 }
 
@@ -57,12 +64,15 @@ function sessionRow(
   what: "server" | "session host",
   launchd: string | null | undefined,
   cli: string,
+  loginChosen = false,
 ): WhereRow {
   const session = launchd || "unknown";
   return {
     what,
     session,
-    status: endsAtLogout(launchd) ? "warn" : "ok",
+    // The service installed in login mode: ending at logout is what was
+    // chosen (the default), so it is said, not warned about.
+    status: endsAtLogout(launchd) ? (loginChosen ? "info" : "warn") : "ok",
     ...(sessionWarning(launchd, cli, what)
       ? { detail: sessionWarning(launchd, cli, what)! }
       : {}),
@@ -72,10 +82,12 @@ function sessionRow(
 export async function whereRows(d: WhereDeps): Promise<WhereRow[]> {
   if (d.platform !== "darwin") return [];
   const rows: WhereRow[] = [];
+  const svc = d.service();
+  const loginChosen = svc?.mode === "login" && svc.state !== "not-loaded";
   const server = await d.server().catch(() => null);
   rows.push(
     server
-      ? sessionRow("server", server.launchd, d.cli)
+      ? sessionRow("server", server.launchd, d.cli, loginChosen)
       : {
           // Not started yet is not a problem (a fresh install).
           what: "server",
@@ -85,15 +97,38 @@ export async function whereRows(d: WhereDeps): Promise<WhereRow[]> {
         },
   );
   const host = await d.host().catch(() => null);
+  const jobPid = host ? (d.hostJob?.() ?? null) : null;
+  // The service's host stands by while another host holds the socket, and
+  // takes over when that one exits: nothing to do.
+  const standsBy =
+    jobPid !== null && host?.pid !== undefined && jobPid !== host.pid;
+  const since = host?.startedAt ? `, since ${host.startedAt.slice(0, 10)}` : "";
+  const older = `an older session host (pid ${host?.pid ?? "?"}${since})`;
+  const switchNow = `To switch now (ends running terminals and agents): ${d.cli} sessions host --stop`;
   rows.push(
-    host
-      ? sessionRow("session host", host.launchd, d.cli)
-      : {
+    host && standsBy
+      ? {
           what: "session host",
-          session: "not running",
-          status: "ok",
-          detail: "it starts when the first terminal or agent does",
-        },
+          session: host.launchd || `older host (pid ${host.pid})`,
+          status: "info",
+          detail: `${older} is serving; the service's host (pid ${jobPid}) takes over when it exits. Nothing to do. ${switchNow}`,
+        }
+      : host && !host.launchd
+        ? {
+            // An older host and no service host behind it: what it lacks.
+            what: "session host",
+            session: `unknown (older host${host.pid ? `, pid ${host.pid}` : ""})`,
+            status: "warn",
+            detail: `${older} can't say where it runs, so whether its terminals and agents stop at logout is unknown. It is replaced the next time it exits. ${switchNow}`,
+          }
+        : host
+          ? sessionRow("session host", host.launchd, d.cli, loginChosen)
+          : {
+              what: "session host",
+              session: "not running",
+              status: "ok",
+              detail: "it starts when the first terminal or agent does",
+            },
   );
   const fda = host?.access;
   if (fda && fda.fullDiskAccess !== null) {
@@ -116,7 +151,6 @@ export async function whereRows(d: WhereDeps): Promise<WhereRow[]> {
           },
     );
   }
-  const svc = d.service();
   if (!svc)
     rows.push({
       what: "service",
@@ -145,6 +179,17 @@ export async function whereRows(d: WhereDeps): Promise<WhereRow[]> {
   return rows;
 }
 
+/** The pid launchd runs `<domain>/<label>` as, or null (launchctl print). */
+export function launchdJobPid(domain: string, label: string): number | null {
+  const r = spawnSync("launchctl", ["print", `${domain}/${label}`], {
+    encoding: "utf-8",
+    timeout: 3000,
+  });
+  if (r.status !== 0) return null;
+  const m = /^\s*pid = (\d+)/m.exec(r.stdout ?? "");
+  return m ? Number(m[1]) : null;
+}
+
 export interface JobProbe {
   exists: (p: string) => boolean;
   /** `launchctl print <domain>/<label>`'s exit status (127: no launchctl). */
@@ -195,9 +240,10 @@ export function formatWhere(rows: WhereRow[], title: string): string[] {
   const lines = ["", `${title} doctor: where it runs`, ""];
   const w = Math.max(...rows.map((r) => r.session.length));
   for (const r of rows) {
-    const mark = r.status === "ok" ? "✓" : "⚠";
+    const mark = r.status === "ok" ? "✓" : r.status === "info" ? "ℹ" : "⚠";
     lines.push(`  ${r.what.padEnd(16)}  ${r.session.padEnd(w)}  ${mark}`);
-    if (r.detail) lines.push(`    ${r.status === "ok" ? "" : "⚠ "}${r.detail}`);
+    if (r.detail)
+      lines.push(`    ${r.status === "warn" ? "⚠ " : ""}${r.detail}`);
   }
   return lines;
 }

package/src/ui/server/agent-routes.ts

@@ -138,6 +138,7 @@ import {
   resumeOrRelaunch,
   keepAgentConversation,
   askForHandoff,
+  rotationChoices,
   rotationSettings,
   setRotationSetting,
   rotationTick,
@@ -1328,7 +1329,18 @@ async function rotationRoute(
       const agent = q.get("agent") ?? undefined;
       if ((ws && !NAME_RE.test(ws)) || (agent && !NAME_RE.test(agent)))
         throw new AgentError("not a name", { usage: true });
-      sendJson(res, rotationSettings(d, agent, ws));
+      // D30: ?choices=1 adds what the overrides form can pick, by name.
+      sendJson(res, {
+        ...rotationSettings(d, agent, ws),
+        ...(q.get("choices") === "1"
+          ? {
+              choices: await rotationChoices(
+                d,
+                Object.keys(readWorkspacesFile().workspaces ?? {}),
+              ),
+            }
+          : {}),
+      });
       return true;
     }
     if (method !== "PUT") return methodNotAllowed(res, "GET, PUT");

package/src/ui/server/public/combobox.js

@@ -0,0 +1,150 @@
+/**
+ * A searchable picker (D30): a text field (role=combobox) over a listbox.
+ * Type to filter (the command palette's ranking, rankCommands), ↑/↓ to
+ * move, Enter (or a click) picks, Esc closes. What is picked is an id; what
+ * is shown is its name. One shared control, so a form never asks a person
+ * to type an id.
+ *
+ *   comboHtml({ id, label, placeholder })   the markup (a <label>, the
+ *                                            field, its list)
+ *   wireCombo(root, id, { items, onPick })  makes it work; items() is read
+ *                                            each time it opens, so it
+ *                                            follows live data. Returns
+ *                                            { value(), set(id), clear() }.
+ *
+ * An item: { id, label, sub?, keywords?, off? } (off: shown, not pickable).
+ */
+import { rankCommands } from "./topbar.js";
+
+const esc = (s) =>
+  String(s ?? "").replace(
+    /[&<>"']/g,
+    (c) =>
+      ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" })[
+        c
+      ],
+  );
+
+export function comboHtml({ id, label, placeholder = "" }) {
+  return (
+    `<span class="den-combo" data-combo="${esc(id)}">` +
+    `<label for="${esc(id)}">${esc(label)}</label>` +
+    `<span class="den-combo-box">` +
+    `<input type="text" id="${esc(id)}" role="combobox" aria-expanded="false" aria-controls="${esc(id)}-list" aria-autocomplete="list" autocomplete="off" spellcheck="false" placeholder="${esc(placeholder)}">` +
+    `<ul id="${esc(id)}-list" role="listbox" aria-label="${esc(label)}" class="den-combo-list" hidden></ul>` +
+    `</span></span>`
+  );
+}
+
+/** Rows ranked for `q` (every item when it is empty). */
+export function comboMatches(items, q) {
+  const list = items.map((x) => ({
+    ...x,
+    keywords: [x.id, x.sub ?? "", ...(x.keywords ?? [])],
+  }));
+  return rankCommands(list, q, { limit: 50, emptyLimit: 50 });
+}
+
+export function wireCombo(root, id, { items, onPick }) {
+  const input = root.querySelector(`#${CSS.escape(id)}`);
+  const ul = root.querySelector(`#${CSS.escape(id)}-list`);
+  if (!input || !ul) return null;
+  let picked = "";
+  let shown = [];
+  let sel = 0;
+  const close = () => {
+    ul.hidden = true;
+    input.setAttribute("aria-expanded", "false");
+    input.removeAttribute("aria-activedescendant");
+  };
+  const draw = () => {
+    shown = comboMatches(
+      items(),
+      input.value === labelOf(picked) ? "" : input.value,
+    );
+    sel = Math.min(sel, Math.max(0, shown.length - 1));
+    ul.innerHTML = shown.length
+      ? shown
+          .map(
+            (x, i) =>
+              `<li role="option" id="${esc(id)}-o-${i}" data-i="${i}" aria-selected="${i === sel}"${x.off ? ' aria-disabled="true"' : ""}>` +
+              `<span class="den-combo-l">${esc(x.label)}</span>` +
+              (x.sub ? `<span class="den-combo-s">${esc(x.sub)}</span>` : "") +
+              `</li>`,
+          )
+          .join("")
+      : `<li class="den-combo-none" aria-disabled="true">No match</li>`;
+    ul.hidden = false;
+    input.setAttribute("aria-expanded", "true");
+    if (shown.length)
+      input.setAttribute("aria-activedescendant", `${id}-o-${sel}`);
+    ul.querySelector(`[data-i="${sel}"]`)?.scrollIntoView?.({
+      block: "nearest",
+    });
+  };
+  const labelOf = (v) => items().find((x) => x.id === v)?.label ?? "";
+  const pick = (x) => {
+    if (!x || x.off) return;
+    picked = x.id;
+    input.value = x.label;
+    input.dataset.value = x.id;
+    close();
+    onPick?.(x);
+  };
+  input.addEventListener("focus", () => {
+    sel = 0;
+    draw();
+  });
+  input.addEventListener("input", () => {
+    picked = "";
+    delete input.dataset.value;
+    sel = 0;
+    draw();
+  });
+  input.addEventListener("keydown", (e) => {
+    if (e.key === "ArrowDown" || e.key === "ArrowUp") {
+      e.preventDefault();
+      if (ul.hidden) return draw();
+      const n = shown.length;
+      if (!n) return;
+      sel = (sel + (e.key === "ArrowDown" ? 1 : n - 1)) % n;
+      draw();
+    } else if (e.key === "Enter") {
+      if (ul.hidden) return;
+      e.preventDefault();
+      pick(shown[sel]);
+    } else if (e.key === "Escape") {
+      if (!ul.hidden) {
+        e.preventDefault();
+        e.stopPropagation();
+        close();
+      }
+    }
+  });
+  // mousedown, not click: the field keeps its focus (no blur close first).
+  ul.addEventListener("mousedown", (e) => {
+    const li = e.target.closest?.("[data-i]");
+    if (!li) return;
+    e.preventDefault();
+    pick(shown[Number(li.dataset.i)]);
+  });
+  input.addEventListener("blur", () => {
+    close();
+    // Leaving with a half-typed name: back to what was picked.
+    if (input.value !== labelOf(picked)) input.value = labelOf(picked);
+  });
+  return {
+    value: () => picked,
+    set: (v) => {
+      picked = v;
+      input.value = labelOf(v);
+      if (v) input.dataset.value = v;
+      else delete input.dataset.value;
+    },
+    clear: () => {
+      picked = "";
+      input.value = "";
+      delete input.dataset.value;
+    },
+  };
+}

package/src/ui/server/public/error-page.js

@@ -305,10 +305,15 @@ function githubBlock(s, t) {
 
 /**
  * D17: a Den with no owner yet that a rule lets someone claim. It leads the
- * page: Connect your GitHub account. "This is my computer" (with
- * web.allowed_github_org) goes to localhost and back, which only works in a
- * browser on the machine Den runs on, then starts the GitHub sign-in with
- * that proof; "Sign in as @login" (web.owner_github) works from anywhere.
+ * page: Connect your GitHub account.
+ *
+ *   - "Sign in as @login" (web.owner_github) works from any browser: when
+ *     it is there, it is the primary button.
+ *   - The localhost trip (web.allowed_github_org) only works in a browser
+ *     on the machine Den runs on, so its button says so ("On <host>
+ *     itself: connect GitHub"), never a footnote (D29).
+ *   - Only the org rule: the page says to open it on <host>, or to set
+ *     web.owner_github to sign in from anywhere.
  */
 function claimBlock(s, t) {
   const g = s.github;
@@ -316,24 +321,31 @@ function claimBlock(s, t) {
   const host = s.machine || "";
   const back = location.origin + location.pathname + location.search;
   const here = g.attest ? `${g.attest}?return=${encodeURIComponent(back)}` : "";
+  const as = g.ownerGithub
+    ? `<button type="button" class="btn primary" id="den-gh-start">${esc(t("err.signin.claimAs", { login: g.ownerGithub }))}</button>`
+    : "";
+  const hereBtn = here
+    ? `<a class="btn${as ? "" : " primary"}" id="den-claim-here" href="${esc(here)}">${
+        host
+          ? withHost(t, "err.signin.claimHereOn", { host })
+          : esc(t("err.signin.claimHere"))
+      }</a>`
+    : "";
   return (
     `<div id="den-gh" class="den-claim">` +
     `<h2 class="den-h" id="den-claim-title">${esc(t("err.signin.claimTitle"))}</h2>` +
     `<p class="lead" id="den-claim-lead">${esc(t("err.signin.claimLead", { name: s.name || "Den" }))}</p>` +
     (g.org
-      ? `<p id="den-claim-org">${withHost(t, "err.signin.claimOrg", { org: g.org, host })}</p>`
+      ? `<p id="den-claim-org">${withHost(
+          t,
+          g.ownerGithub ? "err.signin.claimOrg" : "err.signin.claimOrgOnly",
+          { org: g.org, host },
+        )}</p>`
       : "") +
     `<div class="acts" style="margin-top:0">` +
-    (here
-      ? `<a class="btn primary" id="den-claim-here" href="${esc(here)}">${esc(t("err.signin.claimHere"))}</a>`
-      : "") +
-    (g.ownerGithub
-      ? `<button type="button" class="btn${here ? "" : " primary"}" id="den-gh-start">${esc(t("err.signin.claimAs", { login: g.ownerGithub }))}</button>`
-      : "") +
+    as +
+    hereBtn +
     `</div><div id="den-gh-flow" aria-live="polite"></div>` +
-    (here
-      ? `<p class="den-gh-note" id="den-claim-note">${withHost(t, "err.signin.claimHereNote", { host })}</p>`
-      : "") +
     `</div>`
   );
 }

package/src/ui/server/public/i18n/es.js

@@ -311,9 +311,10 @@
     "err.signin.claimOrg":
       "Los miembros de la organización {org} de GitHub pueden reclamarlo, en un navegador en {host}.",
     "err.signin.claimHere": "Este es mi ordenador: conectar GitHub",
+    "err.signin.claimHereOn": "En {host}: conectar GitHub",
+    "err.signin.claimOrgOnly":
+      "Los miembros de la organización {org} de GitHub pueden reclamarlo desde un navegador en {host}. Abre esta página en {host}, o define web.owner_github para iniciar sesión desde cualquier sitio.",
     "err.signin.claimAs": "Iniciar sesión como @{login}",
-    "err.signin.claimHereNote":
-      "«Este es mi ordenador» solo funciona en un navegador en {host}. En otro sitio no abre nada.",
     "err.signin.claimChecking": "Comprobando que esto es {host}…",
     "err.signin.githubRefused":
       "@{login} no es el propietario de este {name}. Solo la cuenta del propietario puede usar Iniciar sesión con GitHub. Usa «Aprueba este ordenador» en su lugar.",

package/src/ui/server/public/i18n/ja.js

@@ -299,9 +299,10 @@
     "err.signin.claimOrg":
       "GitHub の {org} 組織のメンバーは、{host} 上のブラウザーでこれを登録できます。",
     "err.signin.claimHere": "これは自分のコンピューター: GitHub を接続",
+    "err.signin.claimHereOn": "{host} 上で: GitHub を接続",
+    "err.signin.claimOrgOnly":
+      "GitHub の {org} 組織のメンバーは、{host} 上のブラウザーからこれを登録できます。このページを {host} で開くか、どこからでもサインインできるよう web.owner_github を設定してください。",
     "err.signin.claimAs": "@{login} としてサインイン",
-    "err.signin.claimHereNote":
-      "「これは自分のコンピューター」は {host} 上のブラウザーでだけ使えます。ほかの場所では何も開きません。",
     "err.signin.claimChecking": "ここが {host} か確認しています…",
     "err.signin.githubRefused":
       "@{login} はこの {name} のオーナーではありません。GitHub でサインインを使えるのはオーナーのアカウントだけです。代わりに「このコンピューターを承認」を使ってください。",

package/src/ui/server/public/settings-registry.js

@@ -30,6 +30,7 @@
 import { themeNotice, themeOptions } from "./appearance.js";
 import { qrSvg } from "./qr.js";
 import { renderPersonasSettings } from "./persona-ui.js";
+import { comboHtml, wireCombo } from "./combobox.js";
 
 export const DEN_SETTING_CATEGORIES = [
   {
@@ -1288,6 +1289,67 @@ const ROT_KEYS = [
   ["on_pr_merged", "When its PR merges", "true or false"],
 ];
 const rotVal = (v) => (v === undefined ? "" : String(v));
+/** A value as a person reads it (D30): "never", "Auto", "Relaunch". */
+function rotValText(k, v) {
+  if (k === "on_due")
+    return { auto: "Auto", ask: "Ask", off: "Off" }[v] ?? rotVal(v);
+  if (k === "on_pr_merged")
+    return v === true ? "Relaunch" : v === false ? "Keep going" : rotVal(v);
+  return rotVal(v);
+}
+
+/**
+ * D30: an override's target as a name, from the pickers' choices. One that
+ * no longer exists: its id, and gone.
+ */
+export function rotTargetName(scope, target, c = {}) {
+  const find = (list, id) => (list || []).find((x) => x.id === id);
+  if (scope === "agent") {
+    const a = find(c.agents, target);
+    return a
+      ? { name: a.workspace ? `${a.name} (${a.workspace})` : a.name }
+      : { name: target, gone: true };
+  }
+  if (scope === "persona-workspace") {
+    const [pid, ws] = String(target).split("@");
+    const p = find(c.personas, pid);
+    const w = find(c.workspaces, ws);
+    return p && w
+      ? { name: `${p.name} in ${w.name}` }
+      : { name: target, gone: true };
+  }
+  const list =
+    scope === "persona"
+      ? c.personas
+      : scope === "workspace"
+        ? c.workspaces
+        : c.services;
+  const x = find(list, target);
+  return x ? { name: x.name } : { name: target, gone: true };
+}
+
+/** D30: each picker's rows, from GET /api/agents/rotation?choices=1. */
+export function rotPickItems(kind, c = {}) {
+  if (kind === "agent")
+    return (c.agents || []).map((a) => ({
+      id: a.id,
+      label: a.name,
+      sub: [a.workspace, a.state].filter(Boolean).join(" · "),
+    }));
+  if (kind === "persona")
+    return (c.personas || []).map((p) => ({
+      id: p.id,
+      label: p.name,
+      sub: p.category,
+    }));
+  if (kind === "workspace")
+    return (c.workspaces || []).map((w) => ({ id: w.id, label: w.name }));
+  return (c.services || []).map((x) => ({
+    id: x.id,
+    label: x.name,
+    sub: x.workspace,
+  }));
+}
 
 /** A value typed in the overrides form, as the key takes it. */
 export function rotationValue(key, raw) {
@@ -1325,11 +1387,16 @@ export function rotationHtml(b) {
   const rows = [];
   for (const [scope, byTarget] of Object.entries(b.overrides || {}))
     for (const [target, vals] of Object.entries(byTarget || {}))
-      for (const [k, v] of Object.entries(vals || {}))
+      for (const [k, v] of Object.entries(vals || {})) {
+        const who = rotTargetName(scope, target, b.choices);
+        const setting = (ROT_KEYS.find((x) => x[0] === k) || [k, k])[1];
         rows.push(
-          `<tr data-rot-row><td>${escR((ROT_SCOPES.find((x) => x[0] === scope) || [scope, scope])[1])}</td><td class="den-mono">${escR(target)}</td><td>${escR(k)}</td><td class="den-mono">${escR(rotVal(v))}</td>` +
-            `<td><button type="button" class="btn sm" data-rot-clear data-scope="${escR(scope)}" data-target="${escR(target)}" data-key="${escR(k)}" aria-label="Clear ${escR(k)} for ${escR(scope)} ${escR(target)}">Clear</button></td></tr>`,
+          `<tr data-rot-row${who.gone ? " data-rot-gone" : ""}><td data-l="Scope">${escR((ROT_SCOPES.find((x) => x[0] === scope) || [scope, scope])[1])}</td>` +
+            `<td data-l="For"${who.gone ? ' class="rot-gone"' : ""}>${who.gone ? `<span class="den-mono">${escR(who.name)}</span> (gone)` : escR(who.name)}</td>` +
+            `<td data-l="Setting">${escR(setting)}</td><td data-l="Value">${escR(rotValText(k, v))}</td>` +
+            `<td class="rot-act"><button type="button" class="btn sm" data-rot-clear data-scope="${escR(scope)}" data-target="${escR(target)}" data-key="${escR(k)}" aria-label="${who.gone ? "Remove" : "Clear"} ${escR(setting)} for ${escR(who.name)}">${who.gone ? "Remove" : "Clear"}</button></td></tr>`,
         );
+      }
   return (
     `<div class="rot" data-rotation-settings>` +
     `<div class="rot-inst">` +
@@ -1359,10 +1426,16 @@ export function rotationHtml(b) {
       : `<tr><td colspan="5" class="set-note">No overrides: every agent uses this install's values.</td></tr>`) +
     `</tbody></table></div>` +
     `<form class="rot-add" data-rot-add>` +
-    `<label for="rot-a-scope">Scope</label> <select id="rot-a-scope">${ROT_SCOPES.map(([v, l]) => `<option value="${v}">${escR(l)}</option>`).join("")}</select> ` +
-    `<label for="rot-a-target">For</label> <input type="text" id="rot-a-target" class="den-mono" spellcheck="false" autocomplete="off" placeholder="agent id" required> ` +
-    `<label for="rot-a-key">Setting</label> <select id="rot-a-key">${ROT_KEYS.map(([v, l]) => `<option value="${v}">${escR(l)}</option>`).join("")}</select> ` +
-    `<label for="rot-a-value">Value</label> <input type="text" id="rot-a-value" class="den-mono" spellcheck="false" autocomplete="off" placeholder="a number, or never" required> ` +
+    `<span class="rot-pick"><label for="rot-a-scope">Scope</label> <select id="rot-a-scope">${ROT_SCOPES.map(([v, l]) => `<option value="${v}">${escR(l)}</option>`).join("")}</select></span>` +
+    // The target: picked by name, never typed as an id (D30).
+    `<span class="rot-pick" data-for="agent">${comboHtml({ id: "rot-a-agent", label: "Agent", placeholder: "Type to find an agent" })}</span>` +
+    `<span class="rot-pick" data-for="persona persona-workspace" hidden>${comboHtml({ id: "rot-a-persona", label: "Persona", placeholder: "Type to find a persona" })}</span>` +
+    `<span class="rot-pick" data-for="workspace persona-workspace" hidden>${comboHtml({ id: "rot-a-ws", label: "Workspace", placeholder: "Type to find a workspace" })}</span>` +
+    `<span class="rot-pick" data-for="service" hidden>${comboHtml({ id: "rot-a-service", label: "Service", placeholder: "Type to find a service" })}</span>` +
+    `<span class="rot-pick"><label for="rot-a-key">Setting</label> <select id="rot-a-key">${ROT_KEYS.map(([v, l]) => `<option value="${v}">${escR(l)}</option>`).join("")}</select></span>` +
+    `<span class="rot-pick" data-val="after_compactions"><label for="rot-a-n">Value</label> <input type="number" id="rot-a-n" min="1" max="100" step="1" value="3"> <label class="rot-never"><input type="checkbox" id="rot-a-never"> never</label></span>` +
+    `<span class="rot-pick" data-val="on_due" hidden><label for="rot-a-due">Value</label> <select id="rot-a-due"><option value="auto">Auto</option><option value="ask">Ask</option><option value="off">Off</option></select></span>` +
+    `<span class="rot-pick" data-val="on_pr_merged" hidden><label for="rot-a-pr">Value</label> <select id="rot-a-pr"><option value="true">Relaunch</option><option value="false">Keep going</option></select></span>` +
     `<button type="submit" class="btn sm primary">Add override</button></form>` +
     `<div class="rt-err" role="alert" hidden></div>` +
     `</div>`
@@ -1385,14 +1458,54 @@ function renderRotation(host, ctx) {
       return Promise.resolve();
     }
     return ctx.shell
-      .api("GET", "/api/agents/rotation")
+      .api("GET", "/api/agents/rotation?choices=1")
       .then((b) => {
         host.innerHTML = rotationHtml(b || {});
+        wireAdd(b?.choices || {});
       })
       .catch((x) => {
         host.innerHTML = `<div class="set-note">${escR(x?.message || "The rotation settings did not load.")}</div>`;
       });
   };
+  // D30: the add form's pickers, filled from live data.
+  let picks = {};
+  const wireAdd = (c) => {
+    picks = {};
+    for (const [kind, id] of [
+      ["agent", "rot-a-agent"],
+      ["persona", "rot-a-persona"],
+      ["workspace", "rot-a-ws"],
+      ["service", "rot-a-service"],
+    ])
+      picks[kind] = wireCombo(host, id, { items: () => rotPickItems(kind, c) });
+    showFor();
+  };
+  const showFor = () => {
+    const scope = host.querySelector("#rot-a-scope")?.value;
+    const key = host.querySelector("#rot-a-key")?.value;
+    for (const el of host.querySelectorAll(".rot-add [data-for]"))
+      el.hidden = !el.dataset.for.split(" ").includes(scope);
+    for (const el of host.querySelectorAll(".rot-add [data-val]"))
+      el.hidden = el.dataset.val !== key;
+    const n = host.querySelector("#rot-a-n");
+    const never = host.querySelector("#rot-a-never");
+    if (n && never) n.disabled = never.checked;
+  };
+  const targetOf = (scope) => {
+    const v = (k) => picks[k]?.value() || "";
+    if (scope === "persona-workspace")
+      return v("persona") && v("workspace")
+        ? `${v("persona")}@${v("workspace")}`
+        : "";
+    return v(scope);
+  };
+  const valueOf = (key) => {
+    if (key === "on_due") return host.querySelector("#rot-a-due").value;
+    if (key === "on_pr_merged")
+      return host.querySelector("#rot-a-pr").value === "true";
+    if (host.querySelector("#rot-a-never").checked) return "never";
+    return Number(host.querySelector("#rot-a-n").value);
+  };
   const put = async (body) => {
     try {
       await ctx.shell.api("PUT", "/api/agents/rotation", body);
@@ -1403,16 +1516,11 @@ function renderRotation(host, ctx) {
   };
   host.addEventListener("change", (e) => {
     const k = e.target.closest("[data-rot-key]")?.dataset.rotKey;
-    if (e.target.id === "rot-a-scope") {
-      const s = ROT_SCOPES.find((x) => x[0] === e.target.value);
-      const t = host.querySelector("#rot-a-target");
-      if (s && t) t.placeholder = s[2];
-      return;
-    }
-    if (e.target.id === "rot-a-key") {
-      const s = ROT_KEYS.find((x) => x[0] === e.target.value);
-      const v = host.querySelector("#rot-a-value");
-      if (s && v) v.placeholder = s[2];
+    if (
+      ["rot-a-scope", "rot-a-key", "rot-a-never"].includes(e.target.id) ||
+      e.target.closest?.(".rot-add")
+    ) {
+      showFor();
       return;
     }
     if (!k || k === "after_compactions" || e.target.tagName !== "SELECT")
@@ -1447,12 +1555,18 @@ function renderRotation(host, ctx) {
     if (!f) return;
     e.preventDefault();
     const key = f.querySelector("#rot-a-key").value;
-    void put({
-      scope: f.querySelector("#rot-a-scope").value,
-      target: f.querySelector("#rot-a-target").value.trim(),
-      key,
-      value: rotationValue(key, f.querySelector("#rot-a-value").value),
-    });
+    const scope = f.querySelector("#rot-a-scope").value;
+    const target = targetOf(scope);
+    if (!target) {
+      fail({
+        message:
+          scope === "persona-workspace"
+            ? "Pick a persona and a workspace."
+            : `Pick a ${(ROT_SCOPES.find((x) => x[0] === scope) || [scope, scope])[1].toLowerCase()}.`,
+      });
+      return;
+    }
+    void put({ scope, target, key, value: valueOf(key) });
   });
   void load();
 }

package/src/ui/server/public/settings.html

@@ -454,6 +454,87 @@
       .rot-add {
         margin-top: 10px;
       }
+      /* D30: the add form: each control with its label, wrapping. */
+      .rot-pick {
+        display: inline-flex;
+        align-items: center;
+        gap: 6px;
+        min-width: 0;
+        flex: 1 1 200px;
+        flex-wrap: wrap;
+      }
+      .rot-pick[hidden] {
+        display: none;
+      }
+      .rot-pick input[type="number"] {
+        width: 6em;
+        flex: 0 0 auto;
+      }
+      .rot-never {
+        display: inline-flex;
+        align-items: center;
+        gap: 4px;
+      }
+      .rot-gone {
+        color: var(--muted);
+      }
+      /* The shared picker (combobox.js). */
+      .den-combo {
+        display: inline-flex;
+        align-items: center;
+        gap: 6px;
+        min-width: 0;
+        flex: 1 1 200px;
+        flex-wrap: wrap;
+      }
+      .den-combo-box {
+        position: relative;
+        flex: 1 1 160px;
+        min-width: 0;
+      }
+      .den-combo-box input {
+        width: 100%;
+        box-sizing: border-box;
+      }
+      .den-combo-list {
+        position: absolute;
+        z-index: 20;
+        left: 0;
+        right: 0;
+        top: calc(100% + 2px);
+        max-height: 240px;
+        overflow-y: auto;
+        margin: 0;
+        padding: 4px;
+        list-style: none;
+        background: var(--surface);
+        border: 1px solid var(--border);
+        border-radius: 8px;
+        box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12);
+      }
+      .den-combo-list[hidden] {
+        display: none;
+      }
+      .den-combo-list li {
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: space-between;
+        gap: 2px 8px;
+        padding: 5px 8px;
+        border-radius: 6px;
+        cursor: pointer;
+      }
+      .den-combo-list li[aria-selected="true"] {
+        background: var(--sunken);
+      }
+      .den-combo-list li[aria-disabled="true"] {
+        color: var(--muted);
+        cursor: default;
+      }
+      .den-combo-s {
+        color: var(--muted);
+        font-size: 12px;
+      }
       .rot-ov caption {
         text-align: left;
         color: var(--muted);
@@ -464,7 +545,49 @@
       .rot-ov td {
         padding: 4px 10px 4px 0;
         text-align: left;
-        overflow-wrap: anywhere;
+        /* Break a key at its "_", never mid-word. */
+        overflow-wrap: normal;
+        word-break: normal;
+      }
+      /* Narrow: each override is a card of label/value lines, so no
+         column is squeezed into breaking words mid-letter. */
+      @media (max-width: 560px) {
+        .rot-ov thead {
+          position: absolute;
+          width: 1px;
+          height: 1px;
+          overflow: hidden;
+          clip: rect(0 0 0 0);
+        }
+        .rot-ov,
+        .rot-ov tbody,
+        .rot-ov tr,
+        .rot-ov td {
+          display: block;
+          width: 100%;
+        }
+        .rot-ov caption {
+          display: block;
+        }
+        .rot-ov tr[data-rot-row] {
+          padding: 6px 0;
+          border-top: 1px solid var(--border);
+        }
+        .rot-ov td {
+          display: flex;
+          gap: 8px;
+          padding: 2px 0;
+          overflow-wrap: anywhere;
+        }
+        .rot-ov td[data-l]::before {
+          content: attr(data-l);
+          flex: 0 0 64px;
+          color: var(--muted);
+          font-family: inherit;
+        }
+        .rot-ov td.rot-act {
+          padding-top: 4px;
+        }
       }
       .rt-fl {
         flex-basis: 100%;

package/src/ui/server/public/shell.js

@@ -426,9 +426,10 @@
     "err.signin.claimOrg":
       "Members of the {org} GitHub org can claim it, in a browser on {host}.",
     "err.signin.claimHere": "This is my computer: connect GitHub",
+    "err.signin.claimHereOn": "On {host} itself: connect GitHub",
+    "err.signin.claimOrgOnly":
+      "Members of the {org} GitHub org can claim it, from a browser on {host}. Open this page on {host}, or set web.owner_github to sign in from anywhere.",
     "err.signin.claimAs": "Sign in as @{login}",
-    "err.signin.claimHereNote":
-      "This is my computer works only in a browser on {host}. Anywhere else it opens nothing.",
     "err.signin.claimChecking": "Checking this is {host}…",
     "err.signin.githubRefused":
       "@{login} isn't the owner of this {name}. Only the owner's account can use Sign in with GitHub. Use Approve this computer instead.",
@@ -2320,28 +2321,31 @@
     var down = Object.prototype.hasOwnProperty.call(off, id)
       ? !!off[id]
       : state.health[id] === "down";
+    // D27: a real link (never popup-blocked, as window.open was in Safari).
+    var live = !down && /^https?:\/\//i.test(url);
     return (
-      '<button type="button" class="den-pvisit" tabindex="-1" data-visit="' +
+      '<a class="den-pvisit" tabindex="-1" data-visit="' +
       esc(id) +
       '" data-url="' +
       esc(url) +
-      '" aria-label="' +
+      '"' +
+      (live
+        ? ' href="' + esc(url) + '" target="_blank" rel="noopener noreferrer"'
+        : ' role="link" aria-disabled="true"') +
+      ' aria-label="' +
       esc(t("act.visitX", { s: id })) +
       '" title="' +
       esc(down ? t("svp.notRunning") : url) +
-      '"' +
-      (down ? ' aria-disabled="true"' : "") +
-      '><span aria-hidden="true">↗</span></button>'
+      '"><span aria-hidden="true">↗</span></a>'
     );
   }
+  /** A pin's Visit ↗ clicked: true when the link opens by itself. */
   function visitPin(b) {
-    if (b.getAttribute("aria-disabled") === "true") {
+    if (b.getAttribute("aria-disabled") === "true" || !b.hasAttribute("href")) {
       toast(t("svp.notRunning"));
-      return;
+      return false;
     }
-    var url = b.getAttribute("data-url");
-    if (url && /^https?:\/\//i.test(url))
-      window.open(url, "_blank", "noopener");
+    return true;
   }
   // 0.4.18: the service panel (svc-panel.js registers it).
   var servicePanel = null;
@@ -2653,8 +2657,7 @@
     var tgt = e.target;
     var v = tgt && tgt.closest ? tgt.closest("[data-visit]") : null;
     if (v) {
-      e.preventDefault();
-      visitPin(v);
+      if (!visitPin(v)) e.preventDefault();
       return;
     }
     // 0.4.18: a plain click (or Enter) on a pinned row opens its panel;
@@ -5018,6 +5021,9 @@
     ".den-btn.primary { background: var(--accent-fill); border-color: var(--accent-fill); color: var(--on-accent); }",
     ".den-btn.sm { padding: 2px 9px; font-size: 12.5px; }",
     ".den-btn:disabled { opacity: .6; cursor: default; }",
+    // D27: Visit is a link styled as a button.
+    "a.den-btn, a.den-pvisit { text-decoration: none; display: inline-flex; align-items: center; justify-content: center; }",
+    "a.den-pvisit { display: grid; }",
     // Status drawer (.scrim, .drawer, .prob-card, .grp, .svl: R15)
     ".den-scrim { position: fixed; inset: 0; background: rgb(0 0 0 / 0.35); z-index: 40; }",
     ".den-drawer { position: fixed; top: 0; right: 0; bottom: 0; width: min(420px, 100%); z-index: 41;",

package/src/ui/server/public/svc-panel.js

@@ -67,6 +67,9 @@ const S = {
   testing: new Set(),
   /** The open panel: { id, el, opener, scrim, timer }. */
   open: null,
+  /** D27: a pointer is down inside the panel: repaint after it is up. */
+  pressed: false,
+  syncLater: false,
 };
 
 /** Start or Restart from here: "starting…" until health says, or the timeout. */
@@ -228,14 +231,21 @@ function testsHtml(s) {
   return `<span class="den-svp-${ok ? "ok" : "bad"}">${esc(t(ok ? "svp.testsOk" : "svp.testsBad", { t: at }))}</span>`;
 }
 
-/** A Visit button (the rail row's ↗, or the panel's primary). */
+/**
+ * Visit: a real link, styled as a button (D27). A native target=_blank link
+ * is never popup-blocked (Safari blocked window.open from the delegated
+ * click) and works with no script. Off (down, starting): no href,
+ * aria-disabled, and a click says why (visit()).
+ */
 export function visitHtml(s, cls, label) {
   if (!s.url) return "";
-  const on = visitable(s);
+  const on = visitable(s) && /^https?:\/\//i.test(s.url);
   return (
-    `<button type="button" class="${cls}" data-visit="${esc(s.id)}" data-url="${esc(s.url)}"` +
-    ` aria-label="${esc(t("act.visitX", { s: s.id }))}" title="${esc(on ? s.url : t("svp.notRunning"))}"` +
-    `${on ? "" : ' aria-disabled="true"'}>${label}</button>`
+    `<a class="${cls}" data-visit="${esc(s.id)}" data-url="${esc(s.url)}"` +
+    (on
+      ? ` href="${esc(s.url)}" target="_blank" rel="noopener noreferrer"`
+      : ` role="link" tabindex="0" aria-disabled="true"`) +
+    ` aria-label="${esc(t("act.visitX", { s: s.id }))}" title="${esc(on ? s.url : t("svp.notRunning"))}">${label}</a>`
   );
 }
 
@@ -335,6 +345,12 @@ function sync() {
   publishUrls();
   const o = S.open;
   if (!o) return;
+  // D27: never repaint under a press: the button pressed would be replaced
+  // between pointerdown and click, and the click would land on the panel.
+  if (S.pressed) {
+    S.syncLater = true;
+    return;
+  }
   const a = document.activeElement;
   const mine = a && o.el.contains(a) && a !== o.el;
   const key = mine
@@ -451,15 +467,20 @@ export function panelOpen() {
 const env = () => S.deps.currentEnv?.() ?? "local";
 const runs = () => window.denShell?.runs;
 
-/** Visit: the service's URL in a new tab, or why not. */
+/**
+ * Visit, clicked: a live link opens by itself (the browser follows it, so
+ * true: leave the click alone); an off one says why (false: the caller
+ * prevents the click).
+ */
 export function visit(btn) {
-  if (btn.getAttribute("aria-disabled") === "true") {
+  if (
+    btn.getAttribute("aria-disabled") === "true" ||
+    !btn.hasAttribute("href")
+  ) {
     window.denShell?.toast?.(t("svp.notRunning"));
-    return;
+    return false;
   }
-  const url = btn.dataset.url;
-  if (!url || !/^https?:\/\//i.test(url)) return;
-  window.open(url, "_blank", "noopener");
+  return true;
 }
 
 /** A stream into a runs-dock tab: Start, Stop, Restart (exec), Logs, tests. */
@@ -635,6 +656,27 @@ export function initServicePanel(deps = {}) {
     sync();
   });
   window.addEventListener("den:pins", () => sync());
+  // D27: a press inside the open panel holds its repaint until it ends.
+  document.addEventListener(
+    "pointerdown",
+    (e) => {
+      if (S.open?.el.contains(e.target)) S.pressed = true;
+    },
+    true,
+  );
+  const released = () => {
+    if (!S.pressed) return;
+    S.pressed = false;
+    // After the click this press makes, then the repaint it held.
+    setTimeout(() => {
+      if (S.syncLater) {
+        S.syncLater = false;
+        sync();
+      }
+    }, 0);
+  };
+  document.addEventListener("pointerup", released, true);
+  document.addEventListener("pointercancel", released, true);
   document.addEventListener(
     "click",
     (e) => {
@@ -643,10 +685,7 @@ export function initServicePanel(deps = {}) {
       // The panel's Visit here; the rail's ↗ is shell.js's (the same visit()).
       const v = tgt.closest?.("[data-visit]");
       if (v) {
-        if (o?.el.contains(v)) {
-          e.preventDefault();
-          visit(v);
-        }
+        if (o?.el.contains(v) && !visit(v)) e.preventDefault();
         return;
       }
       const opener = tgt.closest?.("[data-svpanel-open]");

package/src/ui/server/ui-assets.ts

@@ -52,6 +52,8 @@ export const UI_MODULES: readonly string[] = [
   "/server-agent-page.js",
   // 0.4.18: the service panel (rail pins, Graph ⋯, Services names).
   "/svc-panel.js",
+  // D30: the shared searchable picker (Settings › Agents › Rotation).
+  "/combobox.js",
   // 0.4.18: where a service's live log comes from (Logs page and panel).
   "/log-source.js",
 ];