@linxin666/dsh-remote-web-ui 0.1.10 → 0.1.12

package/src/client/UpdateEntry.tsx

@@ -0,0 +1,96 @@
+/**
+ * The sidebar update seat: the download trigger beside the remote-control
+ * trigger plus the update panel modal. Owns the flow — probe the registry
+ * on open, auto-run the update when a newer release exists, report the
+ * outcome (restart hint on success, translated failure on error).
+ * Component-local state per the client stack rules.
+ */
+import { useCallback, useEffect, useRef, useState } from "react"
+import { createPortal } from "react-dom"
+import type { TranslateNS } from '@deepseek-ai/dsh-client-ui-slots'
+import { IconDownloadOutline16 } from '@deepseek-ai/dsh-client-ui-primitives'
+import type { UpdateStatus } from '../update.ts'
+import { fetchUpdateStatus, runUpdate } from "./update-api.ts"
+import { UpdatePanel, type UpdateView } from "./UpdatePanel.tsx"
+import css from "./remote.module.css"
+
+/** Entry props: the sidebar column state + the standard locale seat. */
+export interface UpdateEntryProps {
+  /** Whether the sidebar renders wide content (false = 56px rail). */
+  wide: boolean
+  t: TranslateNS<'remote'>
+}
+
+/**
+ * Render the update trigger and panel.
+ * @param props - column state and locale seat.
+ * @returns the entry element tree.
+ */
+export function UpdateEntry({ wide, t }: UpdateEntryProps) {
+  const [open, setOpen] = useState(false)
+  const [view, setView] = useState<UpdateView>({ kind: "checking" })
+  const runToken = useRef(0)
+
+  const check = useCallback(async (): Promise<void> => {
+    setView({ kind: "checking" })
+    let status: UpdateStatus
+    try {
+      status = await fetchUpdateStatus()
+    } catch {
+      setView({ kind: "error", message: t("update.offline"), detail: t("update.offlineDetail") })
+      return
+    }
+    if (status.error === "registry-unreachable") {
+      setView({ kind: "result", status })
+      return
+    }
+    setView({ kind: "result", status })
+    // Auto-update: an npm install with a newer release proceeds without a
+    // second confirmation — clicking the update trigger is the intent.
+    if (status.mode !== "npm" || !status.outdated) return
+    setView({ kind: "updating", status })
+    const token = ++runToken.current
+    try {
+      const result = await runUpdate()
+      if (token !== runToken.current) return
+      setView({ kind: "done", result })
+    } catch {
+      if (token !== runToken.current) return
+      setView({ kind: "error", message: t("update.error"), detail: t("update.offlineDetail") })
+    }
+  }, [t])
+
+  const openPanel = useCallback((): void => {
+    setOpen(true)
+    void check()
+  }, [check])
+
+  const closePanel = useCallback((): void => {
+    runToken.current++
+    setOpen(false)
+  }, [])
+
+  // Unmount safety: an in-flight update must not land on a dead component.
+  useEffect(() => () => { runToken.current++ }, [])
+
+  return (
+    <>
+      <button
+        type="button"
+        className={css.trigger}
+        data-wide={wide ? undefined : "rail"}
+        aria-label={t("update.label")}
+        title={t("update.label")}
+        onClick={openPanel}
+      >
+        <IconDownloadOutline16 size={wide ? 16 : 18} />
+      </button>
+      {open && createPortal((
+        <div className={css.overlay} role="presentation">
+          <div className={css.mask} aria-hidden="true" onClick={closePanel} />
+          <UpdatePanel t={t} view={view} onClose={closePanel} onRecheck={() => { void check() }} />
+        </div>
+      ), document.body)}
+    </>
+  )
+}

package/src/client/UpdatePanel.tsx

