dsh-sidenote 0.3.1 → 0.3.2

package/lib/types/client/chat/cards.d.ts

@@ -140,6 +140,10 @@ export interface NodeCardInput {
     meta?: unknown;
     /** 结果正文（已拼 text 块）。 */
     rawText: string;
+    /** 失败标记（0.1.2 节点 isError）——失败结果无 meta（presentationMeta 只投
+     *  影成功路径），但 write 的空-meta 回退必须先判它，否则失败的 write 也
+     *  会被渲染成 diff 卡（官方 diffCardModel 显式 isError → null）。 */
+    isError?: boolean | undefined;
     cwdBase?: string | undefined;
 }
 /**

package/lib/types/client/locales.d.ts

@@ -38,8 +38,18 @@ export declare const en: {
     permFullAccess: string;
     pendingNotice: string;
     writeNotice: string;
+    pendingApprovalTitle: string;
+    pendingApprovalDesc: string;
+    pendingReject: string;
+    pendingAllowOnce: string;
+    pendingQuestionTitle: string;
+    pendingPlanReview: string;
+    pendingQuestionSubmit: string;
+    pendingQuestionCancel: string;
+    pendingCustomPlaceholder: string;
     modelFollowsMain: string;
     stopReply: string;
+    sideChatDone: string;
     stopReplyTitle: string;
     send: string;
     attachTitle: string;

package/lib/types/client/sidechat/PendingCard.d.ts

@@ -0,0 +1,4 @@
+import type { PendingItem } from './pending.ts';
+export declare function PendingCardList({ items }: {
+    items: readonly PendingItem[];
+}): import("react").JSX.Element;

package/lib/types/client/sidechat/notify.d.ts

@@ -0,0 +1,16 @@
+/**
+ * 完成通知（WI-03，L3 常驻监听层）：侧聊子会话 running true→false 翻转时
+ * toast 提醒——用户焦点在主对话时侧聊长任务跑完能被看见（Zed
+ * notify_when_agent_waiting 先例）。
+ *
+ * 事件源是 session.subscribe 快照推送（非轮询）；宿主 notifier 入账不依赖
+ * 订阅者——面板不可见（SideChatPanel 的 uSES 断订阅）期间事件不丢。
+ * 本层是常驻 ctx.effect：Tab 开闭由 betterSidebar.subscribeState 重扫驱动。
+ */
+import type { Context } from '../host/contracts.ts';
+/**
+ * 翻转侦测核心（抽出来纯可测）：running true→false 且距挂接超过保护窗
+ * 时返回 true。调用方持状态。
+ */
+export declare function shouldNotify(wasRunning: boolean, running: boolean, attachedAt: number, now: number): boolean;
+export declare function registerCompletionNotify(ctx: Context): void;

package/lib/types/client/sidechat/pending.d.ts

