@spzxg/cli-ui 0.6.6 → 0.6.7

package/dist/cli-ui.js

@@ -1,4 +1,4 @@
-import { C as a, b as i, d as r, e as t, f as o, h as C, i as l, j as n, k as m, m as d, l as u, n as w, o as B, p as f } from "./cli-ui-embed-BAqonuoD.js";
+import { C as a, b as i, d as r, e as t, f as o, h as C, i as l, j as n, k as m, m as d, l as u, n as w, o as B, p as f } from "./cli-ui-embed-CB7ibAtF.js";
 export {
   a as CliBoard,
   i as CliBrowserView,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spzxg/cli-ui",
-  "version": "0.6.6",
+  "version": "0.6.7",
   "type": "module",
   "description": "相互联动的 CliMsgList、CliChat、CliBoard，支持任务中枢和完整 Operator 工作区。",
   "main": "src/index.ts",
@@ -41,6 +41,7 @@
     "@types/react": "19.2.17",
     "@types/react-dom": "19.2.3",
     "@vitejs/plugin-react": "4.7.0",
+    "fake-indexeddb": "^6.2.7",
     "jsdom": "^25.0.1",
     "postcss": "^8.5.32",
     "typescript": "^5.7.3",
@@ -51,6 +52,7 @@
     "@xterm/addon-fit": "^0.11.0",
     "@xterm/addon-web-links": "^0.12.0",
     "@xterm/xterm": "^6.0.0",
+    "htmlparser2": "10.0.0",
     "jszip": "^3.10.2",
     "mammoth": "^1.13.0",
     "react-markdown": "^10.1.0",

package/src/board/CliBoard.tsx

@@ -1,3 +1,5 @@
+import { retryWorkspaceFiles } from "./fileWatch";
+import { retainFileScope } from "./fileScope";
 // cli-board：右侧看板。界面取自 Operator 的会话右栏（SessionRail）：文件 / 改动 / 浏览器三个页签。
 // 数据经 center 的 /api/jobs/:id/board、files、diff、browser 转发自执行节点（浏览器不直连节点）。
 //
@@ -5,17 +7,16 @@
 //   · 改动：分支上的 diff（只读）；
 //   · 浏览器：任务浏览器的实时画面、接管 / 交还、打开 / 关闭。
 //
-// 同步：任务每有进展（实时流里的轮次 / 输出变化）就刷新，运行中再定时刷新；打开着的文件改了会自动重读。
+// 同步：每轮实时输出结束、恢复页面或手动刷新时检查打开的文件，只读取缺失变化块；没有周期轮询。
 // 和 cli-chat 放在同一个 Provider 里时，对话里点本地文件 / 「查看浏览器」会在这里打开（store.openInBoard）。
 import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState, type CSSProperties, type ReactNode } from "react";
+import { createPortal } from "react-dom";
 import { CliErrorBoundary } from "../ui/ErrorBoundary";
 import type { BoardRef, CliEvent, CliStore, CliStoreOptions, OpenTarget } from "../core/store";
 import { useCliState, useCliStore, useCliStoreContext, useComponentEvents, withOwnProvider } from "../core/provider";
 import { convKey, parseConvKey, isRunning } from "../core/conversation";
-import { toolDataOf } from "../ui/transcriptModel";
 import type { BoardInfo, FileEntry } from "../core/types";
 import { Icon } from "../ui/icons";
-import { CenterError } from "../core/client";
 import { FileViewer, type FileAction } from "./FileViewer";
 import { FilesPane } from "./FilesPane";
 import { ChangesPane } from "./ChangesPane";
@@ -24,7 +25,9 @@ import { rememberBoardFile } from "./context";
 import type { BoardFile } from "./workspace";
 import type { WorkspaceHandlers } from "../core/provider";
 import { useBoardPanels } from "./panels";
-import { PanelControls, PanelTab } from "./PanelControls";
+import { PanelControls, PanelTab, type InlineBoardLayout } from "./PanelControls";
+import { useBoardVisibility } from "./useBoardVisibility";
+import { useBoardUpload } from "./useBoardUpload";
 
 export type BoardTab = "files" | "changes" | "browser";
 
@@ -34,7 +37,7 @@ export interface BoardExtraTab {
   label: string;
   render: (ctx: { jobId: string; store: CliStore; quote: (ref: Omit<BoardRef, "id"> & { id?: string }) => void }) => ReactNode;
 }
-const TAB_LABEL: Record<BoardTab, string> = { files: "文件", changes: "改动", browser: "浏览器" };
+const TAB_LABEL: Record<BoardTab, string> = { files: "工作区", changes: "改动", browser: "浏览器" };
 /** 同时开着的文件页签最多几个：再开新的，关掉最早打开、当前没在看的那个。 */
 export const MAX_FILE_TABS = 8;
 const FILE_TAB = "file:";
@@ -53,12 +56,19 @@ const useIsoLayoutEffect = typeof window === "undefined" ? useEffect : useLayout
 function saveTabs(jobId: string, files: string[], tab: string, history: BoardFile[]) {
   try { sessionStorage.setItem(tabsKey(jobId), JSON.stringify({ files, tab, history })); } catch { /* 存不下就不记 */ }
 }
