@bongos/core 1.19.878 → 1.19.880

package/modules/hall-ui/public/harbor.js

@@ -1,367 +0,0 @@
-// public-builders/harbor.js — the Harbor (/builders/harbor).
-//
-// Metic+ dev-box management view (idea 257 / task 1163; Archon-only until ADR 0157
-// moved `box.fleet.manage` to the working rank). Every builder's dev box is one
-// oversight row in a panel, grouped by lifecycle (task 1003469); a Metic or Archon
-// can close any box and block a builder from opening new ones.
-//
-// Like the Watch page, this reads /api/bongos/me to learn the viewer's rank and
-// shows a restricted notice below the Metic floor — DEFENCE IN DEPTH only. The data +
-// mutation endpoints (/boxes, /boxes/:id/close, /boxes/:id/block) are ALSO gated
-// server-side on `box.fleet.manage` (ADR 0016), and the page itself is gated by
-// serve-internal.js requireGovernmentPage — whose own floor is `page.view.government`,
-// metic since ADR 0157. On a 401 it redirects into the web sign-in flow.
-
-(() => {
-  'use strict';
-
-  const API = '/api/bongos';
-  // Generated typed client (task 1996 / R09), served as window.BongosClient by
-  // /lib/bongos-client.js. baseUrl:'' passes the full `${API}${path}` URLs below
-  // through unchanged; result-mode ({ status, ok, data }) preserves control flow 1:1.
-  const api = window.BongosClient.createClient({ baseUrl: '', credentials: 'same-origin', throwOnError: false });
-  const { escapeHtml, fmtInt } = window.OTB;
-  const { emptyStateHtml } = window.OTBKit;
-  const rankLabel = (rank) => window.OTB.rankLabel(rank, { empty: '' });
-  const toast = (msg) => window.OTB.toast(msg);
-
-  // States that hold a droplet/snapshot worth reclaiming — mirrors the server's
-  // boxes.canTransition('deprovision', …). A box in one of these can be
-  // closed; the rest (none/destroyed/provisioning) have nothing to deprovision.
-  const CLOSEABLE = new Set(['active', 'parking', 'parked', 'waking', 'error']);
-
-  // ---- fetch helpers (mirror watch.js) -------------------------------------
-
-  async function fetchJson(path) {
-    const res = await api.request('GET', `${API}${path}`);
-    if (res.status === 401) { window.location.assign(`${API}/auth/web/start`); throw { kind: '401' }; }
-    if (res.status === 403) { throw { kind: '403' }; }
-    if (!res.ok) throw new Error(`${path} → ${res.status}`);
-    return res.data;
-  }
-
-  async function sendJson(method, path, body) {
-    const res = await api.request(method, `${API}${path}`, { body: body || {} });
-    if (res.status === 401) { window.location.assign(`${API}/auth/web/start`); throw { kind: '401' }; }
-    const data = res.data || {};
-    if (!res.ok) throw new Error(data.message || data.error || `${path} → ${res.status}`);
-    return data;
-  }
-
-  // ---- formatters ----------------------------------------------------------
-
-  // ISO → "3h 12m" / "2d 4h" / "8m" elapsed-since. "—" for empty/bad input.
-  function fmtAgo(iso) {
-    if (!iso) return '—';
-    const t = new Date(iso).getTime();
-    if (!Number.isFinite(t)) return '—';
-    let s = Math.max(0, Math.round((Date.now() - t) / 1000));
-    const d = Math.floor(s / 86400); s -= d * 86400;
-    const h = Math.floor(s / 3600); s -= h * 3600;
-    const m = Math.floor(s / 60);
-    if (d > 0) return `${d}d ${h}h`;
-    if (h > 0) return `${h}h ${m}m`;
-    return `${m}m`;
-  }
-
-  function fmtUsd(n) {
-    const v = Number(n);
-    if (!Number.isFinite(v)) return '$0.00';
-    return `$${v.toFixed(2)}`;
-  }
-
-  // The lifecycle state as a hairline pill in the state's colour — the shell's
-  // .fact-pill states, never a coloured band on the row (task 1003469 retired the
-  // 4px "roof" strip each card wore).
-  function statePill(state) {
-    const s = state || 'none';
-    const mod = s === 'active' ? 'ok'
-      : (s === 'provisioning' || s === 'waking' || s === 'parking') ? 'warn'
-        : s === 'error' ? 'danger'
-          : 'quiet';
-    return `<span class="fact-pill fact-pill--${mod}">${escapeHtml(s)}</span>`;
-  }
-
-  // ---- modal ---------------------------------------------------------------
-
-  function closeModal() {
-    const root = document.getElementById('harbor-modal-root');
-    if (root) root.innerHTML = '';
-  }
-
-  // Build the confirm dialog on the shell's --z-modal layer: the oversight
-  // family's .ov-modal (oversight.css). `bodyHtml` is optional extra HTML
-  // (inputs); onConfirm receives the dialog so the caller can read them.
-  function openModal({ title, bodyHtml, confirmLabel, onConfirm }) {
-    const root = document.getElementById('harbor-modal-root');
-    root.innerHTML = '';
-    const bg = document.createElement('div');
-    bg.className = 'ov-modal-bg';
-    bg.innerHTML =
-      `<div class="ov-modal" role="dialog" aria-modal="true" aria-labelledby="harbor-modal-h">
-        <h2 class="scroll__h" id="harbor-modal-h">${escapeHtml(title)}</h2>
-        ${bodyHtml}
-        <div class="ov-modal__actions">
-          <button type="button" class="btn-ghost" data-act="cancel">Cancel</button>
-          <button type="button" class="btn-accent" data-act="confirm">${escapeHtml(confirmLabel)}</button>
-        </div>
-      </div>`;
-    bg.addEventListener('click', (e) => { if (e.target === bg) closeModal(); });
-    bg.addEventListener('keydown', (e) => { if (e.key === 'Escape') closeModal(); });
-    bg.querySelector('[data-act=cancel]').addEventListener('click', closeModal);
-    bg.querySelector('[data-act=confirm]').addEventListener('click', () => onConfirm(bg));
-    root.appendChild(bg);
-    const first = bg.querySelector('textarea, input, [data-act=confirm]');
-    if (first) first.focus();
-  }
-
-  // ---- actions -------------------------------------------------------------
-
-  function confirmClose(box) {
-    const who = box.builder.github_login || `#${box.builder.id}`;
-    const verb = box.state === 'parked' ? 'destroy the snapshot of' : 'close';
-    openModal({
-      title: `Close ${who}'s box?`,
-      bodyHtml: `<p>This will ${verb} <strong>${escapeHtml(who)}</strong>'s dev box (state: ${escapeHtml(box.state)}). Any uncommitted work on that box is lost. The box is destroyed; the builder can open a fresh one unless they are also blocked.</p>
-         <p>A fresh box has a <strong>new SSH identity</strong>. If their Claude Desktop later says &ldquo;Host denied&rdquo; or asks for a password, tell them to fully restart Desktop (it re-pins) or press Repair — not to keep rebuilding, which only rotates the identity again.</p>`,
-      confirmLabel: 'Close box',
-      onConfirm: async () => {
-        try {
-          const r = await sendJson('POST', `/boxes/${box.builder.id}/close`, {});
-          toast(r.message || 'Close queued.');
-          closeModal();
-          load();
-        } catch (err) {
-          if (err && err.kind === '401') return;
-          toast(`Could not close: ${err.message || err}`);
-        }
-      },
-    });
-  }
-
-  function confirmBlock(box) {
-    const who = box.builder.github_login || `#${box.builder.id}`;
-    const hasLiveBox = CLOSEABLE.has(box.state);
-    openModal({
-      title: `Bar ${who} from opening boxes?`,
-      bodyHtml:
-        `<p>${escapeHtml(who)} will not be able to open or wake a dev box until you unblock them. A box they already have running is left alone unless you also close it below.</p>
-         <label for="harbor-block-reason">Reason (shown to the builder)</label>
-         <textarea id="harbor-block-reason" rows="2" placeholder="e.g. runaway cost — paused pending review"></textarea>
-         ${hasLiveBox ? `<label class="ov-modal__check"><input type="checkbox" id="harbor-block-close"> Also close the box they have running now (state: ${escapeHtml(box.state)})</label>` : ''}`,
-      confirmLabel: 'Block builder',
-      onConfirm: async (modal) => {
-        const reason = (modal.querySelector('#harbor-block-reason') || {}).value || '';
-        const closeEl = modal.querySelector('#harbor-block-close');
-        try {
-          const r = await sendJson('PATCH', `/boxes/${box.builder.id}/block`, {
-            blocked: true,
-            reason: reason.trim() || undefined,
-            close_current: !!(closeEl && closeEl.checked),
-          });
-          toast(r.close_queued ? 'Builder blocked — running box will be closed.' : 'Builder blocked.');
-          closeModal();
-          load();
-        } catch (err) {
-          if (err && err.kind === '401') return;
-          toast(`Could not block: ${err.message || err}`);
-        }
-      },
-    });
-  }
-
-  function confirmUnblock(box) {
-    const who = box.builder.github_login || `#${box.builder.id}`;
-    openModal({
-      title: `Lift the block on ${who}?`,
-      bodyHtml: `<p>${escapeHtml(who)} will be able to open dev boxes again.</p>`,
-      confirmLabel: 'Unblock',
-      onConfirm: async () => {
-        try {
-          await sendJson('PATCH', `/boxes/${box.builder.id}/block`, { blocked: false });
-          toast('Block lifted.');
-          closeModal();
-          load();
-        } catch (err) {
-          if (err && err.kind === '401') return;
-          toast(`Could not unblock: ${err.message || err}`);
-        }
-      },
-    });
-  }
-
-  // ---- render --------------------------------------------------------------
-
-  // One box, one oversight row (oversight.css .ov-row): who and their rank, the
-  // state pill, then the facts a fleet operator scans for — make, address, how
-  // long it has been up, how long idle, what it has cost — the barred note when
-  // there is one, and the two actions on the right.
-  function renderRow(box, costByBuilder) {
-    const blocked = !!(box.blocked && box.blocked.is);
-    const who = escapeHtml(box.builder.display_name || box.builder.github_login || `#${box.builder.id}`);
-    const login = box.builder.github_login ? `<span class="ov-mono">@${escapeHtml(box.builder.github_login)}</span>` : '';
-    const rank = rankLabel(box.builder.rank);
-    const cost = costByBuilder.get(String(box.builder.id));
-
-    const facts = [statePill(box.state)];
-    if (blocked) facts.push('<span class="fact-pill fact-pill--danger">blocked</span>');
-    if (rank) facts.push(`<span class="fact-chip">${escapeHtml(rank)}</span>`);
-    if (box.region || box.size_slug) {
-      facts.push(`<span class="ov-fact">${escapeHtml([box.region, box.size_slug].filter(Boolean).join(' · '))}</span>`);
-    }
-    if (box.ip && box.state === 'active') facts.push(`<span class="ov-mono">${escapeHtml(box.ip)}</span>`);
-    if (box.state === 'active') {
-      facts.push(`<span class="ov-fact">up <b>${fmtAgo(box.provisioned_at)}</b></span>`);
-      facts.push(`<span class="ov-fact">idle <b>${fmtAgo(box.last_activity_at)}</b>${box.claude_active ? ' · claude live' : ''}</span>`);
-    } else if (box.state === 'parked') {
-      facts.push(`<span class="ov-fact">parked <b>${fmtAgo(box.parked_at)}</b> ago</span>`);
-    } else if (CLOSEABLE.has(box.state) || box.state === 'provisioning') {
-      facts.push(`<span class="ov-fact">in this state <b>${fmtAgo(box.last_activity_at || box.provisioned_at)}</b></span>`);
-    }
-    facts.push(`<span class="ov-fact">cost <b>${cost != null ? fmtUsd(cost) : fmtUsd(box.compute_cost_usd)}</b></span>`);
-
-    const barred = blocked
-      ? `<p class="harbor-barred">Barred from opening boxes${box.blocked.reason ? `: ${escapeHtml(box.blocked.reason)}` : '.'}</p>`
-      : '';
-
-    const closeable = CLOSEABLE.has(box.state);
-    const actions = [];
-    if (closeable) {
-      actions.push(`<button type="button" class="btn-ghost btn-ghost--danger" data-act="close">${box.state === 'parked' ? 'Destroy' : 'Close'}</button>`);
-    }
-    actions.push(blocked
-      ? '<button type="button" class="btn-ghost" data-act="unblock">Unblock</button>'
-      : '<button type="button" class="btn-ghost" data-act="block">Block</button>');
-
-    const el = document.createElement('li');
-    el.className = 'ov-row';
-    el.innerHTML =
-      `<div class="ov-row__main">
-         <span class="ov-row__title">${who}${login}</span>
-         <div class="ov-row__facts">${facts.join('')}</div>
-         ${barred}
-       </div>
-       <div class="ov-row__right"><div class="ov-row__actions">${actions.join('')}</div></div>`;
-
-    const closeBtn = el.querySelector('[data-act=close]');
-    if (closeBtn) closeBtn.addEventListener('click', () => confirmClose(box));
-    const blockBtn = el.querySelector('[data-act=block]');
-    if (blockBtn) blockBtn.addEventListener('click', () => confirmBlock(box));
-    const unblockBtn = el.querySelector('[data-act=unblock]');
-    if (unblockBtn) unblockBtn.addEventListener('click', () => confirmUnblock(box));
-    return el;
-  }
-
-  // The fleet reads in three runs — running, parked or in transition, no box —
-  // so the operator's eye lands on the boxes that cost money first. Within a run
-  // the API's order holds (most recently touched first). An empty run is not
-  // drawn: a head over nothing is a promise the page cannot keep.
-  const GROUPS = [
-    { name: 'Running', test: (b) => b.state === 'active' },
-    { name: 'Parked or in transition', test: (b) => CLOSEABLE.has(b.state) || b.state === 'provisioning' },
-    { name: 'No box', test: () => true },
-  ];
-
-  function renderDock(boxes, costByBuilder) {
-    const dock = document.getElementById('harbor-dock');
-    dock.innerHTML = '';
-    let left = boxes.slice();
-    for (const g of GROUPS) {
-      const mine = left.filter(g.test);
-      left = left.filter((b) => !g.test(b));
-      if (!mine.length) continue;
-      const sec = document.createElement('section');
-      sec.className = 'ov-group';
-      sec.innerHTML = `<div class="ov-group__head"><span class="ov-group__name">${escapeHtml(g.name)}</span><span class="ov-group__n">${fmtInt(mine.length)}</span></div>`;
-      const list = document.createElement('ul');
-      list.className = 'ov-rows';
-      for (const box of mine) list.appendChild(renderRow(box, costByBuilder));
-      sec.appendChild(list);
-      dock.appendChild(sec);
-    }
-  }
-
-  // The glass strip above the panel: the shell's .stat-row, each tile a figure
-  // with the one clause that makes it a fact rather than a number.
-  function renderSummary(boxes, totalUsd) {
-    const afloat = boxes.filter((b) => CLOSEABLE.has(b.state)).length;
-    const active = boxes.filter((b) => b.state === 'active').length;
-    const live = boxes.filter((b) => b.state === 'active' && b.claude_active).length;
-    const blocked = boxes.filter((b) => b.blocked && b.blocked.is).length;
-    const tiles = [
-      ['Boxes live', fmtInt(afloat), `of ${fmtInt(boxes.length)} builder${boxes.length === 1 ? '' : 's'}`],
-      ['Active now', fmtInt(active), `${fmtInt(live)} with claude live`],
-      ['Blocked builders', fmtInt(blocked), blocked ? 'barred from opening a box' : 'nobody barred'],
-      ['Total cost', fmtUsd(totalUsd), 'across every box'],
-    ];
-    document.getElementById('harbor-summary').innerHTML = tiles.map(([label, num, sub]) =>
-      `<div class="stat-tile"><span class="stat-tile__label">${escapeHtml(label)}</span><span class="stat-tile__num">${num}</span><span class="stat-tile__sub">${escapeHtml(sub)}</span></div>`).join('');
-  }
-
-  async function load() {
-    const dock = document.getElementById('harbor-dock');
-    let boxesResp, ledger;
-    try {
-      [boxesResp, ledger] = await Promise.all([
-        fetchJson('/boxes'),
-        fetchJson('/boxes/cost-ledger').catch(() => ({ totals_by_builder: [] })),
-      ]);
-    } catch (err) {
-      if (err && err.kind === '401') return;
-      if (err && err.kind === '403') { showSealed(); return; }
-      dock.innerHTML = emptyStateHtml('Could not load dev boxes just now.');
-      return;
-    }
-
-    const boxes = boxesResp.boxes || [];
-    const costByBuilder = new Map();
-    let totalUsd = 0;
-    for (const row of (ledger.totals_by_builder || [])) {
-      const usd = Number(row.total_usd) || 0;
-      costByBuilder.set(String(row.builder_id), usd);
-      totalUsd += usd;
-    }
-
-    renderSummary(boxes, totalUsd);
-
-    if (boxes.length === 0) {
-      dock.innerHTML = emptyStateHtml('No dev boxes yet. No builder has opened one.');
-      return;
-    }
-    renderDock(boxes, costByBuilder);
-  }
-
-  function showSealed() {
-    document.getElementById('harbor-sealed').hidden = false;
-    document.getElementById('harbor-body').hidden = true;
-    document.getElementById('harbor-sub').textContent = 'Restricted.';
-    // The floor in the pack's own words (ADR 0157: metic), never a rank spelled into the source.
-    const body = document.getElementById('harbor-sealed-body');
-    if (body) body.textContent = `Available from the ${rankLabel('metic')} rank up.`;
-  }
-
-  async function init() {
-    // Confirm the viewer's rank for a friendly restricted notice; the server gates
-    // the page + every endpoint regardless (this is cosmetic defence-in-depth).
-    let me;
-    try {
-      me = await fetchJson('/me');
-    } catch (err) {
-      if (err && err.kind === '401') return;        // redirected to sign-in
-      if (err && err.kind === '403') { showSealed(); return; }
-      me = null;
-    }
-    const rank = (me && (me.builder || me).rank || '').toLowerCase();
-    // ADR 0157: Harbor sits at the `page.view.government` floor (metic), and the fleet
-    // data it reads is `box.fleet.manage` (also metic now). Cosmetic —
-    // requireGovernmentPage + the route gates are the wall; this just picks body vs
-    // sealed notice.
-    if (rank !== 'metic' && rank !== 'archon') { showSealed(); return; }
-
-    document.getElementById('harbor-sub').textContent = 'Each builder’s dev box at a glance.';
-    document.getElementById('harbor-body').hidden = false;
-    await load();
-  }
-
-  init();
-})();

