dsh-tiddlywiki 0.22.2 → 0.22.4

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "dsh-tiddlywiki",
   "description": "TiddlyWiki 5 as the DSH persistent knowledge base: fifteen tiddlywiki_* agent tools (filtered search/recent/tags/batch/rewrite/trash/lint + git sync & conflict resolve), a full TiddlyWiki editor embedded in the GUI center column (same-origin proxy, works over Tailscale/LAN/domain), a right-side wiki tab, a per-session summary tab, a quick-note card with draft auto-save behind a single knowledge FAB, an optional clip bookmarklet that also saves selected images as attachments, and git-based sync with auto-commit. Mounts via the official dsh plugin system — no DSH source changes.",
-  "version": "0.22.2",
+  "version": "0.22.4",
   "type": "module",
   "keywords": [
     "dsh",
@@ -85,7 +85,7 @@
     "smoke:client": "node scripts/smoke-client.mjs",
     "selftest": "node scripts/selftest.mjs",
     "verify:static": "node scripts/verify-send-to-agent-bundle.mjs && node scripts/verify-render-bundle.mjs && node scripts/verify-package-contents.mjs && node scripts/verify-version-consistency.mjs && node scripts/verify-constants.mjs",
-    "verify:unit": "node scripts/verify-clip-bridge.mjs && node scripts/verify-seed-error-policy.mjs && node scripts/verify-render-sanitizer.mjs && node scripts/verify-secret-masking.mjs && node scripts/verify-write-policy.mjs && node scripts/verify-prompt.mjs && npx tsx scripts/verify-status-cache.mjs",
+    "verify:unit": "node scripts/verify-clip-bridge.mjs && node scripts/verify-seed-error-policy.mjs && node scripts/verify-render-sanitizer.mjs && node scripts/verify-secret-masking.mjs && node scripts/verify-write-policy.mjs && node scripts/verify-prompt.mjs && node scripts/verify-frame-guards.mjs && npx tsx scripts/verify-frame-surface.mjs && npx tsx scripts/verify-status-cache.mjs",
     "verify:e2e": "node scripts/verify-auth.mjs && node scripts/verify-tools.mjs && node scripts/verify-audit-fixes.mjs && node scripts/verify-git-resolve.mjs && node scripts/verify-resilience.mjs && node scripts/verify-seed-send-to-agent.mjs && node scripts/verify-seeds-admin.mjs && node scripts/verify-wiki-switch.mjs",
     "verify:large": "node scripts/verify-large-wiki.mjs",
     "verify": "npm run verify:static && npm run verify:unit && npm run verify:e2e && npm run verify:large",

package/src/client/note-widget.ts

@@ -356,7 +356,6 @@ interface BuiltUi {
   draftBanner: HTMLDivElement
   /** 草稿横幅文案（恢复「其它窗口草稿」时改写为带来源的提示）。 */
   bannerText: HTMLSpanElement
-  recentBtn: HTMLButtonElement
   recentWrap: HTMLDivElement
 }
 
@@ -820,7 +819,7 @@ export function createNoteWidget(): NoteWidgetHandle {
     root.append(card, recentWrap)
     document.body.append(root)
 
-    const handle: BuiltUi = { root, card, editor, titleInput, tagEditor, saveBtn, editBtn, draftBanner, bannerText, recentBtn, recentWrap }
+    const handle: BuiltUi = { root, card, editor, titleInput, tagEditor, saveBtn, editBtn, draftBanner, bannerText, recentWrap }
     ui = handle
 
     const close = (): void => {
@@ -1067,8 +1066,10 @@ export function createNoteWidget(): NoteWidgetHandle {
       ui?.tagEditor.dispose()
       ui?.editor.view.destroy()
       ui?.root.remove()
-      const toastEl = document.querySelector<HTMLElement>('.dsh-tw-toast')
-      toastEl?.remove()
+      // NOTE: `.dsh-tw-toast` is deliberately NOT removed here (v0.22.3). It is a
+      // page-level singleton owned by toast.ts and shared with the settings page;
+      // deleting it on this widget's unmount killed a toast another surface was
+      // showing (toast.ts would only re-create it on the next call).
       ui = undefined
     },
   }

package/src/client/panel.ts

@@ -10,10 +10,16 @@
  * Toggling rides the shared PanelState; cross-plugin exclusivity rides the
  * `dsh-panel-activate` event (same protocol as dsh-taskboard).
  *
+ * This module owns the overlay LAYOUT only (rect pinning, lazy build, chrome,
+ * exclusion). The iframe's whole lifecycle — `/status` polling, error/starting
+ * states, theme sync, FAB reload, tiddler-hash navigation — is the shared
+ * kernel in tw-frame.ts (v0.22.4), so the panel and the rightbar tab can no
+ * longer drift apart (the drift is what produced the v0.22.3 empty-src bug).
+ *
  * The iframe points at the SAME-ORIGIN TW proxy (`<origin>/dsh-tiddlywiki/tw/`,
  * remote-access mode R1): the browser only talks to the DSH origin — which it
  * already reaches over loopback, LAN, Tailscale, a domain or HTTPS — and DSH
- * proxies to the loopback TW child. The panel reads /status first and only
+ * proxies to the loopback TW child. The kernel reads /status first and only
  * sets iframe.src when the service is actually running. Because the proxy URL
  * is origin-relative and port-independent, a TW restart never reloads the
  * iframe, so an in-progress edit keeps its unsaved state.
@@ -22,9 +28,8 @@
  */
 import type { PanelState } from './state.ts'
 import { ENTRY_SELECTOR } from './sidebar-entry.ts'
-import { attachThemeSync, setThemeSyncConfig } from './theme-sync.ts'
-// 事件名单一来源：两个协议常量由 tw-frame.ts 定义（panel/rightbar 共同依赖）。
-import { ACTIVATE_EVENT, openTiddlerInLiveTab, PANEL_RELOAD_EVENT } from './tw-frame.ts'
+// 事件名与 frame 生命周期助手都只有一份，住在 tw-frame.ts（内核）。
+import { ACTIVATE_EVENT, createTwFrameSurface, openTiddlerInLiveTab, type TwFrameSkin } from './tw-frame.ts'
 
 /**
  * Center-column targets, most-specific shell generation first. The official
@@ -57,8 +62,20 @@ const APP_OVERLAY_Z_INDEX = 20
 /** Safety re-measure cadence for shell layout changes CSS can't see. */
 const SYNC_INTERVAL_MS = 2_000
 
-import { RESTART_ENDPOINT } from './endpoints.ts'
-import { fetchStatus } from './status-cache.ts'
+/**
+ * The panel's skin for the shared frame kernel. The inline flex chain is
+ * required because — unlike `.dsh-tw-rightbar-frame-wrap` — the panel's frame
+ * wrapper has no stylesheet rule; `data-dsh-tw-view` is what the stylesheet
+ * keys on to hide the conversation content the overlay covers.
+ */
+const PANEL_SKIN: TwFrameSkin = {
+  view: 'dsh-tw-view',
+  viewDataset: { dshTwView: '' },
+  frameWrap: 'dsh-tw-panel-frame-wrap',
+  frameWrapStyle: 'flex:1;min-height:0;display:flex;flex-direction:column',
+  frame: 'dsh-tw-panel-frame',
+  error: 'dsh-tw-panel-error',
+}
 
 /**
  * Cross-module open request: the reply-stream tool cards and the document
@@ -99,65 +116,16 @@ function conversationColumn(): HTMLElement | undefined {
   return undefined
 }
 
-async function requestRestart(): Promise<boolean> {
-  try {
-    const res = await fetch(RESTART_ENDPOINT, { method: 'POST', signal: AbortSignal.timeout(8_000) })
-    return res.ok
-  } catch {
-    return false
-  }
-}
-
 export function mountPanel(state: PanelState): () => void {
   let container: HTMLDivElement | undefined
   let columnEl: HTMLElement | undefined
-  let iframe: HTMLIFrameElement | undefined
-  let frameArea: HTMLDivElement | undefined
-  let errorArea: HTMLDivElement | undefined
-  let refreshTimer: number | undefined
-  /** In-flight hash-readiness retry timers (cancelled by dispose, v0.19.1). */
-  const hashWaitTimers = new Set<number>()
-  let refreshAttempts = 0
-  let themeSyncDispose: (() => void) | undefined
-  /** true once the iframe's document finished loading (hash navigation target ready). */
-  let frameLoaded = false
-  /** A tiddler-hash open request waiting for the frame to become ready. */
-  let pendingHash: string | null = null
   /** Set by the disposer: no timers/observers may touch DOM or the iframe after. */
   let disposed = false
   /** Last observed presence of the better-sidebar host layer (applyChrome cache). */
   let lastHasHost: boolean | undefined
 
-  const build = (): HTMLDivElement => {
-    const view = document.createElement('div')
-    view.dataset.dshTwView = ''
-    view.className = 'dsh-tw-view'
-
-    frameArea = document.createElement('div')
-    frameArea.className = 'dsh-tw-panel-frame-wrap'
-    frameArea.style.cssText = 'flex:1;min-height:0;display:flex;flex-direction:column'
-    iframe = document.createElement('iframe')
-    iframe.className = 'dsh-tw-panel-frame'
-    iframe.title = 'TiddlyWiki'
-    iframe.hidden = true
-    frameArea.append(iframe)
-    // Track load so a pending tiddler-hash navigation can target a ready
-    // document (setting contentWindow.location.hash before load is a no-op).
-    iframe.addEventListener('load', () => {
-      frameLoaded = true
-      applyPendingHash()
-    })
-    // Embedded TW follows the DSH light/dark theme (non-persisting palette
-    // swap inside the same-origin iframe; re-applied on load + theme change).
-    themeSyncDispose = attachThemeSync(iframe)
-
-    errorArea = document.createElement('div')
-    errorArea.className = 'dsh-tw-panel-error'
-    errorArea.hidden = true
-
-    view.append(frameArea, errorArea)
-    return view
-  }
+  /** iframe + /status lifecycle (shared with the rightbar tab, tw-frame.ts). */
+  const surface = createTwFrameSurface(PANEL_SKIN)
 
   /** Pin the overlay to the center column's current viewport rect. */
   const syncRect = (): void => {
@@ -202,172 +170,26 @@ export function mountPanel(state: PanelState): () => void {
     if (columnEl === undefined || !columnEl.isConnected) columnEl = conversationColumn()
     if (container !== undefined) return
     if (columnEl === undefined) return
-    container = build()
+    // 惰性构建：内核自己也记着可见性，晚于 setVisible(true) 建 DOM 时会自动补一次
+    // /status（否则面板会停在空壳上）。
+    container = surface.build()
     container.style.position = 'fixed'
     applyChrome(true)
     document.body.append(container)
     syncRect()
   }
 
-  const showError = (message: string): void => {
-    if (iframe === undefined || errorArea === undefined || frameArea === undefined) return
-    iframe.hidden = true
-    errorArea.hidden = false
-    errorArea.textContent = ''
-    const p = document.createElement('div')
-    p.textContent = 'TiddlyWiki 服务不可用'
-    const code = document.createElement('code')
-    code.textContent = message
-    const retry = document.createElement('button')
-    retry.type = 'button'
-    retry.textContent = '重试'
-    retry.addEventListener('click', () => {
-      retry.disabled = true
-      retry.textContent = '重启中…'
-      void requestRestart().finally(() => { void doRefresh() })
-    })
-    errorArea.append(p, code, retry)
-  }
-
-  const showStarting = (): void => {
-    if (iframe === undefined || errorArea === undefined || frameArea === undefined) return
-    iframe.hidden = true
-    errorArea.hidden = false
-    errorArea.textContent = ''
-    const p = document.createElement('div')
-    p.textContent = 'TiddlyWiki 服务正在启动…'
-    errorArea.append(p)
-  }
-
-  const showFrame = (url: string): void => {
-    if (iframe === undefined || errorArea === undefined) return
-    errorArea.hidden = true
-    // 只有面板打开时才显示 iframe（对照 tw-frame.ts 的 `frame.hidden = !visible`）：
-    // doRefresh() 在面板关闭后仍可能在途，无条件 hidden=false 会让已关闭的面板
-    // 被一个迟到的 /status 响应重新显示出来。
-    iframe.hidden = !state.isOpen()
-    // Set the src only when the url actually changed, so an editor in the
-    // iframe never loses unsaved state on a status refresh.
-    if (iframe.dataset.loaded !== url) {
-      iframe.dataset.loaded = url
-      frameLoaded = false
-      iframe.src = url
-    }
-  }
-
-  /**
-   * Apply a pending tiddler-hash navigation once the iframe document is ready.
-   * Preferred: same-origin `contentWindow.location.hash` — a hashchange INSIDE
-   * the frame (no reload), TW's story handler opens the tiddler. Fallback: a
-   * full `iframe.src` reload with the hash (TW auto-saves drafts, acceptable).
-   *
-   * TW registers its hashchange listener in a STARTUP module that runs after
-   * the iframe's `load` event, so setting `location.hash` right on load is a
-   * no-op (hash lost → TW stays on its home page). We therefore wait for TW to
-   * become ready inside the frame (the `$tw` global appears once boot settles)
-   * before setting the hash; if it never does (service down / slow boot) we
-   * fall back to a full reload with the hash, which TW processes at startup.
-   * A newer open request supersedes an in-flight wait.
-   */
-  const applyPendingHash = (): void => {
-    if (pendingHash === null || iframe === undefined || !frameLoaded) return
-    const hash = pendingHash
-    const win = iframe.contentWindow
-    if (win === null) {
-      fallbackLoad(hash)
-      return
-    }
-    const tryOnce = (attempt: number): void => {
-      if (disposed) return // unmounted: do not keep waiting or touch the iframe
-      if (pendingHash !== hash) return // superseded by a newer request
-      const frameTw = win as { $tw?: unknown }
-      if (typeof frameTw.$tw !== 'object' || frameTw.$tw === null) {
-        if (attempt < 40) {
-          // Track the retry timer so dispose() can cancel it (v0.19.1): an
-          // untracked 40×150ms chain kept the closure (and the iframe) alive up
-          // to ~6s after hot-reload/unmount.
-          const timer = window.setTimeout(() => {
-            hashWaitTimers.delete(timer)
-            tryOnce(attempt + 1)
-          }, 150)
-          hashWaitTimers.add(timer)
-          return
-        }
-        fallbackLoad(hash)
-        return
-      }
-      pendingHash = null
-      try {
-        if (win.location.hash === hash) return
-        win.location.hash = hash
-      } catch {
-        fallbackLoad(hash)
-      }
-    }
-    tryOnce(0)
-  }
-
-  const fallbackLoad = (hash: string): void => {
-    if (disposed || iframe === undefined) return // never drive a detached frame
-    if (pendingHash === hash) pendingHash = null
-    const base = iframe.src.split('#')[0]
-    if (iframe.src !== `${base}${hash}`) iframe.src = `${base}${hash}`
-  }
-
   const onOpenTiddler = (event: Event): void => {
     const detail = (event as CustomEvent).detail as { title?: unknown } | undefined
     const title = typeof detail?.title === 'string' && detail.title.length > 0 ? detail.title : ''
     if (title.length === 0) return
-    // 侧边栏（rightbar）的 TW tab 可见时，链接直接在那里
-    // 打开（与聊天并排）；否则退回中央面板。互斥由 tw-frame.ts 共享的
-    // dsh-panel-activate 协议保证。
+    // 侧边栏（rightbar）的 TW tab 可见时，链接直接在那里打开（与聊天并排）；
+    // 否则退回中央面板。互斥由 tw-frame.ts 共享的 dsh-panel-activate 协议保证。
     if (openTiddlerInLiveTab(title)) return
-    pendingHash = `#${encodeURIComponent(title)}`
+    // 顺序有意义：applyActive 由 openPanel() 同步触发，先把内核切到可见，
+    // openTiddler() 才会被内核接受（否则内核以 visible=false 拒绝，链接丢失）。
     state.openPanel()
-    applyPendingHash()
-  }
-
-  const doRefresh = async (): Promise<void> => {
-    if (refreshTimer !== undefined) {
-      window.clearTimeout(refreshTimer)
-      refreshTimer = undefined
-    }
-    const payload = await fetchStatus()
-    if (disposed) return // unmounted while fetching: stop, don't touch DOM
-    if (payload === null) {
-      showError('无法访问 /dsh-tiddlywiki/status')
-      return
-    }
-    if (payload.status === 'running') {
-      refreshAttempts = 0
-      // Keep the embedded TW's theme adaption in step with the settings page.
-      setThemeSyncConfig({
-        enabled: payload.ui?.followDshTheme !== false,
-        darkPalette: payload.ui?.darkPalette,
-      })
-      // Same-origin proxy URL: build from the page's own origin so it works no
-      // matter which host/domain the user reached DSH on. Fall back to the
-      // legacy loopback `url` for older servers that do not send twProxy.
-      if (typeof payload.twProxy === 'string') {
-        showFrame(new URL(payload.twProxy, window.location.origin).href)
-      } else if (typeof payload.url === 'string') {
-        showFrame(payload.url)
-      } else {
-        showError('服务未返回编辑器地址')
-      }
-      return
-    }
-    if (payload.status === 'starting') {
-      showStarting()
-      // Auto-poll while starting (bounded).
-      if (refreshAttempts < 30) {
-        refreshAttempts++
-        refreshTimer = window.setTimeout(() => { void doRefresh() }, 1_500)
-      }
-      return
-    }
-    refreshAttempts = 0
-    showError(payload.error ?? `服务状态：${payload.status}`)
+    surface.openTiddler(title)
   }
 
   const applyActive = (): void => {
@@ -378,15 +200,12 @@ export function mountPanel(state: PanelState): () => void {
       // syncRect() 现在只在打开时测量（关闭状态早退），所以打开这一帧必须主动
       // 请求一次布局：否则容器要等到下一个 2s interval 才有 left/top/width/height。
       scheduleLayout()
-      void doRefresh()
     } else {
       document.documentElement.removeAttribute(ACTIVE_ATTR)
-      if (refreshTimer !== undefined) {
-        window.clearTimeout(refreshTimer)
-        refreshTimer = undefined
-      }
-      refreshAttempts = 0
     }
+    // 打开 = 首次加载 + 每次重探 /status；关闭 = 隐藏 frame 并停掉有界轮询
+    // （下次打开重新给满预算）。两种语义都在内核里。
+    surface.setVisible(state.isOpen())
   }
   const onOtherActivate = (event: Event): void => {
     const detail = (event as CustomEvent).detail
@@ -436,22 +255,13 @@ export function mountPanel(state: PanelState): () => void {
   ensure()
   applyActive()
 
-  // The "知识库" FAB's 重载面板 entry dispatches this event to reload the
-  // iframe (the panel itself no longer owns a floating status/reload button).
-  const onReloadRequest = (): void => {
-    // `!iframe.hidden` 在 showFrame 修正后仍然成立：iframe 只在「面板打开 + 服务
-    // running」时被显示，因此 !hidden ⇒ 面板开着且已加载真实 twProxy 地址（也避免
-    // 对尚未设置 src 的 iframe 赋值空串把 DSH 页面载进自身）。
-    if (iframe !== undefined && !iframe.hidden) iframe.src = iframe.src
-  }
-  document.addEventListener(PANEL_RELOAD_EVENT, onReloadRequest)
+  // 链接路由入口（回复流工具卡 / 文档点击拦截器派发，见 `openTiddler()`）。
+  // FAB 的「重载面板」事件由内核自己挂监听（含「只重载真的载入过 TW 的 frame」
+  // 这条判据），panel 不再参与。
   document.addEventListener(OPEN_TIDDLER_EVENT, onOpenTiddler)
 
   return () => {
     disposed = true
-    if (refreshTimer !== undefined) window.clearTimeout(refreshTimer)
-    for (const timer of hashWaitTimers) window.clearTimeout(timer)
-    hashWaitTimers.clear()
     if (layoutRaf !== undefined) window.cancelAnimationFrame(layoutRaf)
     layoutRaf = undefined
     window.clearInterval(syncInterval)
@@ -460,12 +270,11 @@ export function mountPanel(state: PanelState): () => void {
     resizeObserver.disconnect()
     document.removeEventListener('click', onClickSidebarRow, true)
     document.removeEventListener(ACTIVATE_EVENT, onOtherActivate)
-    document.removeEventListener(PANEL_RELOAD_EVENT, onReloadRequest)
     document.removeEventListener(OPEN_TIDDLER_EVENT, onOpenTiddler)
     waitObserver.disconnect()
     unsubscribe()
-    themeSyncDispose?.()
     document.documentElement.removeAttribute(ACTIVE_ATTR)
+    surface.dispose()
     container?.remove()
   }
 }

package/src/client/quick-note-dock.ts

@@ -38,13 +38,21 @@ export function createQuickNoteDock(note: NoteWidgetHandle): () => React.ReactEl
     const wrapRef = React.useRef<HTMLDivElement | null>(null)
     const btnRef = React.useRef<HTMLButtonElement | null>(null)
     React.useEffect(() => {
+      // alive 守卫（v0.22.3）：卸载后不再 setState；fetchUiConfig 带 TTL 缓存但
+      // 首次调用会真的发请求，回调可能在组件卸载之后才 resolve。
+      let alive = true
       const onState = (event: Event): void => {
         const detail = (event as CustomEvent<{ open?: boolean }>).detail
         setOpen(detail?.open === true)
       }
       window.addEventListener(NOTE_STATE_EVENT, onState)
-      void fetchUiConfig().then((cfg) => setMode(cfg.quickNoteMode))
-      return () => window.removeEventListener(NOTE_STATE_EVENT, onState)
+      void fetchUiConfig().then((cfg) => {
+        if (alive) setMode(cfg.quickNoteMode)
+      })
+      return () => {
+        alive = false
+        window.removeEventListener(NOTE_STATE_EVENT, onState)
+      }
     }, [])
     React.useLayoutEffect(() => {
       const wrap = wrapRef.current

package/src/client/rightbar-tab.ts

@@ -112,7 +112,8 @@ export function TwRightbarTabBody(props: RightbarTabBodyProps): React.ReactEleme
     return () => document.removeEventListener(ACTIVATE_EVENT, onActivate)
   }, [visible, close])
 
-  return React.createElement('div', { ref: hostRef, className: 'dsh-tw-rightbar-tab', 'data-dsh-tw-rightbar': '' })
+  // 不再挂 `data-dsh-tw-rightbar`（v0.22.3）：没有任何选择器/代码消费它。
+  return React.createElement('div', { ref: hostRef, className: 'dsh-tw-rightbar-tab' })
 }
 
 /** The tab definition (stage 1): a page type opened by kind, with a guide entry box. */

package/src/client/session-summary.ts

@@ -95,6 +95,13 @@ function SessionSummaryView(props: SessionSummaryViewProps): React.ReactElement
   const [summaryTitle, setSummaryTitle] = React.useState<string | null>(null)
   const [error, setError] = React.useState('')
   const genRef = React.useRef(0)
+  /**
+   * 卸载守卫（v0.22.3）：genRef 只能识别「被更新的一次 generate 取代」，覆盖不到
+   * 卸载——组件卸载后 genRef 不再变化，在途的 fetch 一 resolve 就会 setState，并
+   * 在「条目缺失」分支里再递归触发一轮请求（clearInterval 挡不住已在途的那次）。
+   * 置 false 的效果排在同组件其它 effect 之前执行，所以清理顺序不影响它。
+   */
+  const mountedRef = React.useRef(true)
   /**
    * 统一「连续失败计数」：任何一次 generate() 失败（HTTP 失败 / 缺标题 / 渲染
    * 服务不可用 / 条目缺失 / 抛错）都递增，任何一次成功归零。达到 MAX_MISSES 后
@@ -105,6 +112,8 @@ function SessionSummaryView(props: SessionSummaryViewProps): React.ReactElement
 
   const generate = React.useCallback(async (): Promise<void> => {
     const gen = ++genRef.current
+    // 卸载后不再发起新一轮（含「条目缺失 → 自动重建」的递归调用）。
+    if (!mountedRef.current) return
     setPhase('loading')
     if (typeof sessionId !== 'string' || sessionId.length === 0) {
       setPhase('error')
@@ -125,7 +134,7 @@ function SessionSummaryView(props: SessionSummaryViewProps): React.ReactElement
         signal: AbortSignal.timeout(25_000),
       })
       const data = (await res.json().catch(() => null)) as { ok?: boolean; title?: string; error?: string } | null
-      if (gen !== genRef.current) return
+      if (!mountedRef.current || gen !== genRef.current) return
       if (!res.ok || data?.ok !== true) {
         failuresRef.current++
         setPhase('error')
@@ -142,12 +151,12 @@ function SessionSummaryView(props: SessionSummaryViewProps): React.ReactElement
       // 原生渲染：wikitext → HTML 片段（块解析，标题/表格/列表/引用齐全，
       // 链接已重写为 /dsh-tiddlywiki/tw/#标题，点击由全局拦截器接管）。
       const fragment = await fetchRenderFragment(data.title)
-      if (gen !== genRef.current) return
+      if (!mountedRef.current || gen !== genRef.current) return
       if (fragment === null) {
         // 区分「条目被清（TW 重启把 $:/temp 冲掉了）」与「渲染服务不可用」：
         // 前者自动重建（受 MAX_MISSES 约束，有界），后者直接报错交还手动重试。
         const exists = await tiddlerExists(data.title)
-        if (gen !== genRef.current) return
+        if (!mountedRef.current || gen !== genRef.current) return
         if (!exists) {
           failuresRef.current++
           if (failuresRef.current < MAX_MISSES) {
@@ -167,7 +176,7 @@ function SessionSummaryView(props: SessionSummaryViewProps): React.ReactElement
       setHtml(fragment)
       setPhase('ready')
     } catch (err) {
-      if (gen !== genRef.current) return
+      if (!mountedRef.current || gen !== genRef.current) return
       failuresRef.current++
       setPhase('error')
       setError(err instanceof Error ? err.message : String(err))
@@ -175,8 +184,13 @@ function SessionSummaryView(props: SessionSummaryViewProps): React.ReactElement
   }, [sessionId])
 
   // 进入 tab 自动触发生成；切走再切回会重新挂载 → 再次生成（总是最新）。
+  // 卸载时置 mountedRef=false：在途请求 resolve 后不再 setState / 不再递归重建。
   React.useEffect(() => {
+    mountedRef.current = true
     void generate()
+    return () => {
+      mountedRef.current = false
+    }
   }, [generate])
 
   // 自愈：汇总条目是 volatile 的 `$:/temp`，TW 重启即消失；若已就绪但条目

package/src/client/settings-page.ts

@@ -49,7 +49,7 @@ interface CatalogEntry {
 interface AdminState {
   ok?: boolean
   server?: { status?: string; url?: string; wikiPath?: string; error?: string }
-  info?: { plugins?: string[]; themes?: string[]; languages?: string[] }
+  info?: { plugins?: string[]; themes?: string[]; languages?: string[]; themeActive?: string }
   catalog?: { plugins?: CatalogEntry[]; themes?: CatalogEntry[]; languages?: CatalogEntry[] }
   config?: Record<string, unknown>
   git?: { exists?: boolean; branch?: string; dirty?: boolean; lastCommit?: string; remote?: string } | null
@@ -101,7 +101,6 @@ async function fetchJson<T>(url: string, init?: RequestInit): Promise<T> {
 /** Form controls registry for the config section (changed-only patch). */
 interface ConfigField {
   key: string
-  input: HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement
   initial: string | boolean | number
   read: () => string | boolean | number
   changed: () => boolean
@@ -224,7 +223,7 @@ function renderConfigSection(body: HTMLElement, config: Record<string, unknown>,
     input.value = initial
     const wrap = make('label', 'dsh-tw-settings-field')
     wrap.append(make('span', 'dsh-tw-settings-label', label), input)
-    fields.push({ key, input, initial, read: () => input.value.trim(), changed: () => input.value.trim() !== initial })
+    fields.push({ key, initial, read: () => input.value.trim(), changed: () => input.value.trim() !== initial })
     section.append(wrap)
   }
   const checkField = (key: string, label: string, initial: boolean): void => {
@@ -233,7 +232,7 @@ function renderConfigSection(body: HTMLElement, config: Record<string, unknown>,
     input.checked = initial
     const wrap = make('label', 'dsh-tw-settings-field dsh-tw-settings-field-check')
     wrap.append(input, make('span', 'dsh-tw-settings-label', label))
-    fields.push({ key, input, initial, read: () => input.checked, changed: () => input.checked !== initial })
+    fields.push({ key, initial, read: () => input.checked, changed: () => input.checked !== initial })
     section.append(wrap)
   }
   const numField = (key: string, label: string, initial: number): void => {
@@ -250,7 +249,7 @@ function renderConfigSection(body: HTMLElement, config: Record<string, unknown>,
     }
     const wrap = make('label', 'dsh-tw-settings-field')
     wrap.append(make('span', 'dsh-tw-settings-label', label), input)
-    fields.push({ key, input, initial, read, changed: () => read() !== initial })
+    fields.push({ key, initial, read, changed: () => read() !== initial })
     section.append(wrap)
   }
   const selectField = (key: string, label: string, initial: string, options: Array<{ value: string; label: string }>): void => {
@@ -264,7 +263,7 @@ function renderConfigSection(body: HTMLElement, config: Record<string, unknown>,
     }
     const wrap = make('label', 'dsh-tw-settings-field')
     wrap.append(make('span', 'dsh-tw-settings-label', label), select)
-    fields.push({ key, input: select, initial, read: () => select.value, changed: () => select.value !== initial })
+    fields.push({ key, initial, read: () => select.value, changed: () => select.value !== initial })
     section.append(wrap)
   }
   /**
@@ -279,7 +278,7 @@ function renderConfigSection(body: HTMLElement, config: Record<string, unknown>,
     input.value = initial
     const wrap = make('label', 'dsh-tw-settings-field dsh-tw-settings-field-area')
     wrap.append(make('span', 'dsh-tw-settings-label', label), input)
-    fields.push({ key, input, initial, read: () => input.value.trim(), changed: () => input.value.trim() !== initial })
+    fields.push({ key, initial, read: () => input.value.trim(), changed: () => input.value.trim() !== initial })
     section.append(wrap)
     return input
   }
@@ -477,7 +476,18 @@ function renderCatalogSection(
     make('span', 'dsh-tw-settings-name', '主题'),
   )
   const themeList = info?.themes ?? []
-  let activeThemeName = themeList.length > 0 ? themeList[themeList.length - 1] : 'tiddlywiki/vanilla'
+  // The ACTIVE theme comes from the host (`$:/theme`, v0.22.3). Deriving it from
+  // the last loaded entry was a guess: with an explicitly activated non-last
+  // theme the wrong radio showed up checked, and one click on 应用主题 (without
+  // touching the radios) rewrote `$:/theme` to that wrong pick. Guessing stays
+  // as the fallback only when the host cannot tell (wiki down / no `$:/theme`).
+  const activeFromServer = info?.themeActive
+  let activeThemeName =
+    typeof activeFromServer === 'string' && themes.some((theme) => theme.name === activeFromServer)
+      ? activeFromServer
+      : themeList.length > 0
+        ? themeList[themeList.length - 1]
+        : 'tiddlywiki/vanilla'
   const themeWrap = make('div', 'dsh-tw-settings-list')
   for (const theme of themes) {
     const load = make('input', 'dsh-tw-settings-check')

package/src/client/theme-sync.ts

@@ -224,18 +224,33 @@ function syncColorScheme($tw: NonNullable<TwRuntime['$tw']>, frame: HTMLIFrameEl
   }
 }
 
-/** Apply the current DSH theme to one TW iframe (no-op until TW is ready). */
+/**
+ * Apply the current DSH theme to one TW iframe (no-op until TW is ready).
+ *
+ * Every path in here is best-effort and MUST NOT throw: `setThemeSyncConfig()`
+ * calls the registered appliers synchronously from inside `doRefresh()`'s
+ * `await` chain, so one exception becomes an unhandled rejection (and skips the
+ * rest of that refresh) for every caller — including the two surfaces that
+ * mount this on the frame's `load` event. The access below is the sharp edge:
+ * as soon as the frame navigates somewhere cross-origin (a link inside the
+ * embedded TW), reading `contentWindow.$tw` itself raises SecurityError — the
+ * inner helpers' try/catch blocks never get a chance to run.
+ */
 function applyToFrame(frame: HTMLIFrameElement): void {
-  const $tw = (frame.contentWindow as TwRuntime | null)?.$tw
-  if ($tw === undefined || $tw.wiki === undefined) return
-  installPaletteSaveGuard($tw)
-  if (syncEnabled) {
-    applyPalette($tw, readDshDark())
-  } else {
-    // Feature off → undo any palette we forced (leave the user's own choice).
-    applyPalette($tw, false)
+  try {
+    const $tw = (frame.contentWindow as TwRuntime | null)?.$tw
+    if ($tw === undefined || $tw.wiki === undefined) return
+    installPaletteSaveGuard($tw)
+    if (syncEnabled) {
+      applyPalette($tw, readDshDark())
+    } else {
+      // Feature off → undo any palette we forced (leave the user's own choice).
+      applyPalette($tw, false)
+    }
+    syncColorScheme($tw, frame)
+  } catch {
+    // Cross-origin frame, TW not booted, detached frame: the next pass retries.
   }
-  syncColorScheme($tw, frame)
 }
 
 /**

package/src/client/tool-views.ts

@@ -227,7 +227,9 @@ function ToolCardShell(props: {
           ? React.createElement(
               'span',
               { className: 'dsh-tw-toolcard-tags' },
-              ...props.tags.map((tag) => React.createElement('span', { className: 'dsh-tw-toolcard-tag', key: tag }, tag)),
+              // index in the key: a tiddler can carry the same tag twice (TW does
+              // not dedup), and duplicate keys make React drop/reshuffle chips.
+              ...props.tags.map((tag, index) => React.createElement('span', { className: 'dsh-tw-toolcard-tag', key: `${index}-${tag}` }, tag)),
             )
           : null,
       )