@@ -0,0 +1,71 @@
+/**
+ * R8 侧边审批/提问答复（L0/L1：双版本数据源探测链 + 视图模型归一）。
+ *
+ * 侦察依据（.vibe Delivery_04/Workitem_02 design.md）：
+ * - pending 不在 projections.faceOf 体系——0.1.1 在 Session 快照顶层
+ *   `pending: PendingWait[]`（mux 帧铸造，重连重放 rpcId 不变）；0.1.2 移入
+ *   `ctx.get('uiSession').pendingInteractions`（Map<SessionId, Pending>，
+ *   每会话至多一项，precedence 仲裁）。
+ * - 写路径都是公开对象的公开方法：0.1.1 `wait.respond({ok,value})`（审批
+ *   value={sessionId, approvalId, outcome}；提问整批 {sessionId, answer}，
+ *   取消走 {ok:false,error:{code:'cancelled',…}}）；0.1.2 域对象
+ *   `answer(outcome|answer)` / `cancel()`。
+ * - 竞答安全：先答先得，settle 幂等——后答方 throw，UI catch 吞掉并回退
+ *   按钮态（宿主同款 `.catch(() => setAnswered(false))`）。
+ *
+ * off-face 纪律：两面都 feature-check；全缺席返回 undefined（面板回退
+ * pendingBar 跳转行为，不崩）。
+ */
+export interface PendingApprovalView {
+    kind: 'approval';
+    key: string;
+    toolName: string;
+    reason?: string | undefined;
+    answer: (outcome: 'allowed-once' | 'rejected') => Promise<void>;
+}
+export interface PendingQuestionOption {
+    label: string;
+    description?: string | undefined;
+}
+export interface PendingQuestionView {
+    kind: 'question';
+    key: string;
+    /** plan-review 按通用提问流降级（提交值逐字回传 asker 原 label）。 */
+    planReview: boolean;
+    questions: readonly {
+        id: string;
+        question: string;
+        header?: string | undefined;
+        detail?: string | undefined;
+        options: readonly PendingQuestionOption[];
+        multiSelect: boolean;
+    }[];
+    /** 整批提交（不可拆单题）：answers = [{id, selected: label[], custom?}]。 */
+    answer: (answers: readonly {
+        id: string;
+        selected: readonly string[];
+        custom?: string;
+    }[]) => Promise<void>;
+    cancel: () => Promise<void>;
+}
+export type PendingItem = PendingApprovalView | PendingQuestionView;
+export interface PendingStore {
+    readonly available: boolean;
+    subscribe(fn: () => void): () => void;
+    /** 缓存快照：底层引用不变则返回同一数组（uSES 纪律）。 */
+    getSnapshot(): readonly PendingItem[];
+}
+interface CtxLike {
+    get?: (key: string) => unknown;
+}
+interface SessionLike {
+    subscribe(fn: () => void): () => void;
+    getSnapshot(): unknown;
+}
+/**
+ * 双版本探测链（chatSourceOf 同款纪律）：0.1.2 uiSession.pendingInteractions
+ * （getSnapshot() 是 Map 才认）优先；0.1.1 Session 快照 pending 数组回退；
+ * 双缺席 undefined（面板回退 pendingBar 跳转）。
+ */
+export declare function createPendingStore(ctx: CtxLike, session: SessionLike | undefined, childId: string): PendingStore | undefined;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-sidenote",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "description": "DSH web plugin: Codex-style side chat (fork the current session into a persistent side panel) + selection annotations with numbered badges and a composer chip. A thin consumer of dsh-better-sidebar. / Codex 风格侧边聊天 + 划选注释的 DSH 插件。",
   "type": "module",
   "license": "MIT",

package/src/client/chat/cards.ts

@@ -356,8 +356,111 @@ function readMetaOf(meta: unknown): { path: string; lines: { number: number; tex
   }
 }
 
