dsh-config-manager 0.1.71 → 0.1.72

package/src/client/chat/ChatEntryView.tsx

@@ -0,0 +1,391 @@
+/**
+ * 每条用户消息的「↺ 回退」入口 —— **接管 `conversation.chat.node` 的 `user` key 渲染器**。
+ *
+ * 为什么必须接管（而不是追加）：该 key 没有 children 表（宿主只对 turn-tail 声明了子位），
+ * framework 没有「往用户消息里加 UI」的位子；唯一合法做法是 priority -1 遮蔽宿主的
+ * `UserMessageNodeView`，然后在自己的渲染里把那条气泡**复刻**一遍（宿主组件 / CSS Modules
+ * 全是 ui-chat 私有、不可导入 —— 外观靠本仓库 CSS 逼近，图片**必须**走 owner 给的
+ * `renderMessageImages`）。
+ *
+ * 三件硬约束（本文件是它们的落点）：
+ *  ① **用户消息绝不消失**：整个子树包在 `ChatEntryErrorBoundary` 里，抛错就降级成
+ *     **纯文本气泡**（文本仍可见）+ ASCII `console.warn`；即使边界自己也没兜住，
+ *     ui-renderer 的 per-entry 边界还会让我们的登记**abdicate**、退回宿主渲染器
+ *     （SlotErrorBoundary → reportEntryError({ abdicate: true }) → outlet 重渲染到 cell 的下一个幸存者）。
+ *  ② **不新造通道**：点开的是既有复核对话框 `RollbackReviewDialog`（T4/T20 的判定与写路径）。
+ *  ③ 回合号只认 `node.location`（`chatNodeTurn`，与宿主 turnTail 同一条读法）；取不到 → 如实禁用。
+ *
+ * 组件的全部判定在 `chat-entry-view.ts`（node 可测）：本文件只做装配、订阅与渲染。
+ */
+import { Component, Fragment, createElement, useCallback, useEffect, useMemo, useState, type ReactNode } from 'react'
+import type { PropsLocale, PropsRuntime } from '@deepseek-ai/dsh-client-ui-slots'
+import type { TranslateNS } from '../client-types.ts'
+import type { RollbackPointPort } from '../../ui/rollback-view.ts'
+import { CopyStateIcon, RefreshIcon } from '../common/Icon.tsx'
+import { copyTextToClipboard } from '../common/clipboard.ts'
+import { RollbackReviewDialog } from './RollbackReviewDialog.tsx'
+import type { RollbackDiffOpenResult } from './rollback-diff-tab.ts'
+import {
+  buildChatEntrySafeRow,
+  buildChatEntryView,
+  chatEntryButtonState,
+  chatEntryTurnPhase,
+  planChatEntryAttachments,
+  lookupPointForTurn,
+  rawBlockText,
+  CHAT_ENTRY_WARN_PREFIX,
+  type ChatEntryBubbleView,
+  type ChatEntryFallbackRow,
+  type ChatEntryFile,
+  type ChatPointLookup,
+} from './chat-entry-view.ts'
+import { ChatPointWindowController, type ChatPointWindowState } from './chat-point-window.ts'
+import type { ArchiveOutcome } from './rollback-entry-view.ts'
+import type { ChildOpenState } from './rollback-entry-view.ts'
+import type { RollbackFileIconRenderer } from './RollbackFileIcon.tsx'
+// 槽位契约的类型镜像（SlotMap 的 conversation.chat.node entry），见该文件头部说明。
+import type {} from './chat-slots.ts'
+import css from '../config-manager.module.css'
+
+const NEWLINE = String.fromCharCode(10)
+
+/**
+ * 图片渲染位（宿主 `conversation.message.images` 的 renderSlot 绑定）。
+ *
+ * 为什么签名这么宽：真实 props 合并了 ui-primitives / ui-session 的类型，本仓库**没有安装**它们；
+ * 我们只承诺「原样转发 `{ images, align, compact, loadImage }`」（逐字对齐宿主
+ * `renderMessageImages = (owner) => renderSlot('conversation.message.images', { ...owner, loadImage })`），
+ * 返回值当作不透明 ReactNode 渲染 —— 绝不自己实现图片渲染。
+ */
+export type MessageImagesRenderer = (owner: unknown) => ReactNode
+
+/** 本条目经 inject 面拿到的业务能力（与回合尾入口同一个 inject 形状）。 */
+export interface ChatEntryViewInjected {
+  /** 回退端口（T2 的 RecoveryApi；组件**不直接 fetch**）。 */
+  port: RollbackPointPort
+  /** recovery 字典（rollback.* 词汇单一所有）。 */
+  rt: TranslateNS<'config-manager-recovery'>
+  /** 打开 fork 出来的子会话（降级态由对话框如实呈现）。 */
+  openChildSession: (childId: string) => Promise<ChildOpenState>
+  /** A（无感替换）：回退后把原会话收进「已归档」；失败一律结构化返回，由对话框如实呈现。 */
+  archiveParentSession: (sessionId: string) => Promise<ArchiveOutcome>
+  /** 第一条消息之前没有可 fork 的边界：开一条全新会话（uiWorkspace.startSession 同一条路）。 */
+  startFreshSession: () => Promise<{ ok: true } | { ok: false; code: string }>
+  /**
+   * 「查看」：把该文件的差异开进 DSH 右侧栏（装配点注入）。侧栏不可用时返回 no-sidebar，
+   * 由预览对话框如实降级为弹窗内展示 —— 绝不给一个点了没反应的入口。
+   */
+  openDiff: (pointId: string, filePath: string) => RollbackDiffOpenResult
+  /**
+   * 文件类型图标的外部来源（可选）：装了 dsh-better-sidebar 时用它的 `betterSidebar.fileIcon`，
+   * 否则对话框回落到 DSH 自带的 `FileTypeIcon`（第 7 条，详见 RollbackFileIcon.tsx）。
+   */
+  fileIcon?: RollbackFileIconRenderer
+}
+
+/**
+ * 完整 props：owner/keyProps 面（`PropsRuntime` 从 SlotMap 推导出 node / renderMessageImages 等）
+ * + session 标准 props + 本插件字典（`t`）+ inject 面。
+ *
+ * 注意 `props.node` 的静态类型是 `unknown`（镜像里刻意不写死宿主节点形状）；真正读它的地方全在
+ * `chat-entry-view.ts` 的宽度接收纯函数里。
+ */
+export type ChatEntryViewProps = PropsRuntime<'conversation.chat.node', 'user'> & PropsLocale<'config-manager-chat'> & ChatEntryViewInjected
+
+/** 文件卡：文件名 + 扩展名徽标 + 体积（扩展名徽标 = 类型图标的诚实兜底，见能力对照表）。 */
+function FileCard({ file, size }: { file: ChatEntryFile; size: string | null }) {
+  return (
+    <span className={css.chatFileCard} title={file.name !== '' ? file.name : undefined}>
+      {file.ext !== null && <span className={css.chatFileExt}>{file.ext}</span>}
+      <span className={css.chatFileName}>{file.name !== '' ? file.name : '?'}</span>
+      {size !== null && <span className={css.chatFileMeta}>{size}</span>}
+    </span>
+  )
+}
+
+/** 未知块：宿主用 JsonBlock，这里用原生 `<details>` + 预格式化 JSON（零新增依赖、零新增通道）。 */
+function RawBlock({ payload, label, truncatedLabel }: { payload: unknown; label: string; truncatedLabel: (total: number) => string }) {
+  const text = rawBlockText(payload)
+  const max = 4000
+  const shown = text.length > max ? text.slice(0, max) + NEWLINE + truncatedLabel(text.length) : text
+  return (
+    <details className={css.chatRawBlock}>
+      <summary className={css.chatRawSummary}>{label}</summary>
+      <pre className={`${css.chatRawPre} ${css.mono}`}>{shown}</pre>
+    </details>
+  )
+}
+
+/** 复制动作按钮（成功才切「已复制」；失败不给假信号 —— 与 common/CopyButton 同语义）。 */
+function ChatEntryCopyAction({ text, t }: { text: string; t: TranslateNS<'config-manager-chat'> }) {
+  const [copied, setCopied] = useState(false)
+  useEffect(() => {
+    if (!copied) return undefined
+    const timer = setTimeout(() => { setCopied(false) }, 1000)
+    return () => { clearTimeout(timer) }
+  }, [copied])
+  const onCopy = useCallback(() => {
+    if (copied) return
+    void copyTextToClipboard(text).then((ok) => { if (ok) setCopied(true) })
+  }, [copied, text])
+  return (
+    <button
+      type="button"
+      className={css.chatActionBtn}
+      aria-label={copied ? t('chat.entry.copied') : t('chat.entry.copy')}
+      title={copied ? t('chat.entry.copied') : t('chat.entry.copy')}
+      onClick={onCopy}
+    >
+      <CopyStateIcon done={copied} size={13} />
+    </button>
+  )
+}
+
+interface ChatEntryBodyProps extends ChatEntryViewInjected {
+  node: unknown
+  sessionId: string
+  /** 宿主图片渲染位（SlotMap 的 keyProps 把返回值声明成 unknown ⇒ 用它当 `MessageImagesRenderer` 必须过一层窄化）。 */
+  renderMessageImages?: unknown
+  t: TranslateNS<'config-manager-chat'>
+}
+
+/**
+ * 一条用户消息的行主体：气泡（文本/图片/文件卡/时间/复制）+ 我们那颗「回退」按钮。
+ *
+ * 与宿主 UserStyleBubble 的逐条对照见任务 output 的能力对照表。**下面按现状分别写**（t12 修正：
+ * 旧注释把「引用」与「技能」并成同一句结论，已与本文件下方的渲染不符 —— 前者已复刻、后者仍未做）：
+ *  · **引用（会话引用）**：**已复刻**——线格式 `@[label](dsh-session:…)` 在纯投影层换成 label 文本
+ *    （`projectChatEntryText`），且 `data.referenceLabels` 非空时渲染**宿主的引用汇总行**
+ *    （见下方 `css.chatEntryReference` + `t('chat.entry.referenceSummary')` 那段，文案与宿主
+ *    `引用会话 · {labels}` 逐字同义）。**仍有的差距**只有 chip 的**外观与可点开**（已追认）。
+ *  · **技能（skillNames）**：**仍不渲染** —— 宿主交给 ui-primitives 的 `projectUserText` 在正文内部
+ *    把它渲染成 chip（包私有、不可导入）⇒ 我们不为技能产出任何界面元素（不编造内容）。
+ *  · 文件类型图标：宿主用 ui-primitives 的 FileTypeIcon（包私有）⇒ 我们用**扩展名徽标**兜底；
+ *  · 气泡底色：宿主直接用 `--dsw-specific-bubble`，本仓库 token 层没有这一档 ⇒ 用 `--cm-surface-2`
+ *    （亮/暗主题下都是「比底更强的面」），不改 DESIGN 体系、不新增 token。
+ */
+function ChatEntryBody({ node, sessionId, renderMessageImages, t, rt, port, openChildSession, archiveParentSession, startFreshSession, openDiff, fileIcon }: ChatEntryBodyProps) {
+  const view = useMemo(() => buildChatEntryView(node), [node])
+  const [lookup, setLookup] = useState<ChatPointLookup | null>(null)
+  /** 有界重试窗口是否还开着（**状态诚实**的唯一开关，R1）—— 由状态机的 `onState` 驱动。 */
+  const [windowOpen, setWindowOpen] = useState(false)
+  const [dialogTurn, setDialogTurn] = useState<number | null>(null)
+  const turn = view.turnNumber
+  const phase = chatEntryTurnPhase(turn === null ? null : { turn, status: view.turnStatus })
+  /**
+   * 「还没拿到结论」⇒ 按钮如实显示「正在读取回滚点…」（**不许**说成「没有回滚点」）：
+   *  · 窗口开着（首读在途 / 读到空还会再读 / 读失败还会再读）→ `pointsPending`；
+   *  · 窗口关掉且仍为空 → `noPoint`（此时才是「已证实没有」）。
+   * 判据只用状态机给的两个事实（`windowOpen` + `lookup`），没有第三个需要手工同步的标志。
+   */
+  const retrying = windowOpen && (lookup === null || lookup.point === null)
+  const button = chatEntryButtonState({ node, sessionId, lookup, pending: false, retrying })
+
+  /**
+   * 读回滚点列表：**收尾之后的有界重试**（R1），不是一次性的惰取。
+   *
+   * 为什么必须重试：引擎在回合**收尾之后**才写点 —— 真机实测 turn/end 之后 **7.8 s**
+   * （session-e3a7953c…：turn/end 20:03:38.658Z → 该回合的点 createdAt 20:03:46.434Z）。
+   * 旧实现的 effect 条件是「读到过就永不重查」，于是首读撞上那个空窗就**永久禁用**；
+   * 现在按 `CHAT_POINT_RETRY_DELAYS_MS`（0.5/1.5/3/6/12 s）在 `CHAT_POINT_LOOKUP_WINDOW_MS`
+   * 窗口内再读，**命中即停**（命中后一个请求都不再发）。
+   *
+   * **一次 effect 调用 = 一个新实例**（T9 / RR2-A）：React StrictMode 会走
+   * `effect → cleanup → effect` 双调用。实例若跨调用复用（此前放在 `useMemo` 里），第二次 `start()`
+   * 会因为 `started` 已置位而变成 no-op，而被 dispose 的那个循环又永不回调 ⇒ 窗口**永久**停在
+   * `open: true`、按钮永久停在「正在读取回滚点…」禁用（与原始症状同一类）。每次 effect 各建实例即无此路径。
+   *
+   * 又因为依赖里**没有任何 React 状态**（只有 `canLookup` / `port` / `sessionId` / `turn`），
+   * 状态回调不会把 effect 再跑一遍 ⇒ 同时满足 F1「一个挂载只跑一轮窗口」（不周期性重开）。
+   *
+   * 只在「回合已收尾」时才读 —— 收尾未知/未结束的回合注定没有点，不浪费这次请求（按钮此时已如实禁用）。
+   * 「用户再次触发」= 重新挂载（切档 / 重进会话）或会话/回合变化 ⇒ 新实例；不需要刷新页面。
+   */
+  const canLookup = turn !== null && phase === 'closed' && sessionId !== ''
+  useEffect(() => {
+    if (!canLookup || turn === null) return undefined
+    const controller = new ChatPointWindowController({
+      attempt: (force) => lookupPointForTurn({ port, sessionId, turn, force }),
+      onState: (state: ChatPointWindowState) => {
+        setLookup(state.lookup)
+        setWindowOpen(state.open)
+      },
+    })
+    controller.start()
+    // F2：取消通道（循环立即 settle）。dispose **不回调** onState —— 这里正是卸载/换会话，
+    // 回调只会在卸载后 setState（RR2-B：语义与注释对齐，见 chat-point-window.ts 的 dispose 文档）。
+    return () => { controller.dispose() }
+  }, [canLookup, port, sessionId, turn])
+
+  const openDialog = useCallback(() => {
+    if (button.kind !== 'enabled') return
+    setDialogTurn(button.turn)
+  }, [button])
+
+  const bubble: ChatEntryBubbleView = view.bubble
+  /**
+   * 附件按**content 原始顺序**输出（宿主 `attachments.map` 同构）：图片走 owner 的
+   * `renderMessageImages`（每张一次调用），文件走文件卡 —— 两类**共用同一条序列**，
+   * 绝不重排成「先图片后文件」（t4 复核 D2）。
+   */
+  const canRenderImages = typeof renderMessageImages === 'function'
+  const attachmentNodes = planChatEntryAttachments(bubble).map((item) => item.kind === 'image'
+    ? (canRenderImages
+        ? (
+          <Fragment key={'image:' + String(item.index)}>
+            {(renderMessageImages as MessageImagesRenderer)(item.owner)}
+          </Fragment>
+          )
+        : null)
+    : <FileCard key={'file:' + String(item.index)} file={item.file} size={item.size} />)
+  const hasAttachments = attachmentNodes.some((node) => node !== null)
+  const reasonKey = button.kind === 'disabled' ? button.key : null
+
+  return (
+    <div className={css.chatEntryScope}>
+      <div className={css.chatEntryRow}>
+        <div className={css.chatEntryStack}>
+          {hasAttachments && (
+            <div className={css.chatAttachmentRow} data-message-attachments="">
+              {attachmentNodes}
+            </div>
+          )}
+          {bubble.showBubble && (
+            <div className={css.chatBubble}>
+              {bubble.text !== '' && <span className={css.chatBubbleText}>{bubble.text}</span>}
+              {bubble.raw.map((block) => (
+                <RawBlock
+                  key={'raw-' + block.id}
+                  payload={block.payload}
+                  label={t('chat.entry.extraBlock')}
+                  truncatedLabel={(total) => t('chat.entry.truncated', { total })}
+                />
+              ))}
+            </div>
+          )}
+          {!canRenderImages && bubble.images.length > 0 && (
+            <div className={css.chatEntryNotice}>{t('chat.entry.noImageRenderer')}</div>
+          )}
+          {/* 引用会话汇总行：宿主在气泡下方渲染 referenceSummary（`引用会话 · {labels}`）。
+              我们复刻这一行（文案在 chat 字典里，**不依赖 ui-primitives**）；`data-ref-chip` 供探针定位。 */}
+          {view.referenceLabels.length > 0 && (
+            <div className={css.chatEntryReference} data-ref-chip="">
+              {t('chat.entry.referenceSummary', {
+                labels: view.referenceLabels.join(t('chat.entry.referenceSeparator')),
+              })}
+            </div>
+          )}
+        </div>
+        <div className={css.chatEntryActions}>
+          {/* 时间在动作行**最前**（宿主把 MessageIconActions 的 clock 设为 "start"，与它同构） */}
+          {view.clock !== null && <span className={css.chatEntryTime}>{view.clock}</span>}
+          <ChatEntryCopyAction text={bubble.text} t={t} />
+          {/* 回退入口：**只有图标**（无文字标签、无边框按钮样式），与时间戳/复制图标同一行同观感 ——
+              2026-10-10 用户第二条要求「回退按钮只有一个 icon 而不是一个按钮」。可见文案退到
+              aria-label/title；禁用原因是原生 title 里的一句话（InfoHint 的 Portal 钉在插件设置页
+              根节点，聊天区不存在）。按钮始终留在原地（禁用而不是消失）：入口可见性不随判据漂移。 */}
+          <button
+            type="button"
+            className={css.chatActionBtn}
+            disabled={button.kind !== 'enabled'}
+            aria-label={t('chat.entry.label')}
+            title={reasonKey === null ? t('chat.entry.label') : t(reasonKey as 'chat.entry.disabled.noTurn')}
+            onClick={openDialog}
+            /* 只读判据（零样式、零文案）：重试窗口开着时置位 —— 排障时一眼看出「正在读取」是暂态还是终态 */
+            data-chat-entry-window-open={windowOpen ? '' : undefined}
+            data-chat-entry-window-closed={windowOpen ? undefined : ''}
+          >
+            <RefreshIcon size={13} />
+          </button>
+        </div>
+      </div>
+      {dialogTurn !== null && (
+        <RollbackReviewDialog
+          sessionId={sessionId}
+          turn={dialogTurn}
+          port={port}
+          rt={rt}
+          t={t}
+          openChildSession={openChildSession}
+          archiveParentSession={archiveParentSession}
+          startFreshSession={startFreshSession}
+          openDiff={openDiff}
+          renderFileIcon={fileIcon}
+          onClose={() => { setDialogTurn(null) }}
+        />
+      )}
+    </div>
+  )
+}
+
+interface ChatEntryBoundaryProps {
+  node: unknown
+  t: TranslateNS<'config-manager-chat'>
+  /** 被保护的子树（`createElement` 的第三参给进来，故这里可选）。 */
+  children?: ReactNode
+}
+
+interface ChatEntryBoundaryState {
+  failed: boolean
+  row: ChatEntryFallbackRow | null
+}
+
+/**
+ * 错误边界：**用户消息绝不消失**。
+ *
+ * 为什么必须是 class 而不是函数组件：React 18 只有 class 能声明 `getDerivedStateFromError` /
+ * `componentDidCatch`（本仓库「函数组件 + hooks，无 class」规范的**唯一例外**，且例外点只有这一个）。
+ *
+ * 三件事：
+ *  ① `getDerivedStateFromError` 先切失败态；真正的内容在 `componentDidCatch` 里由
+ *     `buildChatEntrySafeRow` 现算 —— 它自己**不抛**（内部 try/catch + 只认文本与 JSON 短表示），
+ *     所以降级气泡一定有内容；连节点都读不出文本时给空字符串（仍然渲染出一条气泡行，不是「整条消失」）。
+ *  ② `componentDidCatch` 打 ASCII `console.warn`（诊断用，绝不当作界面文案）。
+ *  ③ 节点换了（重挂 / 分页）就清掉失败态（`componentDidUpdate`），不让一次崩溃永久钉死这条消息。
+ *
+ * 与宿主 ui-renderer 的 per-entry 边界的关系：那一层会在我们崩溃时把我们的登记 **abdicate**，
+ * 让 outlet 退回宿主渲染器（消息也能活）；但它会先渲染一个 `<div data-slot-error>` 空壳，
+ * 所以本边界是「消息不消失」的第一道，宿主边界是最后一道。
+ */
+export class ChatEntryErrorBoundary extends Component<ChatEntryBoundaryProps, ChatEntryBoundaryState> {
+  override state: ChatEntryBoundaryState = { failed: false, row: null }
+
+  static getDerivedStateFromError(): ChatEntryBoundaryState {
+    return { failed: true, row: null }
+  }
+
+  override componentDidCatch(error: unknown): void {
+    const row = buildChatEntrySafeRow({ node: this.props.node, project: buildChatEntryView })
+    console.warn(CHAT_ENTRY_WARN_PREFIX + (error instanceof Error ? error.message : String(error)))
+    this.setState({ row })
+  }
+
+  override componentDidUpdate(previous: ChatEntryBoundaryProps): void {
+    if (previous.node !== this.props.node && this.state.failed) this.setState({ failed: false, row: null })
+  }
+
+  override render(): ReactNode {
+    if (!this.state.failed) return this.props.children
+    const text = this.state.row === null ? '' : this.state.row.text
+    const names = this.state.row === null ? [] : this.state.row.fileNames
+    return (
+      <div
+        className={`${css.chatEntryScope} ${css.chatEntryRow} ${css.chatBubble} ${css.chatFallbackBubble}`}
+        data-chat-entry-fallback=""
+      >
+        <span className={css.chatBubbleText}>{text}</span>
+        {names.length > 0 && <span className={css.chatFileMeta}>{names.join(' / ')}</span>}
+      </div>
+    )
+  }
+}
+
+/**
+ * 注册到 `conversation.chat.node` 的 `user` cell（priority -1，遮蔽宿主渲染器）。
+ *
+ * 已核实：**steering 是另一个 key**（宿主对 user 与 steering 各注册了一次同一个 UserMessageNodeView，
+ * 但那是两条独立的 keyed cell）；本入口只注册 `user`，steering 一律保持宿主的渲染器。
+ */
+export function ChatEntryNodeView(props: ChatEntryViewProps) {
+  return createElement(ChatEntryErrorBoundary, { node: props.node, t: props.t }, createElement(ChatEntryBody, props))
+}