package/modules/hall-ui/public/harbor.states.json

@@ -1,77 +0,0 @@
-{
-  "_": "Harbor — the dev-box dock behind requireGovernmentPage. Its confirm modal is the reason this page needed the shell to grow a --z-modal layer (task 1003307), so the modal is rendered, not assumed. Written with the re-skin (task 1003307) so this page is MEASURED at three widths in both modes rather than looked at once.",
-  "page": "/builders/harbor",
-  "surface": "hall-ui",
-  "stub": {
-    "prefix": "/builders/"
-  },
-  "modeQuery": false,
-  "_feeds": "The kit's own stub carries no feed for this page, so against it the page renders its EMPTY and SKELETON states — which is the point: those are states the floors must hold in. Against the hall-preview harness the same states render populated. Every declared 404 below is a fixture the harness does not carry, named rather than hidden.",
-  "ignoreRequests": [
-    "/api/(gds|bongos)/me$",
-    "/api/(gds|bongos)/me/",
-    "/api/(gds|bongos)/goals",
-    "/api/(gds|bongos)/inbox/",
-    "/api/(gds|bongos)/versions",
-    "/api/(gds|bongos)/boxes",
-    "/api/(gds|bongos)/provisioning"
-  ],
-  "ignoreConsole": [
-    "/api/(gds|bongos)/",
-    "\\b401\\b",
-    "\\b403\\b",
-    "\\b404\\b",
-    "\\b501\\b",
-    "Unauthorized",
-    "Forbidden",
-    "Not Found",
-    "Not Implemented",
-    "load failed"
-  ],
-  "states": {
-    "dock": {
-      "auth": true,
-      "actions": [
-        [
-          "wait",
-          700
-        ]
-      ],
-      "expect": {
-        "visible": [
-          "#harbor-body"
-        ]
-      }
-    },
-    "out": {
-      "auth": false
-    },
-    "block": {
-      "auth": true,
-      "actions": [
-        [
-          "wait",
-          700
-        ],
-        [
-          "clickIfVisible",
-          "[data-act=block]"
-        ],
-        [
-          "wait",
-          250
-        ]
-      ]
-    }
-  },
-  "reducedMotion": {
-    "auth": true,
-    "actions": [
-      [
-        "wait",
-        600
-      ]
-    ]
-  },
-  "_states": "task 1003469: `block` opens the confirm modal on the first row that has a Block action. clickIfVisible, because the kit's own stub carries no /boxes fixture and renders the empty dock — the modal is measured against the harness, where the fixture fleet renders."
-}