+/**
+ * FsDiffMeta 校验（0.1.2 diff 卡，dsh-tool-fs computeHunkDiffs 产物的忠实子集）。
+ * 返回值三态：{diffs 非空} / 'empty'（空数组——write create/同内容覆写是合法值，
+ * 客户端回退 args 整文件 diff）/ undefined（malformed——降级）。
+ * 逐项校验，一项违规整卡降级（官方 narrowDiffs 同款）。
+ */
+function diffMetaOf(meta: unknown): { diffs: readonly FileDiff[] } | 'empty' | undefined {
+  if (typeof meta !== 'object' || meta === null || Array.isArray(meta)) return undefined
+  const m = meta as { diffs?: unknown }
+  if (!Array.isArray(m.diffs)) return undefined
+  if (m.diffs.length === 0) return 'empty'
+  const diffs: FileDiff[] = []
+  for (const raw of m.diffs) {
+    const d = raw as { path?: unknown; oldText?: unknown; newText?: unknown }
+    if (typeof d?.path !== 'string') return undefined
+    if (d.oldText !== null && typeof d.oldText !== 'string') return undefined
+    if (typeof d.newText !== 'string') return undefined
+    diffs.push({ path: d.path, oldText: d.oldText, newText: d.newText } as FileDiff)
+  }
+  return { diffs }
+}
+
+/** SearchMeta 校验（0.1.2 search 卡；truncated/total 是硬字段；空结果合法）。 */
+function searchMetaOf(meta: unknown):
+  | { shape: 'matches'; files: readonly { path: string; matches: readonly { lineNumber: number; line: string }[] }[]; truncated: boolean; total: number }
+  | { shape: 'paths'; paths: readonly string[]; truncated: boolean; total: number }
+  | undefined {
+  if (typeof meta !== 'object' || meta === null || Array.isArray(meta)) return undefined
+  const m = meta as Record<string, unknown>
+  if (typeof m.truncated !== 'boolean') return undefined
+  if (typeof m.total !== 'number' || !Number.isInteger(m.total) || m.total < 0) return undefined
+  if (m.shape === 'matches') {
+    if (!Array.isArray(m.files)) return undefined
+    const files: { path: string; matches: { lineNumber: number; line: string }[] }[] = []
+    for (const rawF of m.files) {
+      const f = rawF as { path?: unknown; matches?: unknown }
+      if (typeof f?.path !== 'string' || !Array.isArray(f.matches)) return undefined
+      const matches: { lineNumber: number; line: string }[] = []
+      for (const rawM of f.matches) {
+        const mm = rawM as { lineNumber?: unknown; line?: unknown }
+        if (typeof mm?.lineNumber !== 'number' || !Number.isInteger(mm.lineNumber) || mm.lineNumber < 1) return undefined
+        if (typeof mm.line !== 'string') return undefined
+        matches.push({ lineNumber: mm.lineNumber, line: mm.line })
+      }
+      files.push({ path: f.path, matches })
+    }
+    return { shape: 'matches', files, truncated: m.truncated, total: m.total }
+  }
+  if (m.shape === 'paths') {
+    if (!Array.isArray(m.paths) || !m.paths.every(p => typeof p === 'string')) return undefined
+    return { shape: 'paths', paths: m.paths as readonly string[], truncated: m.truncated, total: m.total }
+  }
+  return undefined
+}
+
+/** WebSearchMeta 校验（sources 逐项 url 必填、title/snippet 可选；publishedAt 校验后丢弃）。 */
+function webSearchMetaOf(meta: unknown): { sources: readonly { url: string; title?: string; snippet?: string }[]; truncated: boolean; answer?: string } | undefined {
+  if (typeof meta !== 'object' || meta === null || Array.isArray(meta)) return undefined
+  const m = meta as Record<string, unknown>
+  if (typeof m.truncated !== 'boolean') return undefined
+  if (!Array.isArray(m.sources)) return undefined
+  const sources: { url: string; title?: string; snippet?: string }[] = []
+  for (const raw of m.sources) {
+    const s = raw as { url?: unknown; title?: unknown; snippet?: unknown; publishedAt?: unknown }
+    if (typeof s?.url !== 'string') return undefined
+    if (s.title !== undefined && typeof s.title !== 'string') return undefined
+    if (s.snippet !== undefined && typeof s.snippet !== 'string') return undefined
+    if (s.publishedAt !== undefined && typeof s.publishedAt !== 'string') return undefined
+    sources.push({
+      url: s.url,
+      ...(s.title !== undefined ? { title: s.title as string } : {}),
+      ...(s.snippet !== undefined ? { snippet: s.snippet as string } : {}),
+    })
+  }
+  if (m.answer !== undefined && typeof m.answer !== 'string') return undefined
+  return { sources, truncated: m.truncated, ...(m.answer !== undefined ? { answer: m.answer as string } : {}) }
+}
+
+/** WebFetchMeta 校验（url + 整数 statusCode + truncated 硬字段）。 */
+function webFetchMetaOf(meta: unknown): { url: string; statusCode: number; truncated: boolean } | undefined {
+  if (typeof meta !== 'object' || meta === null || Array.isArray(meta)) return undefined
+  const m = meta as Record<string, unknown>
+  if (typeof m.url !== 'string') return undefined
+  if (typeof m.statusCode !== 'number' || !Number.isInteger(m.statusCode)) return undefined
+  if (typeof m.truncated !== 'boolean') return undefined
+  return { url: m.url, statusCode: m.statusCode, truncated: m.truncated }
+}
+
 /** argsRaw（JSON 字符串）里尽力提取展示字段。 */