package/src/client/chat/RollbackDiffTab.tsx

@@ -0,0 +1,61 @@
+/**
+ * DSH 右侧栏「回滚差异」标签页的正文（只读；内容 = 该回退点里一个记录在案文件的前后对照）。
+ *
+ * 目标来自标签页自己的**资源地址**（`dsh-resource://cm-rollback-diff/<pointId>/<path>`）——
+ * 地址由 seat 通过 `useTabInfo` 给出，所以同一个文件开两个标签、或从历史布局恢复标签都能各自取到
+ * 自己的目标；**拿不到地址**时如实说「读不出来」，绝不用全局变量猜一个文件给用户看。
+ *
+ * 地址解析与打开动作在 `rollback-diff-tab.ts`（纯函数、node 单测）；本文件只做取数与装配。
+ */
+import { useEffect, useState } from 'react'
+import type { TranslateNS } from '../client-types.ts'
+import type { RollbackFileDiffResult, RollbackPointPort } from '../../ui/rollback-view.ts'
+import { Empty } from '../common/ui.tsx'
+import { parseRollbackDiffAddress } from './rollback-diff-tab.ts'
+import { RollbackDiffPane, type RollbackDiffState } from '../recovery/RollbackDiffPane.tsx'
+
+/** 装配点注入面（端口的读差异方法 + recovery 字典）。 */
+export interface RollbackDiffTabInjected {
+  port: RollbackPointPort
+  rt: TranslateNS<'config-manager-recovery'>
+}
+
+/** 完整 props：注入面 + 侧栏 seat 提供的 tab 信息钩子（可能不存在）。 */
+export type RollbackDiffTabProps = RollbackDiffTabInjected & {
+  useTabInfo?: () => { tab?: { contentId?: unknown } }
+}
+
+/** 从 seat 的 tab 信息钩子里读资源地址（钩子缺失 / 抛错一律当「读不到」，不猜）。 */
+function readContentId(useTabInfo: RollbackDiffTabProps['useTabInfo']): unknown {
+  if (typeof useTabInfo !== 'function') return undefined
+  try {
+    return useTabInfo()?.tab?.contentId
+  } catch {
+    return undefined
+  }
+}
+
+export function RollbackDiffTab({ port, rt, useTabInfo }: RollbackDiffTabProps) {
+  const contentId = readContentId(useTabInfo)
+  const target = parseRollbackDiffAddress(contentId)
+  const [state, setState] = useState<RollbackDiffState>({ status: 'loading' })
+  useEffect(() => {
+    if (target === null) return
+    const read = port.rollbackPointFileDiff
+    if (typeof read !== 'function') {
+      // 端口没实现这条能力（旧宿主）：如实说读不出来，绝不显示空白装成「没有差异」
+      setState({ status: 'error', message: null })
+      return
+    }
+    let alive = true
+    setState({ status: 'loading' })
+    const pending: Promise<RollbackFileDiffResult> = read.call(port, target.pointId, target.path)
+    pending.then(
+      (diff) => { if (alive) setState({ status: 'ready', diff }) },
+      (error: unknown) => { if (alive) setState({ status: 'error', message: error instanceof Error ? error.message : String(error) }) },
+    )
+    return () => { alive = false }
+  }, [port, contentId])
+  if (target === null) return <Empty>{rt('rollback.diff.failed')}</Empty>
+  return <RollbackDiffPane state={state} rt={rt} />
+}