package/modules/hall-ui/public/pair.css

@@ -1,23 +0,0 @@
-/* pair.css — what the Dev Box pairing page has and the rest of the panel family
-   does not (task 1003308, goal 1000081; the archetype is panel.css). One panel,
-   one device, one button. The device is a row of the family with the platform
-   glyph as its figure; the approve button is the page's one accent door. */
-
-#pair-scroll { max-width: 640px; }
-
-.pair-device {
-  display: flex;
-  align-items: center;
-  gap: var(--sp-sm);
-  margin: var(--sp-sm) 0 var(--sp-md);
-  padding: var(--sp-sm) 0;
-  border-top: var(--line) solid var(--rule-soft);
-  border-bottom: var(--line) solid var(--rule-soft);
-}
-.pair-device__glyph { width: 40px; font-size: 26px; line-height: 1; text-align: center; color: var(--ink-soft); flex: none; }
-.pair-device__name { font-size: 14.5px; font-weight: 500; color: var(--ink); }
-.pair-device__meta { margin-top: 2px; font-size: 13.5px; color: var(--ink-soft); }
-.pair-code { font-family: var(--font-mono); font-size: 12.5px; letter-spacing: .08em; color: var(--ink); }
-.pair-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-xs); }
-.pair-actions .pair-status { margin: 0; }
-.pair-note { margin: var(--sp-sm) 0 0; max-width: var(--measure); font-size: 13px; color: var(--ink-faint); }