@@ -0,0 +1,203 @@
+/**
+ * The update panel body: check progress, version comparison, the
+ * auto-update in-flight state, and the outcome (restart hint on success,
+ * translated failure on error). Pure presentation — all state arrives
+ * through props from the entry behavior component.
+ */
+import type { TranslateNS } from '@deepseek-ai/dsh-client-ui-slots'
+import { IconCloseOutline16, IconRefreshOutline16 } from '@deepseek-ai/dsh-client-ui-primitives'
+import type { UpdateRunResult, UpdateStatus } from '../update.ts'
+import css from "./remote.module.css"
+
+/** The panel view state, owned by the entry component. */
+export type UpdateView =
+  | { kind: 'checking' }
+  | { kind: 'result'; status: UpdateStatus }
+  | { kind: 'updating'; status: UpdateStatus }
+  | { kind: 'done'; result: UpdateRunResult }
+  | { kind: 'error'; message: string; detail?: string }
+
+/** Full panel props: copy + view state + actions. */
+export interface UpdatePanelProps {
+  t: TranslateNS<'remote'>
+  view: UpdateView
+  onClose(): void
+  /** Re-run the check from a terminal state. */
+  onRecheck(): void
+}
+
+/** The anchor package name (aggregate first) for copy purposes. */
+function anchorName(status: UpdateStatus | undefined): string | undefined {
+  return status?.anchor ?? status?.packages[0]?.name
+}
+
+/** The latest npm release of the anchor, for reference copy. */
+function anchorLatest(status: UpdateStatus | undefined): string | undefined {
+  return status?.packages[0]?.latest
+}
+
+/**
+ * Render the update panel.
+ * @param props - copy, view state, and actions.
+ * @returns the panel element tree.
+ */
+export function UpdatePanel({ t, view, onClose, onRecheck }: UpdatePanelProps) {
+  const status = view.kind === "result" || view.kind === "updating" ? view.status : undefined
+  const title = view.kind === "done" && view.result.ok ? t("update.done") : t("update.title")
+  const subtitle = subtitleOf(t, view)
+  return (
+    <div className={css.panel} role="dialog" aria-modal="true" aria-label={title}>
+      <div className={css.header}>
+        <div className={css.heading}>
+          <h2 className={css.title}>{title}</h2>
+          {subtitle !== undefined && <p className={css.subtitle}>{subtitle}</p>}
+        </div>
+        <button type="button" className={css.close} aria-label={t("update.close")} onClick={onClose}>
+          <IconCloseOutline16 />
+        </button>
+      </div>
+      {view.kind === "checking" && <p className={css.updateStatus}>{t("update.checking")}</p>}
+      {view.kind === "result" && status !== undefined && <ResultBody t={t} status={status} />}
+      {view.kind === "updating" && status !== undefined && (
+        <div>
+          <p className={css.updateStatus}>
+            {t("update.updating", { name: anchorName(status) ?? "", version: anchorLatest(status) ?? "" })}
+          </p>
+          <PackageList status={status} />
+        </div>
+      )}
+      {view.kind === "done" && <DoneBody t={t} result={view.result} />}
+      {view.kind === "error" && (
+        <div>
+          <p className={css.updateError}>{view.message}</p>
+          {view.detail !== undefined && <pre className={css.updateOutput}>{view.detail}</pre>}
+        </div>
+      )}
+      {(view.kind === "done" || view.kind === "error") && (
+        <div className={css.updateActions}>
+          <button type="button" className={css.updateRetry} onClick={onRecheck}>
+            <IconRefreshOutline16 /> {t("update.retry")}
+          </button>
+        </div>
+      )}
+    </div>
+  )
+}
+
+/** The subtitle copy per view state (absent on plain results). */
+function subtitleOf(t: TranslateNS<"remote">, view: UpdateView): string | undefined {
+  switch (view.kind) {
+    case "checking":
+      return t("update.checking")
+    case "updating":
+      return t("update.updatingTitle")
+    case "result":
+      return undefined
+    case "done":
+      return view.result.ok ? t("update.doneDetail") : t("update.error")
+    case "error":
+      // The error body below carries the message; no subtitle duplication.
+      return undefined
+  }
+}
+
+/** The checked result body: mode banner + version list. */
+function ResultBody({ t, status }: { t: TranslateNS<"remote">; status: UpdateStatus }) {
+  const anchor = anchorName(status)
+  const latest = anchorLatest(status)
+  if (status.mode === "link") {
+    return (
+      <div>
+        <p className={css.updateStatus}>{t("update.linkMode")}</p>
+        <p className={css.updateDetail}>{t("update.linkModeDetail", { version: latest ?? "-" })}</p>
+      </div>
+    )
+  }
+  if (status.mode === "missing") {
+    return (
+      <div>
+        <p className={css.updateStatus}>{t("update.missing")}</p>
+        <p className={css.updateDetail}>{t("update.missingDetail")}</p>
+      </div>
+    )
+  }
+  if (status.error === "registry-unreachable") {
+    return (
+      <div>
+        <p className={css.updateStatus}>{t("update.offline")}</p>
+        <p className={css.updateDetail}>{t("update.offlineDetail")}</p>
+      </div>
+    )
+  }
+  if (status.outdated) {
+    return (
+      <div>
+        <p className={css.updateStatus}>{t("update.found")}</p>
+        <p className={css.updateDetail}>
+          {anchor !== undefined ? t("update.foundDetail", { name: anchor, version: latest ?? "" }) : ""}
+        </p>
+      </div>
+    )
+  }
+  return (
+    <div>
+      <p className={css.updateStatus}>{t("update.upToDate")}</p>
+      {anchor !== undefined && latest !== undefined && (
+        <p className={css.updateDetail}>{t("update.upToDateDetail", { name: anchor, version: latest })}</p>
+      )}
+      <PackageList status={status} />
+    </div>
+  )
+}
+
+/** The per-package current → latest comparison list. */
+function PackageList({ status }: { status: UpdateStatus }) {
+  if (status.packages.length === 0) return null
+  return (
+    <ul className={css.updateList}>
+      {status.packages.map(packageStatus => (
+        <li key={packageStatus.name} className={css.updateListItem}>
+          <span className={css.updateListName}>{packageStatus.name}</span>
+          <span className={css.updateListVersions}>
+            {packageStatus.current}
+            {packageStatus.latest !== undefined && packageStatus.latest !== packageStatus.current && (
+              <> → {packageStatus.latest}</>
+            )}
+          </span>
+        </li>
+      ))}
+    </ul>
+  )
+}
+
+/** The outcome body: success + restart hint, or the translated failure. */
+function DoneBody({ t, result }: { t: TranslateNS<"remote">; result: UpdateRunResult }) {
+  if (result.ok) {
+    // The title already reads "Update complete"; the body carries the details.
+    return (
+      <div>
+        <p className={css.updateDetail}>{t("update.doneDetail")}</p>
+        <p className={css.updateDetail}>{t("update.restartHint")}</p>
+      </div>
+    )
+  }
+  const message = errorMessageOf(t, result)
+  return (
+    <div>
+      <p className={css.updateError}>{message}</p>
+      {result.output.trim() !== "" && <pre className={css.updateOutput}>{result.output.trim()}</pre>}
+    </div>
+  )
+}
+
+/** Translate a structured failure code; fall back to the raw message. */
+function errorMessageOf(t: TranslateNS<"remote">, result: UpdateRunResult): string {
+  switch (result.errorCode) {
+    case "pnpm-missing": return t("update.error.pnpmMissing")
+    case "timeout": return t("update.error.timeout")
+    case "not-found": return t("update.error.notFound")
+    case "link": return t("update.error.link")
+    case "pnpm-failed": return t("update.error.pnpmFailed", { code: String(result.exitCode ?? "?") })
+    default: return result.error ?? t("update.error.unknown")
+  }
+}