-/** 有输出就刷新文件，但两次之间至少隔这么久（智能体连写几十个文件时不至于每个都打一次中枢）。 */
-const ACTIVITY_GAP_MS = 700;
 
 export interface CliBoardProps extends CliStoreOptions, WorkspaceHandlers {
-  /** 默认监听整个工作区，收起后继续。旧中枢降级状态可由 onFilesWatch 观察。 */
+  /** @internal 同一个看板在 Chat 标题区放置页签。 */
+  inlineLayout?: InlineBoardLayout;
+  /** @internal 将当前 Chat 的打开请求交给自己的内嵌看板。 */
+  inlineOwner?: string;
+  /** @internal 手机抽屉沿用看板内容，独立控制它的可见状态。 */
+  visible?: boolean;
+  /** @internal 引用后返回当前 Chat。 */
+  onQuoteToChat?: () => void;
+  /** 默认在轮次结束、恢复页面和手动刷新时检查已打开文件与可见目录。收起后暂停文件读取。 */
   watchFiles?: boolean;
+  /** @deprecated 保留兼容；文件同步由事件触发，不再使用定时间隔。 */
   fileWatchIntervalMs?: number;
   /** 看哪个对话（center 的 job_id）。不给就跟共享仓库的选中走（和 cli-msglist / cli-chat 联动）。 */
   jobId?: string | null;
@@ -73,7 +83,7 @@ export interface CliBoardProps extends CliStoreOptions, WorkspaceHandlers {
   readOnly?: boolean;
   /** 文件上的自定义操作（预览头部的按钮）。 */
   fileActions?: FileAction[];
-  /** 运行中兜底刷新文件列表的间隔，缺省 15000ms（文件变化主要靠实时流里的工具结果触发，这里只兜底；人多时每人每 4 秒去节点列一次目录太重）；0 = 只在实时流有变化时刷新。改动（diff）不轮询，只在有进展时刷新。 */
+  /** @deprecated 保留兼容；文件同步由事件触发，不再进行定时轮询。 */
   pollMs?: number;
   /** 接不接对话里的「打开文件 / 查看浏览器」，缺省接。 */
   acceptOpen?: boolean;
@@ -113,15 +123,23 @@ export function CliBoard(props: CliBoardProps) {
   return <CliErrorBoundary component="cli-board" theme={props.theme}>{withOwnProvider(props, <BoardInner {...props} inProvider={!!ctx} />, !!ctx)}</CliErrorBoundary>;
 }
 
-interface OpenFile { reloadKey?:number; path: string; size?: number; mtime?: number; version: number }
+interface OpenFile { name?: string; reloadKey?:number; path: string; size?: number; mtime?: number; version: number }
 
-function BoardInner({ jobId: jobIdProp, taskId: taskIdProp, tabs, availableTabs, defaultTab, readOnly, fileActions, pollMs = 15_000, acceptOpen = true, quoteToChat, autoQuoteOpenFile, extraTabs, onCollapse, collapsed, onExpand, onNavigate, onEvent, onFilesChange, onFilesWatch, onBoardContextChange, watchFiles = true, fileWatchIntervalMs, theme = "light", className, style, inProvider }: CliBoardProps & { inProvider: boolean }) {
+function BoardInner({ jobId: jobIdProp, taskId: taskIdProp, tabs, availableTabs, defaultTab, readOnly, fileActions, acceptOpen = true, quoteToChat, autoQuoteOpenFile, extraTabs, onCollapse, collapsed, onExpand, onNavigate, onEvent, onFilesChange, onFilesWatch, onBoardContextChange, watchFiles = true, fileWatchIntervalMs, theme = "light", className, style, inProvider, inlineLayout, inlineOwner, visible: visibilityOverride, onQuoteToChat }: CliBoardProps & { inProvider: boolean }) {
   useComponentEvents(onEvent, {onFilesChange,onFilesWatch,onBoardContextChange}, inProvider);
   const store = useCliStore();
   const backend = store.client.board;
   const selected = useCliState((s) => s.selected);
   // 内部用对话键（见 core/conversation.ts）：看板接口按它找对话任务里的那个对话。
   const jobId = jobIdProp !== undefined ? (jobIdProp ? convKey(parseConvKey(jobIdProp).jobId, taskIdProp ?? parseConvKey(jobIdProp).taskId) : null) : selected;
+  const rootRef = useRef<HTMLElement | null>(null);
+  const isInline = !!inlineOwner || !!inlineLayout;
+  const cssVisible = useBoardVisibility(rootRef, !isInline);
+  const visible = !collapsed && (isInline ? visibilityOverride ?? inlineLayout?.active ?? true : cssVisible);
+  const layoutRef = useRef(inlineLayout);
+  layoutRef.current = inlineLayout;
+  const quoteCallbackRef = useRef(onQuoteToChat);
+  quoteCallbackRef.current = onQuoteToChat;
 
   const storageId = jobId && store.draftScope ? `${store.draftScope}:${jobId}` : jobId;
   const [info, setInfo] = useState<BoardInfo | null>(null);
@@ -131,12 +149,8 @@ function BoardInner({ jobId: jobIdProp, taskId: taskIdProp, tabs, availableTabs,
   const [dir, setDir] = useState("");
   const [files, setFiles] = useState<OpenFile[]>([]);
   const [history,setHistory] = useState<BoardFile[]>([]);
-  // 刷新信号，按代价分开：
-  //   tick     进展（实时流有新输出 / 轮次变化，节流）、切回页面、手动刷新 —— 文件、改动、打开的文件都跟着刷新；
-  //   pollTick 运行中的定时刷新 —— 只刷文件列表和打开的文件（改动要在节点上跑 git diff，不轮询）；
-  //   statusKey 轮次 / 对话状态变化 —— 才重新查看板概况（它会探测节点的浏览器接口，不随输出刷新）。
+  // 文件变化、恢复页面与手动刷新更新视图；流式轮末检查由 store 直接触发。
   const [tick, setTick] = useState(0);
-  const [pollTick, setPollTick] = useState(0);
 
   // 换了对话：回到初始状态。
   const lastJob = useRef(jobId);
@@ -147,14 +161,8 @@ function BoardInner({ jobId: jobIdProp, taskId: taskIdProp, tabs, availableTabs,
   }
   // 恢复上次开着的文件页签（存在 sessionStorage）：挂上之后、绘制之前做——服务端渲染和首次渲染一致，不会对不上。
   const restored = useRef<string | null>(null);
-  useIsoLayoutEffect(() => {
-    if (!storageId || restored.current === storageId) return;
-    restored.current = storageId;
-    const saved = loadTabs(storageId);
-    setHistory(saved.history.map(file=>({...file,sourceId:file.sourceId??jobId??undefined})));
-    if (saved.files.length) setFiles((cur) => (cur.length ? cur : saved.files.map((path) => ({ path, version: 0 }))));
-    if (saved.tab) setTab((cur) => (cur === (defaultTab ?? tabs?.[0] ?? "files") ? saved.tab! : cur));
-  }, [storageId]);
+  const [hydrated, setHydrated] = useState<{ id: string | null; visible: boolean }>({ id: null, visible: false });
+  const restoreNeeded = hydrated.id !== storageId || (!isInline && visible && !hydrated.visible);
 
   // 实时流：看板单独用时也要知道任务在不在跑（同一对话只连一次）。
   useEffect(() => (jobId ? store.open(jobId) : undefined), [store, jobId]);
@@ -164,67 +172,58 @@ function BoardInner({ jobId: jobIdProp, taskId: taskIdProp, tabs, availableTabs,
   const statusKey = conv
     ? `${conv.turns.map((t) => `${t.turn_id}:${t.status}`).join(",")}|${conv.job?.status ?? ""}|${conv.task?.id ?? ""}:${conv.task?.status ?? ""}:${conv.remoteTaskId ?? conv.task?.remote_task_id ?? ""}`
     : "";
-  // 能改动文件的只有工具调用：签名 = 轮次状态 + 消息条数 + 最近一个工具拿没拿到结果（拿到结果就是文件刚写完）。
-  // 智能体逐字输出回复时条数和工具都不变，不触发刷新——几十个人同时看也不会每秒去节点上列一遍目录。
-  const lastTool = useMemo(() => {
-    const msgs = conv?.msgs ?? [];
-    for (let i = msgs.length - 1, n = 0; i >= 0 && n < 50; i--, n++) if (msgs[i].role === "tool") return `${msgs[i].id}:${toolDataOf(msgs[i]).result !== undefined}`;
-    return "";
-  }, [conv?.msgs]);
-  const activity = conv ? `${statusKey}|${conv.msgs.length}|${lastTool}` : "";
-
   const bump = useCallback(() => setTick((n) => n + 1), []);
-  // 手动刷新（页签栏的 ↻）：连看板概况一起重查。
   const [manual, setManual] = useState(0);
-  const refreshAll = useCallback(() => { setManual((n) => n + 1); bump(); }, [bump]);
-  const lastBump = useRef(0);
-  const pending = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);
-  useEffect(() => {
-    if (!activity) return;
-    const wait = Math.max(0, ACTIVITY_GAP_MS - (Date.now() - lastBump.current));
-    if (pending.current) clearTimeout(pending.current);
-    pending.current = setTimeout(() => { lastBump.current = Date.now(); bump(); }, wait);
-    return () => { if (pending.current) clearTimeout(pending.current); };
-  }, [activity, bump]);
-  useEffect(() => {
-    if (!running || !pollMs) return;
-    const t = setInterval(() => { if (document.visibilityState === "visible") setPollTick((n) => n + 1); }, pollMs);
-    return () => clearInterval(t);
-  }, [running, pollMs, bump]);
+  const refreshAll = useCallback(() => {
+    setManual((n) => n + 1); bump();
+    if (backend && jobId) retryWorkspaceFiles(backend, jobId, { manual: true });
+  }, [bump, backend, jobId]);
   useEffect(() => {
     const on = () => { if (document.visibilityState === "visible") bump(); };
     document.addEventListener("visibilitychange", on);
     return () => document.removeEventListener("visibilitychange", on);
   }, [bump]);
 
-  // 看板信息：还没派发到节点时每 3 秒再问一次。
+  // 派发和节点变化由已有聊天流驱动，不为文件看板再开启轮询。
   useEffect(() => {
     if (!backend || !jobId) return;
     let alive = true;
-    let timer: ReturnType<typeof setTimeout> | undefined;
-    const load = () => backend.info(jobId).then((i) => {
+    void backend.info(jobId).then((i) => {
       if (!alive) return;
       setInfo((old) => (old && old.dispatched === i.dispatched && old.remote_task_id === i.remote_task_id && old.files === i.files && old.browser === i.browser && old.node?.health === i.node?.health ? old : i));
       setInfoError(null);
-      if (!i.dispatched) timer = setTimeout(load, 3000);
-    }, (e: unknown) => {
-      if (!alive) return;
-      setInfoError(e instanceof Error ? e.message : String(e));
-      timer = setTimeout(load, 5000);
-    });
-    void load();
-    return () => { alive = false; if (timer) clearTimeout(timer); };
-  }, [backend, jobId, statusKey, manual]); // eslint-disable-line react-hooks/exhaustive-deps
+    }, (e: unknown) => { if (alive) setInfoError(e instanceof Error ? e.message : String(e)); });
+    return () => { alive = false; };
+  }, [backend, jobId, statusKey, manual]);
 
   const builtinTabs = useMemo<string[]>(() => (availableTabs ?? ["files", "changes", "browser"]).filter(t => ["files","changes","browser"].includes(t)).filter(t => t !== "browser" || !info || info.browser !== false).filter(t => t !== "files" || !info || info.files !== false), [availableTabs, info?.browser, info?.files]);
   const allowedPanels = [...builtinTabs, ...(extraTabs ?? []).map(t => t.id)];
   const panels = useBoardPanels(jobId ? `center:${storageId}` : null, allowedPanels, [...(tabs ?? builtinTabs.filter(tab=>tab!=="changes")), ...(extraTabs ?? []).map(t => t.id)]);
+  useIsoLayoutEffect(() => {
+    if (!restoreNeeded) {
+      if (!visible && hydrated.visible) setHydrated({ id: storageId, visible: false });
+      return;
+    }
+    if (storageId) {
+      const current = jobId ? store.getState().boardContext[jobId] : undefined;
+      const saved = loadTabs(storageId);
+      const paths = current?.files ?? saved.files;
+      restored.current = storageId;
+      setFiles(previous => paths.map(path => previous.find(file => file.path === path) ?? { path, version: 0 }));
+      setHistory((current?.history ?? saved.history).map(file => ({ ...file, sourceId: file.sourceId ?? jobId ?? undefined })));
+      setDir(current?.dir ?? "");
+      const selectedTab = current?.tab ?? saved.tab;
+      if (selectedTab) { setTab(selectedTab); if (allowedPanels.includes(selectedTab)) panels.show(selectedTab); }
+    }
+    setHydrated({ id: storageId, visible });
+  }, [store, storageId, jobId, visible, restoreNeeded]); // eslint-disable-line react-hooks/exhaustive-deps
   const shownTabs = [...panels.open, ...(builtinTabs.includes("files") ? files.map(f => fileTabId(f.path)) : [])];
   const activeTab = shownTabs.includes(tab) ? tab : shownTabs[0] ?? "";
   const file = activeTab.startsWith(FILE_TAB) ? files.find((f) => fileTabId(f.path) === activeTab) ?? null : null;
   useEffect(()=>{if(file&&jobId)setHistory(previous=>{const next=rememberBoardFile(previous,{path:file.path,sourceId:jobId});return JSON.stringify(next)===JSON.stringify(previous)?previous:next;});},[file?.path,jobId]);
-  const tabLabel = (t: string) => TAB_LABEL[t as BoardTab] ?? (t.startsWith(FILE_TAB) ? t.slice(FILE_TAB.length).split("/").pop() || t : undefined) ?? extraTabs?.find((x) => x.id === t)?.label ?? t;
+  const tabLabel = (t: string) => TAB_LABEL[t as BoardTab] ?? (t.startsWith(FILE_TAB) ? files.find(file => file.path === t.slice(FILE_TAB.length))?.name || t.slice(FILE_TAB.length).split("/").pop() || t : undefined) ?? extraTabs?.find((x) => x.id === t)?.label ?? t;
   // 页签多了横向滚动：当前页签总是滚到看得见的地方（新开的文件页签在最后，窄看板里容易被挤出去）。
+  const [toolbarHost, setToolbarHost] = useState<HTMLSpanElement | null>(null);
   const tabsRef = useRef<HTMLDivElement | null>(null);
   const revealTab = useCallback(() => {
     // 直接算滚动位置，不用 scrollIntoView：它会连带滚动宿主页面。
@@ -242,7 +241,7 @@ function BoardInner({ jobId: jobIdProp, taskId: taskIdProp, tabs, availableTabs,
     let alive = true;
     void document.fonts?.ready.then(() => { if (alive) revealTab(); });
     return () => { alive = false; timers.forEach(clearTimeout); };
-  }, [activeTab, shownTabs.length, collapsed, revealTab]);
+  }, [activeTab, shownTabs.length, collapsed, visible, inlineLayout?.active, inlineLayout?.tabsHost, revealTab]);
   // 看板宽度或页签宽度变了（分栏拖动、刚挂上时分栏才给出宽度、字体加载完页签变宽）：再对一次。
   useEffect(() => {
     const box = tabsRef.current;
@@ -251,7 +250,7 @@ function BoardInner({ jobId: jobIdProp, taskId: taskIdProp, tabs, availableTabs,
     ro.observe(box);
     for (const child of box.children) ro.observe(child);
     return () => ro.disconnect();
-  }, [collapsed, revealTab, shownTabs.length]);
+  }, [collapsed, visible, inlineLayout?.tabsHost, revealTab, shownTabs.length]);
   // 记下开着的文件页签和当前页签（刷新页面后恢复）。恢复之前不写，免得用空的盖掉上次的。
   useEffect(() => { if (storageId && restored.current === storageId) saveTabs(storageId, files.map((f) => f.path), activeTab, history); }, [storageId, files, activeTab, history]);
   // 引用到对话：和对话在同一个 Provider 里时缺省开。
@@ -265,21 +264,25 @@ function BoardInner({ jobId: jobIdProp, taskId: taskIdProp, tabs, availableTabs,
   },[store,backend,jobId,watchFiles,fileWatchIntervalMs,info?.dispatched,info?.files]);
   const canQuote = (quoteToChat ?? inProvider) && !!jobId;
   const quote = useCallback((ref: Omit<BoardRef, "id"> & { id?: string }) => {
-    if (jobId) store.addRef(jobId, { ...ref, id: ref.id ?? `${ref.kind}:${ref.label}` });
+    if (jobId) { store.addRef(jobId, { ...ref, id: ref.id ?? `${ref.kind}:${ref.label}` }); if (quoteCallbackRef.current) quoteCallbackRef.current(); else layoutRef.current?.onChat(); }
   }, [store, jobId]);
-  const quoteText = useCallback((path: string, text: string) => {
+  const quoteText = useCallback((path: string, text: string, context?: { revision: string }) => {
     const name = path.split("/").pop() || path;
     const short = text.replace(/\s+/g, " ").slice(0, 24);
     // 同一个文件里选不同的段落各算一条（按内容区分），同一段重复点只留一条。
-    quote({ id: `sel:${path}:${text.length}:${short}`, kind: "selection", label: `${name}：${short}${text.length > 24 ? "…" : ""}`, text: `工作区文件 ${path} 里选中的这段：\n${text.split("\n").map((l) => `  > ${l}`).join("\n")}` });
+    quote({ id: `sel:${path}:${text.length}:${short}`, kind: "selection", label: `${name}：${short}${text.length > 24 ? "…" : ""}`, text: `${context ? `文件修订：${context.revision}\n` : ""}工作区文件 ${path} 里选中的这段：\n${text.split("\n").map((l) => `  > ${l}`).join("\n")}` });
   }, [quote]);
   // 正在看的东西（打开的文件、浏览器当前页面）：告诉对话（缺省带进下一条消息一次）。收起、切走、关掉、离开时撤掉。
   const autoView = (autoQuoteOpenFile ?? canQuote) && !!jobId;
   const [browserPage, setBrowserPage] = useState<{ url: string; title: string } | null>(null);
-  const viewingPath = autoView && !collapsed && file ? file.path : null;
-  const viewingPage = autoView && !collapsed && activeTab === "browser" && browserPage ? browserPage : null;
+  const viewingPath = autoView && visible && file ? file.path : null;
+  const viewingPage = autoView && visible && activeTab === "browser" && browserPage ? browserPage : null;
   // 这个看板自己的标识：同一个对话开着两个看板时，各撤各的「正在看」和看板状态。
   const owner = useMemo(() => `board-${Math.random().toString(36).slice(2, 10)}`, []);
+  useIsoLayoutEffect(() => {
+    if (jobId && !isInline) store.reportBoardPresence(jobId, owner, visible, { availableTabs, readOnly });
+  }, [store, jobId, owner, visible, isInline, availableTabs?.join(","), readOnly]); // eslint-disable-line react-hooks/exhaustive-deps
+  useIsoLayoutEffect(() => () => { if (jobId && !isInline) store.reportBoardPresence(jobId, owner, null); }, [store, jobId, owner, isInline]);
   useEffect(() => {
     if (!jobId || !autoView) return;
     store.setViewing(jobId, viewingPath
@@ -303,14 +306,14 @@ function BoardInner({ jobId: jobIdProp, taskId: taskIdProp, tabs, availableTabs,
     backend.stat(jobId, path).then((s) => {
       if (!alive || s.type !== "file") return;
       // 第一次拿到修改时间（从对话里打开的、刷新后恢复的）只记下来；之后变了才重读。
-      update((f) => (f.mtime === s.mtime ? f : { ...f, size: s.size, mtime: s.mtime, version: f.mtime === undefined ? f.version : f.version + 1 }));
+      update((f) => (f.mtime === s.mtime && f.name === s.name ? f : { ...f, name: s.name, size: s.size, mtime: s.mtime, version: f.mtime === undefined ? f.version : f.version + 1 }));
     }, (e: unknown) => {
       // 打开着的文件被删了：重读一次，预览里显示「文件不存在」，不继续显示旧内容。
-      if (alive && e instanceof CenterError && e.status === 404) update((f) => (f.mtime !== -1 ? { ...f, mtime: -1, version: f.version + 1 } : f));
+      if (alive && (e as { status?: number }).status === 404) update((f) => (f.mtime !== -1 ? { ...f, mtime: -1, version: f.version + 1 } : f));
     });
     return () => { alive = false; };
     // 只看正在看的那个文件：切到别的文件页签时查一次它（后台的页签不轮询）。
-  }, [tick, pollTick, file?.path, info?.dispatched]); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [tick, file?.path, info?.dispatched]); // eslint-disable-line react-hooks/exhaustive-deps
 
   const activeRef = useRef(activeTab);
   activeRef.current = activeTab;
@@ -320,8 +323,8 @@ function BoardInner({ jobId: jobIdProp, taskId: taskIdProp, tabs, availableTabs,
     if (!clean) return;
     setFiles((list) => {
       const have = list.find((f) => f.path === clean);
-      if (have) return list.map((f) => (f.path === clean ? { ...f, size: entry?.size ?? f.size, mtime: entry?.mtime ?? f.mtime, version: f.version + 1 } : f));
-      const next = [...list, { path: clean, size: entry?.size, mtime: entry?.mtime, version: 0 }];
+      if (have) return list.map((f) => (f.path === clean ? { ...f, name: entry?.name ?? f.name, size: entry?.size ?? f.size, mtime: entry?.mtime ?? f.mtime, version: f.version + 1 } : f));
+      const next = [...list, { path: clean, name: entry?.name, size: entry?.size, mtime: entry?.mtime, version: 0 }];
       while (next.length > MAX_FILE_TABS) {
         const i = next.findIndex((f) => fileTabId(f.path) !== activeRef.current && f.path !== clean);
         next.splice(i >= 0 ? i : 0, 1);
@@ -332,6 +335,13 @@ function BoardInner({ jobId: jobIdProp, taskId: taskIdProp, tabs, availableTabs,
     const parent = clean.includes("/") && !clean.startsWith("/") ? clean.split("/").slice(0, -1).join("/") : "";
     setDir(parent);
   }, []);
+  const uploadToWorkspace = useMemo(() => !readOnly && jobId && backend?.uploadFile
+    ? (file: File, options: import("../core/documentUpload").DocumentUploadOptions) => backend.uploadFile!(jobId, file, options)
+    : undefined, [backend, jobId, readOnly]);
+  const upload = useBoardUpload(jobId, uploadToWorkspace, receipt => {
+    openPath(receipt.path!, { name: receipt.name, size: receipt.size });
+    setTick(value => value + 1);
+  });
   /** 关文件页签：关的是正在看的，就切到它旁边的文件页签，没有了回文件列表。 */
   const closeFile = useCallback((path: string) => {
     setFiles((list) => {
@@ -348,6 +358,8 @@ function BoardInner({ jobId: jobIdProp, taskId: taskIdProp, tabs, availableTabs,
   jobRef.current = jobId;
   const expandRef = useRef(onExpand);
   expandRef.current = onExpand;
+  const visibleRef = useRef(visible);
+  visibleRef.current = visible;
   useEffect(() => {
     if (!acceptOpen || !backend) return;
     return store.registerBoard((target: string, what: OpenTarget) => {
@@ -359,30 +371,38 @@ function BoardInner({ jobId: jobIdProp, taskId: taskIdProp, tabs, availableTabs,
         setTab(targetPanel);
         if (what.kind === "files") setDir(what.path ?? "");
       }
-      expandRef.current?.();
+      if (layoutRef.current) layoutRef.current.onActivate(); else expandRef.current?.();
       return true;
-    });
-  }, [store, backend, acceptOpen, openPath, builtinTabs.join(","), allowedPanels.join(","), panels.show]);
+    }, { owner: inlineOwner ?? owner, inline: isInline, priority: () => isInline ? 1 : visibleRef.current ? 2 : 0 });
+  }, [store, backend, acceptOpen, openPath, builtinTabs.join(","), allowedPanels.join(","), panels.show, inlineOwner, owner, isInline]); // eslint-disable-line react-hooks/exhaustive-deps
 
   const navRef = useRef(onNavigate);
   navRef.current = onNavigate;
   useEffect(() => { navRef.current?.({ tab: activeTab, dir, file: file?.path ?? null }); }, [activeTab, dir, file?.path]);
   // 看板现在的样子报给仓库：业务方用 store.workspace().openFile() / openFiles() 拿到当前打开的文件。
-  const openPaths = files.map((f) => f.path).join("\n");
+  const openPaths = JSON.stringify(files.map((f) => f.path));
+  const filesEnabled = builtinTabs.includes("files");
+  useEffect(() => {
+    if (!backend || !jobId || !watchFiles || !visible || !filesEnabled) return;
+    return retainFileScope(backend, jobId, { paths: JSON.parse(openPaths) as string[], dirs: [] });
+  }, [backend, jobId, watchFiles, visible, openPaths, filesEnabled]);
   useEffect(() => {
-    if (!jobId) return;
-    store.reportBoard(jobId, { tab: activeTab, dir, file: file?.path ?? null, files: files.map(file=>file.path), current:file?{path:file.path,sourceId:jobId}:null,opened:files.map(file=>({path:file.path,sourceId:jobId})),history,browser:activeTab==="browser"?browserPage:null,visible:!collapsed,autoContext:autoQuoteOpenFile??canQuote }, owner);
-  }, [store, jobId, activeTab, dir, file?.path, openPaths, history, browserPage, collapsed, autoQuoteOpenFile, canQuote, owner]);
+    if (!jobId || restoreNeeded) return;
+    const currentFile = isInline && !visible ? null : file;
+    store.reportBoard(jobId, { tab: activeTab, dir, file: currentFile?.path ?? null, files: files.map(file=>file.path), current:file?{path:file.path,sourceId:jobId}:null,opened:files.map(file=>({path:file.path,sourceId:jobId})),history,browser:activeTab==="browser"?browserPage:null,visible,autoContext:autoQuoteOpenFile??canQuote }, owner);
+  }, [store, jobId, activeTab, dir, file?.path, openPaths, history, browserPage, visible, autoQuoteOpenFile, canQuote, owner, restoreNeeded]);
   useEffect(() => () => { if (jobId) store.reportBoard(jobId, null, owner); }, [store, jobId, owner]);
 
   const body = () => {
     if (!activeTab) return <div className="cli-board-empty">看板模块已全部关闭。通过右上角“管理看板模块”重新打开。</div>;
     if (!backend) return <div className="tc-note">当前后端不支持看板（需要任务中心提供 /api/jobs/:id/board）。</div>;
     if (!jobId) return <div className="tc-note">选择或开始一个对话后，这里显示它的文件、改动和浏览器。</div>;
-    if (!info) return <div className="tc-note">{infoError ? `读取看板失败：${infoError}（稍后自动重试）` : "读取中…"}</div>;
+    if (!info) return <div className="tc-note">{infoError ? <>读取看板失败：{infoError} <button className="cli-fv-btn" onClick={refreshAll}>重试</button></> : "读取中…"}</div>;
     if (!info.dispatched) return <div className="tc-note">任务还没开始执行（{info.detail ?? "等待分配执行节点"}）。开始后这里会显示工作区文件。</div>;
+    if (!visible) return null;
     if (activeTab === "changes") return <ChangesPane key={jobId} backend={backend} jobId={jobId} refreshKey={tick} onOpen={(p) => openPath(p)} />;
     if (activeTab === "browser") {
+      if (!visible) return null;
       return <BrowserPane key={`${jobId}:${info.remote_task_id}`} backend={backend} jobId={jobId} readOnly={readOnly}
         onPage={setBrowserPage}
         onQuote={canQuote ? (p) => quote({ id: "browser:page", kind: "browser", label: p.title || p.url, text: `任务浏览器当前打开的页面：${p.title ? `${p.title} — ` : ""}${p.url}` }) : undefined}
@@ -396,27 +416,28 @@ function BoardInner({ jobId: jobIdProp, taskId: taskIdProp, tabs, availableTabs,
     if (extra) return extra.render({ jobId, store, quote });
     if (activeTab.startsWith(FILE_TAB) && file) {
       return (
-        <FileViewer
+        <FileViewer toolbarHost={toolbarHost}
           key={file.path}
           backend={backend}
           jobId={jobId}
           path={file.path}
+          displayName={file.name}
           size={file.size}
           mtime={file.mtime}
-          version={file.version} reloadKey={file.reloadKey}
+          version={file.version + manual} reloadKey={file.reloadKey}
           actions={allFileActions}
           onOpenPath={(p) => openPath(p)}
-          onQuoteText={canQuote ? (text) => quoteText(file.path, text) : undefined}
-          lead={<button className="cli-fv-back" onClick={() => { panels.show("files"); setTab("files"); }} title="返回文件列表">‹</button>}
+          onQuoteText={canQuote ? (text, context) => quoteText(file.path, text, context) : undefined}
+          onBack={() => { setDir(file.path.includes("/") ? file.path.slice(0, file.path.lastIndexOf("/")) : ""); panels.show("files"); setTab("files"); }}
         />
       );
     }
-    return <FilesPane key={jobId} backend={backend} jobId={jobId} dir={dir} onDir={setDir} onOpen={(e) => openPath(e.path, e)} refreshKey={tick + pollTick} />;
+    return <FilesPane toolbarHost={toolbarHost} key={jobId} backend={backend} jobId={jobId} dir={dir} onDir={setDir} onOpen={(e) => openPath(e.path, e)} refreshKey={tick} />;
   };
 
   if (collapsed) {
     return (
-      <aside className={`cli-ui cli-board collapsed ${className ?? ""}`} data-theme={theme} style={style}>
+      <aside ref={rootRef} className={`cli-ui cli-board collapsed ${className ?? ""}`} data-theme={theme} style={style}>
         <button className="cli-board-strip" onClick={onExpand} title="显示看板">
           {Icon.chevRight()}
           {shownTabs.map((t) => <span key={t} className="cli-board-strip-t">{tabLabel(t)}</span>)}
@@ -426,32 +447,39 @@ function BoardInner({ jobId: jobIdProp, taskId: taskIdProp, tabs, availableTabs,
     );
   }
 
-  return (
-    <aside className={`cli-ui cli-board sess-rail ${className ?? ""}`} data-theme={theme} style={style} onPointerDown={()=>jobId&&store.activateBoard(jobId,owner)} onClickCapture={()=>jobId&&store.activateBoard(jobId,owner)} onFocusCapture={()=>jobId&&store.activateBoard(jobId,owner)}>
-      <div className="rail-tabs">
-        <div className="rail-tabs-scroll" role="tablist" ref={tabsRef}>
+  const selectTab = (id: string) => { setTab(id); layoutRef.current?.onActivate(); };
+  const tabBar = <div className="rail-tabs">
+        <div className="rail-tabs-scroll" role={inlineLayout ? undefined : "tablist"} ref={tabsRef}>
           {shownTabs.map((t) => t.startsWith(FILE_TAB) ? (
-            <span key={t} className={`rail-tab rail-ftab ${activeTab === t ? "on" : ""}`} role="tab" aria-selected={activeTab === t} title={t.slice(FILE_TAB.length)}
+            <span key={t} className={`rail-tab rail-ftab ${activeTab === t && (!inlineLayout || inlineLayout.active) ? "on" : ""}`} title={t.slice(FILE_TAB.length)}
               onMouseDown={(e) => { if (e.button === 1) { e.preventDefault(); closeFile(t.slice(FILE_TAB.length)); } }}>
-              <button className="rail-ftab-l" onClick={() => setTab(t)}>{Icon.doc()}{tabLabel(t)}</button>
+              <button className="rail-ftab-l" role="tab" aria-selected={activeTab === t && (!inlineLayout || inlineLayout.active)} aria-label={tabLabel(t)} onClick={() => selectTab(t)}>{Icon.doc()}<span className="rail-ftab-text">{tabLabel(t)}</span></button>
               <button className="rail-ftab-x" onClick={() => closeFile(t.slice(FILE_TAB.length))} title="关闭（鼠标中键也可以）" aria-label={`关闭 ${tabLabel(t)}`}>{Icon.x()}</button>
             </span>
           ) : (
-            <PanelTab key={t} id={t} label={tabLabel(t)} active={activeTab === t} onSelect={() => setTab(t)} onClose={() => {
+            <PanelTab key={t} id={t} label={tabLabel(t)} active={activeTab === t && (!inlineLayout || inlineLayout.active)} onSelect={() => selectTab(t)} onClose={() => {
               panels.close(t);
               if (activeTab === t) setTab(shownTabs.find(id => id !== t) ?? "");
+              if (inlineLayout && shownTabs.length === 1) inlineLayout.onChat();
             }} />
           ))}
         </div>
-        <PanelControls available={allowedPanels} open={panels.open} label={tabLabel}
-          onShow={id => { panels.show(id); setTab(id); }}
+        <PanelControls toolbarRef={setToolbarHost} available={allowedPanels} open={panels.open} label={tabLabel}
+          upload={!readOnly && builtinTabs.includes("files") && uploadToWorkspace ? { onChoose: upload.choose, disabled: upload.busy || !info?.dispatched, hint: !info?.dispatched ? "工作区尚未就绪" : "保存到当前会话，不发送消息" } : undefined}
+          onShow={id => { panels.show(id); selectTab(id); }}
           onClose={id => { panels.close(id); if (activeTab === id) setTab(shownTabs.find(t => t !== id) ?? ""); }} />
-        {info?.dispatched && <button className="rail-collapse" onClick={refreshAll} title={running ? "运行中 · 自动同步" : "刷新"}>
+        {info?.dispatched && !file && <button className="rail-collapse" onClick={refreshAll} title={running ? "运行中 · 本轮结束后同步，点击立即检查" : "刷新"}>
           <span className={`cli-sync-dot ${running ? "on" : ""}`} />↻
         </button>}
         {onCollapse && <button className="rail-collapse" onClick={onCollapse} title="隐藏面板">{Icon.chevRight()}</button>}
-      </div>
+      </div>;
+  return <>
+    {inlineLayout?.tabsHost && createPortal(tabBar, inlineLayout.tabsHost)}
+    <aside ref={rootRef} className={`cli-ui cli-board sess-rail${isInline ? " cli-inline-board" : ""} ${className ?? ""}`} data-theme={theme} hidden={isInline && !visible} style={{ ...style, ...(isInline && !visible ? { display: "none" } : {}) }} onPointerDown={()=>jobId&&store.activateBoard(jobId,owner)} onClickCapture={()=>jobId&&store.activateBoard(jobId,owner)} onFocusCapture={()=>jobId&&store.activateBoard(jobId,owner)}>
+      {!inlineLayout && tabBar}
+      {upload.input}
+      {upload.progress}
       <div className="rail-scroll">{body()}</div>
     </aside>
-  );
+  </>;
 }