package/modules/hall-ui/public/pair.html

@@ -1,58 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
-  <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>Approve your Dev Box app — {{worldName}}</title>
-  <meta name="description" content="Approve the Dev Box desktop app's request to sign in as you.">
-  <link rel="icon" href="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><text x='16' y='24' font-size='24' text-anchor='middle' font-family='sans-serif'>⌂</text></svg>">
-  <link rel="preconnect" href="https://fonts.googleapis.com">
-  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-  <link rel="stylesheet" href="/builders/style.css?v=2026-07-02-shell1">
-  <!-- The PANEL archetype (task 1003308) before the page's own sheet. -->
-  <link rel="stylesheet" href="/builders/panel.css">
-  <link rel="stylesheet" href="/builders/pair.css">
-</head>
-<body data-page="pair" data-page-title="Device pairing">
-
-<div class="app">
-  <aside class="app-sidebar" id="app-sidebar" aria-label="Primary"></aside>
-  <div class="app-scrim" id="app-scrim" hidden></div>
-  <div class="app-body">
-    <header class="app-topbar" id="app-topbar"></header>
-    <div class="app-content">
-      <!-- The page's ONE h1 (one-header-main-h1), in the family's voice; the
-           sub-line is pair.js's — the request, the approval, or the error. -->
-      <div class="page-head page-head--room page-head--panel">
-        <h1 id="pair-h1" class="page-head__h">pairing</h1>
-        <p class="page-head__sub" id="pair-sub">Reading the request…</p>
-      </div>
-      <main id="hall-main">
-        <section class="scroll" id="pair-scroll" aria-labelledby="pair-h">
-          <h2 id="pair-h" class="scroll__h">A device is asking to act as you</h2>
-          <div id="pair-body">
-            <p class="scroll__lede">Loading…</p>
-          </div>
-          <p class="pair-note">
-            Approve only if you just clicked “Connect” in the Dev Box app on your own
-            machine. Approving signs that app in as you; the request expires on its own
-            if you do nothing.
-          </p>
-        </section>
-      </main>
-      <footer class="app-foot" id="app-foot"></footer>
-    </div>
-  </div>
-</div>
-
-<div id="toast" class="toast" role="status" aria-live="polite" data-visible="0"></div>
-
-<!-- App shell (sidebar/topbar/footer) — dependency-free, loads FIRST. -->
-<script src="/builders/shell.js?v=2026-07-02-shell1"></script>
-<!-- jump palette (Ctrl/Cmd-K). Optional by design: without it the shell's slot stays hidden. -->
-<script src="/builders/palette.js" defer></script>
-<!-- shared frontend toolkit (window.OTB) — loaded before pair.js, which pulls from it. -->
-<script src="/builders/dom-utils.js?v=2026-06-14-domutils"></script>
-<script src="/builders/pair.js?v=2026-06-14-domutils"></script>
-</body>
-</html>