package/src/client/index.ts

@@ -8,7 +8,7 @@
  */
 import { createElement } from 'react'
 import { createRoot } from 'react-dom/client'
-import type { ClientContext } from '@deepseek-ai/dsh-client-runtime/client'
+import type { ClientContext, SettingsScope, SettingsScopeSpec } from '@deepseek-ai/dsh-client-runtime/client'
 // Type-only: pulls the locale plugin's Context merge (ctx.locale) and the
 // ui-sidebar SlotMap merge (the 'sidebar.remote' hole).
 import type {} from '@deepseek-ai/dsh-client-locale/client'
@@ -30,6 +30,8 @@ export type { PanelState, RemotePanelProps } from './RemotePanel.tsx'
 export type { PairFailedNoticeProps } from './PairFailedNotice.tsx'
 export type { RemoteKey } from './locales.ts'
 export type { RemoteSettingsCardFace, RemoteSettingsCardState } from './RemoteSettingsCard.tsx'
+export type { UpdateEntryProps } from './UpdateEntry.tsx'
+export type { UpdatePanelProps, UpdateView } from './UpdatePanel.tsx'
 
 declare module '@deepseek-ai/dsh-client-ui-slots' {
   interface LocaleNamespaceMap {
@@ -66,6 +68,18 @@ export interface SettingsPluginItemOwnerProps {
   children?: never
 }
 
+declare module '@deepseek-ai/cordis' {
+  interface Context {
+    /**
+     * Optional rc.6 compatibility binder provided by dsh-web-ui-settings;
+     * absent when that group plugin is not installed, so callers fall back to
+     * the official settings scope.
+     */
+    webUiSettings?: { bind<S>(spec: SettingsScopeSpec<S>): SettingsScope<S> }
+  }
+}
+
+
 /** Dictionary namespace owned by this plugin. */
 const NS = 'remote'
 
@@ -86,7 +100,8 @@ export function apply(ctx: ClientContext): void {
   ctx.effect(() => ctx.locale.register(NS, { zh, en }), 'remote-web-ui: dictionaries')
 
   const t = ctx.locale.bind(NS)
-  const settingsScope = ctx.settingsScope.bind<RemoteSettings>({ namespace: REMOTE_WEB_UI_NS })
+  const binder = ctx.get('webUiSettings') ?? ctx.settingsScope
+  const settingsScope = binder.bind<RemoteSettings>({ namespace: REMOTE_WEB_UI_NS })
   const enabled = (): boolean => {
     const snapshot = settingsScope.getSnapshot()
     return snapshot.status === 'ready'

package/src/client/locales.ts

@@ -70,6 +70,35 @@ export const zh = {
   'settings.unsaved': '未保存',
   'settings.saveFailed': '部署未接受这些值，已保留供你修改。',
   'settings.invalidNumber': '请输入数字，留空则使用默认值。',
+  // 更新面板（侧边栏更新按钮）。
+  'update.label': '检查更新',
+  'update.title': '检查更新',
+  'update.checking': '正在检查远程仓库中的新版本…',
+  'update.upToDate': '当前已是最新版本',
+  'update.upToDateDetail': '{name} 已是最新版本 v{version}。',
+  'update.found': '发现新版本',
+  'update.foundDetail': '{name} 有新版本 v{version}，正在自动更新…',
+  'update.updating': '正在更新 {name} 至 v{version}，可能需要 1-2 分钟…',
+  'update.updatingTitle': '正在自动更新…',
+  'update.done': '更新完成',
+  'update.doneDetail': '所有组件已更新到最新版本。',
+  'update.restartHint': '请重启 dsh web 使新版本生效：在终端按 Ctrl+C 停止后重新运行 dsh web。',
+  'update.linkMode': '当前为本地开发模式',
+  'update.linkModeDetail': 'dsh-web-ui 通过本地链接安装（开发模式），无法自动更新。npm 上最新版本：{version}。请在仓库中执行 git pull 更新。',
+  'update.missing': '未找到 dsh-web-ui 安装',
+  'update.missingDetail': '无法定位已安装的 dsh-web-ui 聚合包。请先运行 dsh plugin --profile <profile> add @linxin666/dsh-web-ui-all。',
+  'update.offline': '无法连接更新源',
+  'update.offlineDetail': '网络不可用或更新服务异常，请稍后重试。',
+  'update.error': '更新失败',
+  'update.packages': '组件版本',
+  'update.retry': '重新检查',
+  'update.close': '关闭更新面板',
+  'update.error.pnpmMissing': '未找到 pnpm，请先安装 pnpm（brew install pnpm 或 corepack enable）。',
+  'update.error.timeout': '更新超时，已终止安装进程，请重试。',
+  'update.error.notFound': '未找到 dsh-web-ui 聚合包安装，无法更新。',
+  'update.error.link': '当前为本地开发模式（链接安装），无法自动更新。',
+  'update.error.pnpmFailed': '更新执行失败（pnpm 退出码 {code}），详见下方输出。',
+  'update.error.unknown': '更新失败，请重试。',
 } satisfies Record<string, string>
 
 /** The remote namespace key union. */
@@ -148,4 +177,33 @@ export const en = {
   'settings.unsaved': 'Unsaved',
   'settings.saveFailed': 'The deployment did not accept these values; they were left for you to correct.',
   'settings.invalidNumber': 'Enter a number, or leave blank to use the default.',
+  // Update panel (the sidebar update trigger).
+  'update.label': 'Check for updates',
+  'update.title': 'Check for updates',
+  'update.checking': 'Checking the remote repository for newer releases…',
+  'update.upToDate': 'Everything is up to date',
+  'update.upToDateDetail': '{name} is at the latest version v{version}.',
+  'update.found': 'A new version is available',
+  'update.foundDetail': '{name} has a newer release v{version}; updating automatically…',
+  'update.updating': 'Updating {name} to v{version}; this may take 1-2 minutes…',
+  'update.updatingTitle': 'Updating automatically…',
+  'update.done': 'Update complete',
+  'update.doneDetail': 'All components are up to date.',
+  'update.restartHint': 'Restart dsh web for the new version to take effect: stop it with Ctrl+C in the terminal, then run dsh web again.',
+  'update.linkMode': 'Local development mode',
+  'update.linkModeDetail': 'dsh-web-ui is installed via a local link (development mode) and cannot be updated remotely. Latest npm release: {version}. Run git pull in the repository to update.',
+  'update.missing': 'dsh-web-ui not found',
+  'update.missingDetail': 'Could not locate the installed dsh-web-ui aggregate package. Install it with: dsh plugin --profile <profile> add @linxin666/dsh-web-ui-all',
+  'update.offline': 'Cannot reach the update source',
+  'update.offlineDetail': 'The network is unavailable or the update service is failing; try again later.',
+  'update.error': 'Update failed',
+  'update.packages': 'Component versions',
+  'update.retry': 'Check again',
+  'update.close': 'Close update panel',
+  'update.error.pnpmMissing': 'pnpm was not found. Install it first (brew install pnpm or corepack enable).',
+  'update.error.timeout': 'The update timed out and the install process was killed; try again.',
+  'update.error.notFound': 'The dsh-web-ui aggregate package is not installed; nothing to update.',
+  'update.error.link': 'Local development mode (link install) — automatic update is unavailable.',
+  'update.error.pnpmFailed': 'The update failed (pnpm exited with code {code}); see the output below.',
+  'update.error.unknown': 'Update failed; try again.',
 } satisfies Record<RemoteKey, string>

package/src/client/remote.module.css

@@ -420,3 +420,112 @@
     transition: none;
   }
 }
+
+/* Footer seat row: the update trigger sits LEFT of the remote trigger in wide
+   mode; the rail stacks them with the update circle below the remote circle
+   (mirroring the settings circle keeping its bottom anchor). */
+.entryRow {
+  flex: none;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.entryRow[data-rail='rail'] {
+  flex-direction: column-reverse;
+  gap: 4px;
+}
+
+/* ── update panel extras ─────────────────────────────────────────────── */
+
+.updateStatus {
+  margin: 0;
+  font-weight: 600;
+}
+
+.updateDetail {
+  margin: 6px 0 0;
+  color: var(--dsw-alias-label-secondary);
+  font-size: 13px;
+}
+
+.updateError {
+  margin: 0;
+  color: var(--dsw-alias-text-danger, var(--dsw-alias-label-primary));
+  font-weight: 600;
+}
+
+.updateOutput {
+  max-height: 180px;
+  margin: 10px 0 0;
+  overflow: auto;
+  padding: 10px 12px;
+  border-radius: 10px;
+  background: var(--dsw-alias-bg-layer-1);
+  color: var(--dsw-alias-label-secondary);
+  font-size: 12px;
+  line-height: 18px;
+  white-space: pre-wrap;
+  word-break: break-all;
+}
+
+.updateList {
+  margin: 12px 0 0;
+  padding: 0;
+  list-style: none;
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.updateListItem {
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  gap: 12px;
+  font-size: 13px;
+}
+
+.updateListName {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: var(--dsw-alias-label-primary);
+}
+
+.updateListVersions {
+  flex: none;
+  color: var(--dsw-alias-label-secondary);
+  font-variant-numeric: tabular-nums;
+}
+
+.updateActions {
+  display: flex;
+  justify-content: flex-end;
+  margin-top: 16px;
+}
+
+.updateRetry {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  border: none;
+  border-radius: 10px;
+  padding: 8px 14px;
+  background: var(--dsw-alias-interactive-bg-hover);
+  color: var(--dsw-alias-label-primary);
+  font-size: 13px;
+  cursor: pointer;
+  transition: background-color 120ms ease, color 120ms ease;
+}
+
+.updateRetry:hover {
+  background: var(--dsw-alias-interactive-bg-active);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .updateRetry {
+    transition: none;
+  }
+}

package/src/client/update-api.ts

@@ -0,0 +1,29 @@
+/**
+ * Browser-side wire helpers for the /api/update surface. Plain fetch over
+ * same-origin /api like the pairing client; the host half enforces the
+ * loopback-only fence and owns the pnpm run.
+ */
+
+import type { UpdateRunResult, UpdateStatus } from '../update.ts'
+
+/**
+ * Probe the update status: install mode, owning profile, and the
+ * current-vs-latest comparison for every family package.
+ * @returns the status snapshot.
+ */
+export async function fetchUpdateStatus(): Promise<UpdateStatus> {
+  const response = await fetch('/api/update/status')
+  if (!response.ok) throw new Error('update status unavailable')
+  return await response.json() as UpdateStatus
+}
+
+/**
+ * Run the update (pnpm update in the owning profile). Blocks until pnpm
+ * exits — the panel shows an in-flight state meanwhile.
+ * @returns the run outcome.
+ */
+export async function runUpdate(): Promise<UpdateRunResult> {
+  const response = await fetch('/api/update/run', { method: 'POST' })
+  if (!response.ok) throw new Error('update run unavailable')
+  return await response.json() as UpdateRunResult
+}

package/src/index.ts

@@ -8,6 +8,7 @@
  * phone-side pair/accept + deep-link flow.
  */
 
+import { createRequire } from 'node:module'
 import { setInterval as nodeSetInterval } from 'node:timers'
 import type { IncomingMessage } from 'node:http'
 import type { Context } from '@deepseek-ai/cordis'
@@ -16,11 +17,20 @@ import z from 'schemastery'
 import type {} from '@deepseek-ai/dsh-host-webserver'
 import { PairingService } from './pairing.ts'
 import { makeGateListener } from './gate.ts'
-import { makeRoutes } from './routes.ts'
+import { isTrustedApiRequest, makeRoutes } from './routes.ts'
 import { makeMobileRoutes } from './mobile-routes.ts'
 import { makeMobileApiRoutes } from './mobile-api.ts'
 import { lanIPv4Addresses } from './lan.ts'
 import { TunnelManager, type TunnelInfo } from './tunnel.ts'
+import {
+  checkUpdates,
+  fetchLatestVersion,
+  resolveAnchorManifest,
+  resolveUpdateTarget,
+  runUpdate,
+  type UpdateRunResult,
+} from './update.ts'
+import { makeUpdateRoutes } from './update-routes.ts'
 
 declare module '@deepseek-ai/cordis' {
   interface Events {
@@ -215,10 +225,50 @@ export function apply(ctx: Context, config?: Config): void {
   if (apiProxy === undefined) {
     console.warn('remote-web-ui: apiProxy service unavailable — the mobile data channel is disabled')
   }
+  // ── remote update ────────────────────────────────────────────────────────
+  // The dsh-web-ui self-update surface: probe the npm registry for family
+  // releases and run `pnpm update` in the owning profile. Resolutions anchor
+  // on the host process's own module graph, so the update always targets the
+  // profile the running web GUI was booted from. The probe path resolves once
+  // (the anchor stays the same package across updates); versions are re-read
+  // from disk per check.
+  const requireFromHost = createRequire(import.meta.url)
+  const anchorManifestPath = resolveAnchorManifest(specifier => requireFromHost.resolve(specifier))
+  const updateRoutes = makeUpdateRoutes({
+    // Control endpoints are host-surface only: a LAN/phone origin must never
+    // trigger a real install on this machine.
+    fence: request => isTrustedApiRequest(request, []),
+    check: () => checkUpdates({
+      anchorManifestPath,
+      resolve: specifier => {
+        try {
+          return requireFromHost.resolve(specifier)
+        } catch {
+          return undefined
+        }
+      },
+      fetchLatest: name => fetchLatestVersion(name, fetch),
+    }),
+    run: async (): Promise<UpdateRunResult> => {
+      const target = resolveUpdateTarget({ anchorManifestPath })
+      if ('error' in target) {
+        const code = target.error
+        return {
+          ok: false,
+          exitCode: null,
+          output: '',
+          error: code === 'not-found' ? 'dsh-web-ui aggregate not installed' : 'local link install — update unavailable',
+          errorCode: code,
+        }
+      }
+      return runUpdate({ profileDir: target.profileDir, packages: target.packages })
+    },
+  })
   const routes = [
     ...makeRoutes({ service, lanAddresses }),
     ...makeMobileRoutes(),
     ...(apiProxy !== undefined ? makeMobileApiRoutes({ service, apiProxy }) : []),
+    ...updateRoutes,
   ]
   const gate = makeGateListener(service, () => resolve().requirePairingForLan, () => resolve().enabled)
   ctx.effect(() => ctx.on('api/gate', gate), 'remote-web-ui: api gate')

package/src/routes.ts

@@ -27,7 +27,7 @@ import { isLoopbackClient, readCookie } from './gate.ts'
  * @returns true when the Host is ours (loopback or trusted) and any attached
  * browser markers are same-origin.
  */
-function isTrustedApiRequest(request: IncomingMessage, trustedHosts: readonly string[]): boolean {
+export function isTrustedApiRequest(request: IncomingMessage, trustedHosts: readonly string[]): boolean {
   const host = request.headers.host
   if (typeof host !== 'string') return false
   let hostUrl: URL