@dsh-xhl/dsh-live-inspector 1.0.0

package/lib/client.js

@@ -0,0 +1,3019 @@
+window.__ModuleLoader__.load({
+  // Must equal the package name: the loader derives the expected module id from the manifest
+  // and reports "loaded without registering <id>" when the two disagree.
+  id: '@dsh-xhl/dsh-live-inspector',
+  factory(require) {
+    const React = require('react');
+    const h = React.createElement;
+
+    // The slot cell key. Internal, and independent of the package name.
+    const TAB_ID = 'dsh-live-inspector';
+    const TAB_KIND = 'git-tree';
+    const FILE_ADDRESS_PREFIX = 'dsh-resource://file/';
+    const MAX_RENDERED_DIFF_ROWS = 150;
+    const MAX_LINE_CHARACTERS = 400;
+
+    // Shell tools whose results can imply file changes the file tools never reported.
+    const SHELL_TOOL_NAMES = new Set(['bash', 'pwsh', 'shell', 'terminal', 'run_command']);
+
+    // Global registry of per-session states
+    const sessionStates = new Map();
+    let currentMountedSessionId = null;
+    let globalCtx = null;
+
+    // ─── Undo engine state ────────────────────────────────────────────────────────
+    // Baselines are keyed by targetKey (which folds together the relative and absolute
+    // spellings of one file). Artifacts are the exact (before, after) text pairs pulled out
+    // of tool/result metadata, which is what makes a hunk-level revert exact, not a guess.
+    const baselines = new Map(); // targetKey -> { text, digest, bytes, at }
+
+    // The text a file had when each turn first touched it. This is what makes a per-turn
+    // undo safe: reverting turn N restores the state the file entered turn N with, so every
+    // earlier turn's work survives.
+    const turnStarts = new Map(); // targetKey -> Map(turn -> { text, digest, bytes })
+
+    const listeners = new Set();
+    let notifyTimer = null;
+    function notify() {
+      if (notifyTimer) return;
+      notifyTimer = setTimeout(() => {
+        notifyTimer = null;
+        for (const listener of listeners) {
+          try {
+            listener();
+          } catch (e) {
+            console.warn('[@dsh-xhl/dsh-live-inspector] listener error:', e);
+          }
+        }
+      }, 40);
+    }
+
+    function getSessionState(sid) {
+      if (!sid) return null;
+      let s = sessionStates.get(sid);
+      if (!s) {
+        s = {
+          sessionId: sid,
+          files: {}, // path -> { path, key, name, dir, ext, status, active, timestamp, line, count, phases, diffs, edits }
+          activePath: null,
+          filter: 'all',
+          searchQuery: '',
+          selectedPath: null,
+          processedSeqs: new Set(),
+          autoOpenOpenedThisTurn: false,
+          reviewUrl: null,
+          cwd: null,
+          toast: null,
+          confirmingAll: false,
+          currentTurn: null,
+          selectedTurn: null,
+          showAllTurns: false,
+          turns: [],
+          dirtyTimers: new Map()
+        };
+        sessionStates.set(sid, s);
+      }
+      return s;
+    }
+
+    function resolveCurrentSessionId() {
+      // 1. Session currently visible in Main View
+      try {
+        const list = globalCtx?.sessions?.list?.getSnapshot();
+        if (list && list.byId) {
+          for (const id in list.byId) {
+            if ((list.byId[id]?.retainedBy?.mainView ?? 0) > 0) {
+              return id;
+            }
+          }
+        }
+      } catch {}
+
+      // 2. sidebarRight mounted session
+      try {
+        const sid = globalCtx?.sidebarRight?.mounted?.getSnapshot();
+        if (sid) return sid;
+      } catch {}
+
+      // 3. Fallback to cached or first available session
+      if (currentMountedSessionId) return currentMountedSessionId;
+      try {
+        const ids = globalCtx?.sessions?.list?.getSnapshot()?.ids;
+        if (ids && ids.length > 0) return ids[0];
+      } catch {}
+
+      return null;
+    }
+
+    function encodeSegment(s) {
+      return encodeURIComponent(s).replace(/%3A/gi, ':');
+    }
+    function encodePath(p) {
+      return p.split('/').map(encodeSegment).join('/');
+    }
+    function sessionFileAddress(sessionId, path) {
+      const normalized = path.replace(/\\/g, '/').replace(/^(?:\.\/)+/, '');
+      return FILE_ADDRESS_PREFIX + 'session/' + encodeSegment(sessionId) + '/' + encodePath(normalized);
+    }
+
+    // High-precision token/word-level diff with guard against huge lines
+    function wordDiff(oldStr, newStr) {
+      if (!oldStr && !newStr) return { oldParts: [], newParts: [] };
+      if (!oldStr) return { oldParts: [], newParts: [{ text: newStr, changed: true }] };
+      if (!newStr) return { oldParts: [{ text: oldStr, changed: true }], newParts: [] };
+      if (oldStr === newStr) {
+        return {
+          oldParts: [{ text: oldStr, changed: false }],
+          newParts: [{ text: newStr, changed: false }]
+        };
+      }
+
+      // Performance cap on extremely long minified lines
+      if (oldStr.length > MAX_LINE_CHARACTERS || newStr.length > MAX_LINE_CHARACTERS) {
+        return {
+          oldParts: [{ text: oldStr.slice(0, MAX_LINE_CHARACTERS) + (oldStr.length > MAX_LINE_CHARACTERS ? '…' : ''), changed: true }],
+          newParts: [{ text: newStr.slice(0, MAX_LINE_CHARACTERS) + (newStr.length > MAX_LINE_CHARACTERS ? '…' : ''), changed: true }]
+        };
+      }
+
+      const tokenRegex = /(\s+|[a-zA-Z0-9_$]+|[^\s\w])/g;
+      const oldTokens = oldStr.match(tokenRegex) || [oldStr];
+      const newTokens = newStr.match(tokenRegex) || [newStr];
+
+      let prefix = 0;
+      while (prefix < oldTokens.length && prefix < newTokens.length && oldTokens[prefix] === newTokens[prefix]) {
+        prefix++;
+      }
+
+      let suffix = 0;
+      while (
+        suffix < (oldTokens.length - prefix) &&
+        suffix < (newTokens.length - prefix) &&
+        oldTokens[oldTokens.length - 1 - suffix] === newTokens[newTokens.length - 1 - suffix]
+      ) {
+        suffix++;
+      }
+
+      const oldPrefix = oldTokens.slice(0, prefix).join('');
+      const oldMid = oldTokens.slice(prefix, oldTokens.length - suffix).join('');
+      const oldSuffix = oldTokens.slice(oldTokens.length - suffix).join('');
+
+      const newPrefix = newTokens.slice(0, prefix).join('');
+      const newMid = newTokens.slice(prefix, newTokens.length - suffix).join('');
+      const newSuffix = newTokens.slice(newTokens.length - suffix).join('');
+
+      return {
+        oldParts: [
+          { text: oldPrefix, changed: false },
+          { text: oldMid, changed: true },
+          { text: oldSuffix, changed: false }
+        ].filter(p => p.text.length > 0),
+        newParts: [
+          { text: newPrefix, changed: false },
+          { text: newMid, changed: true },
+          { text: newSuffix, changed: false }
+        ].filter(p => p.text.length > 0)
+      };
+    }
+
+    // Professional line-aligned split diff calculation
+    function computeSplitDiff(oldText, newText, startLine = 1) {
+      let rawOldLines = typeof oldText === 'string' ? oldText.split('\n') : [];
+      let rawNewLines = typeof newText === 'string' ? newText.split('\n') : [];
+
+      let prefixCount = 0;
+      while (prefixCount < rawOldLines.length && prefixCount < rawNewLines.length && rawOldLines[prefixCount] === rawNewLines[prefixCount]) {
+        prefixCount++;
+      }
+
+      let suffixCount = 0;
+      while (
+        suffixCount < (rawOldLines.length - prefixCount) &&
+        suffixCount < (rawNewLines.length - prefixCount) &&
+        rawOldLines[rawOldLines.length - 1 - suffixCount] === rawNewLines[rawNewLines.length - 1 - suffixCount]
+      ) {
+        suffixCount++;
+      }
+
+      const oldDiff = rawOldLines.slice(prefixCount, rawOldLines.length - suffixCount);
+      const newDiff = rawNewLines.slice(prefixCount, rawNewLines.length - suffixCount);
+
+      const rows = [];
+      let curOldNo = startLine;
+      let curNewNo = startLine;
+
+      // Prefix context lines (up to 3)
+      const contextPrefixStart = Math.max(0, prefixCount - 3);
+      for (let i = contextPrefixStart; i < prefixCount; i++) {
+        rows.push({
+          left: { no: curOldNo + i, text: rawOldLines[i], kind: 'context', parts: [{ text: rawOldLines[i], changed: false }] },
+          right: { no: curNewNo + i, text: rawNewLines[i], kind: 'context', parts: [{ text: rawNewLines[i], changed: false }] }
+        });
+      }
+      curOldNo += prefixCount;
+      curNewNo += prefixCount;
+
+      // Changed lines (aligned side-by-side with word-level diffing)
+      const maxDiff = Math.max(oldDiff.length, newDiff.length);
+      for (let i = 0; i < maxDiff; i++) {
+        const oldL = i < oldDiff.length ? oldDiff[i] : null;
+        const newL = i < newDiff.length ? newDiff[i] : null;
+
+        let parts = { oldParts: [], newParts: [] };
+        if (oldL !== null && newL !== null) {
+          parts = wordDiff(oldL, newL);
+        } else if (oldL !== null) {
+          parts.oldParts = [{ text: oldL, changed: true }];
+        } else if (newL !== null) {
+          parts.newParts = [{ text: newL, changed: true }];
+        }
+
+        const leftCell = oldL !== null ? {
+          no: curOldNo + i,
+          text: oldL,
+          kind: 'del',
+          parts: parts.oldParts
+        } : null;
+
+        const rightCell = newL !== null ? {
+          no: curNewNo + i,
+          text: newL,
+          kind: 'add',
+          parts: parts.newParts
+        } : null;
+
+        rows.push({ left: leftCell, right: rightCell });
+      }
+      curOldNo += oldDiff.length;
+      curNewNo += newDiff.length;
+
+      // Suffix context lines (up to 3)
+      const suffixLines = Math.min(3, suffixCount);
+      for (let i = 0; i < suffixLines; i++) {
+        const oldIdx = rawOldLines.length - suffixCount + i;
+        const newIdx = rawNewLines.length - suffixCount + i;
+        rows.push({
+          left: { no: curOldNo + i, text: rawOldLines[oldIdx], kind: 'context', parts: [{ text: rawOldLines[oldIdx], changed: false }] },
+          right: { no: curNewNo + i, text: rawNewLines[newIdx], kind: 'context', parts: [{ text: rawNewLines[newIdx], changed: false }] }
+        });
+      }
+
+      const truncated = rows.length > MAX_RENDERED_DIFF_ROWS;
+      const displayRows = truncated ? rows.slice(0, MAX_RENDERED_DIFF_ROWS) : rows;
+
+      return {
+        rows: displayRows,
+        totalRows: rows.length,
+        truncated: truncated,
+        oldLinesCount: rawOldLines.length,
+        newLinesCount: rawNewLines.length,
+        delCount: oldDiff.length,
+        addCount: newDiff.length
+      };
+    }
+
+    // GitHub-style 5-square diffstat mini bar
+    function DiffStatBar({ addCount, delCount }) {
+      const total = addCount + delCount;
+      if (total === 0) return null;
+      const greenBoxes = Math.min(5, Math.max(addCount > 0 ? 1 : 0, Math.round((addCount / total) * 5)));
+      const redBoxes = Math.min(5 - greenBoxes, Math.max(delCount > 0 ? 1 : 0, 5 - greenBoxes));
+      const grayBoxes = Math.max(0, 5 - greenBoxes - redBoxes);
+
+      return h('span', {
+        title: '+' + addCount + ' / -' + delCount,
+        style: { display: 'inline-flex', gap: '2px', alignItems: 'center' }
+      },
+        Array.from({ length: greenBoxes }).map((_, i) =>
+          h('span', { key: 'g' + i, style: { width: '5px', height: '5px', borderRadius: '1px', background: '#10b981' } })
+        ),
+        Array.from({ length: redBoxes }).map((_, i) =>
+          h('span', { key: 'r' + i, style: { width: '5px', height: '5px', borderRadius: '1px', background: '#ef4444' } })
+        ),
+        Array.from({ length: grayBoxes }).map((_, i) =>
+          h('span', { key: 'gr' + i, style: { width: '5px', height: '5px', borderRadius: '1px', background: 'rgba(255,255,255,0.15)' } })
+        )
+      );
+    }
+
+    // Extension Badge
+    function FileExtBadge({ ext }) {
+      let bg = 'rgba(255,255,255,0.06)';
+      let color = 'inherit';
+      let label = (ext || '').toUpperCase().slice(0, 4);
+
+      if (ext === 'ts' || ext === 'tsx') {
+        bg = 'rgba(49, 120, 198, 0.2)';
+        color = '#60a5fa';
+      } else if (ext === 'js' || ext === 'jsx') {
+        bg = 'rgba(247, 223, 30, 0.2)';
+        color = '#facc15';
+      } else if (ext === 'json') {
+        bg = 'rgba(16, 185, 129, 0.2)';
+        color = '#34d399';
+      } else if (ext === 'css' || ext === 'scss') {
+        bg = 'rgba(236, 72, 153, 0.2)';
+        color = '#f472b6';
+      } else if (ext === 'md') {
+        bg = 'rgba(168, 85, 247, 0.2)';
+        color = '#c084fc';
+      }
+
+      return h('span', {
+        style: {
+          padding: '1px 4px',
+          borderRadius: '3px',
+          fontSize: '9px',
+          fontWeight: 700,
+          fontFamily: 'monospace',
+          background: bg,
+          color: color,
+          flexShrink: 0
+        }
+      }, label || 'FILE');
+    }
+
+    // ─── Undo engine ──────────────────────────────────────────────────────────────
+
+    /** The session log records relative paths; anchor them on the session's own cwd. */
+    function normalizeCwd(value) {
+      if (typeof value !== 'string' || value.length === 0) return null;
+      const clean = value.replace(/\\/g, '/').replace(/\/+$/, '');
+      return clean.length > 0 ? clean : null;
+    }
+
+    function keyOfPath(sessionId, filePath) {
+      const clean = String(filePath || '').replace(/\\/g, '/').replace(/^(?:\.\/)+/, '');
+      const st = getSessionState(sessionId);
+      const cwd = normalizeCwd(st && st.cwd);
+      if (/^[a-zA-Z]:\//.test(clean) || clean.startsWith('/')) {
+        return clean.toLowerCase();
+      }
+      return cwd ? (cwd + '/' + clean).toLowerCase() : clean.toLowerCase();
+    }
+
+    /** Strip the session cwd so a baseline lookup can match a log path. */
+    function aliasOfPath(sessionId, filePath) {
+      const clean = String(filePath || '').replace(/\\/g, '/').replace(/^(?:\.\/)+/, '');
+      const st = getSessionState(sessionId);
+      const cwd = normalizeCwd(st && st.cwd);
+      if (cwd && clean.toLowerCase().startsWith(cwd + '/')) {
+        return clean.slice(cwd.length + 1);
+      }
+      return null;
+    }
+
+    /** Pull the working directory out of whatever entries happen to carry it. */
+    function readCwdFromEntries(sessionId, entries) {
+      for (const entry of entries) {
+        if (!entry) continue;
+        const ev = entry.type === 'event' ? entry.event : null;
+        if (!ev || !ev.data) continue;
+        const raw = ev.data.cwd;
+        if (typeof raw === 'string' && raw.length > 0) {
+          const st = getSessionState(sessionId);
+          const cwd = normalizeCwd(raw);
+          if (st && cwd) st.cwd = cwd;
+          return;
+        }
+      }
+    }
+
+    // ─── Host filesystem seam ─────────────────────────────────────────────────────
+    // A bundle Client module cannot reach its Host half two other ways, so this uses the one
+    // that works: the Host half mounts its own HTTP routes on the Harness web server and this
+    // half calls them with plain `fetch`.
+    //
+    //   host.call(...)            only exists for DYNAMIC packages (injected as a closure
+    //                             parameter); a bundle's `require` has no such module.
+    //   ctx.remote.<namespace>    the composition mounts a fixed set of Typert namespaces and
+    //                             offers no hook for a third-party bundle to add one.
+    //   fetch('/liveinspector/api')  a WebRoute this package owns — what shipped plugins use.
+    //
+    // Endpoints answer `{ ok: true, value }` or `{ ok: false, error }`; every failure is
+    // converted to the answered shape the rest of this file reasons about, so a refused path
+    // is a toast rather than an unhandled rejection.
+
+    const API_PREFIX = '/liveinspector/api';
+
+    /** Call one Host endpoint. Never throws: a transport or HTTP failure is an answer. */
+    async function callFs(method, payload) {
+      let response;
+      try {
+        response = await fetch(`${API_PREFIX}/${method}`, {
+          method: 'POST',
+          headers: { 'content-type': 'application/json' },
+          body: JSON.stringify(payload)
+        });
+      } catch (error) {
+        return { ok: false, error: `无法连接到 Host：${String((error && error.message) || error)}` };
+      }
+
+      let parsed = null;
+      try {
+        parsed = await response.json();
+      } catch {
+        return { ok: false, error: `Host 返回 ${response.status}，但没有 JSON 响应体` };
+      }
+      if (!parsed || typeof parsed !== 'object') {
+        return { ok: false, error: `Host 返回 ${response.status}，响应体格式不符合预期` };
+      }
+      if (parsed.ok !== true) {
+        const message = parsed.error && parsed.error.message ? parsed.error.message : `Host 返回 ${response.status}`;
+        return { ok: false, error: message };
+      }
+      const value = parsed.value;
+      if (value === null || typeof value !== 'object') {
+        return { ok: false, error: 'Host 没有返回结果' };
+      }
+      return value;
+    }
+
+    /** The session working directory, which relative tool paths resolve against. */
+    function cwdOf(sessionId) {
+      const st = getSessionState(sessionId);
+      return (st && st.cwd) || undefined;
+    }
+
+    /**
+     * Capture the pre-edit text of one file exactly once, before its first change.
+     *
+     * This runs on the first mutating tool call, when the file is still untouched — the only
+     * moment the "before" state exists on disk. A read before the first mutation also counts
+     * as untouched, which is what catches a write-after-read sequence.
+     */
+    async function ensureBaseline(sessionId, filePath) {
+      const st = getSessionState(sessionId);
+      if (!st) return null;
+      const key = keyOfPath(sessionId, filePath);
+      if (baselines.has(key)) return baselines.get(key);
+
+      // Claim the slot synchronously so concurrent tool events cannot race.
+      const pending = { text: null, digest: null, bytes: 0, at: Date.now(), loading: true };
+      baselines.set(key, pending);
+
+      let record;
+      try {
+        const answer = await callFs('fs.read', { path: filePath, cwd: cwdOf(sessionId) });
+        if (answer && answer.ok === true && !answer.omitted) {
+          record = { text: answer.text, digest: answer.digest || null, bytes: answer.bytes || 0, at: Date.now(), loading: false };
+        } else if (answer && answer.ok === true) {
+          // Oversized: the digest still proves identity, but a restore is refused.
+          record = { text: null, digest: answer.digest || null, bytes: answer.bytes || 0, at: Date.now(), loading: false, oversized: true };
+        } else {
+          record = { text: null, digest: null, bytes: 0, at: Date.now(), loading: false, unavailable: true };
+        }
+      } catch (error) {
+        record = { text: null, digest: null, bytes: 0, at: Date.now(), loading: false, unavailable: true };
+        console.debug('[@dsh-xhl/dsh-live-inspector] no revert baseline for', filePath, error);
+      }
+
+      baselines.set(key, record);
+      notify();
+      return record;
+    }
+
+    function baselineOf(sessionId, filePath) {
+      return baselines.get(keyOfPath(sessionId, filePath)) || null;
+    }
+
+    /**
+     * Snapshot a file's text the first time a given turn touches it.
+     *
+     * The read happens *before* that turn's first mutation, so the snapshot is exactly the
+     * state the file entered the turn with — every earlier turn's work included. Reverting a
+     * turn writes this back, which is why a turn-scoped undo cannot reach past its own turn.
+     */
+    async function ensureTurnStart(sessionId, filePath, turn) {
+      if (typeof turn !== 'number') return null;
+      const key = keyOfPath(sessionId, filePath);
+      let byTurn = turnStarts.get(key);
+      if (!byTurn) {
+        byTurn = new Map();
+        turnStarts.set(key, byTurn);
+      }
+      if (byTurn.has(turn)) return byTurn.get(turn);
+
+      const pending = { text: null, digest: null, bytes: 0, loading: true };
+      byTurn.set(turn, pending);
+
+      let record;
+      try {
+        const answer = await callFs('fs.read', { path: filePath, cwd: cwdOf(sessionId) });
+        if (answer && answer.ok === true && !answer.omitted) {
+          record = { text: answer.text, digest: answer.digest || null, bytes: answer.bytes || 0, loading: false };
+        } else if (answer && answer.ok === true) {
+          record = { text: null, digest: answer.digest || null, bytes: answer.bytes || 0, loading: false, oversized: true };
+        } else {
+          record = { text: null, digest: null, bytes: 0, loading: false, unavailable: true };
+        }
+      } catch (error) {
+        record = { text: null, digest: null, bytes: 0, loading: false, unavailable: true };
+        console.debug('[@dsh-xhl/dsh-live-inspector] no turn snapshot for', filePath, 'turn', turn, error);
+      }
+
+      byTurn.set(turn, record);
+      notify();
+      return record;
+    }
+
+    function turnStartOf(sessionId, filePath, turn) {
+      const byTurn = turnStarts.get(keyOfPath(sessionId, filePath));
+      return (byTurn && byTurn.get(turn)) || null;
+    }
+
+    /** Every turn that touched this file, ascending. */
+    function turnsOfFile(sessionId, file) {
+      const key = (file && file.key) || keyOfPath(sessionId, file.path);
+      const byTurn = turnStarts.get(key);
+      if (!byTurn) return [];
+      return Array.from(byTurn.keys()).sort((a, b) => a - b);
+    }
+
+    function hasRevertibleBaseline(sessionId, file) {
+      if (!file || file.status === 'R' || file.removed) return false;
+      const key = file.key || keyOfPath(sessionId, file.path);
+      if (baselines.has(key)) return true;
+      const alias = aliasOfPath(sessionId, file.path);
+      if (alias && baselines.has(alias)) return true;
+      // A file the agent created is revertible by deletion even with no baseline.
+      return file.status === 'A';
+    }
+
+    /** Narrow tool/result meta into the exact (before / after) pairs the diff cards use.
+     *  A null `oldText` is meaningful: it means the file did not exist before the call. */
+    function extractArtifactsFromResult(meta) {
+      if (!meta || typeof meta !== 'object' || Array.isArray(meta)) return null;
+      const diffs = meta.diffs;
+      if (!Array.isArray(diffs) || diffs.length === 0) return null;
+      const artifacts = [];
+      for (const diff of diffs) {
+        if (!diff || typeof diff !== 'object') continue;
+        if (typeof diff.path !== 'string' || typeof diff.newText !== 'string') continue;
+        if (diff.oldText !== null && typeof diff.oldText !== 'string') continue;
+        artifacts.push({ path: diff.path, oldText: diff.oldText, newText: diff.newText });
+      }
+      return artifacts.length > 0 ? artifacts : null;
+    }
+
+    /** Whether a recorded artifact vouches for this hunk's original text. */
+    function artifactWitnesses(phases, oldText) {
+      if (oldText.length === 0) return false;
+      for (const phase of phases || []) {
+        for (const artifact of phase.artifacts || []) {
+          if (artifact.oldText === null) continue;
+          if (artifact.oldText.indexOf(oldText) !== -1) return true;
+        }
+      }
+      return false;
+    }
+
+    /**
+     * Compute the anchor that lets ONE hunk be undone on its own.
+     *
+     * A tool/result artifact is the (before, after) pair of one ENTIRE tool call, and one call
+     * can produce several hunks — so neither the artifact's `after` nor a slice of its `before`
+     * identifies a single hunk. The hunk itself does: it carries its exact old text and its
+     * exact replacement text, plus the diff's context lines on either side, and that whole
+     * shape is what makes it locatable in the LIVE file (which, by the time the user clicks,
+     * may already hold this call's other hunks and later edits too).
+     *
+     * Returns `{ anchor }` on success or `{ reason }` naming the precise refusal, so the panel
+     * can tell the user WHICH condition blocked them instead of one catch-all sentence.
+     */
+    function hunkAnchorOutcome(file, hunkIndex) {
+      const hunk = (file && file.diffs ? file.diffs : [])[hunkIndex];
+      if (!hunk) return { reason: '这处改动已不在记录中' };
+
+      const oldJoined = hunk.oldText.join('\n');
+      const newJoined = hunk.newText.join('\n');
+      if (oldJoined.length === 0) {
+        return { reason: '这处改动只是新增了若干行，没有可还原的原文' };
+      }
+      if (oldJoined === newJoined) {
+        return { reason: '这处改动实际没有改变任何文本' };
+      }
+      if (!hunk.replaceAll && hunk.newText.length === 0) {
+        return { reason: '这处改动只是删除了若干行，请改用「撤销整轮」' };
+      }
+      if (!artifactWitnesses(file && file.phases, oldJoined)) {
+        return {
+          reason: '没有记录这处改动确切的改前/改后文本' +
+            '（它来自 edit/write 之外的工具，或来自历史回放），' +
+            '因此无法单独撤销，请改用「撤销整轮」'
+        };
+      }
+
+      return { anchor: { sliceBefore: oldJoined, sliceAfter: newJoined, replaceAll: !!hunk.replaceAll } };
+    }
+
+    /** The anchor for one hunk, or null when it has none. See {@link hunkAnchorOutcome}. */
+    function hunkAnchorOf(file, hunkIndex) {
+      return hunkAnchorOutcome(file, hunkIndex).anchor || null;
+    }
+
+    /** Resolve an anchor against the live file text, refusing drift and ambiguity. */
+    function locateAnchor(anchor, currentText) {
+      // `replace_all` has no single span: it is revertible only while every occurrence the
+      // call produced is still present and the original text has not come back.
+      if (anchor.replaceAll) {
+        if (anchor.sliceBefore === anchor.sliceAfter) return null;
+        if (countOccurrences(currentText, anchor.sliceAfter) === 0) return null;
+        if (countOccurrences(currentText, anchor.sliceBefore) > 0) return null;
+        return { mode: 'all', from: anchor.sliceAfter, to: anchor.sliceBefore };
+      }
+
+      const afterCount = countOccurrences(currentText, anchor.sliceAfter);
+      const beforeCount = countOccurrences(currentText, anchor.sliceBefore);
+
+      // Normally the file holds this hunk's post-change shape. If instead only the original
+      // shape survives, the change is already reverted.
+      if (beforeCount === 1 && afterCount === 0) return { mode: 'already' };
+      if (afterCount !== 1) return null;
+      return { mode: 'single', from: anchor.sliceAfter, to: anchor.sliceBefore };
+    }
+
+    function countOccurrences(haystack, needle) {
+      if (!needle || needle.length === 0) return 0;
+      let count = 0;
+      let index = haystack.indexOf(needle);
+      while (index !== -1) {
+        count++;
+        index = haystack.indexOf(needle, index + needle.length);
+      }
+      return count;
+    }
+
+    /**
+     * Reconstruct the old/new text a diff card DISPLAYS.
+     *
+     * A tool/result artifact is the (before, after) pair of one ENTIRE tool call, and one call
+     * can produce several hunks — so the artifact's `after` is never the right "new text" for a
+     * single hunk. The hunk's own recorded lines are: they are exactly what that change did, in
+     * both directions. Only the whole-file view needs an artifact.
+     */
+    function resolveCardTexts(sessionId, file, artifactIndex, hunkIndex) {
+      const phases = (file && file.phases) || [];
+      const artifacts = [];
+      for (const item of phases) {
+        for (const artifact of item.artifacts || []) artifacts.push(artifact);
+      }
+
+      // Whole-file view: the file's first recorded baseline against its newest recorded text.
+      if (hunkIndex === undefined || hunkIndex === null) {
+        if (artifacts.length === 0) {
+          const last = phases[phases.length - 1];
+          if (!last) return null;
+          return { oldText: last.oldText, newText: last.newText, exact: false, whole: true };
+        }
+        const first = artifacts[0];
+        const newest = artifacts[artifacts.length - 1];
+        return { oldText: first.oldText, newText: newest.newText, exact: true, whole: true };
+      }
+
+      const hunk = (file.diffs || [])[hunkIndex];
+      if (!hunk) return null;
+      return {
+        oldText: hunk.oldText.join('\n'),
+        newText: hunk.newText.join('\n'),
+        exact: !!hunkAnchorOf(file, hunkIndex),
+        whole: false
+      };
+    }
+
+    function verifyEditFile(file) {
+      if (file.status === 'R') {
+        throw new Error('这个文件在本次会话中只被读取过');
+      }
+      if (file.dirty === true) {
+        throw new Error('智能体正在写入这个文件，请等这一步结束后再撤销');
+      }
+    }
+
+    function setToast(sessionId, message, tone) {
+      const st = getSessionState(sessionId);
+      if (!st) return;
+      st.toast = { message, tone: tone || 'info', at: Date.now() };
+      notify();
+    }
+
+    /** Read the live file through the Host half, refusing anything not plainly revertible. */
+    async function readCurrentText(sessionId, filePath) {
+      const answer = await callFs('fs.read', { path: filePath, cwd: cwdOf(sessionId) });
+      if (!answer || answer.ok !== true) {
+        throw new Error((answer && answer.error) || '读取文件失败');
+      }
+      if (answer.omitted) {
+        throw new Error('文件太大，无法从这个面板替换');
+      }
+      return { text: answer.text, digest: answer.digest };
+    }
+
+    async function writeText(sessionId, filePath, content) {
+      const answer = await callFs('fs.write', { path: filePath, content, cwd: cwdOf(sessionId) });
+      if (!answer || answer.ok !== true) {
+        throw new Error((answer && answer.error) || '写入文件失败');
+      }
+      return answer;
+    }
+
+    async function deleteFile(sessionId, filePath) {
+      const answer = await callFs('fs.delete', { path: filePath, cwd: cwdOf(sessionId) });
+      if (!answer || answer.ok !== true) {
+        throw new Error((answer && answer.error) || '删除文件失败');
+      }
+      return answer;
+    }
+
+    /**
+     * Files the session has recorded that no longer exist on disk.
+     *
+     * A shell command can delete a file with no file tool involved, and the shell result
+     * carries only command output — no structured file operations. So the panel probes the
+     * paths it already knows about and treats a vanished one as a deletion it can offer to
+     * undo, using the text it captured when the file was last read or written.
+     */
+    async function detectExternalDeletions(sessionId) {
+      const st = getSessionState(sessionId);
+      if (!st) return;
+
+      const candidates = Object.values(st.files).filter(f =>
+        !f.removed &&
+        f.status !== 'A' &&
+        !f.dirty &&
+        !f.missing &&
+        recoverableTextOf(f) !== null
+      );
+      if (candidates.length === 0) return;
+
+      for (const file of candidates) {
+        try {
+          const answer = await callFs('fs.stat', { path: file.path, cwd: cwdOf(sessionId) });
+          if (!answer || answer.ok !== true) continue;
+          if (answer.exists === false) {
+            const record = st.files[file.path];
+            if (!record) continue;
+            record.missing = true;
+            record.status = 'D';
+            record.removed = true;
+            record.removedBy = 'shell';
+            notify();
+          }
+        } catch (error) {
+          // A probe failure is not evidence of deletion.
+          console.debug('[@dsh-xhl/dsh-live-inspector] stat probe failed for', file.path, error);
+        }
+      }
+    }
+
+    /** The best text we hold for a file, used to write it back after a deletion. */
+    function recoverableTextOf(file) {
+      if (!file) return null;
+      const phases = file.phases || [];
+      // Prefer the newest recorded content.
+      for (let i = phases.length - 1; i >= 0; i--) {
+        const phase = phases[i];
+        for (let j = (phase.artifacts || []).length - 1; j >= 0; j--) {
+          const artifact = phase.artifacts[j];
+          if (typeof artifact.newText === 'string') return artifact.newText;
+        }
+      }
+      // Fall back to the pre-session baseline for a file that was only ever read.
+      return null;
+    }
+
+    /**
+     * Revert ONLY one turn's work in one file.
+     *
+     * Restores the snapshot taken when that turn first touched the file, so the file returns
+     * to exactly the state it entered the turn with — every earlier turn's changes survive,
+     * and any later turn's changes are reported as drift rather than silently discarded.
+     */
+    async function revertTurnForFile(sessionId, file, turn) {
+      if (!file) return { ok: false, reason: '没有文件' };
+      try {
+        verifyEditFile(file);
+        const snapshot = turnStartOf(sessionId, file.path, turn);
+        if (!snapshot) {
+          throw new Error('没有为这个文件捕获 ' + (turn + 1) + ' 轮的快照');
+        }
+        if (snapshot.text === null) {
+          throw new Error('第 ' + (turn + 1) + ' 轮没有文本快照（无法读取或超出大小上限）');
+        }
+
+        const current = await readCurrentText(sessionId, file.path);
+        if (current.text === snapshot.text) {
+          return { ok: true, unchanged: true };
+        }
+
+        // A later turn changed this file: reverting now would discard that work too.
+        if (typeof turn === 'number' && turn < latestTurnOfFile(sessionId, file)) {
+          const laterCurrent = turnStartOf(sessionId, file.path, nextTurnOfFile(sessionId, file, turn));
+          if (laterCurrent && laterCurrent.text !== null && current.text !== laterCurrent.text) {
+            throw new Error('更后面的轮次也改过这个文件，请先撤销最新的那一轮');
+          }
+        }
+
+        await writeText(sessionId, file.path, snapshot.text);
+
+        // The file now matches this turn's entry state; it still carries earlier turns.
+        const st = getSessionState(sessionId);
+        const record = st && st.files[file.path];
+        if (record) {
+          record.dirty = false;
+          record.confirming = null;
+          if (turn === earliestTurnOfFile(sessionId, file)) {
+            // Nothing earlier remains, so the file really is back to pre-session content.
+            record.status = record.removed ? record.status : 'R';
+            record.reverted = true;
+          }
+        }
+        return { ok: true };
+      } catch (error) {
+        return { ok: false, reason: String((error && error.message) || error) };
+      }
+    }
+
+    function turnsForFileWithChanges(sessionId, file) {
+      if (!file) return [];
+      const seen = new Set();
+      for (const phase of file.phases || []) {
+        if (typeof phase.turn === 'number') seen.add(phase.turn);
+      }
+      return Array.from(seen).sort((a, b) => a - b);
+    }
+
+    function earliestTurnOfFile(sessionId, file) {
+      const turns = turnsForFileWithChanges(sessionId, file);
+      return turns.length > 0 ? turns[0] : null;
+    }
+
+    function latestTurnOfFile(sessionId, file) {
+      const turns = turnsForFileWithChanges(sessionId, file);
+      return turns.length > 0 ? turns[turns.length - 1] : null;
+    }
+
+    function nextTurnOfFile(sessionId, file, turn) {
+      const turns = turnsForFileWithChanges(sessionId, file);
+      for (const t of turns) {
+        if (t > turn) return t;
+      }
+      return null;
+    }
+
+    /** Revert one hunk — one tool call, one contiguous change. */
+    async function revertChange(sessionId, file, cardIndex) {
+      if (!file) return;
+      try {
+        verifyEditFile(file);
+        const outcome = hunkAnchorOutcome(file, cardIndex);
+        const anchor = outcome.anchor;
+        if (!anchor) {
+          throw new Error(outcome.reason || '这处改动无法单独撤销');
+        }
+
+        const current = await readCurrentText(sessionId, file.path);
+        const located = locateAnchor(anchor, current.text);
+        if (!located) {
+          throw new Error('这个文件在这次改动之后又被修改过，已无法定位这处改动，请改用「撤销整轮」');
+        }
+        if (located.mode === 'already') throw new Error('这处改动已经被撤销');
+
+        const next = located.mode === 'all'
+          ? current.text.split(located.from).join(located.to)
+          : current.text.replace(located.from, located.to);
+        if (next === current.text) throw new Error('这处改动已经被撤销');
+
+        await writeText(sessionId, file.path, next);
+        setToast(sessionId, '已撤销 ' + file.name + ' 的第 ' + (cardIndex + 1) + ' 处改动', 'success');
+      } catch (error) {
+        setToast(sessionId, String((error && error.message) || error), 'error');
+      }
+      notify();
+    }
+
+    /** Discard a file the agent created in this session. */
+    async function discardNewFile(sessionId, file) {
+      if (!file) return;
+      try {
+        if (file.dirty === true) {
+          throw new Error('智能体正在写入这个文件，请等这一步结束后再撤销');
+        }
+        if (file.confirming !== 'delete') {
+          file.confirming = 'delete';
+          setToast(sessionId, '再点一次即从磁盘删除 ' + file.path, 'warn');
+          return;
+        }
+        file.confirming = null;
+        await deleteFile(sessionId, file.path);
+
+        const st = getSessionState(sessionId);
+        const record = st && st.files[file.path];
+        if (record) {
+          record.removed = true;
+          record.status = 'D';
+        }
+        setToast(sessionId, '已删除新建文件 ' + file.name, 'success');
+      } catch (error) {
+        file.confirming = null;
+        setToast(sessionId, String((error && error.message) || error), 'error');
+      }
+      notify();
+    }
+
+    /** Write a deleted file back from the newest content the session recorded. */
+    async function restoreRemovedFile(sessionId, file) {
+      if (!file) return;
+      try {
+        if (file.confirming !== 'restore') {
+          file.confirming = 'restore';
+          setToast(sessionId, '再点一次即把 ' + file.path + ' 写回磁盘', 'warn');
+          return;
+        }
+        file.confirming = null;
+
+        const phases = file.phases || [];
+        let newest = null;
+        for (const phase of phases) {
+          for (const artifact of phase.artifacts || []) {
+            if (typeof artifact.newText === 'string') newest = artifact;
+          }
+        }
+
+        // A file deleted by a shell command may never have been written by a file tool, so
+        // fall back to the baseline captured before the session first touched it.
+        let body = newest ? newest.newText : null;
+        let source = '本次会话记录的内容';
+        if (body === null) {
+          const baseline = baselineOf(sessionId, file.path) || baselines.get(file.key);
+          if (baseline && typeof baseline.text === 'string') {
+            body = baseline.text;
+            source = '会话前的原始内容';
+          }
+        }
+        if (body === null) {
+          throw new Error('没有可用来恢复的记录内容；这个文件在本次会话中从未被读取或写入过');
+        }
+
+        await writeText(sessionId, file.path, body);
+
+        const st = getSessionState(sessionId);
+        const record = st && st.files[file.path];
+        if (record) {
+          record.removed = false;
+          record.missing = false;
+          record.removedBy = null;
+          record.status = 'M';
+          record.reverted = false;
+        }
+        setToast(sessionId, '已恢复 ' + file.name + '（来源：' + source + '）', 'success');
+      } catch (error) {
+        file.confirming = null;
+        setToast(sessionId, String((error && error.message) || error), 'error');
+      }
+      notify();
+    }
+
+    /**
+     * Split one recorded edit into the diff cards the inspector shows, in file order.
+     *
+     * `edit`/`str_replace_editor` call arguments are literal, so they give byte-exact hunks
+     * even when replayed from history. `write`/`write_file` only carries the new content, so
+     * its hunks come from the tool/result artifact instead.
+     */
+    function buildDiffs(name, args) {
+      if (name === 'edit') {
+        const oldText = typeof args.old_string === 'string' ? args.old_string : '';
+        const newText = typeof args.new_string === 'string' ? args.new_string : '';
+        if (args.replace_all === true) {
+          return [{ kind: 'replace-all', oldText: splitLines(oldText), newText: splitLines(newText), replaceAll: true }];
+        }
+        return [{ kind: 'block', oldText: splitLines(oldText), newText: splitLines(newText) }];
+      }
+
+      if (name === 'str_replace_editor') {
+        const oldText = typeof args.old_str === 'string' ? args.old_str : '';
+        const newText = typeof args.new_str === 'string' ? args.new_str : '';
+        return [{ kind: 'block', oldText: splitLines(oldText), newText: splitLines(newText) }];
+      }
+
+      return [];
+    }
+
+    function splitLines(text) {
+      return typeof text === 'string' ? text.split('\n') : [];
+    }
+
+    function describeDiff(diff) {
+      if (!diff) return '改动';
+      if (diff.replaceAll) return '全部匹配项';
+      const label = '−' + diff.oldText.length + ' / +' + diff.newText.length;
+      if (diff.oldText.length === 0) return '新增 · ' + label;
+      if (diff.newText.length === 0) return '删除 · ' + label;
+      return label;
+    }
+
+    function extractFilePathAndDiff(name, argsRaw) {
+      if (!argsRaw || typeof argsRaw !== 'string') return null;
+      let args;
+      try {
+        args = JSON.parse(argsRaw);
+      } catch {
+        return null;
+      }
+      if (!args || typeof args !== 'object') return null;
+
+      if (name === 'edit') {
+        const fp = args.file_path || args.path;
+        if (typeof fp === 'string' && fp.length > 0) {
+          return {
+            path: fp,
+            status: 'M',
+            line: typeof args.offset === 'number' ? args.offset : undefined,
+            phase: { kind: 'edit', diffs: buildDiffs('edit', args), oldText: args.old_string, newText: args.new_string }
+          };
+        }
+      }
+
+      if (name === 'str_replace_editor') {
+        const fp = args.path;
+        if (typeof fp === 'string' && fp.length > 0) {
+          return {
+            path: fp,
+            status: 'M',
+            phase: { kind: 'edit', diffs: buildDiffs('str_replace_editor', args), oldText: args.old_str, newText: args.new_str }
+          };
+        }
+      }
+
+      if (name === 'write' || name === 'write_file') {
+        const fp = args.file_path || args.path;
+        if (typeof fp === 'string' && fp.length > 0) {
+          const content = typeof args.content === 'string' ? args.content : null;
+          return {
+            path: fp,
+            status: 'A',
+            line: typeof args.offset === 'number' ? args.offset : undefined,
+            phase: { kind: 'write', diffs: [], oldText: null, newText: content, awaitingArtifact: true }
+          };
+        }
+      }
+
+      if (name === 'read') {
+        const fp = args.file_path || args.path;
+        if (typeof fp === 'string' && fp.length > 0) {
+          return {
+            path: fp,
+            status: 'R',
+            line: typeof args.offset === 'number' ? args.offset : undefined
+          };
+        }
+      }
+
+      return null;
+    }
+
+    function countLeaves(diffs) {
+      let total = 0;
+      for (const diff of diffs || []) {
+        total += diff.replaceAll ? Math.max(1, diff.occurrences || 1) : 1;
+      }
+      return total;
+    }
+
+    function recordFile(sessionId, filePath, status, line, phase, seq, options) {
+      const state = getSessionState(sessionId);
+      if (!state) return;
+
+      const cleanPath = filePath.replace(/\\/g, '/').replace(/^(?:\.\/)+/, '');
+      const parts = cleanPath.split('/');
+      const name = parts.pop() || cleanPath;
+      const dir = parts.join('/') || '.';
+      const ext = name.includes('.') ? name.split('.').pop() : '';
+      const key = keyOfPath(sessionId, cleanPath);
+      const turn = options && typeof options.turn === 'number' ? options.turn : (state.currentTurn || null);
+
+      let nextStatus = status;
+      const existing = state.files[cleanPath];
+      const wasReadOnly = !!existing && existing.status === 'R';
+      const justDiscovered = !existing;
+      if (existing) {
+        if (existing.status === 'M' || status === 'M') {
+          nextStatus = 'M';
+        } else if (existing.status === 'A' && status === 'R') {
+          nextStatus = 'A';
+        }
+      }
+
+      for (const k in state.files) {
+        state.files[k].active = false;
+      }
+
+      const phases = existing && Array.isArray(existing.phases) ? existing.phases.slice() : [];
+      if (phase) {
+        // The call-side extraction is provisional for edits until the tool/result artifact
+        // arrives; the artifact pass replaces it rather than stacking a duplicate phase.
+        if (phase.awaitingArtifact && phases.length > 0) {
+          const last = phases[phases.length - 1];
+          if (last.awaitingArtifact) phases.pop();
+        }
+        phases.push({
+          kind: phase.kind,
+          diffs: phase.diffs || [],
+          artifacts: phase.artifacts || [],
+          oldText: phase.oldText === undefined ? null : phase.oldText,
+          newText: phase.newText === undefined ? null : phase.newText,
+          awaitingArtifact: !!phase.awaitingArtifact,
+          turn: turn,
+          seq: seq,
+          time: Date.now()
+        });
+      }
+
+      const allDiffs = [];
+      for (const item of phases) {
+        for (const diff of item.diffs || []) {
+          // A hunk inherits its phase's turn, which is what scopes a per-turn undo.
+          if (diff.turn === undefined) diff.turn = item.turn === undefined ? null : item.turn;
+          allDiffs.push(diff);
+        }
+      }
+
+      state.files[cleanPath] = {
+        path: cleanPath,
+        key: key,
+        name: name,
+        dir: dir,
+        ext: ext,
+        status: nextStatus,
+        active: true,
+        line: line,
+        timestamp: Date.now(),
+        count: (existing ? existing.count : 0) + 1,
+        phases: phases,
+        diffs: allDiffs,
+        edits: countLeaves(allDiffs),
+        removed: existing ? existing.removed : false,
+        reverted: existing ? existing.reverted : false,
+        confirming: null,
+        dirty: !!phase
+      };
+      state.activePath = cleanPath;
+
+      if (!state.selectedPath || nextStatus === 'M' || nextStatus === 'A') {
+        state.selectedPath = cleanPath;
+      }
+
+      // The pre-session baseline can only be captured while the file is still untouched.
+      const needsBaseline = !options || options.captureBaseline !== false;
+      if (needsBaseline && (justDiscovered || wasReadOnly)) {
+        ensureBaseline(sessionId, cleanPath);
+      }
+
+      // Snapshot what this turn inherited, so reverting the turn can restore exactly that.
+      if (phase && typeof turn === 'number') {
+        ensureTurnStart(sessionId, cleanPath, turn);
+      }
+
+      // The agent may be mid-edit; never offer a revert against a half-written file.
+      if (phase) {
+        if (state.dirtyTimers === undefined) state.dirtyTimers = new Map();
+        const prior = state.dirtyTimers.get(cleanPath);
+        if (prior) clearTimeout(prior);
+        state.dirtyTimers.set(cleanPath, setTimeout(() => {
+          const st = getSessionState(sessionId);
+          if (!st || !st.files[cleanPath]) return;
+          st.files[cleanPath].dirty = false;
+          st.dirtyTimers.delete(cleanPath);
+          notify();
+        }, 1500));
+      }
+    }
+
+    function clearActive(sessionId) {
+      const state = getSessionState(sessionId);
+      if (!state) return;
+      let changed = false;
+      if (state.activePath !== null) {
+        state.activePath = null;
+        changed = true;
+      }
+      for (const k in state.files) {
+        if (state.files[k].active) {
+          state.files[k].active = false;
+          changed = true;
+        }
+      }
+      if (changed) notify();
+    }
+
+    function openSingleFile(sessionId, filePath, line) {
+      if (!sessionId) {
+        console.warn('[@dsh-xhl/dsh-live-inspector] Cannot open file: no active session');
+        return;
+      }
+      const url = sessionFileAddress(sessionId, filePath);
+      const options = line ? { params: { line } } : undefined;
+      console.info('[@dsh-xhl/dsh-live-inspector] Opening file:', url, options);
+
+      if (globalCtx?.sidebarRight && typeof globalCtx.sidebarRight.openResourceIn === 'function') {
+        try {
+          globalCtx.sidebarRight.openResourceIn(sessionId, url, options);
+          return;
+        } catch (e) {
+          console.warn('[@dsh-xhl/dsh-live-inspector] openResourceIn error:', e);
+        }
+      }
+      if (globalCtx?.sidebarRight && typeof globalCtx.sidebarRight.openResource === 'function') {
+        try {
+          globalCtx.sidebarRight.openResource(url, options);
+          return;
+        } catch (e) {
+          console.warn('[@dsh-xhl/dsh-live-inspector] openResource error:', e);
+        }
+      }
+    }
+
+    function openResourceUrl(sessionId, url) {
+      if (globalCtx?.sidebarRight && typeof globalCtx.sidebarRight.openResourceIn === 'function') {
+        try {
+          globalCtx.sidebarRight.openResourceIn(sessionId, url);
+          return;
+        } catch (e) {
+          console.warn('[@dsh-xhl/dsh-live-inspector] openResourceIn error:', e);
+        }
+      }
+      if (globalCtx?.sidebarRight && typeof globalCtx.sidebarRight.openResource === 'function') {
+        try {
+          globalCtx.sidebarRight.openResource(url);
+          return;
+        } catch (e) {
+          console.warn('[@dsh-xhl/dsh-live-inspector] openResource error:', e);
+        }
+      }
+    }
+
+    function renderParts(parts, kind) {
+      if (!parts || parts.length === 0) return null;
+      return parts.map((p, i) => {
+        if (!p.changed) return h('span', { key: i }, p.text);
+        if (kind === 'del') {
+          return h('span', {
+            key: i,
+            style: {
+              background: 'rgba(239, 68, 68, 0.4)',
+              color: '#fff',
+              borderRadius: '2px',
+              padding: '0 2px',
+              fontWeight: 600
+            }
+          }, p.text);
+        }
+        return h('span', {
+          key: i,
+          style: {
+            background: 'rgba(16, 185, 129, 0.4)',
+            color: '#fff',
+            borderRadius: '2px',
+            padding: '0 2px',
+            fontWeight: 600
+          }
+        }, p.text);
+      });
+    }
+
+    // Side-by-Side Split Diff View
+    function SplitDiffView({ computed, wrapLines }) {
+      const { rows, truncated, totalRows } = computed;
+      const emptyHatch = 'repeating-linear-gradient(45deg, rgba(255,255,255,0.015), rgba(255,255,255,0.015) 6px, rgba(0,0,0,0.1) 6px, rgba(0,0,0,0.1) 12px)';
+
+      return h('div', {
+        style: {
+          display: 'grid',
+          gridTemplateColumns: 'minmax(0, 1fr) minmax(0, 1fr)',
+          border: '1px solid var(--dsw-alias-border-l2, rgba(255,255,255,0.1))',
+          borderRadius: '6px',
+          overflow: 'hidden',
+          fontFamily: 'var(--ds-font-family-code, "JetBrains Mono", monospace)',
+          fontSize: '11px',
+          background: 'var(--dsw-alias-bg-layer-2, rgba(0,0,0,0.28))'
+        }
+      },
+        // Left Column Header (Original / Before)
+        h('div', {
+          style: {
+            gridColumn: '1 / 2',
+            padding: '5px 10px',
+            background: 'rgba(239, 68, 68, 0.12)',
+            borderBottom: '1px solid rgba(239, 68, 68, 0.22)',
+            borderRight: '1px solid var(--dsw-alias-border-l2, rgba(255,255,255,0.1))',
+            color: '#f87171',
+            fontWeight: 600,
+            fontSize: '10px',
+            display: 'flex',
+            justifyContent: 'space-between',
+            alignItems: 'center'
+          }
+        },
+          h('span', null, '◀ 原始（改动前）'),
+          h('span', { style: { opacity: 0.8, fontSize: '9px' } }, '-' + computed.delCount + ' 行')
+        ),
+
+        // Right Column Header (Modified / After)
+        h('div', {
+          style: {
+            gridColumn: '2 / 3',
+            padding: '5px 10px',
+            background: 'rgba(16, 185, 129, 0.12)',
+            borderBottom: '1px solid rgba(16, 185, 129, 0.22)',
+            color: '#34d399',
+            fontWeight: 600,
+            fontSize: '10px',
+            display: 'flex',
+            justifyContent: 'space-between',
+            alignItems: 'center'
+          }
+        },
+          h('span', null, '▶ 修改后'),
+          h('span', { style: { opacity: 0.8, fontSize: '9px' } }, '+' + computed.addCount + ' 行')
+        ),
+
+        // Synchronized Aligned Rows
+        h('div', {
+          style: {
+            gridColumn: '1 / -1',
+            maxHeight: '480px',
+            overflowY: 'auto',
+            overflowX: wrapLines ? 'hidden' : 'auto'
+          }
+        },
+          rows.map((row, idx) => {
+            const left = row.left;
+            const right = row.right;
+
+            return h('div', {
+              key: idx,
+              style: {
+                display: 'grid',
+                gridTemplateColumns: 'minmax(0, 1fr) minmax(0, 1fr)',
+                minHeight: '22px',
+                lineHeight: '22px',
+                borderBottom: '0.5px solid rgba(255,255,255,0.02)'
+              }
+            },
+              // LEFT CELL
+              h('div', {
+                style: {
+                  display: 'flex',
+                  minWidth: 0,
+                  borderRight: '1px solid var(--dsw-alias-border-l2, rgba(255,255,255,0.1))',
+                  background: left ? (left.kind === 'del' ? 'rgba(239, 68, 68, 0.08)' : 'transparent') : emptyHatch
+                }
+              },
+                h('div', {
+                  style: {
+                    width: '36px',
+                    flexShrink: 0,
+                    textAlign: 'right',
+                    paddingRight: '6px',
+                    userSelect: 'none',
+                    fontSize: '10px',
+                    color: left?.kind === 'del' ? '#f87171' : 'var(--dsw-alias-label-tertiary, #666)',
+                    background: left?.kind === 'del' ? 'rgba(239, 68, 68, 0.16)' : 'transparent',
+                    borderRight: '1px solid rgba(255,255,255,0.05)'
+                  }
+                }, left ? String(left.no) : ''),
+                h('div', {
+                  style: {
+                    flex: 1,
+                    minWidth: 0,
+                    padding: '0 8px',
+                    whiteSpace: wrapLines ? 'pre-wrap' : 'pre',
+                    wordBreak: wrapLines ? 'break-all' : 'normal',
+                    color: left?.kind === 'del' ? '#fca5a5' : 'var(--dsw-alias-label-secondary, #bbb)'
+                  }
+                }, left ? renderParts(left.parts, left.kind) : '')
+              ),
+
+              // RIGHT CELL
+              h('div', {
+                style: {
+                  display: 'flex',
+                  minWidth: 0,
+                  background: right ? (right.kind === 'add' ? 'rgba(16, 185, 129, 0.08)' : 'transparent') : emptyHatch
+                }
+              },
+                h('div', {
+                  style: {
+                    width: '36px',
+                    flexShrink: 0,
+                    textAlign: 'right',
+                    paddingRight: '6px',
+                    userSelect: 'none',
+                    fontSize: '10px',
+                    color: right?.kind === 'add' ? '#34d399' : 'var(--dsw-alias-label-tertiary, #666)',
+                    background: right?.kind === 'add' ? 'rgba(16, 185, 129, 0.16)' : 'transparent',
+                    borderRight: '1px solid rgba(255,255,255,0.05)'
+                  }
+                }, right ? String(right.no) : ''),
+                h('div', {
+                  style: {
+                    flex: 1,
+                    minWidth: 0,
+                    padding: '0 8px',
+                    whiteSpace: wrapLines ? 'pre-wrap' : 'pre',
+                    wordBreak: wrapLines ? 'break-all' : 'normal',
+                    color: right?.kind === 'add' ? '#86efac' : 'var(--dsw-alias-label-secondary, #bbb)'
+                  }
+                }, right ? renderParts(right.parts, right.kind) : '')
+              )
+            );
+          }),
+
+          truncated ? h('div', {
+            style: {
+              padding: '6px 12px',
+              color: 'var(--dsw-alias-label-tertiary, #888)',
+              fontStyle: 'italic',
+              fontSize: '11px',
+              textAlign: 'center',
+              background: 'rgba(0,0,0,0.2)'
+            }
+          }, '…… 还有 ' + (totalRows - MAX_RENDERED_DIFF_ROWS) + ' 行（在编辑器中查看完整文件）') : null
+        )
+      );
+    }
+
+    // Unified Diff View
+    function UnifiedDiffView({ computed, wrapLines }) {
+      const { rows, truncated, totalRows } = computed;
+
+      return h('div', {
+        style: {
+          border: '1px solid var(--dsw-alias-border-l2, rgba(255,255,255,0.1))',
+          borderRadius: '6px',
+          overflow: 'hidden',
+          fontFamily: 'var(--ds-font-family-code, "JetBrains Mono", monospace)',
+          fontSize: '11px',
+          background: 'var(--dsw-alias-bg-layer-2, rgba(0,0,0,0.28))',
+          maxHeight: '480px',
+          overflowY: 'auto',
+          overflowX: wrapLines ? 'hidden' : 'auto'
+        }
+      },
+        rows.map((row, idx) => {
+          if (row.left?.kind === 'context') {
+            return h('div', {
+              key: idx,
+              style: {
+                display: 'flex',
+                lineHeight: '22px',
+                minHeight: '22px',
+                color: 'var(--dsw-alias-label-secondary, #bbb)',
+                borderBottom: '0.5px solid rgba(255,255,255,0.02)'
+              }
+            },
+              h('span', { style: { width: '36px', textAlign: 'right', paddingRight: '6px', opacity: 0.5, userSelect: 'none' } }, String(row.left.no)),
+              h('span', { style: { width: '36px', textAlign: 'right', paddingRight: '6px', opacity: 0.5, userSelect: 'none' } }, String(row.right.no)),
+              h('span', { style: { width: '18px', textAlign: 'center', opacity: 0.3 } }, ' '),
+              h('span', { style: { flex: 1, paddingRight: '8px', whiteSpace: wrapLines ? 'pre-wrap' : 'pre', wordBreak: wrapLines ? 'break-all' : 'normal' } }, row.left.text)
+            );
+          }
+
+          const elements = [];
+          if (row.left && row.left.kind === 'del') {
+            elements.push(h('div', {
+              key: 'del-' + idx,
+              style: {
+                display: 'flex',
+                lineHeight: '22px',
+                minHeight: '22px',
+                background: 'rgba(239, 68, 68, 0.09)',
+                color: '#fca5a5',
+                borderBottom: '0.5px solid rgba(255,255,255,0.02)'
+              }
+            },
+              h('span', { style: { width: '36px', textAlign: 'right', paddingRight: '6px', color: '#f87171', background: 'rgba(239, 68, 68, 0.16)', userSelect: 'none' } }, String(row.left.no)),
+              h('span', { style: { width: '36px', textAlign: 'right', paddingRight: '6px', background: 'rgba(239, 68, 68, 0.16)', userSelect: 'none' } }, ''),
+              h('span', { style: { width: '18px', textAlign: 'center', color: '#ef4444', fontWeight: 700 } }, '-'),
+              h('span', { style: { flex: 1, paddingRight: '8px', whiteSpace: wrapLines ? 'pre-wrap' : 'pre', wordBreak: wrapLines ? 'break-all' : 'normal' } }, renderParts(row.left.parts, 'del'))
+            ));
+          }
+          if (row.right && row.right.kind === 'add') {
+            elements.push(h('div', {
+              key: 'add-' + idx,
+              style: {
+                display: 'flex',
+                lineHeight: '22px',
+                minHeight: '22px',
+                background: 'rgba(16, 185, 129, 0.09)',
+                color: '#86efac',
+                borderBottom: '0.5px solid rgba(255,255,255,0.02)'
+              }
+            },
+              h('span', { style: { width: '36px', textAlign: 'right', paddingRight: '6px', background: 'rgba(16, 185, 129, 0.16)', userSelect: 'none' } }, ''),
+              h('span', { style: { width: '36px', textAlign: 'right', paddingRight: '6px', color: '#34d399', background: 'rgba(16, 185, 129, 0.16)', userSelect: 'none' } }, String(row.right.no)),
+              h('span', { style: { width: '18px', textAlign: 'center', color: '#10b981', fontWeight: 700 } }, '+'),
+              h('span', { style: { flex: 1, paddingRight: '8px', whiteSpace: wrapLines ? 'pre-wrap' : 'pre', wordBreak: wrapLines ? 'break-all' : 'normal' } }, renderParts(row.right.parts, 'add'))
+            ));
+          }
+          return elements;
+        }),
+
+        truncated ? h('div', {
+          style: {
+            padding: '6px 12px',
+            color: 'var(--dsw-alias-label-tertiary, #888)',
+            fontStyle: 'italic',
+            fontSize: '11px',
+            textAlign: 'center',
+            background: 'rgba(0,0,0,0.2)'
+          }
+        }, '…… 还有 ' + (totalRows - MAX_RENDERED_DIFF_ROWS) + ' 行（在编辑器中查看完整文件）') : null
+      );
+    }
+
+    // Detail Inspector for the Selected File
+    function SelectedFileDiffInspector({ file, currentSid, selectedTurn, newestTurn, turnUndoable, turnLabelOf }) {
+      const [viewMode, setViewMode] = React.useState('split'); // 'split' | 'unified'
+      const [wrapLines, setWrapLines] = React.useState(true);
+      const [activeDiffIdx, setActiveDiffIdx] = React.useState(0);
+      const [busy, setBusy] = React.useState(false);
+
+      if (!file) {
+        return h('div', {
+          style: {
+            padding: '48px 16px',
+            textAlign: 'center',
+            color: 'var(--dsw-alias-label-tertiary, #666)',
+            fontSize: '12px'
+          }
+        },
+          h('div', { style: { fontSize: '24px', marginBottom: '8px' } }, '🌿'),
+          h('div', { style: { fontWeight: 500 } }, '未选择文件'),
+          h('div', { style: { fontSize: '11px', marginTop: '4px', opacity: 0.8 } }, '在上方选择一个文件，即可左右对照查看它的差异。')
+        );
+      }
+
+      const phases = file.phases || [];
+      const diffs = file.diffs || [];
+      const hasDiffs = phases.length > 0;
+
+      // The hunks in scope: only the selected turn's. Each keeps its ORIGINAL index into
+      // `diffs`, because that index selects the diff and addresses the undo handlers.
+      // Hunks with no recorded turn (replayed history) stay visible: hiding them would hide
+      // changes the panel cannot attribute.
+      const inScopeDiffs = diffs
+        .map((diff, idx) => ({ diff, idx }))
+        .filter(({ diff }) => selectedTurn === null || typeof diff.turn !== 'number' || diff.turn === selectedTurn);
+
+      // The active hunk must be one the scope contains. Selecting a turn that does not include
+      // the previously active hunk falls back to the first in-scope hunk, so the diff body can
+      // never render a change from a turn the rest of the panel is not showing.
+      const activeDiffIdxSafe = inScopeDiffs.length > 0
+        ? (inScopeDiffs.some(({ idx }) => idx === activeDiffIdx) ? activeDiffIdx : inScopeDiffs[0].idx)
+        : Math.min(activeDiffIdx, Math.max(0, diffs.length - 1));
+      const currentDiff = diffs[activeDiffIdxSafe];
+
+      const card = React.useMemo(
+        () => (hasDiffs ? resolveCardTexts(currentSid, file, file.selectedArtifact, diffs.length > 0 ? activeDiffIdxSafe : undefined) : null),
+        [currentSid, file.key, file.phases, file.diffs, file.selectedArtifact, activeDiffIdxSafe, hasDiffs]
+      );
+
+      const computed = React.useMemo(() => {
+        if (!card) return null;
+        return computeSplitDiff(card.oldText, card.newText, 1);
+      }, [card && card.oldText, card && card.newText]);
+
+      // Undoing one change is offered only while its anchor still resolves exactly once.
+      // The refusal reason is carried through so the tooltip can name the actual condition.
+      const hunkOutcome = React.useMemo(
+        () => (hasDiffs && diffs.length > 0
+          ? hunkAnchorOutcome(file, activeDiffIdxSafe)
+          : { reason: '未选中任何改动' }),
+        [file.key, file.phases, file.diffs, activeDiffIdxSafe, hasDiffs]
+      );
+      const hunkAnchor = hunkOutcome.anchor || null;
+
+      // The active hunk's own turn, and whether the turn scope lets us undo it.
+      // (Turn-level undo lives in the toolbar and the file rows, not this header.)
+      const activeHunkTurn = currentDiff && typeof currentDiff.turn === 'number' ? currentDiff.turn : null;
+      const hunkInTurnScope = activeHunkTurn === null || selectedTurn === null || activeHunkTurn === selectedTurn;
+
+      async function runRevert(action) {
+        setBusy(true);
+        try {
+          await action();
+        } finally {
+          setBusy(false);
+        }
+      }
+
+      const revertBlocker = file.status === 'R'
+        ? 'Read-only in this session — nothing to revert'
+        : file.dirty
+        ? '智能体正在写入这个文件'
+        : null;
+
+      return h('div', {
+        style: {
+          display: 'flex',
+          flexDirection: 'column',
+          flex: 1,
+          minHeight: 0,
+          background: 'var(--dsw-alias-bg-base, transparent)'
+        }
+      },
+        // Detail Header
+        h('div', {
+          style: {
+            padding: '8px 14px',
+            borderBottom: '1px solid var(--dsw-alias-border-l1, rgba(255,255,255,0.08))',
+            background: 'var(--dsw-alias-bg-layer-1, rgba(255,255,255,0.03))',
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'space-between',
+            flexWrap: 'wrap',
+            gap: '8px'
+          }
+        },
+          // Left: Identity & Badges
+          h('div', { style: { display: 'flex', alignItems: 'center', gap: '8px', minWidth: 0 } },
+            h(FileExtBadge, { ext: file.ext }),
+            h('span', {
+              style: {
+                padding: '1px 6px',
+                borderRadius: '3px',
+                fontSize: '10px',
+                fontWeight: 700,
+                fontFamily: 'monospace',
+                background: file.status === 'M' ? 'rgba(245, 158, 11, 0.2)' : file.status === 'A' ? 'rgba(16, 185, 129, 0.2)' : file.removed ? 'rgba(239, 68, 68, 0.2)' : 'rgba(59, 130, 246, 0.2)',
+                color: file.status === 'M' ? '#f59e0b' : file.status === 'A' ? '#10b981' : file.removed ? '#ef4444' : '#60a5fa',
+                border: '1px solid ' + (file.status === 'M' ? 'rgba(245, 158, 11, 0.4)' : file.status === 'A' ? 'rgba(16, 185, 129, 0.4)' : file.removed ? 'rgba(239, 68, 68, 0.4)' : 'rgba(59, 130, 246, 0.4)')
+              }
+            }, file.removed ? '已删除' : file.status === 'M' ? '已修改' : file.status === 'A' ? '已新建' : '已读取'),
+
+            h('div', { style: { overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' } },
+              h('span', { style: { fontWeight: 600, fontSize: '13px', color: 'var(--dsw-alias-label-primary, inherit)' } }, file.name),
+              file.dir !== '.' ? h('span', { style: { marginLeft: '6px', fontSize: '11px', color: 'var(--dsw-alias-label-tertiary, #888)' } }, file.dir) : null
+            ),
+
+            computed ? h(DiffStatBar, { addCount: computed.addCount, delCount: computed.delCount }) : null
+          ),
+
+          // Right: view controls plus the undo actions
+          h('div', { style: { display: 'flex', alignItems: 'center', gap: '6px', flexWrap: 'wrap' } },
+            hasDiffs ? h('button', {
+              onClick: () => setWrapLines(v => !v),
+              title: wrapLines ? '关闭自动换行' : '开启自动换行',
+              style: {
+                padding: '2px 6px',
+                borderRadius: '4px',
+                fontSize: '10px',
+                cursor: 'pointer',
+                border: '1px solid var(--dsw-alias-border-l1, rgba(255,255,255,0.1))',
+                background: wrapLines ? 'rgba(255,255,255,0.08)' : 'transparent',
+                color: 'var(--dsw-alias-label-secondary, #999)'
+              }
+            }, '换行') : null,
+
+            hasDiffs ? h('div', {
+              style: {
+                display: 'flex',
+                background: 'var(--dsw-alias-bg-layer-2, rgba(255,255,255,0.06))',
+                borderRadius: '4px',
+                padding: '2px',
+                border: '1px solid var(--dsw-alias-border-l1, rgba(255,255,255,0.1))'
+              }
+            },
+              h('button', {
+                onClick: () => setViewMode('split'),
+                title: '左右对照两列',
+                'aria-pressed': viewMode === 'split',
+                style: {
+                  padding: '2px 7px',
+                  borderRadius: '3px',
+                  fontSize: '10px',
+                  fontWeight: 600,
+                  cursor: 'pointer',
+                  border: 'none',
+                  // The selected half reads as a raised surface with primary text, not a filled
+                  // brand chip. The theme exposes no "on-brand" foreground token, so pairing
+                  // --dsw-alias-brand-primary with a hardcoded light foreground is unreadable
+                  // wherever that token resolves light. Both ends here are tokens, so the pair
+                  // stays legible in light and dark alike.
+                  background: viewMode === 'split' ? 'var(--dsw-alias-bg-overlay, rgba(127,127,127,0.22))' : 'transparent',
+                  color: viewMode === 'split' ? 'var(--dsw-alias-label-primary, inherit)' : 'var(--dsw-alias-label-secondary, #999)',
+                  boxShadow: viewMode === 'split' ? '0 1px 2px rgba(0,0,0,0.28)' : 'none'
+                }
+              }, '◫ 左右'),
+              h('button', {
+                onClick: () => setViewMode('unified'),
+                title: '合并单列',
+                'aria-pressed': viewMode === 'unified',
+                style: {
+                  padding: '2px 7px',
+                  borderRadius: '3px',
+                  fontSize: '10px',
+                  fontWeight: 600,
+                  cursor: 'pointer',
+                  border: 'none',
+                  background: viewMode === 'unified' ? 'var(--dsw-alias-bg-overlay, rgba(127,127,127,0.22))' : 'transparent',
+                  color: viewMode === 'unified' ? 'var(--dsw-alias-label-primary, inherit)' : 'var(--dsw-alias-label-secondary, #999)',
+                  boxShadow: viewMode === 'unified' ? '0 1px 2px rgba(0,0,0,0.28)' : 'none'
+                }
+              }, '☰ 合并')
+            ) : null,
+
+            // ── Undo: one hunk of the newest turn ──
+            // Undo controls are HIDDEN, not disabled, on any older turn: an older turn has
+            // already been reviewed, and showing a dead button implies an action that the
+            // panel will refuse. Turn-level undo lives in the toolbar and on the file rows,
+            // so this header offers only the finer-grained hunk undo.
+            turnUndoable && file.status === 'M' && diffs.length > 0 ? h('button', {
+              onClick: () => runRevert(() => revertChange(currentSid, file, activeDiffIdxSafe)),
+              disabled: busy || !!revertBlocker || !hunkAnchor || !hunkInTurnScope,
+              title: revertBlocker
+                ? revertBlocker
+                : !hunkInTurnScope
+                ? '这处改动属于 ' + turnLabelOf(activeHunkTurn) + '，而不是 ' + turnLabelOf(selectedTurn)
+                : hunkAnchor
+                ? '只撤销这处改动（' + describeDiff(currentDiff) + '）'
+                : (hunkOutcome.reason || '这处改动无法单独撤销'),
+              style: undoButtonStyle('warn', busy || !!revertBlocker || !hunkAnchor || !hunkInTurnScope, false)
+            }, '↶ 撤销此改动') : null,
+
+            // ── The only destructive action: removing a created file from disk ──
+            turnUndoable && file.status === 'A' && !file.removed ? h('button', {
+              onClick: () => runRevert(() => discardNewFile(currentSid, file)),
+              disabled: busy || !!file.dirty,
+              title: file.dirty ? '智能体正在写入这个文件' : '把这个新建的文件从磁盘删除',
+              style: undoButtonStyle('danger', busy || !!file.dirty, file.confirming === 'delete')
+            }, file.confirming === 'delete' ? '⚠ 确认删除' : '🗑 删除文件') : null,
+
+            // ── Restore a deleted file (also an undo, so newest turn only) ──
+            turnUndoable && file.removed ? h('button', {
+              onClick: () => runRevert(() => restoreRemovedFile(currentSid, file)),
+              disabled: busy,
+              title: '用本次会话记录的内容把这个文件写回磁盘',
+              style: undoButtonStyle('safe', busy, file.confirming === 'restore')
+            }, file.confirming === 'restore' ? '⚠ 确认恢复' : '⤴ 恢复') : null,
+
+            h('button', {
+              onClick: () => openSingleFile(currentSid, file.path, file.line),
+              title: '在编辑器中打开完整文件',
+              style: {
+                padding: '3px 8px',
+                borderRadius: '4px',
+                fontSize: '11px',
+                fontWeight: 500,
+                border: '1px solid var(--dsw-alias-border-l2, rgba(255,255,255,0.18))',
+                background: 'var(--dsw-alias-bg-layer-2, rgba(255,255,255,0.08))',
+                color: 'inherit',
+                cursor: 'pointer'
+              }
+            }, '↗ 打开编辑器')
+          )
+        ),
+
+        // Change tabs: the hunks of the SELECTED TURN only. Hunks from other turns are not
+        // listed at all — the turn scope is the panel's subject, so showing other turns'
+        // changes here (even dimmed) would contradict the rest of the view.
+        inScopeDiffs.length > 1 ? h('div', {
+          style: {
+            display: 'flex',
+            alignItems: 'center',
+            flexWrap: 'wrap',
+            gap: '6px',
+            padding: '6px 14px',
+            borderBottom: '1px solid rgba(255,255,255,0.06)',
+            background: 'rgba(0,0,0,0.12)'
+          }
+        },
+          h('span', { style: { fontSize: '10px', color: 'var(--dsw-alias-label-tertiary, #777)' } }, '改动：'),
+          // The index carried through is the ORIGINAL index into `diffs`, because that is what
+          // selects the diff and what the undo handlers address — filtering must not renumber.
+          inScopeDiffs.map(({ diff, idx }) => {
+            const hunkTurn = typeof diff.turn === 'number' ? diff.turn : null;
+            return h('button', {
+              key: 'diff-' + idx,
+              onClick: () => setActiveDiffIdx(idx),
+              title: describeDiff(diff) + (hunkTurn === null ? '' : ' · ' + turnLabelOf(hunkTurn)),
+              style: {
+                padding: '2px 8px',
+                borderRadius: '10px',
+                fontSize: '10px',
+                fontWeight: 500,
+                cursor: 'pointer',
+                border: activeDiffIdxSafe === idx ? '1px solid var(--dsw-alias-brand-primary, #3b82f6)' : '1px solid transparent',
+                background: activeDiffIdxSafe === idx ? 'rgba(59, 130, 246, 0.18)' : 'transparent',
+                color: activeDiffIdxSafe === idx ? '#60a5fa' : 'var(--dsw-alias-label-secondary, #888)'
+              }
+            }, '#' + (idx + 1) + ' ' + describeDiff(diff));
+          })
+        ) : null,
+
+        // A change that cannot be undone on its own says WHY, in the same words the button's
+        // tooltip uses — one catch-all sentence would leave the reader guessing.
+        file.status === 'M' && diffs.length > 0 && !hunkAnchor && hunkInTurnScope && !revertBlocker ? h('div', {
+          style: {
+            padding: '5px 14px',
+            fontSize: '10px',
+            color: '#f59e0b',
+            background: 'rgba(245, 158, 11, 0.08)',
+            borderBottom: '1px solid rgba(245, 158, 11, 0.18)'
+          }
+        }, '⚠ This change cannot be undone on its own. ' + (hunkOutcome.reason || '')) : null,
+
+        // Diff Viewer Body
+        h('div', {
+          style: {
+            padding: '10px 14px',
+            flex: 1,
+            overflowY: 'auto'
+          }
+        },
+          computed ? (
+            viewMode === 'split' ? h(SplitDiffView, { computed, wrapLines }) : h(UnifiedDiffView, { computed, wrapLines })
+          ) : (
+            h('div', {
+              style: {
+                padding: '32px 16px',
+                textAlign: 'center',
+                color: 'var(--dsw-alias-label-tertiary, #666)',
+                fontSize: '12px'
+              }
+            }, file.status === 'R' || file.reverted
+              ? 'This file matches its pre-session content.'
+              : (inScopeDiffs.length === 0 && diffs.length > 0
+                ? turnLabelOf(selectedTurn) + ' made no change to this file.'
+                : '没有记录到行级差异。'))
+          )
+        )
+      );
+    }
+
+    /** One-line undo feedback, dismissed automatically for terminal states. */
+    function UndoToast({ toast, onDismiss }) {
+      React.useEffect(() => {
+        const life = toast.tone === 'success' ? 4500 : 10000;
+        const timer = setTimeout(onDismiss, life);
+        return () => clearTimeout(timer);
+      }, [toast.at]);
+
+      const palette = toast.tone === 'error'
+        ? { bg: 'rgba(239, 68, 68, 0.12)', border: 'rgba(239, 68, 68, 0.4)', fg: '#f87171' }
+        : toast.tone === 'success'
+        ? { bg: 'rgba(16, 185, 129, 0.12)', border: 'rgba(16, 185, 129, 0.4)', fg: '#34d399' }
+        : toast.tone === 'warn'
+        ? { bg: 'rgba(245, 158, 11, 0.12)', border: 'rgba(245, 158, 11, 0.4)', fg: '#f59e0b' }
+        : { bg: 'rgba(59, 130, 246, 0.12)', border: 'rgba(59, 130, 246, 0.4)', fg: '#60a5fa' };
+
+      return h('div', {
+        style: {
+          marginTop: '6px',
+          padding: '5px 9px',
+          borderRadius: '5px',
+          background: palette.bg,
+          border: '1px solid ' + palette.border,
+          color: palette.fg,
+          fontSize: '11px',
+          display: 'flex',
+          alignItems: 'center',
+          gap: '8px'
+        }
+      },
+        h('span', { style: { flex: 1, minWidth: 0, wordBreak: 'break-word' } }, toast.message),
+        h('button', {
+          onClick: onDismiss,
+          title: '关闭',
+          style: {
+            background: 'none',
+            border: 'none',
+            color: palette.fg,
+            cursor: 'pointer',
+            fontSize: '12px',
+            padding: '0 2px',
+            lineHeight: 1
+          }
+        }, '✕')
+      );
+    }
+
+    /** Shared button look for the undo controls. */
+    /**
+     * Shared look for the undo controls.
+     *
+     * `danger` is reserved for the single destructive action (deleting a created file from
+     * disk) and is the only tone rendered as a solid fill, so it never reads as a peer of the
+     * restorative buttons beside it. Everything that writes content back stays amber.
+     */
+    function undoButtonStyle(tone, disabled, confirming) {
+      if (tone === 'danger') {
+        return {
+          padding: '3px 9px',
+          borderRadius: '4px',
+          fontSize: '11px',
+          fontWeight: 700,
+          border: '1px solid ' + (confirming ? 'rgba(239, 68, 68, 0.95)' : 'rgba(239, 68, 68, 0.75)'),
+          background: confirming ? '#dc2626' : 'rgba(239, 68, 68, 0.82)',
+          color: '#fff',
+          cursor: disabled ? 'not-allowed' : 'pointer',
+          opacity: disabled ? 0.4 : 1
+        };
+      }
+
+      const palette = tone === 'safe'
+        ? { border: 'rgba(16, 185, 129, ', bg: 'rgba(16, 185, 129, ', fg: '#34d399' }
+        : { border: 'rgba(245, 158, 11, ', bg: 'rgba(245, 158, 11, ', fg: '#f59e0b' };
+
+      return {
+        padding: '3px 8px',
+        borderRadius: '4px',
+        fontSize: '11px',
+        fontWeight: 600,
+        border: '1px solid ' + palette.border + (confirming ? '0.7)' : '0.42)'),
+        background: palette.bg + (confirming ? '0.26)' : '0.13)'),
+        color: palette.fg,
+        cursor: disabled ? 'not-allowed' : 'pointer',
+        opacity: disabled ? 0.45 : 1
+      };
+    }
+
+    // GitTree Tab Title Chip
+    function GitTreeTitle() {
+      const [activeSid, setActiveSid] = React.useState(resolveCurrentSessionId);
+      const [, setTick] = React.useState(0);
+
+      React.useEffect(() => {
+        const sync = () => {
+          const sid = resolveCurrentSessionId();
+          setActiveSid(sid);
+          setTick(t => t + 1);
+        };
+        const unsubMounted = globalCtx?.sidebarRight?.mounted?.subscribe(sync);
+        listeners.add(sync);
+        return () => {
+          if (unsubMounted) unsubMounted();
+          listeners.delete(sync);
+        };
+      }, []);
+
+      const sessionData = getSessionState(activeSid);
+      const fileList = sessionData ? Object.values(sessionData.files) : [];
+      const changedFiles = fileList.filter(f => f.status === 'M' || f.status === 'A');
+      const changesCount = changedFiles.reduce((sum, f) => sum + Math.max(1, f.edits || 1), 0);
+
+      return h('span', { style: { display: 'inline-flex', alignItems: 'center', gap: '6px' } },
+        h('span', null, '改动'),
+        changesCount > 0 ? h('span', {
+          title: changedFiles.length + ' 个文件共有 ' + changesCount + ' 处可撤销改动',
+          style: {
+            fontSize: '11px',
+            lineHeight: '14px',
+            padding: '1px 5px',
+            borderRadius: '10px',
+            // A tinted accent with primary text: the theme has no "on-brand" foreground
+            // token, so a filled brand chip would need a hardcoded colour that breaks in
+            // whichever theme resolves --dsw-alias-brand-primary light.
+            background: 'var(--dsw-alias-bg-overlay, rgba(127,127,127,0.22))',
+            color: 'var(--dsw-alias-label-primary, inherit)',
+            border: '1px solid var(--dsw-alias-brand-primary, #2563eb)',
+            fontWeight: 600
+          }
+        }, String(changesCount)) : null
+      );
+    }
+
+    // Main Tab Body Component
+    function GitTreeBody(props) {
+      const propSid = props?.sessionId;
+      const [activeSid, setActiveSid] = React.useState(() => propSid || resolveCurrentSessionId());
+      const [, setTick] = React.useState(0);
+      const [listCollapsed, setListCollapsed] = React.useState(false);
+
+      React.useEffect(() => {
+        const sync = () => {
+          const sid = propSid || resolveCurrentSessionId();
+          setActiveSid(sid);
+          setTick(t => t + 1);
+        };
+        const unsubMounted = globalCtx?.sidebarRight?.mounted?.subscribe(sync);
+        listeners.add(sync);
+        return () => {
+          if (unsubMounted) unsubMounted();
+          listeners.delete(sync);
+        };
+      }, [propSid]);
+
+      const currentSid = propSid || activeSid || resolveCurrentSessionId();
+      const sessionData = getSessionState(currentSid);
+
+      const [filter, setFilter] = React.useState(sessionData ? sessionData.filter : 'all');
+      const [search, setSearch] = React.useState(sessionData ? sessionData.searchQuery : '');
+
+      const fileList = sessionData ? Object.values(sessionData.files) : [];
+      const modifiedFiles = fileList.filter(f => f.status === 'M');
+      const addedFiles = fileList.filter(f => f.status === 'A');
+      const readFiles = fileList.filter(f => f.status === 'R');
+
+      // ── Turn scope ──
+      // The turn is the ONLY undo unit: undoing turn N restores what each file entered turn N
+      // with, so earlier turns survive. Only the newest turn is undoable — an older turn may
+      // already have later work stacked on top of it, so reverting it would silently discard
+      // that newer work. Older turns stay selectable for reading their diff, but every undo
+      // control is disabled while one is selected.
+      const fileTurns = [];
+      for (const f of fileList) {
+        for (const t of turnsForFileWithChanges(currentSid, f)) {
+          if (!fileTurns.includes(t)) fileTurns.push(t);
+        }
+      }
+      fileTurns.sort((a, b) => a - b);
+
+      const newestTurn = fileTurns.length > 0 ? fileTurns[fileTurns.length - 1] : null;
+
+      // `selectedTurn: null` follows the newest turn; a number pins an explicit choice.
+      const selectedTurn = sessionData && sessionData.selectedTurn !== null && fileTurns.includes(sessionData.selectedTurn)
+        ? sessionData.selectedTurn
+        : newestTurn;
+
+      const showingAllTurns = sessionData ? sessionData.showAllTurns === true : false;
+
+      /**
+       * Whether undo may be offered at all.
+       *
+       * Two conditions, both required: the selected turn is the newest, AND the panel is not
+       * showing "All turns". All turns is a cross-turn reading view, so there is no single
+       * turn an undo would act on — every undo control is hidden while it is selected.
+       */
+      const turnUndoable = !showingAllTurns && selectedTurn !== null && selectedTurn === newestTurn;
+
+      function turnLabel(turn) {
+        if (turn === null) return '—';
+        return '第 ' + (turn + 1) + ' 轮';
+      }
+
+      /** Files this turn changed, regardless of revertibility. */
+      const filesInTurn = showingAllTurns || selectedTurn === null
+        ? fileList
+        : fileList.filter(f => turnsForFileWithChanges(currentSid, f).includes(selectedTurn));
+
+      /** Files this turn changed and that can still be undone, oldest-turn guard included. */
+      const turnTargets = turnUndoable
+        ? filesInTurn.filter(f => f.status === 'M' && !f.dirty)
+        : [];
+      const revertAllCount = turnTargets.length;
+
+      // Chip counts follow the turn scope, so the chips agree with the list they filter.
+      const scopedChangedCount = filesInTurn.filter(f => f.status === 'M' || f.status === 'A').length;
+      const scopedReadCount = filesInTurn.filter(f => f.status === 'R').length;
+
+      if (sessionData && !sessionData.selectedPath && filesInTurn.length > 0) {
+        sessionData.selectedPath = (modifiedFiles[0] || addedFiles[0] || filesInTurn[0]).path;
+      }
+
+      const selectedFile = sessionData && sessionData.selectedPath ? sessionData.files[sessionData.selectedPath] : null;
+
+      let visible = fileList;
+      if (filter === 'changes') {
+        visible = visible.filter(f => f.status === 'M' || f.status === 'A');
+      } else if (filter === 'reads') {
+        visible = visible.filter(f => f.status === 'R');
+      }
+
+      // Scope the list to the selected turn unless the user asked to see everything.
+      if (!showingAllTurns && selectedTurn !== null) {
+        visible = visible.filter(f => turnsForFileWithChanges(currentSid, f).includes(selectedTurn));
+      }
+
+      if (search.trim().length > 0) {
+        const q = search.toLowerCase();
+        visible = visible.filter(f => f.path.toLowerCase().includes(q));
+      }
+
+      visible.sort((a, b) => {
+        if (a.active !== b.active) return a.active ? -1 : 1;
+        const rank = s => (s === 'M' ? 3 : s === 'A' ? 2 : 1);
+        if (rank(a.status) !== rank(b.status)) return rank(b.status) - rank(a.status);
+        return b.timestamp - a.timestamp;
+      });
+
+      // Keep the inspector on a file the current scope actually contains, so selecting a
+      // turn can never leave a diff from another turn on screen.
+      const scopeForSelection = visible.length > 0 ? visible : filesInTurn;
+      if (sessionData && scopeForSelection.length > 0) {
+        const stillInScope = selectedFile && scopeForSelection.some(f => f.path === selectedFile.path);
+        if (!stillInScope) {
+          const pick = scopeForSelection.find(f => f.status === 'M' || f.status === 'A') || scopeForSelection[0];
+          sessionData.selectedPath = pick.path;
+        }
+      }
+      const scopedSelectedFile = sessionData && sessionData.selectedPath ? sessionData.files[sessionData.selectedPath] : null;
+
+      function handleClear() {
+        if (sessionData) {
+          sessionData.files = {};
+          sessionData.activePath = null;
+          sessionData.selectedPath = null;
+          sessionData.reviewUrl = null;
+          notify();
+        }
+      }
+
+      function selectFile(path) {
+        if (sessionData) {
+          sessionData.selectedPath = path;
+          notify();
+        }
+      }
+
+      /** Row-level turn undo. Two clicks, since it writes to disk. */
+      async function revertFileTurnFromRow(sid, file, undoable) {
+        if (!file || selectedTurn === null) return;
+        if (undoable === false) {
+          setToast(sid, turnLabel(selectedTurn) + ' 不是最新轮次，无法撤销', 'info');
+          return;
+        }
+        if (file.confirming !== 'turn') {
+          file.confirming = 'turn';
+          setToast(sid, '再点一次即只撤销 ' + file.path + ' 中 ' + turnLabel(selectedTurn) + ' 的改动', 'warn');
+          return;
+        }
+        file.confirming = null;
+        const result = await revertTurnForFile(sid, file, selectedTurn);
+        setToast(
+          sid,
+          result.ok
+            ? (result.unchanged
+              ? file.name + ' already matched the start of ' + turnLabel(selectedTurn)
+              : '已撤销 ' + file.name + ' 中 ' + turnLabel(selectedTurn) + ' 的改动（更早的轮次保持不动）')
+            : result.reason,
+          result.ok ? 'success' : 'error'
+        );
+      }
+
+      const hunkCount = fileList.reduce((sum, f) => sum + (f.edits || 0), 0);
+
+      async function revertAllFiles() {
+        if (!sessionData) return;
+        if (selectedTurn === null) {
+          setToast(currentSid, '还没有任何轮次改动过文件', 'info');
+          return;
+        }
+
+        const targets = turnTargets;
+
+        if (sessionData.confirmingAll !== true) {
+          if (targets.length === 0) {
+            setToast(currentSid, turnLabel(selectedTurn) + ' 没有可撤销的文件改动', 'info');
+            return;
+          }
+          sessionData.confirmingAll = true;
+          setToast(
+            currentSid,
+            'Click again to undo ' + targets.length + ' file(s) back to the start of ' + turnLabel(selectedTurn) +
+            '. Earlier turns are kept.',
+            'warn'
+          );
+          return;
+        }
+        sessionData.confirmingAll = false;
+
+        let done = 0;
+        let unchanged = 0;
+        const failures = [];
+        for (const file of targets) {
+          const result = await revertTurnForFile(currentSid, file, selectedTurn);
+          if (result.ok) {
+            if (result.unchanged) unchanged++;
+            else done++;
+          } else {
+            failures.push(file.name + ' (' + result.reason + ')');
+          }
+        }
+
+        const parts = ['已将 ' + done + ' 个文件还原到 ' + turnLabel(selectedTurn) + ' 开始时的状态'];
+        if (unchanged > 0) parts.push(unchanged + ' 个本来就一致');
+        if (failures.length > 0) parts.push('失败：' + failures.join('；'));
+        setToast(currentSid, parts.join(' · '), failures.length === 0 ? 'success' : 'error');
+      }
+
+      return h('div', {
+        style: {
+          display: 'flex',
+          flexDirection: 'column',
+          height: '100%',
+          overflow: 'hidden',
+          fontFamily: 'var(--dsw-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif)',
+          color: 'var(--dsw-alias-label-primary, inherit)',
+          fontSize: '13px',
+          background: 'var(--dsw-alias-bg-base, transparent)'
+        }
+      },
+        // Top Toolbar
+        h('div', {
+          style: {
+            padding: '10px 14px',
+            borderBottom: '1px solid var(--dsw-alias-border-l1, rgba(255,255,255,0.08))',
+            background: 'var(--dsw-alias-bg-layer-1, rgba(255,255,255,0.025))'
+          }
+        },
+          h('div', {
+            style: {
+              display: 'flex',
+              alignItems: 'center',
+              justifyContent: 'space-between',
+              marginBottom: '8px'
+            }
+          },
+            h('div', { style: { display: 'flex', alignItems: 'center', gap: '8px', fontWeight: 600, fontSize: '13px' } },
+              h('span', null, '🌿 改动与差异检查器'),
+              h('span', {
+                style: {
+                  fontSize: '11px',
+                  color: 'var(--dsw-alias-label-tertiary, #888)',
+                  fontWeight: 'normal'
+                }
+              }, showingAllTurns
+                ? '(' + (modifiedFiles.length + addedFiles.length) + ' 个改动 / 共 ' + fileList.length + ' 个访问过的文件' +
+                  (hunkCount > 0 ? ' · ' + hunkCount + ' 处可撤销' : '') + ')'
+                : '(' + turnLabel(selectedTurn) + '：' + filesInTurn.length + ' 个文件' +
+                  '' +
+                  (revertAllCount > 0 ? ' · ' + revertAllCount + ' 处可撤销' : '') +
+                  ' — 本次会话共访问 ' + fileList.length + ' 个文件)')
+            ),
+
+            h('div', { style: { display: 'flex', alignItems: 'center', gap: '6px' } },
+              sessionData?.reviewUrl ? h('button', {
+                onClick: () => openResourceUrl(currentSid, sessionData.reviewUrl),
+                title: '在对比标签页中查看整轮改动',
+                style: {
+                  background: 'rgba(37, 99, 235, 0.16)',
+                  border: '1px solid rgba(37, 99, 235, 0.4)',
+                  color: 'var(--dsw-alias-brand-primary, #60a5fa)',
+                  cursor: 'pointer',
+                  fontSize: '11px',
+                  fontWeight: 600,
+                  padding: '2px 8px',
+                  borderRadius: '4px'
+                }
+              }, '🔍 查看整轮') : null,
+
+              h('button', {
+                onClick: () => setListCollapsed(v => !v),
+                title: listCollapsed ? '展开文件列表' : '折叠文件列表',
+                style: {
+                  background: 'none',
+                  border: 'none',
+                  color: 'var(--dsw-alias-label-secondary, #888)',
+                  cursor: 'pointer',
+                  fontSize: '11px',
+                  padding: '2px 6px'
+                }
+              }, listCollapsed ? '▼ 文件' : '▲ 折叠'),
+
+              h('button', {
+                onClick: handleClear,
+                title: '清空本次会话的改动记录',
+                style: {
+                  background: 'none',
+                  border: 'none',
+                  color: 'var(--dsw-alias-label-secondary, #888)',
+                  cursor: 'pointer',
+                  fontSize: '11px',
+                  padding: '2px 6px'
+                }
+              }, '清空')
+            )
+          ),
+
+          // Undo feedback: one line, cleared automatically
+          sessionData?.toast ? h(UndoToast, {
+            toast: sessionData.toast,
+            onDismiss: () => {
+              if (sessionData) sessionData.toast = null;
+              notify();
+            }
+          }) : null,
+
+          // Active indicator banner if running
+          (sessionData && sessionData.activePath) ? h('div', {
+            style: {
+              padding: '6px 10px',
+              borderRadius: '6px',
+              background: 'rgba(16, 185, 129, 0.12)',
+              border: '1px solid rgba(16, 185, 129, 0.3)',
+              color: '#10b981',
+              fontSize: '12px',
+              display: 'flex',
+              alignItems: 'center',
+              gap: '6px',
+              marginBottom: '6px'
+            }
+          },
+            h('span', {
+              style: {
+                width: '7px',
+                height: '7px',
+                borderRadius: '50%',
+                background: '#10b981',
+                boxShadow: '0 0 6px #10b981',
+                display: 'inline-block'
+              }
+            }),
+            h('span', { style: { fontWeight: 500 } }, '智能体正在操作：'),
+            h('span', {
+              style: {
+                fontFamily: 'var(--ds-font-family-code, monospace)',
+                fontWeight: 600,
+                textOverflow: 'ellipsis',
+                overflow: 'hidden',
+                whiteSpace: 'nowrap'
+              }
+            }, sessionData.activePath)
+          ) : null,
+
+          // Filter chips, search, and the Undo all action
+          !listCollapsed ? h('div', null,
+            h('div', { style: { display: 'flex', gap: '6px', alignItems: 'center' } },
+              h('button', {
+                onClick: () => {
+                  setFilter('all');
+                  if (sessionData) sessionData.filter = 'all';
+                },
+                style: {
+                  padding: '2px 8px',
+                  borderRadius: '10px',
+                  border: filter === 'all' ? '1px solid var(--dsw-alias-brand-primary, #3b82f6)' : '1px solid transparent',
+                  background: filter === 'all' ? 'rgba(59, 130, 246, 0.15)' : 'transparent',
+                  color: 'inherit',
+                  cursor: 'pointer',
+                  fontSize: '11px'
+                }
+              }, '全部 (' + filesInTurn.length + ')'),
+
+              h('button', {
+                onClick: () => {
+                  setFilter('changes');
+                  if (sessionData) sessionData.filter = 'changes';
+                },
+                style: {
+                  padding: '2px 8px',
+                  borderRadius: '10px',
+                  border: filter === 'changes' ? '1px solid #f59e0b' : '1px solid transparent',
+                  background: filter === 'changes' ? 'rgba(245, 158, 11, 0.15)' : 'transparent',
+                  color: filter === 'changes' ? '#f59e0b' : 'inherit',
+                  cursor: 'pointer',
+                  fontSize: '11px',
+                  fontWeight: scopedChangedCount > 0 ? 600 : 'normal'
+                }
+              }, '改动 (' + scopedChangedCount + ')'),
+
+              h('button', {
+                onClick: () => {
+                  setFilter('reads');
+                  if (sessionData) sessionData.filter = 'reads';
+                },
+                style: {
+                  padding: '2px 8px',
+                  borderRadius: '10px',
+                  border: filter === 'reads' ? '1px solid #3b82f6' : '1px solid transparent',
+                  background: filter === 'reads' ? 'rgba(59, 130, 246, 0.15)' : 'transparent',
+                  color: filter === 'reads' ? '#3b82f6' : 'inherit',
+                  cursor: 'pointer',
+                  fontSize: '11px'
+                }
+              }, '读取 (' + scopedReadCount + ')'),
+
+              // Turn scope: drives the file list, the diff inspector, and Undo together
+              h('div', {
+                style: { marginLeft: 'auto', display: 'flex', alignItems: 'center', gap: '6px' }
+              },
+                h('select', {
+                  value: showingAllTurns ? 'all' : String(selectedTurn),
+                  onChange: (e) => {
+                    if (!sessionData) return;
+                    const raw = e.target.value;
+                    if (raw === 'all') {
+                      sessionData.showAllTurns = true;
+                    } else {
+                      sessionData.showAllTurns = false;
+                      sessionData.selectedTurn = Number(raw);
+                    }
+                    sessionData.confirmingAll = false;
+                    notify();
+                  },
+                  title: '选择列表、差异和撤销所针对的轮次',
+                  style: {
+                    fontSize: '11px',
+                    padding: '2px 6px',
+                    borderRadius: '10px',
+                    border: '1px solid var(--dsw-alias-border-l1, rgba(255,255,255,0.14))',
+                    background: 'var(--dsw-alias-bg-layer-2, rgba(0,0,0,0.2))',
+                    color: 'inherit',
+                    cursor: 'pointer',
+                    outline: 'none',
+                    maxWidth: '150px'
+                  }
+                },
+                  fileTurns.map(t => h('option', {
+                    key: 'turn-' + t,
+                    value: String(t)
+                  }, turnLabel(t) +
+                     (t === fileTurns[fileTurns.length - 1] ? ' · 最新' : '') +
+                     ' (' + fileList.filter(f =>
+                       f.status === 'M' && turnsForFileWithChanges(currentSid, f).includes(t)
+                     ).length + ' 个文件)')),
+                  h('option', { key: 'turn-all', value: 'all' }, '全部轮次 (' + fileList.length + ')')
+                ),
+
+                // Hidden on older turns and under All turns, like every other undo control.
+                turnUndoable ? h('button', {
+                  onClick: revertAllFiles,
+                  disabled: revertAllCount === 0,
+                  title: revertAllCount === 0
+                    ? turnLabel(selectedTurn) + ' has no undoable file change'
+                    : '撤销 ' + turnLabel(selectedTurn) + ' 在所有文件中的改动，更早的轮次保持不动',
+                  style: {
+                    background: sessionData?.confirmingAll ? 'rgba(245, 158, 11, 0.28)' : 'rgba(245, 158, 11, 0.12)',
+                    border: '1px solid ' + (sessionData?.confirmingAll ? 'rgba(245, 158, 11, 0.7)' : 'rgba(245, 158, 11, 0.4)'),
+                    color: '#f59e0b',
+                    cursor: revertAllCount === 0 ? 'not-allowed' : 'pointer',
+                    fontSize: '11px',
+                    fontWeight: 600,
+                    padding: '2px 8px',
+                    borderRadius: '10px',
+                    opacity: revertAllCount === 0 ? 0.45 : 1,
+                    whiteSpace: 'nowrap'
+                  }
+                }, sessionData?.confirmingAll
+                  ? '⚠ 确认撤销'
+                  : '⟲ 撤销' + turnLabel(selectedTurn) + ' (' + revertAllCount + ' 个文件)') : null
+              )
+            ),
+
+            h('input', {
+              type: 'text',
+              placeholder: '筛选本次会话中的文件…',
+              value: search,
+              onChange: e => {
+                setSearch(e.target.value);
+                if (sessionData) sessionData.searchQuery = e.target.value;
+              },
+              style: {
+                width: '100%',
+                boxSizing: 'border-box',
+                marginTop: '6px',
+                padding: '4px 8px',
+                borderRadius: '4px',
+                fontSize: '11px',
+                border: '1px solid var(--dsw-alias-border-l1, rgba(255,255,255,0.12))',
+                background: 'var(--dsw-alias-bg-layer-2, rgba(0,0,0,0.15))',
+                color: 'inherit',
+                outline: 'none'
+              }
+            })
+          ) : null
+        ),
+
+        // Files Tree List Pane (Top)
+        !listCollapsed ? h('div', {
+          style: {
+            maxHeight: '190px',
+            overflowY: 'auto',
+            padding: '6px 8px',
+            borderBottom: '1px solid var(--dsw-alias-border-l2, rgba(255,255,255,0.1))',
+            background: 'var(--dsw-alias-bg-layer-1, rgba(0,0,0,0.1))'
+          }
+        },
+          visible.length === 0 ? h('div', {
+            style: {
+              padding: '16px 8px',
+              textAlign: 'center',
+              color: 'var(--dsw-alias-label-tertiary, #666)',
+              fontSize: '11px'
+            }
+          }, fileList.length === 0
+            ? '本次会话还没有改动过任何文件。'
+            : (showingAllTurns
+              ? '没有文件符合当前的筛选条件。'
+              : turnLabel(selectedTurn) + ' 没有改动任何符合筛选条件的文件。')) :
+          visible.map(f => {
+            const isSelected = scopedSelectedFile?.path === f.path;
+            const badgeStyle = f.removed
+              ? { bg: 'rgba(239, 68, 68, 0.16)', text: '#ef4444', border: 'rgba(239, 68, 68, 0.35)', label: 'D' }
+              : f.status === 'M'
+              ? { bg: 'rgba(245, 158, 11, 0.16)', text: '#f59e0b', border: 'rgba(245, 158, 11, 0.35)', label: 'M' }
+              : f.status === 'A'
+              ? { bg: 'rgba(16, 185, 129, 0.16)', text: '#10b981', border: 'rgba(16, 185, 129, 0.35)', label: 'A' }
+              : { bg: 'rgba(59, 130, 246, 0.12)', text: '#60a5fa', border: 'rgba(59, 130, 246, 0.25)', label: 'R' };
+
+            const canRestore = f.removed && (recoverableTextOf(f) !== null ||
+              !!baselineOf(currentSid, f.path) || !!baselines.get(f.key));
+
+            const editCount = f.edits || 0;
+            const revertible = hasRevertibleBaseline(currentSid, f);
+            const fileTurnList = turnsForFileWithChanges(currentSid, f);
+            const turnText = fileTurnList.length === 0
+              ? ''
+              : fileTurnList.length === 1
+              ? turnLabel(fileTurnList[0])
+              : turnLabel(fileTurnList[0]) + '–' + turnLabel(fileTurnList[fileTurnList.length - 1]);
+
+            return h('div', {
+              key: f.path,
+              onClick: () => selectFile(f.path),
+              style: {
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'space-between',
+                padding: '4px 8px',
+                margin: '1px 0',
+                borderRadius: '4px',
+                cursor: 'pointer',
+                borderLeft: isSelected ? '3px solid var(--dsw-alias-brand-primary, #3b82f6)' : (f.active ? '3px solid #10b981' : '3px solid transparent'),
+                background: isSelected ? 'rgba(59, 130, 246, 0.14)' : (f.active ? 'rgba(16, 185, 129, 0.08)' : 'transparent'),
+                transition: 'background 0.1s ease'
+              }
+            },
+              h('div', {
+                style: {
+                  display: 'flex',
+                  alignItems: 'center',
+                  gap: '6px',
+                  minWidth: 0,
+                  flex: 1
+                }
+              },
+                h('span', {
+                  title: f.removed
+                    ? (f.removedBy === 'shell' ? '在文件工具之外被删除（shell 命令）' : '在本次会话中被删除')
+                    : f.status === 'M' ? '已修改' : f.status === 'A' ? '已新建' : '已读取',
+                  style: {
+                    display: 'inline-flex',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                    width: '16px',
+                    height: '16px',
+                    borderRadius: '3px',
+                    fontSize: '10px',
+                    fontWeight: 700,
+                    fontFamily: 'monospace',
+                    background: badgeStyle.bg,
+                    color: badgeStyle.text,
+                    border: '1px solid ' + badgeStyle.border,
+                    flexShrink: 0
+                  }
+                }, badgeStyle.label),
+
+                h('div', {
+                  style: {
+                    minWidth: 0,
+                    overflow: 'hidden',
+                    textOverflow: 'ellipsis',
+                    whiteSpace: 'nowrap'
+                  }
+                },
+                  h('span', {
+                    style: {
+                      fontWeight: isSelected ? 600 : 500,
+                      fontFamily: 'var(--ds-font-family-code, monospace)',
+                      color: isSelected ? 'var(--dsw-alias-brand-primary, #60a5fa)' : 'inherit',
+                      fontSize: '12px',
+                      textDecoration: f.removed ? 'line-through' : 'none',
+                      opacity: f.removed ? 0.6 : 1
+                    }
+                  }, f.name),
+                  f.dir !== '.' ? h('span', {
+                    style: {
+                      marginLeft: '6px',
+                      fontSize: '10px',
+                      color: 'var(--dsw-alias-label-tertiary, #777)'
+                    }
+                  }, f.dir) : null
+                )
+              ),
+
+              h('div', { style: { display: 'flex', alignItems: 'center', gap: '6px', flexShrink: 0 } },
+                f.dirty ? h('span', {
+                  title: '智能体正在写入这个文件',
+                  style: { fontSize: '10px', color: '#10b981' }
+                }, '⚡') : null,
+
+                turnText ? h('span', {
+                  title: '改动过这个文件的轮次：' + fileTurnList.map(turnLabel).join('、'),
+                  style: {
+                    fontSize: '10px',
+                    color: 'var(--dsw-alias-label-tertiary, #888)',
+                    background: 'rgba(255,255,255,0.05)',
+                    padding: '1px 5px',
+                    borderRadius: '8px',
+                    whiteSpace: 'nowrap'
+                  }
+                }, turnText) : null,
+
+                editCount > 0 ? h('span', {
+                  title: !turnUndoable
+                    ? 'Already reviewed — ' + turnLabel(selectedTurn) + ' is not the newest turn'
+                    : revertible
+                    ? 'Can be undone back to the start of ' + turnLabel(selectedTurn)
+                    : '没有捕获到撤销快照',
+                  style: {
+                    fontSize: '10px',
+                    color: turnUndoable && revertible ? '#f59e0b' : 'var(--dsw-alias-label-tertiary, #888)',
+                    background: turnUndoable && revertible ? 'rgba(245, 158, 11, 0.12)' : 'rgba(255,255,255,0.05)',
+                    padding: '1px 5px',
+                    borderRadius: '8px',
+                    whiteSpace: 'nowrap'
+                  }
+                }, turnUndoable
+                  ? editCount + ' 处改动'
+                  : editCount + ' 处改动 · 已审核') : null,
+
+                turnUndoable && f.status === 'M' && fileTurnList.length > 0 ? h('button', {
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    revertFileTurnFromRow(currentSid, f, turnUndoable);
+                  },
+                  disabled: !!f.dirty,
+                  title: f.dirty
+                    ? '智能体正在写入这个文件'
+                    : '只撤销这个文件中 ' + turnLabel(selectedTurn) + ' 的改动，更早的轮次保持不动',
+                  style: {
+                    padding: '1px 6px',
+                    borderRadius: '3px',
+                    fontSize: '10px',
+                    border: '1px solid ' + (f.confirming === 'turn' ? 'rgba(245, 158, 11, 0.7)' : 'rgba(245, 158, 11, 0.35)'),
+                    background: f.confirming === 'turn' ? 'rgba(245, 158, 11, 0.28)' : 'rgba(245, 158, 11, 0.12)',
+                    color: '#f59e0b',
+                    cursor: f.dirty ? 'not-allowed' : 'pointer',
+                    opacity: f.dirty ? 0.4 : 1,
+                    whiteSpace: 'nowrap'
+                  }
+                }, f.confirming === 'turn' ? '确认' : '↶ 撤销' + turnLabel(selectedTurn)) : null,
+
+                turnUndoable && f.status === 'A' && !f.removed ? h('button', {
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    discardNewFile(currentSid, f);
+                  },
+                  disabled: !!f.dirty,
+                  title: f.dirty ? '智能体正在写入这个文件' : '把这个新建的文件从磁盘删除',
+                  style: {
+                    padding: '1px 6px',
+                    borderRadius: '3px',
+                    fontSize: '10px',
+                    fontWeight: 700,
+                    border: '1px solid ' + (f.confirming === 'delete' ? 'rgba(239, 68, 68, 0.95)' : 'rgba(239, 68, 68, 0.7)'),
+                    background: f.confirming === 'delete' ? '#dc2626' : 'rgba(239, 68, 68, 0.8)',
+                    color: '#fff',
+                    cursor: f.dirty ? 'not-allowed' : 'pointer',
+                    opacity: f.dirty ? 0.4 : 1
+                  }
+                }, f.confirming === 'delete' ? '确认' : '🗑 删除') : null,
+
+                turnUndoable && f.removed ? h('button', {
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    restoreRemovedFile(currentSid, f);
+                  },
+                  disabled: !canRestore,
+                  title: !canRestore
+                    ? '没有记录这个文件的内容，因此无法恢复'
+                    : (f.removedBy === 'shell'
+                      ? '这个文件在文件工具之外被删除；可用记录的内容把它写回磁盘'
+                      : '用本次会话记录的内容把这个文件写回磁盘'),
+                  style: {
+                    padding: '1px 6px',
+                    borderRadius: '3px',
+                    fontSize: '10px',
+                    border: '1px solid rgba(16, 185, 129, 0.35)',
+                    background: 'rgba(16, 185, 129, 0.12)',
+                    color: '#34d399',
+                    cursor: !canRestore ? 'not-allowed' : 'pointer',
+                    opacity: !canRestore ? 0.45 : 1,
+                    cursor: 'pointer'
+                  }
+                }, f.confirming === 'restore' ? '确认' : '⤴ 恢复') : null,
+
+                h('button', {
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    openSingleFile(currentSid, f.path, f.line);
+                  },
+                  title: '在编辑器中打开',
+                  style: {
+                    padding: '1px 6px',
+                    borderRadius: '3px',
+                    fontSize: '10px',
+                    border: '1px solid var(--dsw-alias-border-l1, rgba(255,255,255,0.12))',
+                    background: 'transparent',
+                    color: 'var(--dsw-alias-label-secondary, #888)',
+                    cursor: 'pointer'
+                  }
+                }, '查看')
+              )
+            );
+          })
+        ) : null,
+
+        // Selected File Diff Inspector (Bottom)
+        h(SelectedFileDiffInspector, {
+          file: scopedSelectedFile,
+          currentSid,
+          selectedTurn,
+          newestTurn,
+          turnUndoable,
+          turnLabelOf: turnLabel
+        })
+      );
+    }
+
+    // React Error Boundary Component to guarantee no white screens ever
+    class SafeGitTreeBody extends React.Component {
+      constructor(props) {
+        super(props);
+        this.state = { hasError: false, error: null };
+      }
+      static getDerivedStateFromError(error) {
+        return { hasError: true, error: error };
+      }
+      componentDidCatch(error, info) {
+        console.error('[@dsh-xhl/dsh-live-inspector] Caught render error:', error, info);
+      }
+      render() {
+        if (this.state.hasError) {
+          return h('div', {
+            style: {
+              padding: '24px 16px',
+              fontFamily: 'sans-serif',
+              color: 'var(--dsw-alias-label-primary, inherit)'
+            }
+          },
+            h('div', { style: { color: '#ef4444', fontWeight: 600, marginBottom: '6px' } }, '⚠️ 实时检查器渲染出错'),
+            h('div', { style: { fontSize: '11px', color: '#888', marginBottom: '12px' } }, String(this.state.error?.message || this.state.error)),
+            h('button', {
+              onClick: () => this.setState({ hasError: false, error: null }),
+              style: {
+                padding: '4px 12px',
+                borderRadius: '4px',
+                cursor: 'pointer',
+                background: 'var(--dsw-alias-bg-overlay, rgba(127,127,127,0.22))',
+                color: 'var(--dsw-alias-label-primary, inherit)',
+                border: '1px solid var(--dsw-alias-brand-primary, #2563eb)',
+                fontSize: '12px'
+              }
+            }, '重新加载')
+          );
+        }
+        return h(GitTreeBody, this.props);
+      }
+    }
+
+    return {
+      // No Host-facing service is declared: this half reaches its Host through the HTTP
+      // routes described at the filesystem seam above, which needs no injected service.
+      inject: ['sidebarRight', 'sidebarRightTabs', 'slots', 'sessions'],
+      apply(ctx) {
+        globalCtx = ctx;
+        const sessionUnsubscribes = new Map();
+
+        // Register tab type into sidebarRightTabs
+        if (ctx.sidebarRightTabs && typeof ctx.sidebarRightTabs.register === 'function') {
+          ctx.effect(() => {
+            return ctx.sidebarRightTabs.register({
+              id: TAB_ID,
+              kind: TAB_KIND,
+              priority: 'builtin',
+              title: () => '改动',
+              guide: [{
+                id: 'git-tree',
+                order: 1,
+                title: () => '改动',
+                description: () => '源文件改动与左右对照差异视图'
+              }]
+            });
+          }, '@dsh-xhl/dsh-live-inspector: git-tree tab registration');
+        }
+
+        // Register tab body into sidebar.right.pane.tab
+        ctx.effect(() => {
+          return ctx.slots.inject('sidebar.right.pane.tab', () => ctx.slots.register({
+            name: 'sidebar.right.pane.tab',
+            key: TAB_ID
+          }, SafeGitTreeBody));
+        }, '@dsh-xhl/dsh-live-inspector: git-tree body slot');
+
+        // Register live tab title into sidebar.right.pane.tab.title
+        ctx.effect(() => {
+          return ctx.slots.inject('sidebar.right.pane.tab.title', () => ctx.slots.register({
+            name: 'sidebar.right.pane.tab.title',
+            key: TAB_ID
+          }, GitTreeTitle));
+        }, '@dsh-xhl/dsh-live-inspector: git-tree title slot');
+
+        function ensureTabOpen(sid) {
+          const activeSid = resolveCurrentSessionId();
+          if (sid && activeSid && sid !== activeSid) return;
+
+          const sessionData = getSessionState(sid || activeSid);
+          if (sessionData && sessionData.autoOpenOpenedThisTurn) return;
+          if (sessionData) sessionData.autoOpenOpenedThisTurn = true;
+
+          try {
+            if (ctx.sidebarRight && typeof ctx.sidebarRight.openTab === 'function') {
+              ctx.sidebarRight.openTab(TAB_KIND);
+            }
+          } catch (e) {
+            console.debug('[@dsh-xhl/dsh-live-inspector] openTab deferred:', e);
+          }
+        }
+
+        function processEntries(sessionId, entries, isInitialScan = false) {
+          if (!Array.isArray(entries) || entries.length === 0) return;
+          const sessionData = getSessionState(sessionId);
+          if (!sessionData) return;
+
+          for (const entry of entries) {
+            if (!entry || entry.type !== 'event' || !entry.event) continue;
+            const ev = entry.event;
+
+            // Strict sequence de-duplication: each event is processed exactly once
+            if (typeof ev.seq === 'number') {
+              if (sessionData.processedSeqs.has(ev.seq)) continue;
+              sessionData.processedSeqs.add(ev.seq);
+            }
+
+            if (ev.type === 'turn/start') {
+              if (!isInitialScan) {
+                sessionData.autoOpenOpenedThisTurn = false;
+              }
+              // turn/start carries the working directory the tool paths are relative to.
+              const rawCwd = ev.data ? ev.data.cwd : null;
+              if (typeof rawCwd === 'string' && rawCwd.length > 0) {
+                const cwd = normalizeCwd(rawCwd);
+                if (cwd) sessionData.cwd = cwd;
+              }
+              if (ev.data && typeof ev.data.turn === 'number') {
+                sessionData.currentTurn = ev.data.turn;
+              }
+              clearActive(sessionId);
+            }
+
+            if (ev.type === 'tool/call' && ev.data) {
+              const toolName = ev.data.name;
+              const extracted = extractFilePathAndDiff(toolName, ev.data.arguments);
+              if (extracted && extracted.path) {
+                const toolTurn = typeof ev.data.turn === 'number' ? ev.data.turn : undefined;
+                recordFile(sessionId, extracted.path, extracted.status, extracted.line, extracted.phase, ev.seq, { turn: toolTurn });
+                if (!isInitialScan) {
+                  ensureTabOpen(sessionId);
+                }
+              }
+            }
+
+            if (ev.type === 'tool/result' && ev.data) {
+              const artifacts = extractArtifactsFromResult(ev.data.meta);
+              if (artifacts) {
+                const resultTurn = typeof ev.data.turn === 'number' ? ev.data.turn : undefined;
+                for (const artifact of artifacts) {
+                  recordFile(sessionId, artifact.path, 'M', undefined, {
+                    kind: 'artifact',
+                    diffs: [],
+                    artifacts: [artifact],
+                    oldText: artifact.oldText,
+                    newText: artifact.newText
+                  }, ev.seq, { captureBaseline: false, turn: resultTurn });
+                }
+              }
+
+              // A shell command can delete files with no file tool involved, so after one
+              // runs, re-check the paths the panel already knows about.
+              if (!isInitialScan && SHELL_TOOL_NAMES.has(ev.data.name)) {
+                detectExternalDeletions(sessionId);
+              }
+            }
+
+            if (ev.type === 'step/end' || ev.type === 'turn/end' || ev.type === 'workspace/changes') {
+              clearActive(sessionId);
+            }
+
+            if (ev.type === 'workspace/changes' && ev.data && typeof ev.data.turn === 'number') {
+              sessionData.reviewUrl = 'dsh-resource://changes-review/session/' + encodeSegment(sessionId) + '/' + ev.seq + '/' + ev.data.turn;
+            }
+          }
+
+          notify();
+        }
+
+        function bindSession(sessionId) {
+          if (!sessionId || sessionUnsubscribes.has(sessionId)) return;
+
+          try {
+            const binding = ctx.sessions?.binding(sessionId);
+            if (binding && binding.eventSource && typeof binding.eventSource.subscribe === 'function') {
+              // Initial scan of historical entries
+              const initialSnapshot = binding.eventSource.getSnapshot();
+              if (initialSnapshot && Array.isArray(initialSnapshot.entries)) {
+                processEntries(sessionId, initialSnapshot.entries, true);
+              }
+
+              // A broadcast change can carry a turn/start from any session, and the cwd it
+              // carries is what this session's relative tool paths resolve against.
+              const huntForCwd = () => {
+                const state = getSessionState(sessionId);
+                if (state && state.cwd) return;
+                const snap = binding.eventSource.getSnapshot();
+                if (!snap || !Array.isArray(snap.entries)) return;
+                readCwdFromEntries(sessionId, snap.entries.slice(-40));
+              };
+              huntForCwd();
+
+              // Subscribe to real-time events
+              const unsub = binding.eventSource.subscribe(() => {
+                const snapshot = binding.eventSource.getSnapshot();
+                if (!snapshot) return;
+                const change = snapshot.change;
+                if (change && Array.isArray(change.entries)) {
+                  processEntries(sessionId, change.entries, false);
+                } else if (change && change.kind === 'settle-assistant' && change.entry) {
+                  processEntries(sessionId, [change.entry], false);
+                } else if (Array.isArray(snapshot.entries)) {
+                  // Fallback: processEntries automatically filters via processedSeqs
+                  processEntries(sessionId, snapshot.entries, false);
+                }
+                huntForCwd();
+              });
+              sessionUnsubscribes.set(sessionId, unsub);
+            }
+          } catch (e) {
+            console.warn('[@dsh-xhl/dsh-live-inspector] Failed to bind session:', sessionId, e);
+          }
+        }
+
+        function syncAllSessions() {
+          try {
+            const list = ctx.sessions?.list?.getSnapshot();
+            if (list && list.byId) {
+              for (const id in list.byId) {
+                bindSession(id);
+              }
+            }
+          } catch (e) {
+            console.warn('[@dsh-xhl/dsh-live-inspector] syncAllSessions error:', e);
+          }
+        }
+
+        // Subscribe to sessions.list to automatically bind all sessions
+        if (ctx.sessions?.list) {
+          ctx.effect(() => {
+            const unsub = ctx.sessions.list.subscribe(() => {
+              syncAllSessions();
+              notify();
+            });
+            syncAllSessions();
+            return () => {
+              if (unsub) unsub();
+            };
+          }, '@dsh-xhl/dsh-live-inspector: all sessions list subscriber');
+        }
+
+        // Watch active session on screen
+        if (ctx.sidebarRight && ctx.sidebarRight.mounted) {
+          ctx.effect(() => {
+            const unsub = ctx.sidebarRight.mounted.subscribe(() => {
+              const sid = ctx.sidebarRight.mounted.getSnapshot();
+              currentMountedSessionId = sid;
+              if (sid) {
+                bindSession(sid);
+                notify();
+              }
+            });
+
+            const initialSid = ctx.sidebarRight.mounted.getSnapshot();
+            currentMountedSessionId = initialSid;
+            if (initialSid) {
+              bindSession(initialSid);
+              notify();
+            }
+
+            return () => {
+              if (unsub) unsub();
+              for (const [, release] of sessionUnsubscribes) {
+                try {
+                  release();
+                } catch {
+                  // ignore
+                }
+              }
+              sessionUnsubscribes.clear();
+            };
+          }, '@dsh-xhl/dsh-live-inspector: session watcher');
+        }
+
+        console.info('[@dsh-xhl/dsh-live-inspector] Fully guarded & de-duplicated Git Tree active.');
+      }
+    };
+  }
+});