package/modules/hall-ui/public/pair.js

@@ -1,132 +0,0 @@
-// public-builders/pair.js — the Dev Box desktop app's approve page (#904,
-// ADR 0044). The app opened this URL with ?code=<pair_code>; the signed-in
-// builder reviews what asked to connect and clicks ONE button. The server
-// gate (requireBuilderPage in server.js) has already bounced unauthenticated
-// visitors through web sign-in with this URL — code included — as ?return=.
-(() => {
-  'use strict';
-
-  const API = '/api/bongos';
-  // Generated typed client (task 1996 / R09), served as window.BongosClient by
-  // /lib/bongos-client.js. baseUrl:'' passes the full `${API}/...` URLs below
-  // through unchanged; result-mode ({ status, ok, data }) preserves control flow 1:1.
-  const api = window.BongosClient.createClient({ baseUrl: '', credentials: 'same-origin', throwOnError: false });
-
-  // escapeHtml / $ now come from the shared window.OTB toolkit (dom-utils.js,
-  // loaded first). The shared $ accepts an optional root arg — a superset of
-  // this page's prior single-arg form, so call sites are unchanged.
-  const { escapeHtml, $ } = window.OTB;
-
-  function toAuth() {
-    const here = window.location.pathname + window.location.search;
-    window.location.assign(`${API}/auth/web/start?return=${encodeURIComponent(here)}`);
-  }
-
-  const PLATFORM_LABELS = {
-    mac: 'macOS', windows: 'Windows', linux: 'Linux', unknown: 'an unknown platform',
-  };
-  const PLATFORM_GLYPHS = { mac: '⌘', windows: '⊞', linux: '🐧', unknown: '🖥' };
-
-  function renderError(heading, detail) {
-    $('#pair-sub').textContent = heading;
-    $('#pair-body').innerHTML = `
-      <p class="scroll__lede">${escapeHtml(detail)}</p>
-      <p class="pair-status pair-status--err">Return to the Dev Box app and click “Connect” again for a fresh code.</p>
-    `;
-  }
-
-  function renderApproved(login) {
-    $('#pair-sub').textContent = 'Approved.';
-    $('#pair-body').innerHTML = `
-      <p class="scroll__lede">
-        The Dev Box app now acts as <strong>@${escapeHtml(login)}</strong>.
-        Return to the app — it has already noticed. You can close this tab.
-      </p>
-      <p class="pair-status pair-status--ok">✓ Approved</p>
-    `;
-  }
-
-  function renderRequest(info, login) {
-    const plat = PLATFORM_LABELS[info.platform] || PLATFORM_LABELS.unknown;
-    const glyph = PLATFORM_GLYPHS[info.platform] || PLATFORM_GLYPHS.unknown;
-    $('#pair-sub').textContent = 'One click, and the app can act as you.';
-    $('#pair-body').innerHTML = `
-      <p class="scroll__lede">
-        <strong>${escapeHtml(info.device_name)}</strong> on ${escapeHtml(plat)}
-        is asking to sign in as <strong>@${escapeHtml(login)}</strong> —
-        to start and stop your dev box on your behalf.
-      </p>
-      <div class="pair-device">
-        <span class="pair-device__glyph" aria-hidden="true">${glyph}</span>
-        <div>
-          <div class="pair-device__name">${escapeHtml(info.device_name)}</div>
-          <div class="pair-device__meta">${escapeHtml(plat)} · code <span class="pair-code">${escapeHtml(info.pair_code)}</span></div>
-        </div>
-      </div>
-      <div class="pair-actions">
-        <button type="button" class="pair-approve" id="pair-approve-btn">Approve — sign the app in as me</button>
-        <span class="pair-status" id="pair-status" role="status" aria-live="polite"></span>
-      </div>
-    `;
-    $('#pair-approve-btn').addEventListener('click', () => approve(info.pair_code, login));
-  }
-
-  async function approve(code, login) {
-    const btn = $('#pair-approve-btn');
-    const status = $('#pair-status');
-    btn.disabled = true;
-    status.textContent = 'Approving…';
-    try {
-      const res = await api.request('POST', `${API}/auth/app-pair/approve`, { body: { pair_code: code } });
-      if (res.status === 401) return toAuth();
-      if (res.status === 404 || res.status === 410) {
-        return renderError('Request expired.', 'This pairing code is unknown or has expired (codes last ten minutes).');
-      }
-      if (res.status === 409) {
-        return renderError('Already approved.', 'This pairing was already approved once — a code works exactly one time.');
-      }
-      if (!res.ok) throw new Error(`approve failed (${res.status})`);
-      renderApproved(login);
-    } catch (err) {
-      btn.disabled = false;
-      status.textContent = 'Approval failed — try again.';
-      status.className = 'pair-status pair-status--err';
-      console.error('[pair]', err);
-    }
-  }
-
-  async function load() {
-    const code = new URLSearchParams(window.location.search).get('code');
-    if (!code) {
-      return renderError('No code in this link.', 'The link is missing its pairing code.');
-    }
-    let me;
-    try {
-      const meRes = await api.request('GET', `${API}/me`);
-      if (meRes.status === 401) return toAuth();
-      if (!meRes.ok) throw new Error(`/me ${meRes.status}`);
-      me = meRes.data;
-    } catch (err) {
-      console.error('[pair]', err);
-      return renderError('Could not reach the server.', 'Could not verify your identity. Reload to try again.');
-    }
-    try {
-      const res = await api.request('GET', `${API}/auth/app-pair/info?code=${encodeURIComponent(code)}`);
-      if (res.status === 401) return toAuth();
-      if (res.status === 404) {
-        return renderError('Request expired.', 'This pairing code is unknown or has expired (codes last ten minutes).');
-      }
-      if (!res.ok) throw new Error(`info ${res.status}`);
-      const info = res.data;
-      if (info.status !== 'pending') {
-        return renderError('Already approved.', 'This pairing was already approved once — a code works exactly one time.');
-      }
-      renderRequest(info, me.builder.github_login);
-    } catch (err) {
-      console.error('[pair]', err);
-      renderError('Could not reach the server.', 'Could not read the pairing request. Reload to try again.');
-    }
-  }
-
-  load();
-})();