device-center 0.2.0-beta.5 → 0.2.0-beta.6

package/server/drivers/cliClient.mjs

@@ -0,0 +1,87 @@
+import { defaultLinkFile, readLink } from './cloudLink.mjs';
+import { machinePost } from './remote.mjs';
+
+export function cliError(code, message, statusCode = 400) {
+  return Object.assign(new Error(message), { cliCode: code, statusCode });
+}
+export function localClient({ port = 5174, fetchImpl = fetch } = {}) {
+  if (!Number.isInteger(port) || port < 1024 || port > 65535) throw cliError('invalid_arguments', '端口须为 1024–65535。');
+  const origin = `http://127.0.0.1:${port}`;
+  async function request(path, input) {
+    let response;
+    try { response = await fetchImpl(origin + path, { method: input === undefined ? 'GET' : 'POST',
+      headers: { origin, ...(input === undefined ? {} : { 'content-type': 'application/json' }) },
+      ...(input === undefined ? {} : { body: JSON.stringify(input) }), redirect: 'error', signal: AbortSignal.timeout(30_000) }); }
+    catch { throw cliError('local_driver_unavailable', '本机 Driver 未响应。先检查 device-center service status 或启动 device-center start。', 503); }
+    if (!/^application\/json(?:;|$)/i.test(response.headers.get('content-type') ?? '')) throw cliError('invalid_driver_response', '本机端口未返回 Device Center JSON。', 502);
+    const chunks = []; let size = 0;
+    try { for await (const chunk of response.body) { size += chunk.length; if (size > 2_097_152) throw cliError('response_too_large', '本机响应过大。', 502); chunks.push(chunk); } }
+    catch (error) { if (error.cliCode) throw error; throw cliError('local_driver_unavailable', '本机响应中断。', 503); }
+    let data;
+    try { data = JSON.parse(Buffer.concat(chunks).toString('utf8')); } catch { throw cliError('invalid_driver_response', '本机响应格式无效。', 502); }
+    if (!response.ok) throw cliError(/^[a-z_]+$/.test(data?.error ?? '') ? data.error : 'local_request_failed', '本机请求失败。', response.status);
+    return data;
+  }
+  let ready = false;
+  async function local() {
+    if (ready) return;
+    const health = await request('/api/health');
+    if (health?.ok !== true || health.mode !== 'local') throw cliError('local_driver_required', '这个端口不是本机 Driver。', 409);
+    ready = true;
+  }
+  const get = path => async () => { await local(); return request(path); };
+  const post = path => async input => { await local(); return request(path, input); };
+  return { origin, health: get('/api/health'), overview: get('/api/overview'), link: get('/api/driver/link'),
+    setup: get('/api/connector/setup'), connector: get('/api/connector/status'),
+    candidates: get('/api/ssh/initialization'), collect: post('/api/devices/collect'), profile: post('/api/devices/profile'),
+    importSsh: post('/api/ssh/initialize'), checkSsh: post('/api/devices/ssh/check'), removeSsh: post('/api/devices/ssh/remove'),
+    async mcp(method, params) { await local();
+      // MCP has its own Accept contract. No arbitrary URL or JSON-RPC method is exposed.
+      if (!['tools/list', 'tools/call'].includes(method)) throw cliError('invalid_arguments', '不支持的 MCP 方法。');
+      let response;
+      try { response = await fetchImpl(origin + '/mcp', { method: 'POST', headers: { origin, 'content-type': 'application/json', accept: 'application/json, text/event-stream' },
+        body: JSON.stringify({ jsonrpc: '2.0', id: 1, method, params }), redirect: 'error', signal: AbortSignal.timeout(30_000) }); }
+      catch { throw cliError('mcp_unavailable', 'MCP 未响应。', 503); }
+      if (!response.ok) throw cliError('mcp_unavailable', 'MCP 未响应。', response.status);
+      if (!/^application\/json(?:;|$)/i.test(response.headers.get('content-type') ?? '')) throw cliError('invalid_driver_response', 'MCP 响应格式无效。', 502);
+      const chunks = []; let size = 0;
+      try { for await (const chunk of response.body) { size += chunk.length; if (size > 2_097_152) throw cliError('response_too_large', 'MCP 响应过大。', 502); chunks.push(chunk); } }
+      catch (error) { if (error.cliCode) throw error; throw cliError('mcp_unavailable', 'MCP 响应中断。', 503); }
+      let value;
+      try { value = JSON.parse(Buffer.concat(chunks).toString('utf8')); } catch { throw cliError('invalid_driver_response', 'MCP 响应格式无效。', 502); }
+      if (value.error || value.result?.isError) throw cliError('mcp_tool_failed', '工具未完成；检查参数、本机信任与目标日志授权。', 409);
+      return value.result;
+    },
+  };
+}
+
+export function cloudClient({ file = defaultLinkFile(), fetchImpl, read = readLink } = {}) {
+  const state = read(file);
+  if (!state?.driverId || state.disabled) throw cliError('device_binding_required', '先运行 connect 绑定这台管理电脑，再 auth login 单独授权 CLI。', 403);
+  const call = async (action, input = {}) => {
+    try { return await machinePost(state, `cli/${action}`, input, fetchImpl); }
+    catch (error) {
+      if (Number.isInteger(error.statusCode)) throw error;
+      throw cliError('cloud_driver_unavailable', '已绑定的控制面未响应有效数据；检查网络和控制面版本。', 503);
+    }
+  };
+  return { origin: state.origin, fingerprint: state.fingerprint, call,
+    async devices() {
+      const devices = []; let offset = 0, total;
+      for (let page = 0; page < 26; page++) {
+        const result = await call('list', { offset, limit: 10 });
+        if (!Array.isArray(result.devices) || result.devices.length > 10 || !Number.isInteger(result.total) || result.total > 256 ||
+            (result.nextOffset !== null && result.nextOffset !== offset + 10)) throw cliError('invalid_cloud_response', '云端分页响应无效。', 502);
+        total ??= result.total;
+        if (total !== result.total) throw cliError('inventory_changed', '设备清单在分页期间变化，请重新 list。', 409);
+        devices.push(...result.devices);
+        if (result.nextOffset === null) {
+          if (devices.length !== total || new Set(devices.map(d => d.id)).size !== total) throw cliError('inventory_changed', '设备清单在分页期间变化，请重新 list。', 409);
+          return { devices, total };
+        }
+        offset = result.nextOffset;
+      }
+      throw cliError('invalid_cloud_response', '云端分页超出上限。', 502);
+    },
+  };
+}