package/src/client/chat/RollbackFileIcon.tsx

@@ -0,0 +1,96 @@
+/**
+ * 文件类型图标 —— 「DSH 侧边栏怎么画，就怎么画」（用户 2026-10-12 第 7 条）。
+ *
+ * 两级来源，优先级从高到低：
+ *  ① **dsh-better-sidebar**（装了才用）：它把文件图标注册表作为 cordis 服务 `betterSidebar` 发布
+ *     （`ctx.betterSidebar.fileIcon(path, size)`；v0.19.0 起还有 `registerFileIcon` / `fileIcons`），
+ *     并且它自己的缺省档**就是** DSH 的 `FileTypeIcon` 画法 —— 装了它就等于同时拿到用户的扩展图标。
+ *     装配点在 src/client/index.ts 的 `fileIconFor`（惰取 + bind，形态不符返回 null）；
+ *  ② **DSH 自带**：`@deepseek-ai/dsh-client-ui-primitives` 的 `FileTypeIcon` —— 这正是 DSH 左侧文件树
+ *     （`dsh-client-ui-sidebar-files` 的 FilesBody）逐字使用的那颗组件（同一份按类型着色的画集）。
+ *
+ * ## 为什么这里是「惰取 + try/catch」而不是顶层 import（**关键**）
+ * 该包由 DSH shell 的模块表作为 **static module seed** 预置（`dsh-web-frontend` 的 `staticModules`
+ * 里就有它），插件 bundle 的 `require` 能直接命中 —— 第三方插件 dsh-better-sidebar 走的就是这条路。
+ * 但那是**较新宿主**才有的模块表：老宿主加载本插件时 `require` 会抛（missed the module table）。
+ * 顶层 `import` 会被打包器改写成**模块体顶层**的 `require`，那一刻抛错会让**整个浏览器半加载失败**
+ * （设置页一起没）—— 为了「一颗图标」赔掉整插件，绝不。所以这里：
+ *  · 只在**真要画 icon 时**才 require（帧内），
+ *  · 拿不到 / 形态不符 / 抛错一律回落一颗**极简的本地 SVG 文件图标**（`fallbackFileGlyph`），
+ *    既不打挂任何东西，也不空着。
+ * 该包因此不进 bundle：源码里只有 `require` 调用（bundle 白名单在 src/utils/bundle-scan.ts 登记）。
+ */
+import type { ComponentType, ReactNode } from 'react'
+import { Icon } from '../common/Icon.tsx'
+
+/** 装配点注入的「外部图标来源」（dsh-better-sidebar 的 `fileIcon`）；返回 null = 它不认这一条。 */
+export type RollbackFileIconRenderer = (path: string) => ReactNode | null
+
+/** `FileTypeIcon` 我们真的用到的入参面（只声明消费的字段，不复制第三方类型）。 */
+interface DshFileTypeIconProps {
+  path: string
+  size?: number
+  className?: string
+}
+
+/** 惰取结果的三态缓存（undefined = 还没试过；null = 试过了，这台宿主没有）。 */
+let cachedDshFileTypeIcon: ComponentType<DshFileTypeIconProps> | null | undefined
+
+/**
+ * 惰取 DSH 自带的 `FileTypeIcon`（**每次进程只试一次**，失败就记 null 不再重试）。
+ *
+ * 为什么不用 `import()`：动态 import 在 cjs 产物里同样要走模块表，且会把整个包拖进 chunk；
+ * 这里的 `require` 是 DSH loader 交给插件工厂的那一个（banner 里 `factory: (require) => {...}`）。
+ */
+function dshFileTypeIcon(): ComponentType<DshFileTypeIconProps> | null {
+  if (cachedDshFileTypeIcon !== undefined) return cachedDshFileTypeIcon
+  cachedDshFileTypeIcon = null
+  try {
+    const loaded = (typeof require === 'function' ? require('@deepseek-ai/dsh-client-ui-primitives') : null) as
+      | { FileTypeIcon?: unknown }
+      | null
+    const icon = loaded?.FileTypeIcon
+    if (typeof icon === 'function' || typeof icon === 'object') {
+      cachedDshFileTypeIcon = icon as ComponentType<DshFileTypeIconProps>
+    }
+  } catch {
+    cachedDshFileTypeIcon = null
+  }
+  return cachedDshFileTypeIcon
+}
+
+/**
+ * 最后的兜底：共享图标原语的通用「文件」图标（`common/Icon.tsx` 的 `name="file"`）。
+ * 只有「没有 better-sidebar + 宿主模块表里没有 ui-primitives」两条同时成立时才会出现 ——
+ * 那时宁可用一颗通用文件图标，也不空着、更不打挂这一行。
+ * 走共享原语而不是就地写 `<svg>`：DESIGN.md §「图标」把 `common/Icon.tsx` 定为唯一出口。
+ */
+function fallbackFileGlyph(size: number): ReactNode {
+  return <Icon name="file" size={size} />
+}
+
+export interface RollbackFileIconProps {
+  /** 文件绝对路径（图标按扩展名/文件名分类；路径越完整越准）。 */
+  path: string
+  /** 边长（px）；缺省 14 = DSH 文件树行内图标尺寸。 */
+  size?: number
+  /** 外部来源（可选）：返回 null / 抛错都回落 DSH 自带画法。 */
+  render?: RollbackFileIconRenderer
+}
+
+/** 一颗装饰性文件类型图标（可访问名由调用方负责：行内文件名的文字就是它的名字）。 */
+export function RollbackFileIcon({ path, size = 14, render }: RollbackFileIconProps) {
+  if (render !== undefined) {
+    let node: ReactNode | null = null
+    try {
+      node = render(path)
+    } catch {
+      node = null
+    }
+    // null / undefined / false = 这一条外部来源接不住 ⇒ 回落 DSH 自带画法（不猜、不空着）
+    if (node !== null && node !== undefined && node !== false) return <>{node}</>
+  }
+  const Dsh = dshFileTypeIcon()
+  if (Dsh !== null) return <Dsh path={path} size={size} />
+  return fallbackFileGlyph(size)
+}