-function argsSummary(argsRaw: string | undefined): { command?: string; description?: string; path?: string; todos?: unknown } {
+function argsSummary(argsRaw: string | undefined): {
+  command?: string
+  description?: string
+  path?: string
+  todos?: unknown
+  /** diff 回退/标题：write 的 content、edit 的 old_string/new_string。 */
+  content?: string
+  oldString?: string
+  newString?: string
+  /** search 标题：pattern/include。 */
+  pattern?: string
+  include?: string
+  /** web 标题：queries（search）/ url（fetch）。 */
+  queries?: readonly string[]
+  url?: string
+} {
   if (argsRaw === undefined || argsRaw === '') return {}
   try {
     const parsed: unknown = JSON.parse(argsRaw)
@@ -368,6 +471,13 @@ function argsSummary(argsRaw: string | undefined): { command?: string; descripti
       ...(typeof a.description === 'string' ? { description: a.description } : {}),
       ...(typeof a.file_path === 'string' ? { path: a.file_path } : typeof a.path === 'string' ? { path: a.path } : {}),
       ...(Array.isArray(a.todos) ? { todos: a.todos } : {}),
+      ...(typeof a.content === 'string' ? { content: a.content } : {}),
+      ...(typeof a.old_string === 'string' ? { oldString: a.old_string } : {}),
+      ...(typeof a.new_string === 'string' ? { newString: a.new_string } : {}),
+      ...(typeof a.pattern === 'string' ? { pattern: a.pattern } : {}),
+      ...(typeof a.include === 'string' ? { include: a.include } : {}),
+      ...(Array.isArray(a.queries) && a.queries.every(q => typeof q === 'string') ? { queries: a.queries as readonly string[] } : {}),
+      ...(typeof a.url === 'string' ? { url: a.url } : {}),
     }
   } catch {
     return {}
@@ -383,6 +493,10 @@ export interface NodeCardInput {
   meta?: unknown
   /** 结果正文（已拼 text 块）。 */
   rawText: string
+  /** 失败标记（0.1.2 节点 isError）——失败结果无 meta（presentationMeta 只投
+   *  影成功路径），但 write 的空-meta 回退必须先判它，否则失败的 write 也
+   *  会被渲染成 diff 卡（官方 diffCardModel 显式 isError → null）。 */
+  isError?: boolean | undefined
   cwdBase?: string | undefined
 }
 
@@ -431,6 +545,71 @@ export function cardModelFromNode(input: NodeCardInput): ToolCardModel {
     if (items !== undefined) return { kind: 'todo', title: todoTitleOf(items), items }
   }
 
+  // write/edit → diff 卡（0.1.2 meta 逆向：FsDiffMeta {diffs: FileDiff[]}）。
+  // 官方语义（diffCardModel 实证）：失败结果不走 diff 卡；write 的 meta
+  // 缺失/malformed/空数组 → 回退 args 整文件 diff（create 语义）；edit 的
+  // meta 缺失/空 → 降级 generic。str_replace_editor settled 无 meta，官方走
+  // generic——不在此列。
+  if ((name === 'write' || name === 'edit') && input.isError !== true) {
+    const path = args.path
+    if (path !== undefined && path.trim() !== '') {
+      const dm = diffMetaOf(input.meta)
+      if (dm !== undefined && dm !== 'empty') {
+        return {
+          kind: 'diff',
+          title: displayTitle(`${name === 'write' ? 'Write' : 'Edit'} ${path}`),
+          diffs: dm.diffs,
+          locations: [{ path } as FileLocation],
+        }
+      }
+      // write 回退：整文件 diff（create/同内容覆写/meta 缺席同形）。
+      if (name === 'write' && args.content !== undefined) {
+        return {
+          kind: 'diff',
+          title: displayTitle(`Write ${path}`),
+          diffs: [{ path, oldText: null, newText: args.content } as FileDiff],
+          locations: [{ path } as FileLocation],
+        }
+      }
+    }
+  }
+
+  // grep/glob → search 卡（SearchMeta：shape 与工具名交叉校验；空结果合法）。
+  if ((name === 'grep' || name === 'glob') && input.isError !== true) {
+    const sm = searchMetaOf(input.meta)
+    const wantShape = name === 'grep' ? 'matches' : 'paths'
+    if (sm !== undefined && sm.shape === wantShape && args.pattern !== undefined) {
+      const where = args.path !== undefined && args.path.trim() !== '' ? ` in ${shortPath(args.path)}` : ''
+      const inc = name === 'grep' && args.include !== undefined && args.include.trim() !== '' ? ` (${args.include})` : ''
+      const title = `${name === 'grep' ? 'Grep' : 'Glob'} ${args.pattern}${where}${inc}`
+      return sm.shape === 'matches'
+        ? { kind: 'search', title, shape: 'matches', files: sm.files, truncated: sm.truncated, total: sm.total }
+        : { kind: 'search', title, shape: 'paths', paths: sm.paths, truncated: sm.truncated, total: sm.total }
+    }
+  }
+
+  // web_search/web_fetch → web 卡（meta 直读；publishedAt 校验后降采样丢弃）。
+  if (name === 'web_search' && input.isError !== true) {
+    const wm = webSearchMetaOf(input.meta)
+    const queries = args.queries?.filter(q => q.trim() !== '') ?? []
+    if (wm !== undefined && queries.length > 0) {
+      return {
+        kind: 'web',
+        title: queries.join(', '),
+        webKind: 'search',
+        sources: wm.sources,
+        truncated: wm.truncated,
+        ...(wm.answer !== undefined ? { answer: wm.answer } : {}),
+      }
+    }
+  }
+  if (name === 'web_fetch' && input.isError !== true) {
+    const wm = webFetchMetaOf(input.meta)
+    if (wm !== undefined && args.url !== undefined && args.url.trim() !== '') {
+      return { kind: 'web', title: args.url, webKind: 'fetch', url: wm.url, statusCode: wm.statusCode, truncated: wm.truncated }
+    }
+  }
+
   // 其余：generic（标题尽力从参数提取可读形态）。
   const title = args.path !== undefined
     ? `${name} · ${shortPath(args.path)}`
@@ -443,19 +622,22 @@ export function cardModelFromNode(input: NodeCardInput): ToolCardModel {
   }
 }
 
-/** 工具名 → 图标类别的静态映射（0.1.2 没有 callView.kind 可用）。 */
+/** 工具名 → 图标类别的静态映射（0.1.2 没有 callView.kind 可用）。
+ *  wire 名实证：str_replace_editor 是下划线（uitool client.js L381）；
+ *  web_search 的 0.1.1 wire kind 是 'search'（presentSearchCall），
+ *  'fetch' 是 web_fetch 的（presentFetchCall）。 */
 const KIND_BY_NAME: Record<string, ToolCallKind> = {
   read: 'read',
   write: 'edit',
   edit: 'edit',
-  'str-replace-editor': 'edit',
+  str_replace_editor: 'edit',
   bash: 'execute',
   'bash-persistent': 'execute',
   pwsh: 'execute',
   'pwsh-persistent': 'execute',
   grep: 'search',
   glob: 'search',
-  web_search: 'fetch',
+  web_search: 'search',
   web_fetch: 'fetch',
 }
 

package/src/client/chat/transcript.ts

@@ -133,6 +133,7 @@ export function nodeToMessage(node: unknown): ChatMessage | null {
             argsRaw: typeof call?.argsRaw === 'string' ? call.argsRaw : undefined,
             meta: n.meta,
             rawText: text,
+            ...(n.isError === true ? { isError: true } : {}),
           })
       return {
         key: seqKey('t', n),

package/src/client/locales.ts

@@ -40,10 +40,20 @@ export const en = {
   modelSwitchTitle: 'Switch the side chat model',
   permChipTitle: 'Permission mode',
   permFullAccess: 'Full access',
-  pendingNotice: '⚠ 侧边会话有审批/提问待处理——点击跳到主视图处理',
-  writeNotice: '侧边会话与主会话同权限，可以修改文件（当前模式见输入框旁 chip）',
+  pendingNotice: '⚠ The side session has a pending approval/question — click to handle it in the main view',
+  writeNotice: 'The side session shares the main session\'s permissions and can modify files (current mode: chip next to the input)',
+  pendingApprovalTitle: 'Waiting for approval',
+  pendingApprovalDesc: 'Tool {name} requests elevated execution',
+  pendingReject: 'Reject',
+  pendingAllowOnce: 'Allow once',
+  pendingQuestionTitle: 'Question',
+  pendingPlanReview: 'Plan review',
+  pendingQuestionSubmit: 'Submit',
+  pendingQuestionCancel: 'Cancel',
+  pendingCustomPlaceholder: 'Custom answer…',
   modelFollowsMain: 'follows main session',
   stopReply: 'Stop',
+  sideChatDone: '「{title}」finished replying',
   stopReplyTitle: 'Stop the current reply',
   send: 'Send',
   attachTitle: 'Attach images',
@@ -198,8 +208,18 @@ export const zh: Record<CopyKey, string> = {
   permFullAccess: 'Full access',
   pendingNotice: '⚠ 侧边会话有审批/提问待处理——点击跳到主视图处理',
   writeNotice: '侧边会话与主会话同权限，可以修改文件（当前模式见输入框旁 chip）',
+  pendingApprovalTitle: '等待审批',
+  pendingApprovalDesc: '工具 {name} 请求越权执行',
+  pendingReject: '拒绝',
+  pendingAllowOnce: '允许一次',
+  pendingQuestionTitle: '提问',
+  pendingPlanReview: '计划审批',
+  pendingQuestionSubmit: '提交回答',
+  pendingQuestionCancel: '取消',
+  pendingCustomPlaceholder: '自定义回答…',
   modelFollowsMain: '跟随主会话',
   stopReply: '停止',
+  sideChatDone: '「{title}」回复完成',
   stopReplyTitle: '停止当前回复',
   send: '发送',
   attachTitle: '添加图片附件',

package/src/client/sidechat/PendingCard.tsx

@@ -0,0 +1,145 @@
+/**
+ * R8 审批/提问答复卡（L2 视图）：钉在 composer 上方（原 pendingBar 位置）。
+ * 自绘 + primitives 图标（材质同源，不求像素级复刻宿主审批卡）。
+ *
+ * 竞答纪律：先答先得——点击后置 answered 本地态；answer 失败（已被主视图
+ * 抢答/settle）catch 吞错并回退按钮态（宿主 `.catch(() => setAnswered(false))`
+ * 同款）；卡片消失由快照驱动（pending 项消失即卸载），UI 不自造状态机。
+ */
+import { useState } from 'react'
+import { IconWarningOutline16, IconQuestionOutline14 } from '@deepseek-ai/dsh-client-ui-primitives'
+import type { PendingItem, PendingQuestionView } from './pending.ts'
+import { t } from '../locales.ts'
+import { useLocaleTick } from '../locale-tick.ts'
+import css from './sidechat.module.css'
+
+export function PendingCardList({ items }: { items: readonly PendingItem[] }) {
+  return (
+    <>
+      {items.map(item => item.kind === 'approval'
+        ? <ApprovalCard key={item.key} item={item} />
+        : <QuestionCard key={item.key} item={item} />)}
+    </>
+  )
+}
+
+/** 审批卡：reason + 拒绝 / 允许一次。 */
+function ApprovalCard({ item }: { item: Extract<PendingItem, { kind: 'approval' }> }) {
+  useLocaleTick()
+  const [answered, setAnswered] = useState(false)
+  const answer = (outcome: 'allowed-once' | 'rejected'): void => {
+    setAnswered(true)
+    item.answer(outcome).catch(() => { setAnswered(false) })
+  }
+  return (
+    <div className={css.pendingCard} data-kind="approval">
+      <div className={css.pendingHead}>
+        <IconWarningOutline16 size={14} />
+        <span className={css.pendingTitle}>{t('pendingApprovalTitle')}</span>
+      </div>
+      <div className={css.pendingDesc}>{t('pendingApprovalDesc', { name: item.toolName })}</div>
+      {item.reason !== undefined && item.reason !== '' && <div className={css.pendingReason}>{item.reason}</div>}
+      <div className={css.pendingActions}>
+        <button type="button" className={css.pendingBtnGhost} disabled={answered} onClick={() => { answer('rejected') }}>
+          {t('pendingReject')}
+        </button>
+        <button type="button" className={css.pendingBtnPrimary} disabled={answered} onClick={() => { answer('allowed-once') }}>
+          {t('pendingAllowOnce')}
+        </button>
+      </div>
+    </div>
+  )
+}
+
+/** 提问卡：选项（单选即点即答语义并入整批提交）+ 自定义 + 整批提交/取消。 */
+function QuestionCard({ item }: { item: PendingQuestionView }) {
+  useLocaleTick()
+  // 每题的选择集合（多选为 Set；单选为单元素 Set）+ 自定义文本。
+  const [selections, setSelections] = useState<ReadonlyMap<string, ReadonlySet<string>>>(new Map())
+  const [customs, setCustoms] = useState<ReadonlyMap<string, string>>(new Map())
+  const [answered, setAnswered] = useState(false)
+
+  const toggle = (qid: string, label: string, multi: boolean): void => {
+    const next = new Map(selections)
+    const cur = new Set(next.get(qid) ?? [])
+    if (multi) {
+      if (cur.has(label)) cur.delete(label)
+      else cur.add(label)
+    } else {
+      cur.clear()
+      cur.add(label)
+    }
+    next.set(qid, cur)
+    setSelections(next)
+  }
+
+  // 提交门槛：每题至少有选中项或自定义文本（整批语义，不留空题）。
+  const ready = item.questions.every(q =>
+    (selections.get(q.id)?.size ?? 0) > 0 || (customs.get(q.id)?.trim() ?? '') !== '',
+  )
+
+  const submit = (): void => {
+    setAnswered(true)
+    item.answer(item.questions.map(q => ({
+      id: q.id,
+      selected: [...(selections.get(q.id) ?? [])],
+      ...((customs.get(q.id)?.trim() ?? '') !== '' ? { custom: customs.get(q.id)!.trim() } : {}),
+    }))).catch(() => { setAnswered(false) })
+  }
+  const cancel = (): void => {
+    setAnswered(true)
+    item.cancel().catch(() => { setAnswered(false) })
+  }
+
+  return (
+    <div className={css.pendingCard} data-kind="question">
+      <div className={css.pendingHead}>
+        <IconQuestionOutline14 size={14} />
+        <span className={css.pendingTitle}>
+          {item.planReview ? t('pendingPlanReview') : t('pendingQuestionTitle')}
+        </span>
+      </div>
+      {item.questions.map(q => (
+        <div key={q.id} className={css.pendingQuestion}>
+          {q.header !== undefined && q.header !== '' && <div className={css.pendingQHeader}>{q.header}</div>}
+          <div className={css.pendingQText}>{q.question}</div>
+          {q.detail !== undefined && q.detail !== '' && <div className={css.pendingReason}>{q.detail}</div>}
+          {q.options.map(o => {
+            const active = selections.get(q.id)?.has(o.label) === true
+            return (
+              <button
+                key={o.label}
+                type="button"
+                className={active ? css.pendingOptionActive : css.pendingOption}
+                disabled={answered}
+                onClick={() => { toggle(q.id, o.label, q.multiSelect) }}
+              >
+                {o.label}
+                {o.description !== undefined && o.description !== '' && <span className={css.pendingOptionDesc}>{o.description}</span>}
+              </button>
+            )
+          })}
+          <input
+            className={css.pendingCustom}
+            placeholder={t('pendingCustomPlaceholder')}
+            disabled={answered}
+            value={customs.get(q.id) ?? ''}
+            onChange={(event) => {
+              const next = new Map(customs)
+              next.set(q.id, event.target.value)
+              setCustoms(next)
+            }}
+          />
+        </div>
+      ))}
+      <div className={css.pendingActions}>
+        <button type="button" className={css.pendingBtnGhost} disabled={answered} onClick={cancel}>
+          {t('pendingQuestionCancel')}
+        </button>
+        <button type="button" className={css.pendingBtnPrimary} disabled={answered || !ready} onClick={submit}>
+          {t('pendingQuestionSubmit')}
+        </button>
+      </div>
+    </div>
+  )
+}

package/src/client/sidechat/SideChatPanel.tsx

@@ -27,11 +27,15 @@ import { FoldCard } from '../chat/FoldCard.tsx'
 import { createFoldStore } from '../chat/viewState.ts'
 import type { ReflowStore } from '../reflow.ts'
 import { showToast } from './toast.tsx'
+import { createPendingStore } from './pending.ts'
+import { PendingCardList } from './PendingCard.tsx'
 import { t } from '../locales.ts'
 import { useLocaleTick } from '../locale-tick.ts'
 import css from './sidechat.module.css'
 
 const NOOP_UNSUBSCRIBE = (): void => {}
+/** uSES 空快照常量（禁产新引用——`?? []` 字面量每次新数组会无限重渲）。 */
+const NO_PENDING: readonly import('./pending.ts').PendingItem[] = []
 
 /** D2 写型工具名（无 diff 卡时的名字兜底）。 */
 const WRITE_TOOLS = new Set(['edit', 'write', 'str-replace-editor', 'str_replace_editor'])
@@ -133,6 +137,23 @@ export function SideChatPanel(props: TabComponentProps & { reflow: ReflowStore }
     ),
     () => (parentSession === undefined ? null : parentSession.getSnapshot()),
   )
+  // R8：审批/提问数据源（双版本探测链——0.1.2 uiSession.pendingInteractions
+  // 优先，0.1.1 Session 快照 pending 回退；面缺席 undefined → 回退纯跳转
+  // pendingBar）。hooks 纪律：必须在相位早退之前（#310 教训）。
+  const pendingStore = useMemo(
+    () => (childId === undefined || session === undefined ? undefined : createPendingStore(ctx, session, childId)),
+    [ctx, session, childId],
+  )
+  const pendingItems = useSyncExternalStore(
+    useCallback(
+      (notify: () => void) => (visible && pendingStore !== undefined ? pendingStore.subscribe(notify) : NOOP_UNSUBSCRIBE),
+      [visible, pendingStore],
+    ),
+    // NO_PENDING 常量：uSES getSnapshot 禁产新引用（`?? []` 每次新数组 →
+    // 无限重渲——实证教训）。
+    () => pendingStore?.getSnapshot() ?? NO_PENDING,
+  )
+
   // D2 提示的消除态（hooks 纪律：必须在相位早退之前——#310 教训）。
   const [writeNoticeDismissed, setWriteNoticeDismissed] = useState(
     () => typeof localStorage !== 'undefined' && localStorage.getItem(WRITE_NOTICE_KEY) === '1',
@@ -321,7 +342,12 @@ export function SideChatPanel(props: TabComponentProps & { reflow: ReflowStore }
           >×</button>
         </div>
       )}
-      {pendingCount > 0 && childId !== undefined && (
+      {/* R8：数据源在场 → 面板内审批/提问答复卡；面缺席（老宿主）→ 回退
+          纯跳转 pendingBar（原行为不变）。 */}
+      {pendingStore !== undefined && pendingItems.length > 0 && (
+        <PendingCardList items={pendingItems} />
+      )}
+      {pendingStore === undefined && pendingCount > 0 && childId !== undefined && (
         <button
           type="button"
           className={css.pendingBar}

package/src/client/sidechat/index.tsx

@@ -29,6 +29,7 @@ import { registerHeaderEntry } from './header.tsx'
 import { registerSideCommand } from './slash.ts'
 import { registerSideChatReferenceSource } from './referenceSource.ts'
 import { registerToastHost } from './toast.tsx'
+import { registerCompletionNotify } from './notify.ts'
 
 export function registerSideChat(ctx: Context, reflow: ReflowStore): void {
   ctx.effect(
@@ -79,4 +80,6 @@ export function registerSideChat(ctx: Context, reflow: ReflowStore): void {
   registerHeaderEntry(ctx)
   // 全局瞬态通知宿主（P4：转正确认等跨 Tab 寿命的反馈）。
   registerToastHost(ctx)
+  // 完成通知（WI-03）：侧聊 running 翻转 → toast。
+  registerCompletionNotify(ctx)
 }