package/server/drivers/cliManagement.mjs

@@ -0,0 +1,119 @@
+import { randomBytes, randomUUID, createHash } from 'node:crypto';
+import { fail, object } from './driverProtocol.mjs';
+
+export const CLI_SCOPES = Object.freeze(['devices:read', 'devices:profile', 'devices:collect']);
+const hash = value => createHash('sha256').update(value).digest('hex');
+const AGE = 300_000;
+// A bound telemetry identity is not an account management credential. A human owner
+// grants this separate, short-lived capability; every call still proves the device key.
+export function createCliManagement({ db, now = Date.now, account }) {
+  db.exec(`CREATE TABLE IF NOT EXISTS cli_requests (
+    id TEXT PRIMARY KEY, driver_id TEXT NOT NULL, ticket_hash TEXT UNIQUE NOT NULL,
+    created_at INTEGER NOT NULL, expires_at INTEGER NOT NULL, minutes INTEGER NOT NULL,
+    state TEXT NOT NULL DEFAULT 'pending');
+    CREATE TABLE IF NOT EXISTS cli_grants (
+    driver_id TEXT PRIMARY KEY, created_at INTEGER NOT NULL, expires_at INTEGER NOT NULL,
+    revoked_at INTEGER, last_used_at INTEGER)`);
+  const descriptor = row => ({ driverId: row.id, name: row.name, platform: row.platform, fingerprint: row.fingerprint });
+  const status = row => {
+    const grant = db.prepare('SELECT * FROM cli_grants WHERE driver_id=?').get(row.id);
+    return { authorized: Boolean(grant && grant.revoked_at == null && grant.expires_at > now()),
+      scopes: [...CLI_SCOPES], expiresAt: grant?.expires_at ?? null, revokedAt: grant?.revoked_at ?? null,
+      lastUsedAt: grant?.last_used_at ?? null, ...descriptor(row) };
+  };
+  function pending(input, tenantId) {
+    if (typeof input.ticket !== 'string' || !/^[a-f0-9]{64}$/.test(input.ticket)) fail('cli_request_unavailable', 404);
+    const request = db.prepare(`SELECT r.*, d.tenant_id, d.name, d.platform, d.fingerprint, d.revoked_at
+      FROM cli_requests r JOIN cloud_drivers d ON d.id=r.driver_id WHERE r.ticket_hash=?`).get(hash(input.ticket));
+    if (!request || request.tenant_id !== tenantId || request.revoked_at != null || request.expires_at <= now() || request.state !== 'pending') fail('cli_request_unavailable', 404);
+    return request;
+  }
+  return {
+    owner(tenantId) {
+      return {
+        lookup(input) {
+          object(input, ['ticket']); const row = pending(input, tenantId);
+          return { id: row.id, driverId: row.driver_id, name: row.name, platform: row.platform, fingerprint: row.fingerprint,
+            scopes: [...CLI_SCOPES], minutes: row.minutes, expiresAt: row.expires_at };
+        },
+        approve(input) {
+          object(input, ['ticket', 'fingerprint']); const row = pending(input, tenantId);
+          if (input.fingerprint !== row.fingerprint) fail('cli_confirmation_required', 400);
+          const expiresAt = now() + row.minutes * 60_000;
+          db.exec('BEGIN IMMEDIATE');
+          try {
+            db.prepare("UPDATE cli_requests SET state='approved' WHERE id=? AND state='pending'").run(row.id);
+            db.prepare(`INSERT INTO cli_grants VALUES (?,?,?,NULL,NULL) ON CONFLICT(driver_id)
+              DO UPDATE SET created_at=excluded.created_at, expires_at=excluded.expires_at, revoked_at=NULL, last_used_at=NULL`).run(row.driver_id, now(), expiresAt);
+            db.exec('COMMIT');
+          } catch (error) { db.exec('ROLLBACK'); throw error; }
+          return { authorized: true, scopes: [...CLI_SCOPES], expiresAt };
+        },
+        deny(input) {
+          object(input, ['ticket']); const row = pending(input, tenantId);
+          db.prepare("UPDATE cli_requests SET state='denied' WHERE id=?").run(row.id);
+          return { ok: true };
+        },
+        grants() {
+          return { grants: db.prepare(`SELECT d.* FROM cloud_drivers d JOIN cli_grants g ON g.driver_id=d.id
+            WHERE d.tenant_id=? AND d.revoked_at IS NULL ORDER BY g.created_at DESC`).all(tenantId).map(status) };
+        },
+        revoke(input) {
+          object(input, ['driverId']);
+          if (typeof input.driverId !== 'string' || !db.prepare('SELECT 1 FROM cloud_drivers WHERE id=? AND tenant_id=?').get(input.driverId, tenantId)) fail('driver_unknown', 404);
+          db.prepare('UPDATE cli_grants SET revoked_at=COALESCE(revoked_at,?) WHERE driver_id=?').run(now(), input.driverId);
+          db.prepare("UPDATE cli_requests SET state='cancelled' WHERE driver_id=? AND state='pending'").run(input.driverId);
+          return { ok: true };
+        },
+      };
+    },
+    machine(action, row, input) {
+      if (action === 'status') { object(input, []); return status(row); }
+      if (action === 'start') {
+        object(input, ['minutes']); const minutes = input.minutes ?? 480;
+        if (!Number.isInteger(minutes) || minutes < 5 || minutes > 480) fail('invalid_cli_duration');
+        // Only expired protocol handoffs are discarded, never account/device data.
+        db.prepare('DELETE FROM cli_requests WHERE expires_at<=?').run(now());
+        if (db.prepare('SELECT count(*) AS n FROM cli_requests').get().n >= 128 ||
+            db.prepare('SELECT count(*) AS n FROM cli_requests WHERE driver_id=? AND created_at>?').get(row.id, now() - 60_000).n >= 3) fail('cli_rate_limited', 429);
+        db.prepare("UPDATE cli_requests SET state='cancelled' WHERE driver_id=? AND state='pending'").run(row.id);
+        const id = randomUUID(), ticket = randomBytes(32).toString('hex');
+        db.prepare('INSERT INTO cli_requests (id,driver_id,ticket_hash,created_at,expires_at,minutes) VALUES (?,?,?,?,?,?)').run(id, row.id, hash(ticket), now(), now() + AGE, minutes);
+        return { id, ticket, expiresAt: now() + AGE, fingerprint: row.fingerprint, scopes: [...CLI_SCOPES], minutes };
+      }
+      if (action === 'poll' || action === 'cancel') {
+        object(input, ['id']);
+        if (typeof input.id !== 'string') fail('cli_request_unavailable', 404);
+        const request = db.prepare('SELECT * FROM cli_requests WHERE id=? AND driver_id=?').get(input.id, row.id);
+        if (!request || request.expires_at <= now()) fail('cli_request_expired', 410);
+        if (action === 'cancel') db.prepare("UPDATE cli_requests SET state='cancelled' WHERE id=? AND state='pending'").run(request.id);
+        return { state: action === 'cancel' && request.state === 'pending' ? 'cancelled' : request.state, ...status(row) };
+      }
+      if (action === 'logout') {
+        object(input, []);
+        db.prepare('UPDATE cli_grants SET revoked_at=COALESCE(revoked_at,?) WHERE driver_id=?').run(now(), row.id);
+        db.prepare("UPDATE cli_requests SET state='cancelled' WHERE driver_id=? AND state='pending'").run(row.id);
+        return { authorized: false, deviceBindingRetained: true };
+      }
+      if (!status(row).authorized) fail('cli_authorization_required', 403);
+      const owner = account(row.tenant_id);
+      let result;
+      if (action === 'list') {
+        object(input, ['offset', 'limit']); const offset = input.offset ?? 0, limit = input.limit ?? 10;
+        if (!Number.isSafeInteger(offset) || offset < 0 || offset > 256 || !Number.isInteger(limit) || limit < 1 || limit > 10) fail('invalid_cli_page');
+        const devices = owner.devices();
+        result = { devices: devices.slice(offset, offset + limit), total: devices.length, nextOffset: offset + limit < devices.length ? offset + limit : null };
+      } else if (action === 'show') {
+        object(input, ['deviceId']);
+        if (typeof input.deviceId !== 'string') fail('invalid_device_id');
+        const device = owner.devices().find(d => d.id === input.deviceId);
+        if (!device) fail('device_not_found', 404);
+        result = { device };
+      } else if (action === 'profile') result = owner.saveProfile(input);
+      else if (action === 'collect') result = owner.collect(input);
+      else fail('cli_action_unavailable', 404);
+      db.prepare('UPDATE cli_grants SET last_used_at=? WHERE driver_id=?').run(now(), row.id);
+      return result;
+    },
+  };
+}

package/server/drivers/cloudRegistry.mjs

@@ -3,6 +3,7 @@ import { fail, object, text, publicIdentity, verifyRequest, normalizeReport } fr
 import { validateCertificate } from './certificates.mjs';
 import { createRelay } from './relay.mjs';
 import { createDeviceProfiles } from './deviceProfiles.mjs';
+import { createCliManagement } from './cliManagement.mjs';
 
 const PAIR_AGE = 5 * 60_000;
 export function createCloudRegistry({ db, origin, now = Date.now, multiUser = false, legacyOwnerMapped = !multiUser }) {
@@ -197,10 +198,14 @@ export function createCloudRegistry({ db, origin, now = Date.now, multiUser = fa
       });
     },
   };
+  const management = createCliManagement({ db, now, account: tenantId => ({
+    devices: () => registry.devices(tenantId), saveProfile: input => registry.saveProfile(input, tenantId), collect: input => registry.collect(input, tenantId),
+  }) });
   return {
     start: registry.start, poll: registry.poll, report: registry.report, disconnect: registry.disconnect,
     machine(action, input) {
       const row = driver(input, `/api/driver/${action}`);
+      if (action.startsWith('cli/')) return management.machine(action.slice(4), row, input.payload);
       if (action === 'control') {
         object(input.payload, []);
         if (row.control_seen_at != null && now() - row.control_seen_at < 3000) fail('driver_control_too_frequent', 429);
@@ -220,6 +225,7 @@ export function createCloudRegistry({ db, origin, now = Date.now, multiUser = fa
         lookup: input => registry.lookup(input, tenantId), approve: input => registry.approve(input, tenantId),
         revoke: input => registry.revoke(input, tenantId), bindings: () => registry.bindings(tenantId), devices: () => registry.devices(tenantId), relayUsage: () => relay.usage(tenantId),
         saveProfile: input => registry.saveProfile(input, tenantId), collect: input => registry.collect(input, tenantId),
+        cli: management.owner(tenantId),
       };
     },
   };

package/server/index.mjs

@@ -53,7 +53,7 @@ async function serveStatic(pathname, response) {
   if (pathname === '/' || pathname === '/index.html') filePath = resolve(PROJECT_ROOT, 'index.html');
   else if (pathname === '/favicon.svg') filePath = resolve(PROJECT_ROOT, 'favicon.svg');
   else if (pathname === '/login') filePath = resolve(PROJECT_ROOT, 'login.html');
-  else if (pathname === '/pair') filePath = resolve(PROJECT_ROOT, 'login.html');
+  else if (pathname === '/pair' || pathname === '/cli') filePath = resolve(PROJECT_ROOT, 'login.html');
   else if (pathname === '/start' || pathname === '/start.html') filePath = resolve(PROJECT_ROOT, 'start.html');
   else if (pathname.startsWith('/src/')) {
     filePath = resolve(PROJECT_ROOT, `.${pathname}`);
@@ -96,6 +96,7 @@ export function createDeviceCenterServer({ dbPath = './data/device-center.sqlite
       // Public liveness and deployed version only; no account, device or configuration data.
       if (path === '/api/health' && request.method === 'GET') return sendJson(response, 200, health);
       if (['/pair', '/src/pair.js', '/src/pair.css', '/src/pairing-handoff.js', '/src/api.js'].includes(path) && request.method === 'GET') return await serveStatic(path, response);
+      if (['/cli', '/src/cli-approval.js', '/src/cli-handoff.js'].includes(path) && request.method === 'GET') return await serveStatic(path, response);
       // Public static installation reference only. No identity, configuration or owner API.
       if (['/start', '/start.html', '/favicon.svg', '/src/start.js', '/src/start.css', '/src/onboarding.js', '/src/i18n.js', '/src/i18n.css', '/src/messages.js', '/src/install-prompt.js', '/src/install-walkthrough.js'].includes(path) && request.method === 'GET') return await serveStatic(path, response);
       if (Object.hasOwn(PUBLIC_GUIDES, path) && request.method === 'GET') {
@@ -107,7 +108,8 @@ export function createDeviceCenterServer({ dbPath = './data/device-center.sqlite
       if (cloud) {
         const machineActions = { '/api/driver/pair/start': 'start', '/api/driver/pair/poll': 'poll', '/api/driver/report': 'report', '/api/driver/disconnect': 'disconnect' };
         if (Object.hasOwn(machineActions, path) && request.method === 'POST') return sendJson(response, 200, registry[machineActions[path]](await readJson(request)));
-        if (['control','certificate','peers','relay/open','relay/accept','relay/exchange','relay/close'].some(action => path === `/api/driver/${action}`) && request.method === 'POST') return sendJson(response, 200, registry.machine(path.slice('/api/driver/'.length), await readJson(request)));
+        if (['control','certificate','peers','relay/open','relay/accept','relay/exchange','relay/close',
+          'cli/start','cli/poll','cli/cancel','cli/status','cli/logout','cli/list','cli/show','cli/profile','cli/collect'].some(action => path === `/api/driver/${action}`) && request.method === 'POST') return sendJson(response, 200, registry.machine(path.slice('/api/driver/'.length), await readJson(request)));
         if (['/login', '/src/login.js', '/src/login-flow.js', '/src/login.css'].includes(path) && request.method === 'GET') return await serveStatic(path, response);
         if (path === '/api/auth/options' && request.method === 'GET') return sendJson(response, 200, cloudAccess.options(request));
         if (path === '/api/auth/continue' && request.method === 'POST') {
@@ -144,6 +146,12 @@ export function createDeviceCenterServer({ dbPath = './data/device-center.sqlite
         accountRegistry = registry.forTenant(principal.tenantId);
         if (path === '/api/auth/session' && request.method === 'GET') return sendJson(response, 200, { authenticated: true });
         if (path === '/api/drivers' && request.method === 'GET') return sendJson(response, 200, { drivers: accountRegistry.bindings() });
+        if (path === '/api/cli/grants' && request.method === 'GET') return sendJson(response, 200, accountRegistry.cli.grants());
+        const cliOwnerActions = { '/api/cli/lookup': 'lookup', '/api/cli/approve': 'approve', '/api/cli/deny': 'deny', '/api/cli/revoke': 'revoke' };
+        if (Object.hasOwn(cliOwnerActions, path) && request.method === 'POST') {
+          if (request.headers.origin !== origin) return sendJson(response, 403, { error: 'same_origin_required' });
+          return sendJson(response, 200, accountRegistry.cli[cliOwnerActions[path]](await readJson(request)));
+        }
         const ownerActions = { '/api/devices/profile': 'saveProfile', '/api/devices/collect': 'collect', '/api/drivers/pairing/lookup': 'lookup', '/api/drivers/pairing/approve': 'approve', '/api/drivers/revoke': 'revoke' };
         if (Object.hasOwn(ownerActions, path) && request.method === 'POST') {
           if (request.headers.origin !== origin) return sendJson(response, 403, { error: 'same_origin_required' });

package/src/cli-approval.js

@@ -0,0 +1,49 @@
+import { captureCli, clearCli } from './cli-handoff.js';
+import { initLanguage, getLocale, h } from './i18n.js';
+const escape = value => String(value).replace(/[&<>"']/g, c => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' })[c]);
+let handoff = captureCli(), request, phase = handoff ? 'loading' : 'missing', timer;
+document.querySelector('link[href="/src/login.css"]').href = '/src/pair.css';
+document.body.innerHTML = `<header><a class="brand" href="/start" data-language-link><img src="/favicon.svg" alt="" width="26" height="26">Device Center</a><div class="language-picker" data-language-picker></div></header><main id="cli-root" aria-live="polite"></main><footer data-i18n="cli.boundary"></footer>`;
+document.querySelector('title').dataset.i18n = 'cli.title';
+const root = document.querySelector('#cli-root');
+async function api(path, input) {
+  const response = await fetch(path, { method: input === undefined ? 'GET' : 'POST', headers: input === undefined ? {} : { 'content-type': 'application/json' },
+    ...(input === undefined ? {} : { body: JSON.stringify(input) }), cache: 'no-store', redirect: 'error', signal: AbortSignal.timeout(12_000) });
+  if (response.status === 401) { location.replace(`/login?lang=${getLocale()}&continue=cli`); throw new Error('authentication_required'); }
+  if (!response.ok) throw new Error('request_failed');
+  return response.json();
+}
+function render() {
+  root.setAttribute('aria-busy', String(phase === 'loading' || phase === 'saving'));
+  let body = '';
+  if (phase === 'ready') body = `<p>${h('cli.intro')}</p><div class="device"><strong>${escape(request.name)}</strong><p>${escape(request.platform)} · ${h('cli.duration', { minutes: request.minutes })}</p></div><p>${h('pair.fingerprint')}</p><code class="fingerprint">${escape(request.fingerprint)}</code><ul><li>${h('cli.read')}</li><li>${h('cli.profile')}</li><li>${h('cli.collect')}</li></ul><p>${h('cli.boundary')}</p><button id="approve">${h('cli.approve')}</button><button id="deny" class="secondary">${h('pair.cancel')}</button>`;
+  else if (phase === 'done') body = `<div class="status-mark" aria-hidden="true">✓</div><p>${h('cli.done')}</p><p>${h('pair.noReply')}</p><a class="primary" href="/cli?lang=${getLocale()}">${h('cli.manage')}</a>`;
+  else if (phase === 'manage') body = `<p>${h('cli.manageBody')}</p>${request.grants.map(grant => `<div class="device"><strong>${escape(grant.name)}</strong><p>${escape(new Date(grant.expiresAt).toLocaleString(getLocale()))} · ${h(grant.authorized ? 'cli.active' : 'cli.inactive')}</p><code class="fingerprint">${escape(grant.fingerprint)}</code>${grant.authorized ? `<button data-revoke="${escape(grant.driverId)}" class="secondary">${h('cli.revoke')}</button>` : ''}</div>`).join('') || `<p>${h('cli.empty')}</p>`}`;
+  else body = `<p>${h(['loading', 'saving'].includes(phase) ? 'pair.wait' : phase === 'cancelled' ? 'pair.cancelledBody' : 'cli.missing')}</p>`;
+  root.innerHTML = `<p class="eyebrow">DEVICE CENTER / CLI</p><h1>${h(phase === 'manage' ? 'cli.manage' : 'cli.title')}</h1>${body}<p><a href="/?lang=${getLocale()}">${h('pair.dashboard')}</a></p>`;
+}
+root.addEventListener('click', async event => {
+  const action = event.target.id, revoke = event.target.dataset.revoke;
+  if (revoke && phase === 'manage') {
+    phase = 'saving'; render();
+    try { await api('/api/cli/revoke', { driverId: revoke }); request = await api('/api/cli/grants'); phase = 'manage'; }
+    catch (error) { if (error.message === 'authentication_required') return; phase = 'missing'; }
+    render(); return;
+  }
+  if (!['approve', 'deny'].includes(action) || phase !== 'ready' || !handoff) return;
+  phase = 'saving'; render();
+  try {
+    await api(action === 'approve' ? '/api/cli/approve' : '/api/cli/deny', { ticket: handoff.ticket, ...(action === 'approve' ? { fingerprint: request.fingerprint } : {}) });
+    phase = action === 'approve' ? 'done' : 'cancelled';
+  } catch (error) { if (error.message === 'authentication_required') return; phase = 'missing'; }
+  clearTimeout(timer); clearCli(); handoff = null; render();
+});
+initLanguage({ onChange: render }); render();
+try {
+  if (handoff) {
+    request = await api('/api/cli/lookup', { ticket: handoff.ticket }); phase = 'ready';
+    timer = setTimeout(() => { if (phase === 'ready') { clearCli(); handoff = null; phase = 'missing'; render(); } }, Math.max(0, request.expiresAt - Date.now()));
+  } else { request = await api('/api/cli/grants'); phase = 'manage'; }
+  render();
+} catch (error) { if (error.message !== 'authentication_required') { clearCli(); handoff = null; phase = 'missing'; render(); } }
+window.addEventListener('pagehide', () => clearTimeout(timer));

package/src/cli-handoff.js

@@ -0,0 +1,19 @@
+const KEY = 'device-center-cli-v1';
+const safeStorage = () => { try { return window.sessionStorage; } catch { return null; } };
+const valid = (value, now) => value && /^[a-f0-9]{64}$/.test(value.ticket ?? '') && Number.isSafeInteger(value.expiresAt) && value.expiresAt > now && value.expiresAt <= now + 330_000;
+export function pendingCli({ storage = safeStorage(), now = Date.now() } = {}) {
+  try { const value = JSON.parse(storage.getItem(KEY)); if (valid(value, now)) return value; storage.removeItem(KEY); } catch { /* no credentials in errors */ }
+  return null;
+}
+export function clearCli({ storage = safeStorage() } = {}) { try { storage.removeItem(KEY); } catch { /* memory remains with caller */ } }
+export function captureCli({ location = window.location, history = window.history, storage = safeStorage(), now = Date.now() } = {}) {
+  if (!location.hash) return pendingCli({ storage, now });
+  const fragment = new URLSearchParams(location.hash.slice(1));
+  history.replaceState(null, '', location.pathname + location.search); clearCli({ storage });
+  if ([...fragment.keys()].sort().join(',') !== 'expires,ticket') return null;
+  const value = { ticket: fragment.get('ticket'), expiresAt: Number(fragment.get('expires')) };
+  if (!valid(value, now)) return null;
+  try { storage.removeItem('device-center-pairing-v1'); } catch { /* handoffs stay in memory */ }
+  try { storage.setItem(KEY, JSON.stringify(value)); } catch { /* signed-in use remains in memory */ }
+  return value;
+}

package/src/login.js

@@ -3,6 +3,8 @@ import { loginDestination } from './pairing-handoff.js';
 import { continueSession, rememberLoginNavigation, pendingLoginNavigation } from './login-flow.js';
 if (location.pathname === '/pair') {
   await import('./pair.js');
+} else if (location.pathname === '/cli') {
+  await import('./cli-approval.js');
 } else {
 initLanguage();
 function setMessage(element, key) { if (key) element.dataset.i18n = key; else delete element.dataset.i18n; element.textContent = key ? t(key) : ''; }

package/src/main.js

@@ -217,7 +217,7 @@ function recentMcpInitialize() {
 }
 function renderSidebar() {
   const projects = state.overview?.projects ?? [];
-  if (cloudMode()) return `<aside class="sidebar"><a class="brand" href="/?lang=${getLocale()}" aria-label="${h("panel.183")}"><span class="brand-mark">${icon('cloud')}</span><span><strong>Device Center</strong><small>${h("panel.184")}</small></span></a><div class="nav-caption">${h("panel.185")}</div><nav aria-label="${h("panel.186")}"><button class="nav-item active" data-action="project" data-project="all">${icon('device')}<span>${h("panel.187")}</span><small>${state.overview?.devices.length ?? 0}</small></button><button class="nav-item" data-action="secure-help">${icon('link')}<span>${h("panel.188")}</span></button></nav><div class="nav-caption">${h("panel.189")}</div><nav class="project-navigation" aria-label="${h("panel.190")}"><p class="nav-empty">${h("panel.191")}</p></nav><div class="sidebar-footer"><span class="local-dot"></span> ${h("panel.192")}<button class="text-button" data-action="logout">${h("panel.193")}</button></div></aside>`;
+  if (cloudMode()) return `<aside class="sidebar"><a class="brand" href="/?lang=${getLocale()}" aria-label="${h("panel.183")}"><span class="brand-mark">${icon('cloud')}</span><span><strong>Device Center</strong><small>${h("panel.184")}</small></span></a><div class="nav-caption">${h("panel.185")}</div><nav aria-label="${h("panel.186")}"><button class="nav-item active" data-action="project" data-project="all">${icon('device')}<span>${h("panel.187")}</span><small>${state.overview?.devices.length ?? 0}</small></button><button class="nav-item" data-action="secure-help">${icon('link')}<span>${h("panel.188")}</span></button><a class="nav-item" href="/cli?lang=${getLocale()}">${icon('link')}<span>${h("cli.manage")}</span></a></nav><div class="nav-caption">${h("panel.189")}</div><nav class="project-navigation" aria-label="${h("panel.190")}"><p class="nav-empty">${h("panel.191")}</p></nav><div class="sidebar-footer"><span class="local-dot"></span> ${h("panel.192")}<button class="text-button" data-action="logout">${h("panel.193")}</button></div></aside>`;
   return `<aside class="sidebar"><a class="brand" href="/?lang=${getLocale()}" aria-label="${h("panel.183")}"><span class="brand-mark">${icon('cloud')}</span><span><strong>Device Center</strong><small>${h("panel.194")}</small></span></a><div class="nav-caption">${h("panel.185")}</div><nav aria-label="${h("panel.186")}"><button class="nav-item ${state.project === 'all' ? 'active' : ''}" data-action="project" data-project="all">${icon('device')}<span>${h("panel.187")}</span><small>${state.overview?.devices.length ?? 0}</small></button><button class="nav-item" data-action="connect">${icon('link')}<span>${h("panel.195")}</span></button><button class="nav-item" data-action="secure-help">${icon('link')}<span>${h("panel.188")}</span></button><button class="nav-item" data-action="cloud-connect">${icon('cloud')}<span>${h("panel.196")}</span></button></nav><div class="nav-caption">${h("panel.189")}</div><nav class="project-navigation" aria-label="${h("panel.190")}">${projects.length ? projects.map((p) => `<button class="nav-item ${state.project === p.id ? 'active' : ''}" data-action="project" data-project="${escapeHtml(p.id)}">${icon('folder')}<span>${escapeHtml(p.name)}</span></button>`).join('') : `<p class="nav-empty">${h("panel.191")}</p>`}</nav><div class="sidebar-footer"><span class="local-dot"></span> ${h("panel.197")}<button class="text-button" data-action="resident">${h("panel.198")}</button></div></aside>`;
 }
 function renderConnection() {