From 36fbc5ac7e2cd414d906a55778a7184af6153b5c Mon Sep 17 00:00:00 2001
From: Menghuan1918 <menghuan2003@outlook.com>
Date: Mon, 28 Sep 2026 00:27:31 +0800
Subject: [PATCH] =?UTF-8?q?feat(sidebar):=20=E6=96=87=E4=BB=B6=E9=A1=B5?=
 =?UTF-8?q?=E4=B8=8E=E6=96=87=E4=BB=B6=E5=8F=98=E5=8A=A8=E9=A1=B5=20UIUX?=
 =?UTF-8?q?=20=E9=87=8D=E6=9E=84=20+=20=E5=85=A8=E5=B1=80=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6=E6=8A=BD=E5=8F=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

文件页（FileTree/TreePanel）
- Ctrl/Cmd 多选 + Shift 按可见行序连选（Esc/点空白/右键收敛），批量条支持复制路径、批量删除（共享 ConfirmDialog + 顺序 fsRemove）
- Git 变更着色：行名按状态上色 + M/A/D/U 徽标，目录按 dirHasChanges 着色，非仓库静默降级（数据来自共享 git 状态存储）
- 新建文件夹：fs.mkdir 路由 + mkdirWorkspaceEntry + 内联输入行（Enter/Esc/blur/IME 守卫）
- 性能：FileRow/DirRow memo（含反向验证）、搜索 hidden 停车不再卸载树、level 拉取世代守卫 + AbortController、fs.tree truncated 提示、use-dir-watch 入参 memo
- 拖拽上传视觉 token 化（硬编码色清零）；可见性下传后隐藏页签停止轮询
- 右键「打开方式」改为复用 DSH 自带 open-in-app（宿主探测的关联应用 + 文件管理器显示）

文件变动页（changes/diff）
- 36px 头（宿主 SegmentedControl）+ 单一 ChangeRow + SectionHeader 分组 + 吸底提交条单状态行 + 历史独立空态
- 修掉：双份空态、暂存失败 unhandled rejection、手动刷新被丢、仓库切换刷新两次、worktree 清单缺 repoRoot、工作树被自动切走、预览持旧快照、恢复高度未 clamp、session ops 无谓轮询
- DiffPane/DiffTab 共用 use-git-diff；修掉 DiffPane 的 untracked 预览从不渲染

全局组件与宿主接入
- 新增 src/client/ui（IconButton/Chip/SectionHeader/Notice/ConfirmDialog/StatusBadge + 共享 git 状态存储）
- 新增 src/client/open-in-app.ts（宿主 open-in-app 客户端适配），删除自研 open-with 全链路与 open.external 路由
- 客户端 inject 补 remote / remote.session：缺声明时 ctx.get('remote').session 会抛出并把整个面板打成错误条（真实挂载 lane 抓到）
- 词典：+25 键 / -20 openWith* / -noChanges，20 份同步

验证：typecheck / lint / test（126 文件 1322 通过）/ build 全绿；
DSH_CMD='npx -y --package @deepseek-ai/dsh@0.1.7-rc.1 dsh' pnpm test:mount 7/7 通过（含 tab sweep 与 perf lane）
---
 README.md                                   |    8 +-
 README_EN.md                                |    8 +-
 docs/external-plugin-guide.md               |    2 +-
 docs/plans/2026-09-27-files-changes-uiux.md |  409 ++++++
 src/client/DiffTab.tsx                      |  159 +--
 src/client/EditorHost.tsx                   |   74 +-
 src/client/FileTree.tsx                     | 1252 +++++++++++++-----
 src/client/TreePanel.tsx                    |  170 +--
 src/client/UploadOverlay.tsx                |    2 +-
 src/client/api.ts                           |   54 +-
 src/client/builtins/tabs.tsx                |   13 +-
 src/client/changes/ChangesTab.tsx           |  184 ++-
 src/client/changes/DiffPane.tsx             |  260 +---
 src/client/changes/GitLens.tsx              | 1310 ++++++++++---------
 src/client/changes/SessionLens.tsx          |   45 +-
 src/client/changes/changes.module.css       |  367 ++----
 src/client/diff/use-git-diff.ts             |  183 +++
 src/client/index.tsx                        |   12 +-
 src/client/layout.css                       |   61 -
 src/client/locales-ar.ts                    |   46 +-
 src/client/locales-de.ts                    |   46 +-
 src/client/locales-fr.ts                    |   46 +-
 src/client/locales-hi.ts                    |   46 +-
 src/client/locales-id.ts                    |   46 +-
 src/client/locales-it.ts                    |   46 +-
 src/client/locales-ja.ts                    |   46 +-
 src/client/locales-ko.ts                    |   46 +-
 src/client/locales-nl.ts                    |   46 +-
 src/client/locales-pl.ts                    |   46 +-
 src/client/locales-pt.ts                    |   46 +-
 src/client/locales-ru.ts                    |   46 +-
 src/client/locales-sv.ts                    |   46 +-
 src/client/locales-th.ts                    |   46 +-
 src/client/locales-tr.ts                    |   46 +-
 src/client/locales-vi.ts                    |   46 +-
 src/client/locales-zh-HK.ts                 |   46 +-
 src/client/locales-zh-MO.ts                 |   46 +-
 src/client/locales-zh-TW.ts                 |   46 +-
 src/client/locales.ts                       |  109 +-
 src/client/menu-flip.ts                     |   68 -
 src/client/open-in-app.ts                   |  214 +++
 src/client/open-with-settings.tsx           |  135 --
 src/client/open-with.ts                     |  221 ----
 src/client/plugin-settings.ts               |   43 -
 src/client/sidebar.module.css               |  270 ++--
 src/client/ui/git-status.ts                 |  300 +++++
 src/client/ui/index.ts                      |   13 +
 src/client/ui/kit.module.css                |  219 ++++
 src/client/ui/kit.tsx                       |  188 +++
 src/client/use-dir-watch.ts                 |   18 +-
 src/fs-operations.ts                        |   40 +
 src/index.ts                                |   27 +-
 src/open-external.ts                        |   89 --
 tests/builtins.spec.ts                      |    6 +-
 tests/changes-tab.spec.tsx                  |  282 +++-
 tests/diff-git-target.spec.tsx              |  184 +++
 tests/file-tree-dir-watch.spec.tsx          |  158 +++
 tests/file-tree-drop.spec.tsx               |    3 +
 tests/file-tree-git-status.spec.tsx         |  145 ++
 tests/file-tree-multiselect.spec.tsx        |  246 ++++
 tests/file-tree-new-folder.spec.tsx         |  253 ++++
 tests/file-tree-open-in-app.spec.tsx        |  291 ++++
 tests/file-tree-open-with.spec.tsx          |  248 ----
 tests/file-tree-rename-delete.spec.tsx      |    3 +
 tests/file-tree-reveal-scroll.spec.tsx      |    3 +
 tests/file-tree-row-memo.spec.tsx           |  134 ++
 tests/file-tree-search-persist.spec.tsx     |  190 +++
 tests/fs-mkdir.spec.ts                      |   82 ++
 tests/git-view-worktree.spec.tsx            |  300 ++++-
 tests/menu-flip.spec.tsx                    |  122 --
 tests/open-external-client.spec.ts          |   98 --
 tests/open-external.spec.ts                 |   73 --
 tests/open-in-app.spec.ts                   |  171 +++
 tests/open-with-settings.spec.tsx           |  112 --
 tests/open-with.spec.ts                     |  150 ---
 tests/ui-kit.spec.tsx                       |  250 ++++
 76 files changed, 6961 insertions(+), 3944 deletions(-)
 create mode 100644 docs/plans/2026-09-27-files-changes-uiux.md
 create mode 100644 src/client/diff/use-git-diff.ts
 delete mode 100644 src/client/menu-flip.ts
 create mode 100644 src/client/open-in-app.ts
 delete mode 100644 src/client/open-with-settings.tsx
 delete mode 100644 src/client/open-with.ts
 delete mode 100644 src/client/plugin-settings.ts
 create mode 100644 src/client/ui/git-status.ts
 create mode 100644 src/client/ui/index.ts
 create mode 100644 src/client/ui/kit.module.css
 create mode 100644 src/client/ui/kit.tsx
 delete mode 100644 src/open-external.ts
 create mode 100644 tests/diff-git-target.spec.tsx
 create mode 100644 tests/file-tree-dir-watch.spec.tsx
 create mode 100644 tests/file-tree-git-status.spec.tsx
 create mode 100644 tests/file-tree-multiselect.spec.tsx
 create mode 100644 tests/file-tree-new-folder.spec.tsx
 create mode 100644 tests/file-tree-open-in-app.spec.tsx
 delete mode 100644 tests/file-tree-open-with.spec.tsx
 create mode 100644 tests/file-tree-row-memo.spec.tsx
 create mode 100644 tests/file-tree-search-persist.spec.tsx
 create mode 100644 tests/fs-mkdir.spec.ts
 delete mode 100644 tests/menu-flip.spec.tsx
 delete mode 100644 tests/open-external-client.spec.ts
 delete mode 100644 tests/open-external.spec.ts
 create mode 100644 tests/open-in-app.spec.ts
 delete mode 100644 tests/open-with-settings.spec.tsx
 delete mode 100644 tests/open-with.spec.ts
 create mode 100644 tests/ui-kit.spec.tsx

diff --git a/README.md b/README.md
index 76c4b63..a98699e 100644
--- a/README.md
+++ b/README.md
@@ -48,8 +48,8 @@
 相比 DSH 官方侧边栏，本插件补上的关键能力：
 
 - **🖥️ 可编辑的代码编辑器**：官方文档预览是**只读**的 → 插件保留**可编辑**的 CodeMirror 编辑器（保存、语法高亮、预览切换）；Markdown / HTML 也走插件自有渲染（Mermaid 图表安全渲染 + 点击放大、README 级内嵌 HTML、浮动目录大纲、HTML 沙箱预览）
-- **🗂️ 增强文件树**：接管内置「文件」页——懒加载目录树、**展开的目录实时 watch 自动刷新**、软链接识别、全局文件名搜索、拖拽上传、悬浮 `@文件` 一键引用进输入框
-- **🌿 文件变动**（官方侧栏没有 Git 面板）：Git 视角（diff / 历史 / 暂存·提交·还原）+ 本轮 AI 改动视角双合一，统一 diff 渲染（行内字符级高亮、语法着色、敏感内容脱敏）
+- **🗂️ 增强文件树**：接管内置「文件」页——懒加载目录树、**展开的目录实时 watch 自动刷新**、软链接识别、全局文件名搜索、拖拽上传、悬浮 `@文件` 一键引用进输入框；**Ctrl/Cmd 多选 + Shift 连选**（批量复制路径 / 批量删除）、**Git 变更着色 + 状态字母**（VS Code 同款）、**新建文件夹**，右键「打开方式」直接复用 DSH 自带的 open-in-app（宿主探测到的系统关联应用 + 文件管理器显示）
+- **🌿 文件变动**（官方侧栏没有 Git 面板）：Git 视角（暂存 / 提交 / 历史 / 工作树与子仓库）+ 本轮 AI 改动视角双合一，统一 diff 渲染（行内字符级高亮、语法着色、敏感内容脱敏）；两视角共用一套 28px 行、单一空态/错误通道与吸底提交条
 - **🧩 任务管理**（官方没有）：子代理拓扑实时预览 + 后台任务清单（退出码 / 实时输出 / 强制终止）
 - **💬 侧边对话**（官方没有，beta）：Codex 风格侧边线程——继承主会话完整上下文独立运行，可持续追问，一键提升为顶层会话
 - **🖥️ 底部工作台**（官方没有）：右列交给 DSH 原生右侧栏，插件另加自绘底部工作台（拖拽分栏 / 按会话持久化），可与原生栏同时展开
@@ -171,9 +171,9 @@ dsh registry enable dsh-external/dsh-better-sidebar
 
 | | |
 |---|---|
-| **🗂️ 文件工作台：资源管理器**<br/><sub>支持两种格式的资源管理器：内嵌在文件预览中 / 独立显示文件树。懒加载目录树、**展开的目录由宿主按目录 watch、改动后自动重列**、软链接按目标类型展示（目录软链接可展开、失效链接标红）、全局文件名搜索、上传文件/文件夹与拖放上传、右键菜单（在新 Tab 打开 / 在侧边打开 / 复制路径）、悬浮 `@文件` 一键引用进输入框。</sub><br/><div align="center"><img width="420" alt="文件资源管理器" src="https://github.com/user-attachments/assets/a410bfd2-a8ba-43e6-873e-22417756e94d" /></div> | **📝 Markdown · HTML 内联预览**<br/><sub>Markdown 预览支持 **Mermaid 图表**（`securityLevel: 'strict'` 安全渲染 + 二次清洗；点击图表弹窗放大、滚轮缩放、拖拽平移）、**README 级内嵌 HTML**（徽章墙 `<div align=center>`、`<details>` 折叠块内嵌 markdown、表格单元格内联标签——DOMPurify 白名单消毒真实渲染，`<script>` 等活性内容剥除，本地图片经会话媒体路由重写）与**浮动目录大纲**（≥3 标题出现，点击平滑跳转、自动展开折叠块）；HTML 走插件自带的**沙箱预览**，并带 `htmlViewerNoSandbox` / `htmlViewerDefaultUnsafe` 两个宿主没有的逃生门开关。**图片 / PDF / 表格 / Office 不再是插件能力**——那些格式由 DSH 自己的文档预览渲染。</sub><br/><div align="center"><img width="420" alt="Markdown + Mermaid 预览" src="https://github.com/user-attachments/assets/fe0e5182-55bb-45cc-b98b-a2877c2bdd38" /></div> |
+| **🗂️ 文件工作台：资源管理器**<br/><sub>支持两种格式的资源管理器：内嵌在文件预览中 / 独立显示文件树。懒加载目录树、**展开的目录由宿主按目录 watch、改动后自动重列**、软链接按目标类型展示（目录软链接可展开、失效链接标红）、全局文件名搜索、上传文件/文件夹与拖放上传、右键菜单（在新 Tab 打开 / 在侧边打开 / 新建文件夹 / 打开方式（DSH 自带 open-in-app：系统关联应用 + 文件管理器显示）/ 复制路径 / 重命名 / 删除）、**Ctrl/Cmd 多选与 Shift 连选**（批量复制路径 / 批量删除）、**Git 变更按状态着色并带 M/A/D/U 字母**、悬浮 `@文件` 一键引用进输入框。</sub><br/><div align="center"><img width="420" alt="文件资源管理器" src="https://github.com/user-attachments/assets/a410bfd2-a8ba-43e6-873e-22417756e94d" /></div> | **📝 Markdown · HTML 内联预览**<br/><sub>Markdown 预览支持 **Mermaid 图表**（`securityLevel: 'strict'` 安全渲染 + 二次清洗；点击图表弹窗放大、滚轮缩放、拖拽平移）、**README 级内嵌 HTML**（徽章墙 `<div align=center>`、`<details>` 折叠块内嵌 markdown、表格单元格内联标签——DOMPurify 白名单消毒真实渲染，`<script>` 等活性内容剥除，本地图片经会话媒体路由重写）与**浮动目录大纲**（≥3 标题出现，点击平滑跳转、自动展开折叠块）；HTML 走插件自带的**沙箱预览**，并带 `htmlViewerNoSandbox` / `htmlViewerDefaultUnsafe` 两个宿主没有的逃生门开关。**图片 / PDF / 表格 / Office 不再是插件能力**——那些格式由 DSH 自己的文档预览渲染。</sub><br/><div align="center"><img width="420" alt="Markdown + Mermaid 预览" src="https://github.com/user-attachments/assets/fe0e5182-55bb-45cc-b98b-a2877c2bdd38" /></div> |
 | **🖥️ CodeMirror 代码编辑器**<br/><sub>**可编辑**的文本 / 代码编辑器（保存、语法高亮、预览切换）——宿主自己的文档预览是**只读**的，这是插件保留 catch-all viewer 的理由。</sub><br/><div align="center"><img width="420" alt="CodeMirror 代码编辑器" src="https://github.com/user-attachments/assets/b44b488e-568c-4ee0-b96c-e9c906598a77" /></div> | **🖼️ 图片 / PDF / 表格 / Office 预览（由 DSH 内置提供）**<br/><sub>这些只读格式由 DSH 自己的 `ui-sidebar-documentpreview` 渲染：宿主侧 Office→PDF 转换、电子表格 worker 表格、图片 / PDF 缩放视口，并**按目录自动刷新**。插件已删除自己的 image / pdf / 下载兜底 viewer，也不再认领这些扩展名。</sub><br/><div align="center"><img width="420" alt="图片内联预览" src="https://github.com/user-attachments/assets/f9a58c30-5b7a-48b5-9e22-37d7e071f593" /></div> |
-| **💻 终端（由 DSH 内置提供）**<br/><sub>右侧栏终端由 DSH 自己的 `ui-sidebar-terminal` 提供：shell 选择、双击重命名、断线重连、刷新后恢复、主题与对比度跟随。插件不再自带终端实现。<br/><br/>⚠️ **模型侧提示**：插件原来自带的 8 个 `terminal_*` 工具（默认关）是模型唯一的**跨调用持久**终端；上游等价物 `@deepseek-ai/dsh-tool-terminal` 未被任何内置 bundle 默认挂载，若你需要该能力，请在 profile 的 `cordis.patch.yml` 里自行插入一行 `tool-terminal`。</sub><br/><div align="center"><img width="420" alt="真实终端" src="https://github.com/user-attachments/assets/0dad6ad3-ff3f-4b5a-86d2-f832ce65323e" /></div> | **🌿 文件变动：Git 视角 + 本轮文件**<br/><sub>双视角合一：**Git 视角**保留完整源代码管理（暂存 / 取消暂存 / 提交（`Ctrl+Enter`）/ 还原、历史、worktree 与子仓库选择）；**本轮文件视角**实时折叠会话事件日志，记录模型读 / 写 / 编辑的每个文件（按文件分组、按类型筛选、操作数角标）。点击任意改动在底部**可拖拽预览面板**查看统一 diff——删红 / 增绿 / 改蓝配对 + 行内字符级高亮 + 语法着色 + 上下文折叠——也可一键展开为 VSCode 式独立 diff tab（同一渲染栈）。</sub><br/><div align="center"><img width="420" alt="文件变动" src="https://github.com/user-attachments/assets/e7fc1220-305f-4bca-8583-e77ab4f4fa78" /></div> |
+| **💻 终端（由 DSH 内置提供）**<br/><sub>右侧栏终端由 DSH 自己的 `ui-sidebar-terminal` 提供：shell 选择、双击重命名、断线重连、刷新后恢复、主题与对比度跟随。插件不再自带终端实现。<br/><br/>⚠️ **模型侧提示**：插件原来自带的 8 个 `terminal_*` 工具（默认关）是模型唯一的**跨调用持久**终端；上游等价物 `@deepseek-ai/dsh-tool-terminal` 未被任何内置 bundle 默认挂载，若你需要该能力，请在 profile 的 `cordis.patch.yml` 里自行插入一行 `tool-terminal`。</sub><br/><div align="center"><img width="420" alt="真实终端" src="https://github.com/user-attachments/assets/0dad6ad3-ff3f-4b5a-86d2-f832ce65323e" /></div> | **🌿 文件变动：Git 视角 + 本轮文件**<br/><sub>双视角合一：**Git 视角**保留完整源代码管理（暂存 / 取消暂存 / 提交（`Ctrl+Enter`）/ 还原、历史、worktree 与子仓库选择）；**本轮文件视角**实时折叠会话事件日志，记录模型读 / 写 / 编辑的每个文件（按文件分组、按类型筛选、操作数角标）。点击任意改动在底部**可拖拽预览面板**查看统一 diff——删红 / 增绿 / 改蓝配对 + 行内字符级高亮 + 语法着色 + 上下文折叠——也可一键展开为 VSCode 式独立 diff tab（同一渲染栈）。两个视角共用 36px 头（宿主 SegmentedControl 切换）、28px 行、单一空态与吸底提交条；git 状态与文件树共享同一份快照，暂存/提交后文件树着色同步刷新。</sub><br/><div align="center"><img width="420" alt="文件变动" src="https://github.com/user-attachments/assets/e7fc1220-305f-4bca-8583-e77ab4f4fa78" /></div> |
 | **🌐 外链接管（浏览器视图由 DSH 提供）**<br/><sub>网页 tab 是 DSH 自己的 `ui-sidebar-browser`（多开 / 后退前进刷新 / 地址栏 / 沙箱 iframe），**0.1.7 起只在 desktop profile 挂载**——Web profile 里没有这个 kind。插件保留宿主没有的那一半：**只认领有 tab 类型通过 `urlTarget` 明确声明的链接**（Ctrl/Cmd 点击始终放行），**其余一律放行给宿主**（正文链接的去向由宿主的用户设置 `linkOpening` 决定）；按协议分流的三个外链接管设置项已删除，认领成功但目标类型此刻不可用时兜底到 `window.open`。</sub><br/><div align="center"><img width="420" alt="内嵌浏览器" src="https://github.com/user-attachments/assets/9bc6b65a-64fc-4942-a685-76e391e55606" /></div> | **🧩 任务页：子代理拓扑 + 后台任务**<br/><sub>子代理树实时拓扑（运行状态、批量实时预览）+ 后台任务清单（退出码 / 实时输出 / 强制终止）；新子代理 / 新任务可自动激活任务页，宽屏同时展开侧边栏，窄屏不强制展开全屏抽屉（可关）。</sub><br/><div align="center"><img width="420" alt="任务页：子代理拓扑" src="https://github.com/user-attachments/assets/dcd8ed2f-59fa-405b-937b-2d250f5034dd" /></div> |
 | **💬 侧边对话(beta)**<br/><sub>Codex 风格侧边线程：**每个对话一个独立 Tab**；线程继承主会话完整上下文（含进行中回合，以 interrupted 诚实冻结）独立运行，不污染主会话；可持续追问、重启冷恢复；一键「保存为新会话」提升为顶层会话。</sub><br/><div align="center"><img width="420" alt="侧边对话(beta)" src="https://github.com/user-attachments/assets/3a338c36-f5de-4000-95f3-4b1cd04f60fc" /></div> | **🖥️ DSH 原生右侧栏 + 插件底部工作台**<br/><sub>右列是 DSH 自己的右侧栏：插件把每个 tab 类型注册成原生 tab（含接管内置「文件」页），聊天里的文件点击直接落到原生栏——**宿主自己的文档预览已覆盖的格式由宿主渲染**，插件只认领 Markdown / HTML / 可编辑代码；插件自有底部面板可与其同时展开，拖 Tab 到分栏边缘**拆分**、拖到中间**合并**，高度拖上缘调节；开合按钮在会话头右侧。</sub><br/><div align="center"><img width="420" alt="双工作台（右侧栏 + 底部面板）" src="https://github.com/user-attachments/assets/dfdb875e-a1a8-4d4b-8340-353736b1708f" /></div> |
 | **⚙️ 声明式设置**<br/><sub>设置页「侧边卡片」分区：每个 tab / 预览器一张小卡片，独立开关（高亮启用态 + 品牌开关滑块）；二级设置经卡片底部「功能设置」条弹窗（开关 / 文本 / 数字 / 下拉）；插件自有设置持久化在 `pluginSettings`，整份偏好则写在 profile 里本插件的**挂载行**上（DSH 0.1.7 起设置按 Loader entry id 寻址）。</sub><br/><div align="center"><img width="420" alt="声明式设置：侧边卡片" src="https://github.com/user-attachments/assets/0800ca64-621e-48da-b7df-aecfddc3ec29" /></div> | **📱 移动端**<br/><sub>窄屏（<768px）自动切换为全宽抽屉：底栏 tab 一次性并入右侧栏，触屏拖拽可调。</sub><br/><div align="center"><img width="360" alt="移动端全宽抽屉" src="https://github.com/user-attachments/assets/a82ba78a-f4cf-4d85-80e8-050a05beb144" /></div> |
diff --git a/README_EN.md b/README_EN.md
index ccd2bf1..fd7e929 100644
--- a/README_EN.md
+++ b/README_EN.md
@@ -48,8 +48,8 @@
 What this plugin adds on top of DSH's stock sidebar:
 
 - **✏️ Editable editor**: the host's document preview is **read-only** → the plugin keeps an **editable** CodeMirror editor (save, syntax highlighting, preview toggle); Markdown / HTML also render through the plugin's own pipeline (Mermaid diagrams with safe rendering + click-to-zoom, README-level inline HTML, floating table of contents, sandboxed HTML preview)
-- **🗂️ Enhanced file tree**: takes over the built-in Files page — lazy-loading tree, **expanded directories watched live and auto-refreshed**, symlink awareness, global filename search, drag-and-drop upload, hover `@file` to drop a reference into the input box
-- **🌿 Changes** (no Git panel in the stock sidebar): two lenses in one tab — **Git** (diff / history / stage·commit·revert) and **This Session** (every file the model touched) — with a unified diff renderer (intra-line character highlights, syntax coloring, secret redaction)
+- **🗂️ Enhanced file tree**: takes over the built-in Files page — lazy-loading tree, **expanded directories watched live and auto-refreshed**, symlink awareness, global filename search, drag-and-drop upload, hover `@file` to drop a reference into the input box; **Ctrl/Cmd multi-select and Shift range-select** (copy or delete a batch), **VS Code-style git status colors + M/A/D/U letters**, **new folder**, and an “Open with” menu that reuses DSH’s own open-in-app (the host’s probed OS handlers + file-manager reveal)
+- **🌿 Changes** (no Git panel in the stock sidebar): two lenses in one tab — **Git** (diff / history / stage·commit·revert) and **This Session** (every file the model touched) — with a unified diff renderer (intra-line character highlights, syntax coloring, secret redaction); the two lenses now share one 36px header (host SegmentedControl), 28px rows, a single empty state and a sticky commit bar, and the git snapshot is shared with the file tree so staging recolors the tree too
 - **🧩 Background Tasks** (absent upstream): agent topology preview + background task list (exit codes / live output / force-kill)
 - **💬 Side Chat** (absent upstream, beta): Codex-style side threads — inheriting the full parent context, running independently, promotable to a top-level session
 - **🖥️ Bottom workbench** (absent upstream): the right column belongs to DSH's native right sidebar; the plugin adds its own bottom workbench (drag-to-split panes, per-session persistence) that coexists with the native bar
@@ -171,9 +171,9 @@ Update: `git pull && pnpm install && pnpm build` → `node scripts/package-regis
 
 | | |
 |---|---|
-| **🗂️ File Workbench: Explorer**<br/><sub>Two explorer modes: embedded in the file preview / standalone file tree. Lazy-loading directory tree whose **expanded directories the host watches per directory and re-lists on change**, symlinks classified by target kind (directory links expand, dangling links flagged), global filename search, file/folder upload buttons plus drag-drop upload, context menu (open in new tab / open to the side / copy paths), and a hover `@file` button that references a file straight into the composer.</sub><br/><div align="center"><img width="420" alt="File explorer" src="https://github.com/user-attachments/assets/a410bfd2-a8ba-43e6-873e-22417756e94d" /></div> | **📝 Inline Preview: Markdown · HTML**<br/><sub>The Markdown preview renders **Mermaid diagrams** (strict-mode safe rendering + a second sanitize pass; click a diagram for a zoom modal with wheel-zoom and drag-pan), **README-level inline HTML** (badge walls `<div align=center>`, `<details>` blocks nesting markdown, inline tags in table cells — DOMPurify-sanitized, `<script>` stripped, local media rewritten to the session media route) and a floating **table of contents** (appears with ≥3 headings, smooth-scroll jumping, auto-expanding folded blocks); HTML uses the plugin's own **sandboxed preview** with the two escape hatches the host does not have (`htmlViewerNoSandbox` / `htmlViewerDefaultUnsafe`). **Images / PDF / spreadsheets / Office are no longer a plugin capability** — the host's own document preview renders those formats.</sub><br/><div align="center"><img width="420" alt="Markdown + Mermaid preview" src="https://github.com/user-attachments/assets/fe0e5182-55bb-45cc-b98b-a2877c2bdd38" /></div> |
+| **🗂️ File Workbench: Explorer**<br/><sub>Two explorer modes: embedded in the file preview / standalone file tree. Lazy-loading directory tree whose **expanded directories the host watches per directory and re-lists on change**, symlinks classified by target kind (directory links expand, dangling links flagged), global filename search, file/folder upload buttons plus drag-drop upload, context menu (open in new tab / open to the side / new folder / Open with (DSH’s own open-in-app: probed OS handlers + file-manager reveal) / copy paths / rename / delete), **Ctrl/Cmd multi-select with Shift range-select** (batch copy paths, batch delete), **git changes colored by status with M/A/D/U letters**, and a hover `@file` button that references a file straight into the composer.</sub><br/><div align="center"><img width="420" alt="File explorer" src="https://github.com/user-attachments/assets/a410bfd2-a8ba-43e6-873e-22417756e94d" /></div> | **📝 Inline Preview: Markdown · HTML**<br/><sub>The Markdown preview renders **Mermaid diagrams** (strict-mode safe rendering + a second sanitize pass; click a diagram for a zoom modal with wheel-zoom and drag-pan), **README-level inline HTML** (badge walls `<div align=center>`, `<details>` blocks nesting markdown, inline tags in table cells — DOMPurify-sanitized, `<script>` stripped, local media rewritten to the session media route) and a floating **table of contents** (appears with ≥3 headings, smooth-scroll jumping, auto-expanding folded blocks); HTML uses the plugin's own **sandboxed preview** with the two escape hatches the host does not have (`htmlViewerNoSandbox` / `htmlViewerDefaultUnsafe`). **Images / PDF / spreadsheets / Office are no longer a plugin capability** — the host's own document preview renders those formats.</sub><br/><div align="center"><img width="420" alt="Markdown + Mermaid preview" src="https://github.com/user-attachments/assets/fe0e5182-55bb-45cc-b98b-a2877c2bdd38" /></div> |
 | **🖥️ CodeMirror editor**<br/><sub>An **editable** text / code editor (save, syntax highlighting, preview toggle) — the host's own document preview is **read-only**, which is exactly why the plugin keeps its catch-all viewer.</sub><br/><div align="center"><img width="420" alt="CodeMirror editor" src="https://github.com/user-attachments/assets/b44b488e-568c-4ee0-b96c-e9c906598a77" /></div> | **🖼️ Images / PDF / spreadsheets / Office (provided by DSH)**<br/><sub>These read-only formats render in DSH's own `ui-sidebar-documentpreview`: host-side Office→PDF conversion, worker-backed spreadsheet tables, image / PDF zoom viewports, and **per-directory auto-refresh**. The plugin deleted its own image / pdf / download-fallback viewers and no longer claims those extensions.</sub><br/><div align="center"><img width="420" alt="Inline image preview" src="https://github.com/user-attachments/assets/f9a58c30-5b7a-48b5-9e22-37d7e071f593" /></div> |
-| **💻 Terminal (provided by DSH)**<br/><sub>The right-Sidebar terminal is provided by DSH's own `ui-sidebar-terminal`: shell picker, double-click rename, reconnect, restore after reload, theme and contrast following. The plugin no longer ships xterm + node-pty.<br/><br/>⚠️ **Model-side caveat**: the plugin's own 8 `terminal_*` tools (off by default) were the model's only **cross-call persistent** terminal; the upstream equivalent `@deepseek-ai/dsh-tool-terminal` is not mounted by any shipped bundle, so if you need that capability, add a `tool-terminal` row to your profile's `cordis.patch.yml` yourself.</sub><br/><div align="center"><img width="420" alt="Terminal" src="https://github.com/user-attachments/assets/0dad6ad3-ff3f-4b5a-86d2-f832ce65323e" /></div> | **🌿 Changes: Git lens + This-Session lens**<br/><sub>Two lenses on "what changed?": the **Git lens** keeps the full source-control surface (stage / unstage / commit (`Ctrl+Enter`) / revert, history, worktree and child-repo selectors); the **This Session** lens folds the session event log live, recording every file the model read / wrote / edited (grouped by file, kind-filtered, op-count badge). Clicking any change previews it in the **draggable bottom pane** with the unified diff — del red / add green / mod-blue pairing + intra-line character highlights + syntax coloring + context folding — or expands into a VSCode-style dedicated diff tab (same rendering stack).</sub><br/><div align="center"><img width="420" alt="Changes" src="https://github.com/user-attachments/assets/e7fc1220-305f-4bca-8583-e77ab4f4fa78" /></div> |
+| **💻 Terminal (provided by DSH)**<br/><sub>The right-Sidebar terminal is provided by DSH's own `ui-sidebar-terminal`: shell picker, double-click rename, reconnect, restore after reload, theme and contrast following. The plugin no longer ships xterm + node-pty.<br/><br/>⚠️ **Model-side caveat**: the plugin's own 8 `terminal_*` tools (off by default) were the model's only **cross-call persistent** terminal; the upstream equivalent `@deepseek-ai/dsh-tool-terminal` is not mounted by any shipped bundle, so if you need that capability, add a `tool-terminal` row to your profile's `cordis.patch.yml` yourself.</sub><br/><div align="center"><img width="420" alt="Terminal" src="https://github.com/user-attachments/assets/0dad6ad3-ff3f-4b5a-86d2-f832ce65323e" /></div> | **🌿 Changes: Git lens + This-Session lens**<br/><sub>Two lenses on "what changed?": the **Git lens** keeps the full source-control surface (stage / unstage / commit (`Ctrl+Enter`) / revert, history, worktree and child-repo selectors); the **This Session** lens folds the session event log live, recording every file the model read / wrote / edited (grouped by file, kind-filtered, op-count badge). Both lenses now share one 36px header, 28px rows, a single empty state and a sticky commit bar; the git snapshot is shared with the file tree, so staging recolors the tree as well. Clicking any change previews it in the **draggable bottom pane** with the unified diff — del red / add green / mod-blue pairing + intra-line character highlights + syntax coloring + context folding — or expands into a VSCode-style dedicated diff tab (same rendering stack).</sub><br/><div align="center"><img width="420" alt="Changes" src="https://github.com/user-attachments/assets/e7fc1220-305f-4bca-8583-e77ab4f4fa78" /></div> |
 | **🌐 External-link takeover (browser view provided by DSH)**<br/><sub>Web tabs are DSH's own `ui-sidebar-browser` (multiple tabs / back-forward-reload / address bar / sandboxed iframe), mounted **only in the desktop profile since 0.1.7** — the Web profile has no such kind. The plugin keeps the half the host does not provide: it takes over **only links a tab type explicitly claims through `urlTarget`** (Ctrl/Cmd-clicks always pass through) and **lets everything else through to the host** (whose `linkOpening` user setting decides where prose links go); the three protocol-routing settings are gone, and a claim whose target type is unavailable at open time falls back to `window.open`.</sub><br/><div align="center"><img width="420" alt="Browser" src="https://github.com/user-attachments/assets/9bc6b65a-64fc-4942-a685-76e391e55606" /></div> | **🧩 Tasks: Agent Topology + Background Jobs**<br/><sub>Live subagent-tree topology (run states, batched live previews) plus the background-jobs list (exit codes / live output / force-kill); new subagents / jobs can auto-activate the Tasks page, expanding the sidebar on wide viewports without forcing narrow full-screen drawers open (configurable).</sub><br/><div align="center"><img width="420" alt="Tasks: subagent topology" src="https://github.com/user-attachments/assets/dcd8ed2f-59fa-405b-937b-2d250f5034dd" /></div> |
 | **💬 Side Chat (beta)**<br/><sub>Codex-style side threads: **one independent tab per conversation**; the thread inherits the parent's full context (including the in-progress turn, honestly frozen as "interrupted") and runs independently without polluting the main session; follow-ups survive restarts; one click promotes the thread to a top-level session.</sub><br/><div align="center"><img width="420" alt="Side Chat (beta)" src="https://github.com/user-attachments/assets/3a338c36-f5de-4000-95f3-4b1cd04f60fc" /></div> | **🖥️ DSH's native right sidebar + plugin bottom workbench**<br/><sub>The right column is DSH's own sidebar: the plugin registers every tab type as a native tab (including taking over the built-in Files page), so clicking a file in the chat lands there directly — **formats the host's own document preview already covers are rendered by the host**, and the plugin claims only Markdown / HTML / editable code; the plugin's own bottom panel can stay open alongside it — drag a tab to a pane edge to **split**, to the middle to **merge**, drag the top edge to resize; the toggle lives in the session header.</sub><br/><div align="center"><img width="420" alt="Dual workbench (right sidebar + bottom panel)" src="https://github.com/user-attachments/assets/dfdb875e-a1a8-4d4b-8340-353736b1708f" /></div> |
 | **⚙️ Declarative Settings**<br/><sub>The "Side card" section in DSH settings: one small card per tab / viewer with an independent toggle (highlighted enabled state + brand switch); secondary settings open from the "Feature settings" strip at the card bottom (switch / text / number / select rows); plugin-owned settings persist under `pluginSettings`, while the whole preference set lives on this plugin's **mount row** in the profile (since DSH 0.1.7 settings are addressed by Loader entry id).</sub><br/><div align="center"><img width="420" alt="Declarative settings: side cards" src="https://github.com/user-attachments/assets/0800ca64-621e-48da-b7df-aecfddc3ec29" /></div> | **📱 Mobile**<br/><sub>On narrow screens (<768px) the panels become a full-width drawer: bottom-panel tabs merge into the sidebar once, with touch-friendly dragging.</sub><br/><div align="center"><img width="360" alt="Mobile full-width drawer" src="https://github.com/user-attachments/assets/a82ba78a-f4cf-4d85-80e8-050a05beb144" /></div> |
diff --git a/docs/external-plugin-guide.md b/docs/external-plugin-guide.md
index b960b1e..188b92a 100644
--- a/docs/external-plugin-guide.md
+++ b/docs/external-plugin-guide.md
@@ -591,7 +591,7 @@ const { value } = await res.json()   // 错误时 { ok: false, error: { code, me
 | `pty.close` / `agent-pty.close` | **已删除**（插件自带的 PTY 栈随终端一起移除；宿主 `ui-sidebar-terminal` 不通过本插件的路由暴露控制面） |
 | `settings.get` / `settings.update` | 侧边栏偏好读写（revision 守卫，冲突回 wire 错误码 `settings-conflict`）；后端在 0.1.7 上就是宿主的 `SettingsForms`，见 §8.2 |
 
-> **文件路径安全边界**：`fs.tree`、`fs.read`、`fs.write`、`/sidebar/file`、`/sidebar/html` 和 `/sidebar/upload` 都以请求对应 session 的权威 `cwd` 作为 workspace 根目录。路径会按真实文件系统路径检查，越界绝对路径、`..` 解析结果和指向 workspace 外部的符号链接都会被拒绝；消费插件不应把 `cwd` 当作可由用户扩大权限范围的参数。
+> **文件路径安全边界**：`fs.tree`、`fs.read`、`fs.write`、`fs.rename`、`fs.remove`、`fs.mkdir`、`/sidebar/file`、`/sidebar/html` 和 `/sidebar/upload` 都以请求对应 session 的权威 `cwd` 作为 workspace 根目录。路径会按真实文件系统路径检查，越界绝对路径、`..` 解析结果和指向 workspace 外部的符号链接都会被拒绝；消费插件不应把 `cwd` 当作可由用户扩大权限范围的参数。
 
 媒体/下载字节走 `/sidebar/file` 路由（`?sessionId=&path=&cwd=&download=1`）：
 
diff --git a/docs/plans/2026-09-27-files-changes-uiux.md b/docs/plans/2026-09-27-files-changes-uiux.md
new file mode 100644
index 0000000..84b2533
--- /dev/null
+++ b/docs/plans/2026-09-27-files-changes-uiux.md
@@ -0,0 +1,409 @@
+# 文件页 / 文件变动页 UIUX 重构（2026-09-27）
+
+用户需求（原文要点）：
+
+- 文件页：Ctrl 多选、Shift 多选；复用 DSH 自带的"使用应用打开"；像 VS Code 一样给 Git 变更上色；优化性能；优化拖拽上传体验/样式；新增新建文件夹。
+- 文件变动页：彻底优化全部 UIUX 交互与功能，更简洁易用；保留 Git 视角与 Agent 视角。
+- 抽取出可复用的全局组件；设计风格与样式参照新的任务管理页；保持 KISS。
+
+本文件是本次重构的**冻结契约**：所有并行实现必须遵守下面的接口与命名，不得自行改动。
+
+---
+
+## 1. 设计基线：任务管理页的原生尺度
+
+`src/client/tasks-graph.module.css:1-15` 已声明插件原生尺度，本次重构把文件页与文件变动页对齐到它：
+
+| 维度 | 值 |
+|---|---|
+| 正文 | `--dsw-font-xxs-12`（12px）；强调 `--dsw-font-xxs-strong-12` |
+| 元信息 | `--dsw-font-xxxs-11`；微标签 10px |
+| 行高 | 列表行 **28px**（原 34px）；密集行 24px |
+| 控件 | 28px（宿主 `Button sm` 同高） |
+| 边 | 结构边 `--dsw-alias-border-l2` 1px；分隔线 `--dsw-alias-border-l1` |
+| 悬停 | `--dsw-alias-interactive-bg-hover` |
+| 选中 | `--dsw-alias-interactive-bg-active` + 2px 内嵌强调条（`::before`，上下内缩 4px） |
+| 圆角阶梯 | 2px 徽标/内联 chip，3px 控件簇，4px 行，8px 卡片 |
+| 唯一强调色 | `--dsw-alias-state-business-primary`（当前项、关系、live） |
+| 状态色 | 成功 `--dsw-alias-state-success-primary`、错误 `--dsw-alias-state-error-primary`、警告 `--dsw-alias-state-warn-primary` |
+| 页面留白 | 12px 横向 gutter；竖直节拍 4 / 6 / 8px |
+| 头带 | 36px 高，`padding: 0 8px 0 12px`，底 `1px solid --dsw-alias-border-l1` |
+| 阴影 | 流内面板**无阴影**；仅浮层（popover/window）用 `--dsw-shadow-lv2/3` |
+| 皮肤契约 | `tests/theme.spec.ts` 逐条扫描 `src/client/**/*.module.css`：任何 `color:` 必须至少含一个 `var(--dsw-*|--ds-*)`，禁止字面色 |
+
+不可触碰的既有断言（改了会红）：
+
+- `tests/theme.spec.ts` 硬编码 `src/client/tasks-graph.module.css` 里的 `.cardBar[data-running='true']::after`、`@keyframes dsh-tasks-bar-sweep`、`.barActivity`；以及 `src/client/sidebar.module.css` 里的 `.paneCard`。
+- `tests/file-tree-reference-tail.spec.ts` 要求 `.explorerRef, .explorerCopied { margin-left: auto }` 留在 `sidebar.module.css`。
+- `tests/panel-host-css.spec.ts` 要求 `sidebar.module.css` 的 `:global([data-dsh-panel-host])` 规则顺序不变。
+- `tests/locales.spec.ts:109,118` 要求 **20 份词典 key 集合完全相等**：新增 key 必须同时进入全部词典。
+
+---
+
+## 2. 全局组件（`src/client/ui/`，由 Lead 冻结）
+
+新目录 `src/client/ui/`：
+
+```
+src/client/ui/index.ts        桶导出（唯一对外入口）
+src/client/ui/kit.tsx         原子组件
+src/client/ui/kit.module.css  样式（token-only）
+src/client/ui/git-status.ts   共享 git 状态存储 + hook
+```
+
+### 2.1 `kit.tsx` 导出面
+
+```ts
+/** 28/24px 方形图标按钮（toolbar / 行尾操作统一用它）。 */
+export function IconButton(props: {
+  icon: ReactNode
+  label: string                 // aria-label + title 默认值
+  title?: string
+  onClick(event: MouseEvent<HTMLButtonElement>): void
+  size?: 'md' | 'sm'            // md=28px（默认），sm=24px
+  active?: boolean
+  disabled?: boolean
+  danger?: boolean
+  className?: string
+}): ReactNode
+
+/** 过滤/切换 chip（带可选计数）。 */
+export function Chip(props: {
+  children: ReactNode
+  active?: boolean
+  count?: number
+  title?: string
+  disabled?: boolean
+  onClick(): void
+  className?: string
+}): ReactNode
+
+/** 28px 节标题带（左侧标签 + 可选计数 + 右侧动作）。 */
+export function SectionHeader(props: {
+  label: ReactNode
+  count?: number
+  action?: ReactNode
+  className?: string
+  children?: ReactNode
+}): ReactNode
+
+/** 空/加载/错误/警告/提示 单行态（替代 14 个重复类）。 */
+export function Notice(props: {
+  kind: 'empty' | 'loading' | 'error' | 'warn' | 'hint'
+  tone?: 'page' | 'well' | 'inline'   // page=16px 居中，well=4px 12px 8px（默认），inline=10px 微文案
+  role?: string
+  className?: string
+  children: ReactNode
+}): ReactNode
+
+/** 危险操作确认弹窗（宿主 Modal + 安静描述段）。 */
+export function ConfirmDialog(props: {
+  open: boolean
+  title: string
+  description: string
+  confirmLabel: string
+  cancelLabel: string
+  danger?: boolean
+  busy?: boolean
+  onConfirm(): void
+  onClose(): void
+}): ReactNode
+
+/** 状态字母/词徽标（Git 变更、op 类型、diff 类型共用一套 tone）。 */
+export type StatusTone =
+  | 'modified' | 'added' | 'deleted' | 'untracked' | 'renamed'
+  | 'conflict' | 'read' | 'write' | 'edit' | 'neutral'
+export function StatusBadge(props: {
+  tone: StatusTone
+  title?: string
+  children: ReactNode
+  className?: string
+}): ReactNode
+```
+
+实现约束：
+
+- 颜色/尺寸全部来自 `kit.module.css` 的 token；`IconButton` 的 `size` 只切 class，不写内联样式。
+- `ConfirmDialog` 用宿主 `Modal`（`@deepseek-ai/dsh-client-ui-primitives`），footer = 取消（`Button variant="outline"`）+ 主按钮（`variant="primary"`，`disabled={busy}`），描述段用 `.confirmDesc`。
+- 现有页面的等价类（`.explorerConfirmDesc` / `.gitConfirmDesc` / `.gitEmpty` / `.gitPlaceholder` / `.gitError` / `.filterChip` / `.gitBadge` / `.opKind` …）在各自页面重构时迁移到 kit；迁移期两者可并存，但**不得修改被测试钉住的类**（见 §1）。
+
+### 2.2 `git-status.ts` 导出面
+
+共享的 git 状态存储：一个 `sessionId + cwd + worktree` 键一份快照、一个轮询器，供文件树（着色）与文件变动页（列表）同时消费，避免重复 `git status`。
+
+```ts
+export type GitTone =
+  | 'modified' | 'added' | 'deleted' | 'untracked' | 'renamed' | 'copied' | 'conflict'
+
+/** 一行 porcelain XY 的语义（纯函数，可单测）。 */
+export interface GitFileStatus {
+  letter: string        // 展示字母：X 侧优先，其次 Y，'??' → 'U'
+  tone: GitTone
+  staged: boolean
+  unstaged: boolean
+}
+export function statusOfXY(xy: string): GitFileStatus | undefined
+
+export interface GitStatusView {
+  /** null = 尚未拿到首个快照。 */
+  snapshot: GitStatusResult | null
+  loading: boolean
+  error: boolean
+  /** 强制重新拉取（在飞时排队一次，不丢请求）。 */
+  refresh(): void
+  /** 绝对路径 → 状态；干净/未知 → undefined。 */
+  statusOf(absolutePath: string): GitFileStatus | undefined
+  /** 该目录（含其下任意层级）是否有变更。 */
+  dirHasChanges(absoluteDir: string): boolean
+}
+
+export function useGitStatus(
+  scope: { sessionId: string; cwd?: string },
+  options?: { worktree?: string; visible?: boolean; pollMs?: number },
+): GitStatusView
+```
+
+实现要点：模块级 `Map<key, Slot>`；`useSyncExternalStore` 订阅；仅当存在 `visible` 订阅者时轮询（默认 2500ms，`mode:'self-scheduling'` 式单飞）；`statusOf` 首次调用时按快照惰性构建 `Map<abs, GitFileStatus>` 与"含变更目录" `Set`（O(n·depth) 一次）；路径拼接复用 `resolveSidebarPath`。
+
+---
+
+## 3. 文件页（`src/client/FileTree.tsx` / `TreePanel.tsx` / `sidebar.module.css`）
+
+### 3.1 多选（Ctrl/Cmd 多选、Shift 连选）
+
+- 状态：`selected: Set<string>`（绝对路径）+ `anchor: string | null`（Shift 起点），二者都是 FileTree 内部 state（不持久化）。
+- 交互（**必须保持现有单击语义不变**，`tests/file-tree-rename-delete.spec.tsx`、`tests/file-tree-drop.spec.tsx` 不得改断言）：
+  - 无修饰键单击：文件行 → 打开（并清空选择）；目录行 → 展开/收起（并清空选择）。
+  - Ctrl/Cmd + 单击：切换该行选中态，`anchor` 设为该行。
+  - Shift + 单击：以 `anchor` 为起点，在**当前可见行序**（深度优先、展开态决定）上连选区间；`anchor` 不变。
+  - 点击树空白处 / Esc：清空选择。
+  - 右键：目标行未选中时先把选择收敛为该行（VS Code 语义），已选中则保留整个选区。
+- 视觉：选中行 `--dsw-alias-interactive-bg-active` + 2px 内嵌强调条；与"reveal 高亮"（`--dsw-alias-state-business-tertiary`）区分。
+- 批量操作条：选区非空时贴在树体顶部（不遮行）：`已选择 N 项` + 复制路径 / 删除 / 取消选择。
+  - 删除走 `ConfirmDialog`（`deleteSelectedTitle` / `deleteSelectedDesc`），逐个 `api.fsRemove`（顺序执行，失败停下并进错误条），成功后 `pruneTree` + `onPathDeleted`。
+  - 复制路径写全部选中行的绝对路径（换行分隔）。
+- 键盘：行保持 `role="button" tabIndex={0}`；`ArrowUp/Down` 可移动焦点（可选，若实现须不破坏现有 Enter/Space）。
+
+### 3.2 Git 变更着色（VS Code 风格）
+
+- 数据：`useGitStatus(scope)`（§2.2）；不做第二次 `git.status` 拉取。
+- 文件行：名字按 tone 上色（modified=warn、added/untracked/copied=success、deleted/conflict=error、renamed=business），行尾加 `StatusBadge` 字母（M/A/D/U/R）与 `title`=状态词。**实施更正**：初稿把 conflict 写成 business，落地时按语义改为 error（冲突是需要先处理掉的阻塞态；`StatusBadge` 的 conflict 同样落 error 家族）。
+- 目录行：其下任意层级有变更时，目录名同样上色（`dirHasChanges`），不显示字母。
+- Git 不可用/非仓库：完全不上色、不加徽标（静默降级）。
+- 新增 i18n：`gitStatusModified|Added|Deleted|Untracked|Renamed|Conflict`。
+
+### 3.3 新建文件夹
+
+- 宿主新增路由 `fs.mkdir`（`src/index.ts`）+ `mkdirWorkspaceEntry`（`src/fs-operations.ts`）；客户端 `api.fsMkdir(scope, path, name)` → `{ path }`。
+- UI：目录行与根行右键菜单新增"新建文件夹"；触发后在**该目录层级顶部**插入内联输入行（与 rename 同一套交互：Enter 提交、Esc 取消、blur 提交、IME 守卫、非法名 `newFolderInvalid`），提交成功即 `retryDir(dir)` 并打开该目录。
+- 名称规则与 rename 一致：非空、非 `.`/`..`、不含路径分隔符；服务端二次校验；目标已存在 → 报错进错误条。
+
+### 3.4 性能
+
+必须落地的四条（有证据的痛点）：
+
+1. **行组件 memo 化**：抽出 `FileRow` / `DirRow`（`React.memo`），把每行的回调与数据做成稳定引用（`useCallback` + ref 读 `dataRef`），使"复制态/拖拽目标/选区/菜单"变化只重渲染受影响的行，而不是整棵树。
+2. **搜索不再卸载树**：`TreePanel` 用 `hidden` 属性/样式切换结果面板与树（原来 `needle !== ''` 直接卸载 `FileTree`，丢失 level 缓存并在清空时全量重拉，见 `TreePanel.tsx:245`）。
+3. **level 拉取加世代守卫 + AbortController**：`loadDir` 丢弃过期响应；`refreshTick` 清缓存后并发重拉（不再串行等待）；tick 触发时只重拉"根 + 已展开"级别。
+4. **`fs.tree` 的 `truncated` 不再被丢弃**：该级别底部渲染 `Notice kind="hint"`（新 key `filesTruncated`）。
+
+另外：`useDirectoryWatch` 每次渲染重建 key/数组的问题一并修掉（入参用 memo 化数组）。
+
+### 3.5 拖拽上传体验
+
+- 目标：与任务页同一套视觉（token-only、无硬编码色）。当前 `FileTree.tsx:83-110` 的 SVG 用 `#3964FE` / `#9CE5ED`，改为 `currentColor` + CSS class 上色。
+- 结构保持（`tests/file-tree-drop.spec.tsx` 断言 `uploadDropZone`、pill 文案、`busy` 抑制、内存拖拽穿透）：仍是"树区高亮框 + 左侧聊天邀请卡"，但：
+  - 高亮框：2px 虚线 `--dsw-alias-border-l2` + 8px 圆角 + 极轻强调色内衬，去掉大范围遮罩阴影（改为 `--dsw-alias-bg-base` 半透明蒙层）；
+  - pill：28px 高、`--dsw-alias-bg-layer-1`、1px `-l2` 边、`--dsw-font-xxxs-11`；
+  - 悬浮到目录行时，目录行整体高亮（现有 `explorerRowDropTarget` 换成新风格）。
+- 上传进度卡（`UploadOverlay.tsx` / `.uploadOverlay*`）：同样对齐新尺度（28px 行、12px 文案、token 色）。
+
+### 3.6 使用应用打开：复用 DSH 自带能力
+
+- **删除**插件自研的 open-with 全链路：配置（`sshHost` / `customEditors` / `pinned`）、`src/client/open-with.ts`、`src/client/open-with-settings.tsx`、宿主 `src/open-external.ts` 与 `open.external` 路由、`api.openExternal`、EditorHost 的 openWith props、`builtins/tabs.tsx` 的 `settings.render`（OpenWithSettings），以及对应 20 份词典里的 `openWith*` key 与相关测试。
+- **改为**消费 DSH 自带的 open-in-app（见 §4）：文件行显示宿主探测到的系统关联应用；目录行显示宿主应用目录（VS Code / Cursor / Zed / Finder…）+ 文件管理器显示；宿主不可用时整段隐藏（与宿主自身行为一致）。
+
+新增/改用的 i18n：`openInApp`（打开方式）、`openInAppDefault`（用默认应用打开）、`revealInFileManager`（在文件管理器中显示）、`openInAppFailed`、`openInAppEmpty`。
+
+---
+
+## 4. 宿主接入层（由 Lead 冻结并先行落地）
+
+### 4.1 `src/client/open-in-app.ts`（新）
+
+```ts
+/** 一个可打开当前路径的应用（文件=系统关联；目录=宿主应用目录）。 */
+export interface OpenInAppEntry {
+  id: string
+  name: string
+  icon: string | null      // 文件：PNG/SVG data URL；目录：宿主图标路由
+  isDefault: boolean
+}
+
+/** 宿主 open-in-app 能力的客户端封装（不可用时全部降级为 no-op / null）。 */
+export interface OpenInApp {
+  /** 宿主是否能把路径交给原生桌面；null = 尚在探测。 */
+  available(): boolean | null
+  /** 目录可用的应用目录（宿主 menu 顺序）。 */
+  directoryApps(): Promise<readonly OpenInAppEntry[]>
+  /** 某个文件当前注册的系统应用；失败 → null。 */
+  fileApps(path: string): Promise<readonly OpenInAppEntry[] | null>
+  /** 用默认应用或指定应用打开（文件或目录）。 */
+  open(path: string, application?: string): Promise<boolean>
+  /** 在系统文件管理器中显示。 */
+  reveal(path: string): Promise<boolean>
+}
+
+/** 从客户端 ctx 构造（内部使用 ctx.remote.session.* 与宿主 /open-in-app/* 路由）。 */
+export function createOpenInApp(ctx: { get(name: string): unknown }): OpenInApp
+```
+
+宿主 API（DSH 0.1.7-rc.x 自带，**不得自研替代**）：
+
+- Remote：`ctx.get('remote').session.canOpenWorkspacePath()` / `workspacePathApplications({path})` / `openWorkspacePath({path, action?:'reveal', application?})`（返回值 `{ok, value}`）。
+- HTTP（同源、带 cookie）：`GET <prefix>/open-in-app/apps` → `{apps: string[]}`；`GET <prefix>/open-in-app/icon/<id>` 图标；`POST <prefix>/open-in-app/open` `{app, path}`（**仅目录**）。
+- 应用名字/图标：宿主 `open-in-app` 命名空间（`app.vscode` 等）经 locale bind 读取，失败回退到 id 本身；图标走宿主 icon 路由。
+
+### 4.2 FileTree 的接线（冻结 prop）
+
+`FileTree` 新增可选 prop：
+
+```ts
+/** 宿主 open-in-app 句柄（EditorHost 构造并注入；缺省时不渲染该段）。 */
+openInApp?: OpenInApp
+```
+
+右键菜单"打开方式"段的新语义：
+
+- 文件行：`fileApps(path)` 异步拉取 → 默认应用（`openInAppDefault`，点击 `open(path)`）+ 其余应用各一行（`open(path, id)`）+ 分隔线 + `revealInFileManager`；无应用 → `openInAppEmpty`（禁用行）；宿主不可用 → 整段隐藏。
+- 目录行：`directoryApps()` → 每应用一行（`open(path, id)`）+ `revealInFileManager`。
+- 失败 → 树顶部错误条（`openInAppFailed`，带路径）。
+
+### 4.3 `fs.mkdir`
+
+- 宿主：`src/fs-operations.ts` 新增 `mkdirWorkspaceEntry({cwd, path, name, fence})`（fence 与存在性校验同 rename），`src/index.ts` 注册 `'fs.mkdir'`。
+- 客户端：`api.fsMkdir(scope, path, name)`。
+- smoke 测试的路由清单（`tests/smoke.spec.ts:84-90`）**不含方法索引**，无需改；但要为 `mkdirWorkspaceEntry` 增单测。
+
+---
+
+## 5. 文件变动页（`src/client/changes/*`）
+
+目标：**更简洁易用**，保留 Git 与 Agent 双视角。重构后结构：
+
+```
+ChangesTab
+├─ header (36px): 宿主 SegmentedControl[Git | 本轮文件]  + 右侧：当前视角的刷新按钮
+├─ Git 视角 (GitLens)
+│   ├─ 顶部一行：分支/仓库/工作树选择（仅在有多个候选时出现）+ 状态摘要
+│   ├─ 变更列表：更改(n) / 已暂存(n) 两组（SectionHeader + 单一 ChangeRow 渲染器）
+│   └─ 提交条（吸底）：Input + 提交按钮 + 单条状态/错误行
+│   └─ 历史：SectionHeader + log 行 + 加载更多（空态明确）
+└─ Agent 视角 (SessionLens)：Chip 过滤 + 按文件分组行 + 预览
+└─ DiffPane（共享预览，保留现有能力：redact / md 阅读 / html 渲染 / pdf / 展开为 diff 页签 / 拖拽高度）
+```
+
+必须修掉的既有缺陷（来自 §6 证据，逐条给通过/拒绝检查）：
+
+1. 干净的仓库只出现**一处**空态（不再两组各印一次 `noChanges`）；历史区有自己的空态与失败态。
+2. 单一错误通道：暂存/取消暂存失败必须被捕获并显示（不再 unhandled rejection）；分支切换错误不再显示在提交框下面，而是统一状态行。
+3. 手动刷新不再静默丢弃（在飞时排队一次）；仓库切换只触发**一次**完整刷新；工作树清单带上 `repoRoot`。
+4. 工作树不再在用户未操作时被自动切走（仅在首次挂载且用户未选择时自动选一次）。
+5. 预览按 `callId` 从最新 ops 重新派生（running → 结算后自动更新）；恢复高度时同时应用上限 clamp。
+6. 轮询与共享：git 状态改由 `useGitStatus` 提供（同 session 的文件树共用一份），session ops 仍由本页轮询，但**仅在本视角可见时**轮询。
+7. `DiffPane` 与 `DiffTab` 的重复加载逻辑抽成一个共享 hook（`useGitDiffTarget`），行为不变（两者都要继续工作）。
+8. 视觉：全部对齐 §1 的尺度（行 28px、12px 正文、4px 行圆角、token-only），图标按钮/徽标/空态/确认弹窗改用 `src/client/ui/kit`。
+
+保留能力（不得回归）：Git 的暂存/取消暂存/全部操作、提交、分支切换、历史分页、放弃更改、revert、cherry-pick、复制哈希/路径、在工作树/子仓库间切换；Agent 视角的 read/write/edit 过滤、按文件分组、相对时间、字节数、运行中/出错标记；预览面板的全部渲染开关。
+
+---
+
+## 6. 验收（每条都要有实际证据）
+
+| # | 检查 | 通过判据 |
+|---|---|---|
+| 1 | 类型/规范 | `pnpm typecheck` + `pnpm lint` 通过 |
+| 2 | 单元/组件测试 | `pnpm test` 全绿（新增测试覆盖：多选、mkdir、git 着色映射、kit 组件、重构后的 changes 页） |
+| 3 | 构建 | `pnpm build` 通过（含 CSS module 编译） |
+| 4 | 皮肤契约 | `tests/theme.spec.ts` 绿；新增 CSS module 无字面色 |
+| 5 | i18n | `tests/locales.spec.ts` 绿（20 份词典 key 集合相等） |
+| 6 | 多选 | 组件测试：Ctrl 单击切换、Shift 连选区间、Esc 清空；单击语义不变（既有测试不动仍绿） |
+| 7 | 着色 | 组件测试：mock `git.status` 后行名带 tone class、目录带 `dirHasChanges` 着色、非仓库无着色 |
+| 8 | 新建文件夹 | host 单测（fence/已存在/非法名）+ 客户端组件测试（菜单 → 输入 → `api.fsMkdir` 调用参数） |
+| 9 | open-in-app | 组件测试：宿主可用时渲染应用行、点击调 `open(path, id)`、不可用段隐藏 |
+| 10 | 性能 | 组件测试或结构性验证：搜索不再卸载树（缓存保留）、level 过期响应被丢弃、`truncated` 有提示 |
+| 11 | 文件变动 | 组件测试：空仓库只一处空态、暂存失败显示错误、预览随结算更新、视角切换仍保留预览 |
+| 12 | 真实挂载 | `pnpm build && pnpm pack && pnpm test:mount`（e2e lane）通过 |
+
+---
+
+## 7. 写入范围（并行实现不得越界）
+
+| 范围 | 归属 |
+|---|---|
+| `src/client/ui/**`、`docs/plans/2026-09-27-files-changes-uiux.md`、`src/client/locales.ts`(zh/en 新 key) | Lead |
+| `src/client/FileTree.tsx`、`src/client/TreePanel.tsx`、`src/client/sidebar.module.css`、`src/client/UploadOverlay.tsx`、`src/client/use-dir-watch.ts`、`tests/file-tree-*.spec.tsx`、`tests/editor-host.spec.tsx` | 文件页实现者 |
+| `src/client/changes/**`、`src/client/diff/**`、`tests/changes-*.spec.*`、`tests/git-view-worktree.spec.tsx`、`tests/sandbox-views.spec.tsx` | 文件变动页实现者 |
+| `src/index.ts`、`src/fs-operations.ts`、`src/client/api.ts`、`src/client/open-in-app.ts`、`src/client/EditorHost.tsx`、`src/client/builtins/tabs.tsx`、`src/open-external.ts`(删)、`src/client/open-with*.ts(x)`(删) | Lead（宿主接入层，先行落地） |
+| `src/client/locales-*.ts`（19 份第三方词典） | 词典传播实现者（单一写者） |
+
+`src/client/locales.ts` 的 zh/en 由 Lead 追加；实现者若确需新 key，必须回报 Lead，不得自行添加（避免 20 份词典冲突）。
+
+---
+
+## 8. 实施记录（落地后的偏差与事实）
+
+### 8.1 交付面
+
+- **全局组件**：新增 `src/client/ui/`（`kit.tsx` + `kit.module.css` + `git-status.ts` + `index.ts`）与 `tests/ui-kit.spec.tsx`；文件页与文件变动页均已真实复用（IconButton / Chip / SectionHeader / Notice / ConfirmDialog / StatusBadge / useGitStatus）。
+- **文件页**（`FileTree.tsx` / `TreePanel.tsx` / `sidebar.module.css` / `UploadOverlay.tsx` / `use-dir-watch.ts`）：多选（Ctrl/Cmd 切换、Shift 按可见行序连选、Esc/空白/右键收敛）、批量条（复制路径 / 删除所选 / 取消选择）、git 着色（文件行名字上色 + M/A/D/U 徽标，目录行仅着色，非仓库静默降级）、新建文件夹（菜单 + 内联输入 + `api.fsMkdir`）、`FileRow`/`DirRow` memo、level 拉取世代守卫 + AbortController、`fs.tree` truncated 提示、搜索改为 `hidden` 停车不再卸载树、拖拽上传视觉 token 化（原 `#3964FE`/`#9CE5ED` 清零）。
+- **宿主接入**：`fs.mkdir` 路由 + `mkdirWorkspaceEntry`（`tests/fs-mkdir.spec.ts` 6 例）；新增 `src/client/open-in-app.ts`（宿主 Remote `canOpenWorkspacePath`/`workspacePathApplications`/`openWorkspacePath` + 宿主路由 `/open-in-app/apps|icon|open` 的客户端适配，`tests/open-in-app.spec.ts` 10 例）。
+- **文件变动页**（`changes/**`、`diff/**`、`DiffTab.tsx`）：36px 头（宿主 `SegmentedControl` + 刷新 IconButton）、单一 `ChangeRow`、SectionHeader 分组、吸底提交条 + 单一状态行、历史区独立空态、`useGitStatus` 共享状态、刷新排队、工作树只自动选一次、预览按 callId 重派生、高度恢复 clamp、session ops 轮询按视角门控、`DiffPane`/`DiffTab` 共用新 hook `src/client/diff/use-git-diff.ts`（并修掉 DiffPane 的 untracked 预览从不渲染的既有缺陷）。
+
+### 8.2 相对冻结契约的偏差（均有理由）
+
+1. **open-with 全链路删除**（而非并存回退）：`src/open-external.ts`、`src/client/open-with.ts`、`src/client/open-with-settings.tsx`、`src/client/plugin-settings.ts`（随之成为死代码）、宿主 `open.external` 路由、`api.openExternal`、editor descriptor 的 `settings.render` 面板与 20 个 `openWith*` 词条全部移除；外部打开改为 DSH 自带 open-in-app。**取舍**：原「SSH 远端 + 自定义编辑器 URL 模板」能力随之消失——它服务的场景是 DSH 宿主在远端、浏览器在本地，此时宿主 open-in-app 本就不可用（`canOpenWorkspacePath()` 为 false，整段隐藏，与宿主自身行为一致）。若需要该能力应回到 DSH 侧或单独插件实现。
+2. **`useSubmenuFlip` 一并删除**：FileTree 的「打开方式」子菜单消失后，`src/client/menu-flip.ts` + `layout.css` 的子菜单翻转规则 + `tests/menu-flip.spec.tsx` 已无消费者，按死代码清除。
+3. **词典同步为 25 个新键**（非 26）：原清单最后一项是插入锚点说明；zh/en 与 19 份词典最终同为 486 键。
+4. **`visible` 逐层下传**：文件树的 git 轮询必须随页签可见性暂停（工作台会保留所有 tab body 挂载），因此 `EditorHost → TreePanel → FileTree` 新增可选 `visible`，`useGitStatus(..., { visible })` 在页签隐藏时退订。这是实施期补的性能修正（不在原 §3 清单里）。
+5. **计划 §5 的「状态摘要」行**未单独实现：干净时用 `changesClean` 空态 + 两个 SectionHeader 计数 + 分支标签表达，避免第三处重复计数文案（KISS）。
+6. **未做浏览器级视觉验证**：拖拽/多选的观感只有 token 与尺度层面的代码证据 + 行为测试；真实挂载 lane（`pnpm test:mount`）见 §8.3。
+
+### 8.3 验证证据
+
+- `pnpm typecheck` / `pnpm lint` / `pnpm test`（126 文件、1318 通过、9 跳过）/ `pnpm build` 全绿（§8.6 是修正后的最终数字：1322 通过）。
+- 新增测试：`tests/ui-kit.spec.tsx`（14）、`tests/fs-mkdir.spec.ts`（6）、`tests/open-in-app.spec.ts`（10）、`tests/file-tree-multiselect.spec.tsx`（8）、`tests/file-tree-git-status.spec.tsx`（4）、`tests/file-tree-new-folder.spec.tsx`（7）、`tests/file-tree-open-in-app.spec.tsx`（8）、`tests/file-tree-row-memo.spec.tsx`（2）、`tests/file-tree-search-persist.spec.tsx`（3）、`tests/file-tree-dir-watch.spec.tsx`（5）、`tests/diff-git-target.spec.tsx`（4），以及 changes-tab / git-view-worktree 的大幅扩充。
+- 真实挂载 lane：`DSH_CMD='npx -y --package @deepseek-ai/dsh@0.1.7-rc.1 dsh' pnpm test:mount`（本机 PATH 上的 dsh 是 rc.2，脚本按基线拒绝直接运行）→ **7/7 通过**。
+
+### 8.4 真实挂载 lane 抓到的缺陷（单测全绿也漏掉的）
+
+`sidbar` 客户端 bundle 缺少 `remote` / `remote.session` 的 cordis inject 声明时，`ctx.get('remote').session` 会抛
+`dsh-better-sidebar: cannot get property "remote.session" without inject`——**这一抛发生在渲染路径上，会把整个「文件」面板替换成错误条 + Retry**（首轮挂载 lane 的截图与 trace 均记录在案，整个 tab sweep 因此失败）。
+
+修法两条，缺一不可：
+
+1. `src/client/index.tsx` 的 `inject` 补上 `'remote'` 与 `'remote.session'`（嵌套属性访问也要单独声明）；
+2. `src/client/open-in-app.ts` 的 `remoteOf()` 加 try/catch：没有该服务组合的部署降级为「无打开方式菜单」，而不是把面板整块打崩（`tests/open-in-app.spec.ts` 新增一条「ctx 抛错时全部降级」用例钉子）。
+
+这条正好说明为什么 §6 的验收表里 `pnpm test:mount` 不能省：单元/组件测试全部是绿的，只有真实宿主挂载才暴露了这个 inject 契约。
+
+### 8.5 独立验证后的修正（verifier 报告 → 已全部落地）
+
+| 编号 | 问题（verifier 证据） | 处置 |
+|---|---|---|
+| P1（高） | `open-in-app` 的 availability 是 tri-state（初始 `null`），但生产路径**没有任何地方调用 `probe()`**，于是 `available() !== true` 恒成立、整段菜单永不渲染——「复用 DSH 自带打开方式」实际未交付 | `FileTree` 挂载时按 handle 探测一次：已知答案（`true`/`false`）直接采用，`null` 才 `probe()`，结果进 state 驱动菜单重渲染。新增两条钉死该生命周期的测试（含**真实 adapter + 假 Host Remote** 的端到端用例）。真实挂载截图确认：菜单出现「Open with default app / Visual Studio Code / QuickTime Player / Reveal in File Manager」（宿主探测到的本机关联应用与真实图标） |
+| P2（中） | `EditorHost` 新增的 `visible` 从未被传入（`builtins/tabs.tsx` 的文件 tab 未解构 `visible`）→ 隐藏页签仍在轮询 git | 文件 tab 的 component 解构并传入 `visible` |
+| P3（中） | 文件树与文件变动页没有共用同一把 slot 键（GitLens 总把自动选中的 **primary** checkout 当 `worktree` 传）→ 同仓库两条 2.5s 轮询 | GitLens 只在选中 **linked** checkout 时才传 `worktree`（primary 的答案是同一份）；`tests/ui-kit.spec.tsx` 增补「同键两个消费者只发一次请求」用例 |
+| P4（中低） | session 视角每个 tick 重折 ops → 新数组击穿下游 memo → 每次都重新 Blob 编码每行正文 | `pull()` 在「无新事件且游标未前进」时**保留上一次 fold 的引用**，直接返回 |
+| P5（低） | `noChanges` 成为死键（20 份词典各一条） | 全部删除（`tests/locales.spec.ts` 仍绿） |
+| P6（低） | 冻结文档写 conflict=business，实现为 error | 以实现为准修正文档（冲突是阻塞态，归 error 家族更合理） |
+| P7（低） | 新增 `fs.mkdir` 未进接入文档的 fence 路由清单 | 指南 §路由安全边界补上 `fs.mkdir`（并补齐原先漏列的 `fs.rename`/`fs.remove`） |
+| P8（低） | 行有 `data-dsh-selected` 但无 `aria-pressed` | 文件/目录行按选中态输出 `aria-pressed` |
+| P9（低） | 手动刷新与定时 tick 可重叠、重复追加同一 delta | `pull()` 单飞（在飞时新请求是 no-op，在飞的那次已覆盖到当下） |
+
+### 8.6 最终验证（修正之后重跑）
+
+- `pnpm typecheck` / `pnpm lint` / `pnpm test`：126 文件、**1322 通过**、9 跳过；`pnpm build` 通过。
+- 真实挂载 lane：`DSH_CMD='npx -y --package @deepseek-ai/dsh@0.1.7-rc.1 dsh' pnpm test:mount` → **7/7 通过**（含 tab sweep、perf lane）。
+- 截图级证据（临时 Playwright 取证脚本，已删除，不留在仓库）：真实宿主上文件树行显示 **M/U 字母与状态色**、右键菜单出现宿主探测到的应用列表、文件变动页显示 36px `Git | Session` 头 + 未暂存/已暂存分组 + 吸底提交条 + 历史。
+- 仍属未验证：拖拽上传的视觉观感与手动多选手感（只有 token/尺度证据与行为测试）、Windows 宿主差异。
diff --git a/src/client/DiffTab.tsx b/src/client/DiffTab.tsx
index 730b1d1..18f63e8 100644
--- a/src/client/DiffTab.tsx
+++ b/src/client/DiffTab.tsx
@@ -5,157 +5,24 @@
  * addition from their content), a commit ref loads the commit's full patch
  * (`git.show`-style). The header carries a refresh button because the tab
  * stays mounted while the changes tab's staging/discard operations change the
- * very content it shows. Rendering goes through the shared {@link DiffFiles}
- * renderer — the same one the changes tab's inline preview uses.
+ * very content it shows. Loading IS the shared `useGitDiffTarget` hook (the
+ * changes tab's inline preview runs the same one, so the staged-side and
+ * untracked fallbacks and the per-file fold cache cannot drift apart);
+ * rendering goes through the shared {@link DiffFiles} renderer.
  */
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
+import { useMemo } from 'react'
 import { IconRefreshOutlineRegular } from '@deepseek-ai/dsh-client-ui-primitives'
 import type { SessionScope } from './api.ts'
-import { api } from './api.ts'
 import type { SidebarDiffRef } from './state.ts'
 import { DiffFiles } from './diff/DiffFiles.tsx'
-import { displayPath, foldRowsFromContents, type DiffFile, type DiffRow, type FoldSegment } from './diff/rows.ts'
+import { useGitDiffTarget } from './diff/use-git-diff.ts'
 import { t } from './locales.ts'
-import { resolveSidebarPath } from './paths.ts'
 import css from './sidebar.module.css'
 
-/** The loaded diff surface (untracked content rendered as a full addition). */
-interface DiffData {
-  diff: string
-  untracked?: string
-}
-
 export function DiffTab(props: { sessionId: string; cwd: string | undefined; diff: SidebarDiffRef }) {
   const { sessionId, cwd, diff } = props
-  const [loading, setLoading] = useState(true)
-  const [error, setError] = useState<string | null>(null)
-  const [data, setData] = useState<DiffData | null>(null)
-  const [tick, setTick] = useState(0)
-  // The staged flag of the side ACTUALLY rendered: when the requested side's
-  // diff came back empty the load falls back to the other side, and the fold
-  // expansion must read that side's revisions (else the sliced line numbers
-  // land on the wrong contents).
-  const [effectiveStaged, setEffectiveStaged] = useState<boolean | null>(null)
-
-  const refresh = useCallback((): void => { setTick(value => value + 1) }, [])
-
-  useEffect(() => {
-    let cancelled = false
-    const scope: SessionScope = { sessionId, cwd, ...(diff.repoRoot !== undefined ? { repoRoot: diff.repoRoot } : {}) }
-    setLoading(true)
-    setError(null)
-    setData(null)
-    setEffectiveStaged(null)
-    const load = async (): Promise<void> => {
-      try {
-        if (diff.kind === 'commit') {
-          const result = await api.gitCommitDiff(scope, diff.hashFull, diff.worktree)
-          if (!cancelled) setData({ diff: result.diff })
-          return
-        }
-        let result = await api.gitDiff(scope, diff.path, diff.staged, diff.worktree)
-        if (result.diff === '') {
-          // The requested side is empty — try the OTHER side once: the ref
-          // may predate the staged-flag fix, or the change moved sides (a
-          // file staged after its tab opened). Both sides empty means the
-          // file genuinely has no text changes.
-          const other = await api.gitDiff(scope, diff.path, !diff.staged, diff.worktree)
-          if (other.diff !== '') {
-            result = other
-            if (!cancelled) setEffectiveStaged(!diff.staged)
-          }
-        }
-        if (result.diff !== '') {
-          if (!cancelled) setData({ diff: result.diff })
-          return
-        }
-        // Empty diff: an untracked file (git diff never lists it) falls back
-        // to a full-file addition; anything else is a genuine no-text-change.
-        if (diff.untracked === true && !diff.staged) {
-          // A child-repo path is relative to diff.repoRoot, not the session
-          // cwd or the linked-worktree root; resolve against whichever the
-          // diff ref carries so the untracked fallback reads the right file.
-          const text = await api.fsRead(scope, resolveSidebarPath(diff.repoRoot ?? diff.worktree ?? cwd, diff.path))
-          if (!cancelled) {
-            setData(text.kind === 'text' ? { diff: '', untracked: text.content } : { diff: '' })
-          }
-          return
-        }
-        if (!cancelled) setData({ diff: '' })
-      } catch (reason) {
-        if (!cancelled) setError(reason instanceof Error ? reason.message : String(reason))
-      } finally {
-        if (!cancelled) setLoading(false)
-      }
-    }
-    void load()
-    return () => { cancelled = true }
-  }, [sessionId, cwd, diff, tick])
-
-  // ── On-demand git fold expansion: a fold's hidden rows come from both
-  //    sides' full contents (git.show / fsRead), fetched ONCE per file so
-  //    sibling folds share the request, then sliced by each fold's line
-  //    ranges. The cache dies with the ref or a refresh tick. ──────────────
-  const foldContents = useRef(new Map<string, Promise<{ old: string; new: string }>>())
-  useEffect(() => { foldContents.current = new Map() }, [diff, tick])
-  const foldLoader = useMemo(() => {
-    const sidesOf = (file: DiffFile): Promise<{ old: string; new: string }> => {
-      // Both sides empty cannot cover a non-empty fold — treat it as a failed
-      // fetch so the fold degrades to the unavailable marker instead of
-      // silently expanding to nothing (the symptom of a bad rev or path
-      // reading null on both sides).
-      const ofSides = (oldContent: string | null, newContent: string | null): { old: string; new: string } => {
-        if ((oldContent ?? '') === '' && (newContent ?? '') === '') throw new Error('no content on either side')
-        return { old: oldContent ?? '', new: newContent ?? '' }
-      }
-      const fetchSides = async (): Promise<{ old: string; new: string }> => {
-        const scope: SessionScope = { sessionId, cwd, ...(diff.repoRoot !== undefined ? { repoRoot: diff.repoRoot } : {}) }
-        if (diff.kind === 'commit') {
-          // The patch's -m --first-parent shape: old side from the parent,
-          // new side from the commit (a root commit's parent read fails → '').
-          const [oldSide, newSide] = await Promise.all([
-            file.oldPath === '/dev/null'
-              ? Promise.resolve({ content: null })
-              : api.gitShow(scope, `${diff.hashFull}^`, displayPath(file.oldPath), diff.worktree),
-            file.newPath === '/dev/null'
-              ? Promise.resolve({ content: null })
-              : api.gitShow(scope, diff.hashFull, displayPath(file.newPath), diff.worktree),
-          ])
-          return ofSides(oldSide.content, newSide.content)
-        }
-        // Worktree change: staged is HEAD vs index, unstaged is index vs
-        // worktree (the worktree side reads the live file).
-        const staged = effectiveStaged ?? diff.staged
-        if (staged) {
-          const [oldSide, newSide] = await Promise.all([
-            file.oldPath === '/dev/null'
-              ? Promise.resolve({ content: null })
-              : api.gitShow(scope, 'HEAD', displayPath(file.oldPath), diff.worktree),
-            file.newPath === '/dev/null'
-              ? Promise.resolve({ content: null })
-              : api.gitShow(scope, ':0', displayPath(file.newPath), diff.worktree),
-          ])
-          return ofSides(oldSide.content, newSide.content)
-        }
-        const [oldSide, worktree] = await Promise.all([
-          file.oldPath === '/dev/null'
-            ? Promise.resolve({ content: null })
-            : api.gitShow(scope, ':0', displayPath(file.oldPath), diff.worktree),
-          api.fsRead(scope, resolveSidebarPath(diff.repoRoot ?? diff.worktree ?? cwd, displayPath(file.newPath))).catch(() => null),
-        ])
-        return ofSides(oldSide.content, worktree !== null && worktree.kind === 'text' ? worktree.content : null)
-      }
-      const path = displayPath(file.newPath === '/dev/null' ? file.oldPath : file.newPath)
-      let promise = foldContents.current.get(path)
-      if (promise === undefined) {
-        promise = fetchSides()
-        foldContents.current.set(path, promise)
-      }
-      return promise
-    }
-    return (file: DiffFile, segment: FoldSegment): Promise<readonly DiffRow[]> =>
-      sidesOf(file).then(sides => foldRowsFromContents(segment, sides.old, sides.new))
-  }, [sessionId, cwd, diff, effectiveStaged])
+  const scope = useMemo<SessionScope>(() => ({ sessionId, cwd }), [sessionId, cwd])
+  const { loading, error, diffText, untracked, refresh, resolveFold } = useGitDiffTarget(diff, scope)
 
   return (
     <div className={css.gitDiffTab}>
@@ -175,12 +42,12 @@ export function DiffTab(props: { sessionId: string; cwd: string | undefined; dif
       </div>
       {loading && <div className={css.gitPlaceholder}>{t('loading')}</div>}
       {!loading && error !== null && <div className={css.gitError}>{t('diffLoadError')}: {error}</div>}
-      {!loading && error === null && data !== null && (
+      {!loading && error === null && diffText !== null && (
         <>
-          {data.untracked !== undefined
-            ? <DiffFiles diff="" untrackedPath={diff.kind === 'worktree' ? diff.path : ''} untrackedContent={data.untracked} />
-            : <DiffFiles diff={data.diff} resolveFold={foldLoader} />}
-          {data.diff === '' && data.untracked === undefined && (
+          {untracked !== undefined
+            ? <DiffFiles diff="" untrackedPath={diff.kind === 'worktree' ? diff.path : ''} untrackedContent={untracked} />
+            : <DiffFiles diff={diffText} resolveFold={resolveFold} />}
+          {diffText === '' && untracked === undefined && (
             <div className={css.gitEmpty}>{t('diffEmpty')}</div>
           )}
         </>
diff --git a/src/client/EditorHost.tsx b/src/client/EditorHost.tsx
index 3c2359e..4de1ce4 100644
--- a/src/client/EditorHost.tsx
+++ b/src/client/EditorHost.tsx
@@ -34,8 +34,7 @@ import { planFirstMatch, planFsReadOutcome, type EditorLoadAction } from './edit
 import { baseName } from './FileTree.tsx'
 import { createFrameBatcher } from './frame-batcher.ts'
 import { openSidebarFile } from './sidebar-file.ts'
-import { openWithSshActive, openWithUrl, parseOpenWithConfig, resolveOpenWithTargets } from './open-with.ts'
-import { updatePluginSettings } from './plugin-settings.ts'
+import { createOpenInApp } from './open-in-app.ts'
 import { TreePanel } from './TreePanel.tsx'
 import { t } from './locales.ts'
 import { relativeTo } from './paths.ts'
@@ -56,10 +55,6 @@ const TREE_WIDTH_DEFAULT = 240
 const TREE_WIDTH_MIN = 160
 const TREE_WIDTH_MAX = 480
 
-/** Stable empty blob for the editor pluginSettings read (a fresh `?? {}`
- *  would change identity every snapshot and loop useSyncExternalStore). */
-const EMPTY_PLUGIN_BLOB: Record<string, unknown> = {}
-
 /** The tab's persisted meta object (a malformed meta reads as empty). */
 function metaOf(tab: SidebarTab): Record<string, unknown> {
   return tab.meta !== null && typeof tab.meta === 'object' && !Array.isArray(tab.meta)
@@ -98,12 +93,16 @@ export function EditorHost(props: {
   store: SidebarStore
   scope: SessionScope
   tab: SidebarTab
+  /** Whether this tab is the active one with its panel open: a parked tab
+   *  must not keep polling (the workbench keeps every tab body mounted). */
+  visible?: boolean
   expanded: string[]
   revealed: string[]
   onToggleDir: (path: string) => void
   onReferenceFile: (path: string, isDir: boolean) => void
 }) {
   const { ctx, store, scope, tab, expanded, revealed, onToggleDir, onReferenceFile } = props
+  const visible = props.visible !== false
   const path = tab.path ?? ''
   const title = tab.title
   // A folder window: the model's `sidebar_open` (or any caller) opens a
@@ -135,16 +134,11 @@ export function EditorHost(props: {
     useCallback((callback: () => void) => store.subscribe(callback), [store]),
     useCallback(() => store.getSnapshot().prefs.editorExplorer, [store]),
   )
-  // The file tree's "open with" configuration (pluginSettings['editor']): a
-  // blob subscription, so a pin click or a settings-page edit re-renders the
-  // menu immediately. The parsed config also drives which targets are shown
-  // (SSH mode hides the host-local ones).
-  const editorBlob = useSyncExternalStore(
-    useCallback((callback: () => void) => store.subscribe(callback), [store]),
-    useCallback(() => store.getSnapshot().prefs.pluginSettings['editor'] ?? EMPTY_PLUGIN_BLOB, [store]),
-  )
-  const openWithConfig = useMemo(() => parseOpenWithConfig(editorBlob.openWith), [editorBlob])
-  const openWithTargets = useMemo(() => resolveOpenWithTargets(openWithConfig), [openWithConfig])
+  // The DSH-native "open with" capability (host open-in-app): one adapter per
+  // window, shared by every row menu below. The plugin no longer owns a
+  // target list, a URL vocabulary or a spawn route — the host reports which
+  // applications are actually installed for THIS path.
+  const openInApp = useMemo(() => createOpenInApp(ctx), [ctx])
   // A path-less tab shows the empty-state hint in merged mode — and in split
   // mode it is the standalone explorer (tree-only, see the render below). A
   // folder tab is a folder window in BOTH modes: the tree rooted at the
@@ -191,40 +185,6 @@ export function EditorHost(props: {
     })
   }
 
-  /** The context menu's "open with" action: reveal the path in the OS file
-   *  manager, or hand the target's URL to its opener — local `file` URLs go
-   *  to the host's external opener, while the SSH-remote form for
-   *  VSCode-family editors launches on the browser/client machine (see
-   *  api.openExternal). Failures are logged only — a missing handler is the
-   *  OS's/browser's dialog, not a sidebar error. */
-  const openWith = (targetId: string, absolute: string): void => {
-    const target = openWithTargets.find(item => item.id === targetId)
-    if (target === undefined) return
-    if (target.kind === 'reveal') {
-      void api.openExternal({ action: 'reveal', path: absolute }).catch(
-        (error: unknown) => { console.error('open external failed', error) },
-      )
-      return
-    }
-    const url = openWithUrl(target, absolute, openWithConfig)
-    if (url === undefined) return
-    void api.openExternal({ action: 'url', url }).catch(
-      (error: unknown) => { console.error('open external failed', error) },
-    )
-  }
-
-  /** Toggle one target's pinned state. The write is serialized (see
-   *  plugin-settings.ts) and the menu re-renders when the store prefs land. */
-  const toggleOpenWithPin = (targetId: string): void => {
-    updatePluginSettings(store, 'editor', (blob) => {
-      const config = parseOpenWithConfig(blob.openWith)
-      const pinned = config.pinned.includes(targetId)
-        ? config.pinned.filter(id => id !== targetId)
-        : [...config.pinned, targetId]
-      return { ...blob, openWith: { ...config, pinned } }
-    })
-  }
-
   // Tree mutations reconcile the OPEN tabs (both split trees, the bottom
   // panel, free windows): a rename retargets its tab to the new path; a
   // delete closes tabs at or under the removed path. See tree-mutations.ts.
@@ -384,6 +344,7 @@ export function EditorHost(props: {
       <div className={css.editor}>
         <TreePanel
           full
+          visible={visible}
           store={store}
           sessionId={scope.sessionId}
           cwd={folderRoot ?? scope.cwd}
@@ -393,11 +354,7 @@ export function EditorHost(props: {
           onOpenFile={openFile}
           onOpenFileNewTab={openFileNewTab}
           onOpenFileSide={openFileSide}
-          openWithTargets={openWithTargets}
-          openWithPinned={openWithConfig.pinned}
-          openWithSsh={openWithSshActive(openWithConfig)}
-          onOpenWith={openWith}
-          onToggleOpenWithPin={toggleOpenWithPin}
+          openInApp={openInApp}
           onReferenceFile={onReferenceFile}
           onPathRenamed={onPathRenamed}
           onPathDeleted={onPathDeleted}
@@ -509,6 +466,7 @@ export function EditorHost(props: {
               onPointerCancel={onResizeEnd}
             />
             <TreePanel
+              visible={visible}
               store={store}
               sessionId={scope.sessionId}
               cwd={scope.cwd}
@@ -518,11 +476,7 @@ export function EditorHost(props: {
               onOpenFile={openFile}
               onOpenFileNewTab={openFileNewTab}
               onOpenFileSide={openFileSide}
-              openWithTargets={openWithTargets}
-              openWithPinned={openWithConfig.pinned}
-              openWithSsh={openWithSshActive(openWithConfig)}
-              onOpenWith={openWith}
-              onToggleOpenWithPin={toggleOpenWithPin}
+              openInApp={openInApp}
               onReferenceFile={onReferenceFile}
               onPathRenamed={onPathRenamed}
               onPathDeleted={onPathDeleted}
diff --git a/src/client/FileTree.tsx b/src/client/FileTree.tsx
index 2eab0fb..ef8e5d4 100644
--- a/src/client/FileTree.tsx
+++ b/src/client/FileTree.tsx
@@ -2,44 +2,64 @@
  * The controlled file tree behind the files window's tree panel (TreePanel
  * wraps it with the search box): a lazy VSCode-style tree rooted at the
  * session's working directory. Levels load on expansion (one API call per
- * directory), directories sort first, hidden entries render dimmed. The
- * expansion set lives in the per-session state (owned by the caller); the
- * caller also owns the refresh affordance — a `refreshTick` bump wipes the
- * level cache so the visible set reloads.
+ * directory; a stale response is dropped by generation guard + abort),
+ * directories sort first, hidden entries render dimmed. The expansion set
+ * lives in the per-session state (owned by the caller); the caller also owns
+ * the refresh affordance — a `refreshTick` bump wipes the level cache so the
+ * visible set reloads.
  *
- * Row actions: hovering a row reveals an @-reference button on the far
- * right (appends `@<relative path>` to the composer draft), and right-click
- * opens a context menu: file rows offer the caller's open escapes
- * (new tab / to the side, only when the callbacks exist) and a download
- * action (the host serves raw bytes, binary-safe); directory rows offer
- * "upload here"; every row can copy the relative or absolute path (with a
- * brief "copied" label replacing the button after a successful write).
+ * Selection (VS Code semantics, no modifier = the old click semantics
+ * untouched): Ctrl/Cmd+click toggles a row and sets the anchor, Shift+click
+ * selects the visible range from the anchor, Escape / a blank click clears,
+ * right-clicking outside the selection collapses it onto the row. A non-empty
+ * selection shows the batch bar above the root row (copy paths / delete /
+ * clear); the batch delete confirms once and removes sequentially.
+ *
+ * Git ink: rows read the shared `useGitStatus` store (the changes page reads
+ * the same snapshot) — a changed file's name takes its tone and a letter
+ * badge, a directory with a change below it is tinted without a letter, and a
+ * non-repo silently renders plain.
+ *
+ * Row actions: hovering a row reveals an @-reference button on the far right
+ * (appends `@<relative path>` to the composer draft), and right-click opens a
+ * context menu: file rows offer the caller's open escapes (new tab / to the
+ * side, only when the callbacks exist), the host's "open in app" section and
+ * a download action (the host serves raw bytes, binary-safe); directory rows
+ * offer "upload here" and "new folder" (an inline editor at the top of that
+ * level); every row can copy the relative or absolute path (with a brief
+ * "copied" label replacing the button after a successful write).
+ *
+ * Rows are memoized components (FileRow / DirRow) fed by stable callbacks and
+ * per-row booleans, so a copy flash, a drag target or a selection change only
+ * re-renders the rows it touches — not the whole tree.
  *
  * Uploads start here (drag-drop or the context menu picker) but run in the
  * caller: every request is reported through `onUploadRequest(dir, items)`
  * (VSCode semantics — a drop on a file row targets its parent directory),
  * and `busy` gates new drags while one upload is in flight.
  */
-import { useCallback, useEffect, useMemo, useRef, useState, type DragEvent, type MouseEvent, type ReactNode } from 'react'
+import { memo, useCallback, useEffect, useMemo, useRef, useState, type DragEvent, type KeyboardEvent, type MouseEvent, type ReactNode } from 'react'
 import { createPortal } from 'react-dom'
 import clsx from 'clsx'
 import {
-  Button, IconChevronRightOutlineRegular, IconCloseFillRegular, IconCodeOutlineRegular, IconCopyOutlineRegular, IconDownloadOutlineRegular,
-  IconEditOutlineRegular, IconLinkOutlineRegular, IconTrashOutlineRegular, Menu, Modal, type MenuEntry, type MenuItem, writeClipboard,
+  IconCloseFillRegular, IconCodeOutlineRegular, IconCopyOutlineRegular, IconDownloadOutlineRegular,
+  IconEditOutlineRegular, IconFolderOpenRegular, IconLinkOutlineRegular, IconPlusOutlineRegular, IconTrashOutlineRegular,
+  Menu, type MenuEntry, type MenuItem, writeClipboard,
 } from '@deepseek-ai/dsh-client-ui-primitives'
-import { SiCursor, SiZedindustries } from 'react-icons/si'
-import { VscFolderOpened, VscLinkExternal, VscPin, VscPinned } from 'react-icons/vsc'
 import { api, downloadUrl, isOutsideWorkspaceMessage, type FsEntry } from './api.ts'
 import { FenceErrorNotice } from './FenceErrorNotice.tsx'
 import { builtinFileIcon, builtinFolderIcon } from './file-icons.tsx'
-import { IconUploadOutline16, IconVscode16 } from './icons.tsx'
+import { IconUploadOutline16 } from './icons.tsx'
 import { isImeComposition } from './ime-guard.ts'
-import { useSubmenuFlip } from './menu-flip.ts'
-import type { OpenWithTarget } from './open-with.ts'
+import type { OpenInApp, OpenInAppEntry } from './open-in-app.ts'
 import { relativeTo } from './paths.ts'
 import { t } from './locales.ts'
 import type { BetterSidebarService } from './service.ts'
 import type { SidebarStore } from './state.ts'
+import {
+  Chip, ConfirmDialog, IconButton, Notice, SectionHeader, StatusBadge, useGitStatus,
+  type GitFileStatus, type GitTone, type StatusTone,
+} from './ui/index.ts'
 import { uploadItemsFromDrop, uploadItemsFromFiles, type UploadItem } from './upload.ts'
 import { useDirectoryWatch } from './use-dir-watch.ts'
 import css from './sidebar.module.css'
@@ -47,6 +67,8 @@ import css from './sidebar.module.css'
 interface LevelData {
   entries?: FsEntry[]
   error?: string
+  /** The host capped this level's listing (a huge directory). */
+  truncated?: boolean
 }
 
 /** Root label: the last path segment (mirror of the host rootLabel). */
@@ -72,43 +94,239 @@ function isFileDrag(event: DragEvent): boolean {
 /** How long the row's "copied" label stays after a successful write. */
 const COPIED_MS = 1200
 
+/** One changed row's tooltip word (the badge's status vocabulary). */
+function gitToneLabel(tone: GitTone): string {
+  switch (tone) {
+    case 'added': return t('gitStatusAdded')
+    case 'deleted': return t('gitStatusDeleted')
+    case 'untracked': return t('gitStatusUntracked')
+    case 'renamed': return t('gitStatusRenamed')
+    case 'conflict': return t('gitStatusConflict')
+    // A copy is an added path from the tree's point of view, and the
+    // `gitStatus*` vocabulary has no separate word for it.
+    case 'copied': return t('gitStatusAdded')
+    case 'modified': return t('gitStatusModified')
+  }
+}
+
+/** The badge tone for one git tone (the kit has no separate 'copied' ink). */
+function badgeToneOf(tone: GitTone): StatusTone {
+  return tone === 'copied' ? 'added' : tone
+}
+
 /**
  * The drop overlay's hero art: an arrow rising out of a notched tray
  * (upload zone — the same glyph family as the toolbar's upload icon) and a
- * tilted pair of photo cards (chat zone). Hand-drawn, colored in the
- * palette of DSH's own native drop illustration (#3964FE / #9CE5ED) so the
- * two zones read as one family; the drop overlay is this flow's one brand
- * moment, so it gets color the rest of the UI never does.
+ * tilted pair of photo cards (chat zone). Hand-drawn, but every ink is a
+ * theme token: the SVG paints `currentColor` and the classes below pick the
+ * accent / tint / cut-out inks.
  */
 const UploadDropIllustration = () => (
   <svg width="64" height="56" viewBox="0 0 64 56" fill="none" aria-hidden="true">
-    <path d="M32 28V11" stroke="#3964FE" strokeWidth="5" strokeLinecap="round" />
-    <path d="M23 20l9-9 9 9" stroke="#3964FE" strokeWidth="5" strokeLinecap="round" strokeLinejoin="round" />
+    <g className={css.uploadDropArtPrimary}>
+      <path d="M32 28V11" stroke="currentColor" strokeWidth="5" strokeLinecap="round" />
+      <path d="M23 20l9-9 9 9" stroke="currentColor" strokeWidth="5" strokeLinecap="round" strokeLinejoin="round" />
+    </g>
     <path
+      className={css.uploadDropArtAccent}
       d="M10 40a4 4 0 0 1 4-4h7l3.2 4.6a5 5 0 0 0 4.1 2.2h7.4a5 5 0 0 0 4.1-2.2L43 36h7a4 4 0 0 1 4 4v2a10 10 0 0 1-10 10H20A10 10 0 0 1 10 42v-2z"
-      fill="#9CE5ED"
+      fill="currentColor"
     />
   </svg>
 )
 
 /** The chat zone's art: two tilted photo cards, each with its own
  *  sun-over-mountains motif (the back card carries detail too, so it never
- *  reads as a bare blob). */
+ *  reads as a bare blob). Same token-only rule as the tray above. */
 const ChatDropIllustration = () => (
   <svg width="96" height="76" viewBox="0 0 96 76" fill="none" aria-hidden="true">
     <g transform="rotate(-12 24 34)">
-      <rect x="6" y="16" width="36" height="36" rx="10" fill="#9CE5ED" />
-      <circle cx="16" cy="27" r="3.5" fill="white" />
-      <path d="M11 44l8-9 6 6 4-4 8 9" stroke="white" strokeWidth="3" strokeLinecap="round" strokeLinejoin="round" />
+      <rect className={css.uploadDropArtAccent} x="6" y="16" width="36" height="36" rx="10" fill="currentColor" />
+      <g className={css.uploadDropArtCut}>
+        <circle cx="16" cy="27" r="3.5" fill="currentColor" />
+        <path d="M11 44l8-9 6 6 4-4 8 9" stroke="currentColor" strokeWidth="3" strokeLinecap="round" strokeLinejoin="round" />
+      </g>
     </g>
     <g transform="rotate(8 61 35)">
-      <rect x="40" y="12" width="42" height="46" rx="10" fill="#3964FE" />
-      <circle cx="55" cy="27" r="5" fill="white" />
-      <path d="M46 50l10-13 7 8 6-6 9 11" stroke="white" strokeWidth="3.5" strokeLinecap="round" strokeLinejoin="round" />
+      <rect className={css.uploadDropArtPrimary} x="40" y="12" width="42" height="46" rx="10" fill="currentColor" />
+      <g className={css.uploadDropArtCut}>
+        <circle cx="55" cy="27" r="5" fill="currentColor" />
+        <path d="M46 50l10-13 7 8 6-6 9 11" stroke="currentColor" strokeWidth="3.5" strokeLinecap="round" strokeLinejoin="round" />
+      </g>
     </g>
   </svg>
 )
 
+/** The modifier subset row activation needs (clicks and Enter/Space share it). */
+interface ActivateModifiers {
+  ctrlKey: boolean
+  metaKey: boolean
+  shiftKey: boolean
+}
+
+/**
+ * The stable per-row callback bundle. `FileRow` / `DirRow` are memoized, so
+ * every handler here must keep its identity for the life of the tree; each
+ * one reads the live props/state through the refs the tree maintains.
+ */
+interface RowActions {
+  activate(event: ActivateModifiers, path: string, isDir: boolean): void
+  contextMenu(event: MouseEvent<HTMLDivElement>, path: string, isDir: boolean): void
+  reference(path: string, isDir: boolean): void
+  dragOver(event: DragEvent<HTMLDivElement>, dir: string): void
+  drop(event: DragEvent<HTMLDivElement>, path: string, isDir: boolean): void
+}
+
+/** One open-in-app entry's leading glyph: the host's icon route / data URL,
+ *  or a generic mark when the host has no icon for it. */
+function AppGlyph(props: { entry: OpenInAppEntry }): ReactNode {
+  const { icon } = props.entry
+  if (icon === null || icon === '') return <IconCodeOutlineRegular size={14} />
+  return <img className={css.explorerAppIcon} src={icon} alt="" width={14} height={14} />
+}
+
+/** One file row's props. Everything is a primitive or a stable reference so
+ *  memo() actually bails out. */
+interface FileRowProps {
+  entry: FsEntry
+  depth: number
+  /** Registry revision: a fresh value re-resolves the row's icon. */
+  iconsVersion: number
+  service: BetterSidebarService | undefined
+  selected: boolean
+  revealed: boolean
+  /** A drag hovers this row's PARENT directory (upload target). */
+  dropTarget: boolean
+  copied: boolean
+  git: GitFileStatus | undefined
+  actions: RowActions
+}
+
+const FileRow = memo(function FileRow(props: FileRowProps): ReactNode {
+  const { entry, depth, iconsVersion, service, selected, revealed, dropTarget, copied, git, actions } = props
+  // Referenced so a registry change re-renders the row with its new icon.
+  void iconsVersion
+  const icon = service !== undefined ? service.fileIcon(entry.path, 14) : builtinFileIcon(entry.path, 14)
+  return (
+    <div
+      role="button"
+      tabIndex={0}
+      className={clsx(
+        css.explorerRow, entry.hidden && css.explorerHidden, entry.broken && css.explorerBroken,
+        selected && css.explorerRowSelected,
+        dropTarget && css.explorerRowDropTarget,
+        revealed && css.explorerRowRevealed,
+      )}
+      data-dsh-revealed={revealed ? 'true' : undefined}
+      data-dsh-selected={selected ? 'true' : undefined}
+      aria-pressed={selected}
+      style={{ paddingLeft: depth * 22 + 6 }}
+      title={entry.broken ? `${entry.path} — ${t('brokenSymlink')}` : entry.path}
+      onClick={(event) => { actions.activate(event, entry.path, false) }}
+      onKeyDown={(event: KeyboardEvent<HTMLDivElement>) => {
+        if (event.key === 'Enter' || event.key === ' ') {
+          event.preventDefault()
+          actions.activate(event, entry.path, false)
+        }
+      }}
+      onDragOver={(event) => { actions.dragOver(event, parentOf(entry.path)) }}
+      onDrop={(event) => { actions.drop(event, entry.path, false) }}
+      onContextMenu={(event) => { actions.contextMenu(event, entry.path, false) }}
+    >
+      {icon}
+      <span className={clsx(css.explorerName, git !== undefined && css.explorerGitName)} data-git-tone={git?.tone}>
+        {entry.name}
+      </span>
+      {entry.isSymlink && <IconLinkOutlineRegular size={12} className={css.explorerSymlink} />}
+      {git !== undefined && <StatusBadge tone={badgeToneOf(git.tone)} title={gitToneLabel(git.tone)}>{git.letter}</StatusBadge>}
+      {copied
+        ? <span className={css.explorerCopied}>{t('copied')}</span>
+        : (
+          <button
+            type="button"
+            className={css.explorerRef}
+            aria-label={t('referenceFile')}
+            title={t('referenceFile')}
+            onClick={(event) => {
+              event.stopPropagation()
+              actions.reference(entry.path, false)
+            }}
+          >
+            {t('referenceFile')}
+          </button>
+        )}
+    </div>
+  )
+})
+
+/** One directory row's props (same stability rules as {@link FileRowProps}). */
+interface DirRowProps {
+  entry: FsEntry
+  depth: number
+  expanded: boolean
+  iconsVersion: number
+  service: BetterSidebarService | undefined
+  selected: boolean
+  revealed: boolean
+  dropTarget: boolean
+  /** A change exists at or below this directory (tinted, never lettered). */
+  gitChanged: boolean
+  copied: boolean
+  actions: RowActions
+}
+
+const DirRow = memo(function DirRow(props: DirRowProps): ReactNode {
+  const { entry, depth, expanded, iconsVersion, service, selected, revealed, dropTarget, gitChanged, copied, actions } = props
+  void iconsVersion
+  const icon = service !== undefined ? service.folderIcon(entry.path, expanded, 14) : builtinFolderIcon(expanded, 14)
+  return (
+    <div
+      role="button"
+      tabIndex={0}
+      className={clsx(
+        css.explorerRow, css.explorerDir, entry.hidden && css.explorerHidden,
+        selected && css.explorerRowSelected,
+        dropTarget && css.explorerRowDropTarget,
+        revealed && css.explorerRowRevealed,
+      )}
+      data-dsh-revealed={revealed ? 'true' : undefined}
+      data-dsh-selected={selected ? 'true' : undefined}
+      aria-pressed={selected}
+      style={{ paddingLeft: depth * 22 + 6 }}
+      onClick={(event) => { actions.activate(event, entry.path, true) }}
+      onKeyDown={(event: KeyboardEvent<HTMLDivElement>) => {
+        if (event.key === 'Enter' || event.key === ' ') {
+          event.preventDefault()
+          actions.activate(event, entry.path, true)
+        }
+      }}
+      onDragOver={(event) => { actions.dragOver(event, entry.path) }}
+      onDrop={(event) => { actions.drop(event, entry.path, true) }}
+      onContextMenu={(event) => { actions.contextMenu(event, entry.path, true) }}
+    >
+      {icon}
+      <span className={clsx(css.explorerName, gitChanged && css.explorerDirChanged)}>{entry.name}</span>
+      {entry.isSymlink && <IconLinkOutlineRegular size={12} className={css.explorerSymlink} />}
+      {copied
+        ? <span className={css.explorerCopied}>{t('copied')}</span>
+        : (
+          <button
+            type="button"
+            className={css.explorerRef}
+            aria-label={t('referenceFile')}
+            title={t('referenceFile')}
+            onClick={(event) => {
+              event.stopPropagation()
+              actions.reference(entry.path, true)
+            }}
+          >
+            {t('referenceFile')}
+          </button>
+        )}
+    </div>
+  )
+})
+
 export function FileTree(props: {
   sessionId: string
   cwd: string | undefined
@@ -124,18 +342,11 @@ export function FileTree(props: {
   /** Context-menu "open to the side" (file rows; absent → no entry). */
   onOpenFileSide?: (path: string) => void
   /**
-   * The "open with" menu: resolved external targets (already SSH-filtered
-   * and in menu order). Absent → the whole section is hidden.
+   * The host's open-in-app handle (EditorHost builds it and injects it).
+   * Absent, or reporting the host cannot hand paths to the desktop, hides the
+   * whole "open in app" section.
    */
-  openWithTargets?: OpenWithTarget[]
-  /** Ids of targets pinned to the menu's top level (subset of the ids). */
-  openWithPinned?: string[]
-  /** Whether the workspace is remote (appends the SSH hint to target labels). */
-  openWithSsh?: boolean
-  /** Open one target externally (reveal or URL — the caller decides). */
-  onOpenWith?: (targetId: string, path: string) => void
-  /** Toggle one target's pinned state (the submenu row's pushpin). */
-  onToggleOpenWithPin?: (targetId: string) => void
+  openInApp?: OpenInApp
   /** Insert `@<relative path>` into the composer draft (file vs directory). */
   onReferenceFile: (path: string, isDir: boolean) => void
   /** A rename landed (old row path → new path): the caller retargets open tabs. */
@@ -148,6 +359,18 @@ export function FileTree(props: {
   onUploadRequest: (dir: string, items: UploadItem[]) => void
   /** True while an upload is in flight (drops are ignored). */
   busy: boolean
+  /**
+   * Park the tree out of the layout WITHOUT unmounting it: the search results
+   * panel takes the surface while the level cache (and the live watcher) stays
+   * warm, so clearing the query is free.
+   */
+  hidden?: boolean
+  /**
+   * Whether the owning tab is on screen. Defaults to true; a parked tab
+   * passes false so the shared git-status store stops polling for rows
+   * nobody can see (the workbench keeps every tab body mounted).
+   */
+  visible?: boolean
   /**
    * The sidebar registry service: when present, externally registered file
    * icons (`registerFileIcon`) outrank the host's file-type artwork on file rows.
@@ -155,49 +378,60 @@ export function FileTree(props: {
    */
   service?: BetterSidebarService
 }) {
-  const { sessionId, cwd, store, expanded, revealed, onToggle, onOpenFile, onOpenFileNewTab, onOpenFileSide, openWithTargets, openWithPinned, openWithSsh, onOpenWith, onToggleOpenWithPin, onReferenceFile, onPathRenamed, onPathDeleted, refreshTick, onUploadRequest, busy, service } = props
+  // `onToggle` / `onOpenFile` are read through `propsRef` (the stable row
+  // callbacks must not change identity when the caller re-renders).
+  const {
+    sessionId, cwd, store, expanded, revealed, onOpenFileNewTab, onOpenFileSide,
+    openInApp, onReferenceFile, onPathRenamed, onPathDeleted, refreshTick, onUploadRequest, busy, hidden, visible, service,
+  } = props
+  /** The live props for the stable callbacks below (identity churns per render). */
+  const propsRef = useRef(props)
+  propsRef.current = props
   const [data, setData] = useState<Record<string, LevelData>>({})
   /**
    * Registry revision for the file-icon feature: bumps on ANY registry
    * change (register/dispose of tabs, viewers, or icons — one listener
-   * set) so rows re-resolve their icons. The value itself is unread; the
-   * state bump IS the re-render trigger.
+   * set) so rows re-resolve their icons. Handed to the memoized rows as a
+   * prop precisely so the bump reaches them.
    */
-  const [, setIconsVersion] = useState(0)
+  const [iconsVersion, setIconsVersion] = useState(0)
   useEffect(
     () => service?.subscribe(() => { setIconsVersion(version => version + 1) }),
     [service],
   )
   /**
-   * One file row's leading glyph. The service resolver owns the whole
-   * chain (registered specific ext → built-in glyph map → registered
-   * global default → stock VscFile, with per-factory crash isolation);
-   * without a service the built-in map alone applies.
-   */
-  const fileRowIcon = (path: string): ReactNode =>
-    service !== undefined ? service.fileIcon(path, 14) : builtinFileIcon(path, 14)
-
-  /**
-   * One directory row's leading glyph: the registered `'folder'` /
-   * `'folder-open'` icon when present, else the built-in VSCodicons glyphs.
+   * One directory row's leading glyph (the root row and the new-folder
+   * editor use it directly; FileRow/DirRow resolve their own).
    */
   const dirRowIcon = (path: string, open: boolean): ReactNode =>
     service !== undefined ? service.folderIcon(path, open, 14) : builtinFolderIcon(open, 14)
   const dataRef = useRef(data)
+  /** Every in-flight level fetch, keyed by directory (aborted on refresh/unmount). */
+  const controllersRef = useRef(new Map<string, AbortController>())
+  /** Bumped whenever the cache is wiped: a response from an older generation is dropped. */
+  const generationRef = useRef(0)
   /** The row whose path was just copied ("copied" label replaces its button). */
   const [copiedPath, setCopiedPath] = useState<string | null>(null)
   /** Open context menu: the row path (and whether it is a directory) plus the cursor position. */
   const [rowMenu, setRowMenu] = useState<{ path: string; isDir: boolean; x: number; y: number } | null>(null)
-  // The row menu's "open with" submenu is the one submenu that can tower past
-  // the viewport; publish its flip geometry for layout.css while it is open.
-  useSubmenuFlip(rowMenu)
+  /** The open-in-app rows for the open menu (null entries = listing failed). */
+  const [apps, setApps] = useState<{ path: string; entries: readonly OpenInAppEntry[] | null } | null>(null)
   /** The row being renamed inline: its path plus the edit buffer. */
   const [renaming, setRenaming] = useState<{ path: string; value: string } | null>(null)
-  /** The delete awaiting the confirmation modal's yes. */
+  /** The inline new-folder editor: the directory it inserts into plus the buffer. */
+  const [newFolder, setNewFolder] = useState<{ dir: string; value: string } | null>(null)
+  /** The delete awaiting the confirmation modal's yes (single row). */
   const [confirmDelete, setConfirmDelete] = useState<{ path: string; isDir: boolean; name: string } | null>(null)
+  /** The batch delete awaiting the confirmation modal's yes. */
+  const [confirmDeleteSelected, setConfirmDeleteSelected] = useState(false)
+  /** True while the batch delete walks its paths (locks the dialog). */
+  const [deletingSelected, setDeletingSelected] = useState(false)
   /** The last mutation failure (dismissable strip above the tree). */
   const [actionError, setActionError] = useState<string | null>(null)
-  /** Whether a file drag hovers the tree (drives the portaled drop zone). */
+  /** The multi-selection (absolute paths) and its Shift anchor. */
+  const [selected, setSelected] = useState<Set<string>>(() => new Set())
+  const anchorRef = useRef<string | null>(null)
+  /** Whether a dragged-over state exists at all (drives the portaled drop zone). */
   const [dropOver, setDropOver] = useState(false)
   /** The directory a drag is hovering right now (null = body, drop to root). */
   const [dropTarget, setDropTarget] = useState<string | null>(null)
@@ -217,12 +451,12 @@ export function FileTree(props: {
   const fileInputRef = useRef<HTMLInputElement>(null)
 
   /** Reset all drag state (drop landed, the drag left, or a new drag begins). */
-  const resetDrop = (): void => {
+  const resetDrop = useCallback((): void => {
     dropDepth.current = 0
     setDropOver(false)
     setDropTarget(null)
     setDropRect(null)
-  }
+  }, [])
 
   /**
    * Drop handlers: always swallow the event (a dropped file must never open
@@ -232,86 +466,100 @@ export function FileTree(props: {
    * their entry handles — captured synchronously inside uploadItemsFromDrop
    * while the dataTransfer is still live), so the request rides a then.
    */
-  const reportDrop = (dir: string, data: DataTransfer | undefined): void => {
-    if (busy) return
-    void uploadItemsFromDrop(data).then((items) => {
-      if (items.length > 0) onUploadRequest(dir, items)
+  const reportDrop = useCallback((dir: string, transfer: DataTransfer | undefined): void => {
+    if (propsRef.current.busy) return
+    void uploadItemsFromDrop(transfer).then((items) => {
+      if (items.length > 0) propsRef.current.onUploadRequest(dir, items)
     })
-  }
-  const handleBodyDrop = (event: DragEvent): void => {
+  }, [])
+  const handleBodyDrop = useCallback((event: DragEvent<HTMLDivElement>): void => {
     if (!isFileDrag(event)) return
     event.preventDefault()
     event.stopPropagation()
     resetDrop()
-    if (cwd !== undefined) reportDrop(cwd, event.dataTransfer)
-  }
-  const handleDirDrop = (event: DragEvent, dir: string): void => {
+    const root = propsRef.current.cwd
+    if (root !== undefined) reportDrop(root, event.dataTransfer)
+  }, [reportDrop, resetDrop])
+  const handleDirDrop = useCallback((event: DragEvent<HTMLDivElement>, dir: string): void => {
     if (!isFileDrag(event)) return
     event.preventDefault()
     event.stopPropagation()
     resetDrop()
     reportDrop(dir, event.dataTransfer)
-  }
-  const handleFileDrop = (event: DragEvent, path: string): void => {
-    // VSCode semantics: dropping onto a file uploads into its directory.
-    handleDirDrop(event, parentOf(path))
-  }
-  const handleBodyDragEnter = (event: DragEvent): void => {
+  }, [reportDrop, resetDrop])
+  const handleBodyDragEnter = useCallback((event: DragEvent<HTMLDivElement>): void => {
     if (!isFileDrag(event)) return
     event.preventDefault()
     event.stopPropagation()
     dropDepth.current += 1
-    if (busy) return
+    if (propsRef.current.busy) return
     // First entry: anchor the portaled drop zone to the body's rect.
     if (dropDepth.current === 1) {
       const rect = bodyRef.current?.getBoundingClientRect()
       setDropRect(rect === undefined ? null : { top: rect.top, left: rect.left, width: rect.width, height: rect.height })
     }
     setDropOver(true)
-  }
-  const handleBodyDragLeave = (): void => {
+  }, [])
+  const handleBodyDragLeave = useCallback((): void => {
     dropDepth.current = Math.max(0, dropDepth.current - 1)
     if (dropDepth.current > 0) return
     setDropOver(false)
     setDropTarget(null)
     setDropRect(null)
-  }
-  const handleBodyDragOver = (event: DragEvent): void => {
+  }, [])
+  const handleBodyDragOver = useCallback((event: DragEvent<HTMLDivElement>): void => {
     if (!isFileDrag(event)) return
     event.preventDefault()
     event.stopPropagation()
-    event.dataTransfer.dropEffect = busy ? 'none' : 'copy'
-    if (busy) return
+    event.dataTransfer.dropEffect = propsRef.current.busy ? 'none' : 'copy'
+    if (propsRef.current.busy) return
     // Rows stop propagation, so this only fires over non-row regions: the
     // drag targets the workspace root. dragover fires continuously, making
     // it the authoritative (flicker-free) place to clear the row target.
     setDropTarget(null)
-  }
-  const handleRowDragOver = (event: DragEvent, dir: string): void => {
+  }, [])
+  const handleRowDragOver = useCallback((event: DragEvent<HTMLDivElement>, dir: string): void => {
     if (!isFileDrag(event)) return
     event.preventDefault()
     event.stopPropagation()
-    event.dataTransfer.dropEffect = busy ? 'none' : 'copy'
-    if (busy) return
+    event.dataTransfer.dropEffect = propsRef.current.busy ? 'none' : 'copy'
+    if (propsRef.current.busy) return
     setDropTarget(dir)
-  }
+  }, [])
+  /** A row drop: a directory targets itself, a file its parent (VSCode semantics). */
+  const handleDrop = useCallback((event: DragEvent<HTMLDivElement>, path: string, isDir: boolean): void => {
+    handleDirDrop(event, isDir ? path : parentOf(path))
+  }, [handleDirDrop])
 
   const storeLevel = useCallback((path: string, level: LevelData) => {
     dataRef.current = { ...dataRef.current, [path]: level }
     setData(dataRef.current)
   }, [])
 
+  /**
+   * List one directory into the cache. Levels already loaded (including the
+   * empty placeholder of an in-flight fetch) are left alone; a stale response
+   * — the cache was wiped by a refresh tick, or a newer fetch for the same
+   * directory started — is dropped instead of overwriting fresher data.
+   */
   const loadDir = useCallback((dir: string) => {
     if (dataRef.current[dir] !== undefined) return
+    const generation = generationRef.current
+    controllersRef.current.get(dir)?.abort()
+    const controller = new AbortController()
+    controllersRef.current.set(dir, controller)
     storeLevel(dir, {})
-    api.fsTree({ sessionId, cwd }, dir).then((listing) => {
-      storeLevel(dir, { entries: listing.entries })
+    api.fsTree({ sessionId, cwd }, dir, controller.signal).then((listing) => {
+      if (controller.signal.aborted || generation !== generationRef.current) return
+      storeLevel(dir, { entries: listing.entries, truncated: listing.truncated })
     }).catch((error: unknown) => {
+      if (controller.signal.aborted || generation !== generationRef.current) return
       storeLevel(dir, { error: error instanceof Error ? error.message : String(error) })
     })
   }, [sessionId, cwd, storeLevel])
 
-  /** Drop one level from the cache and reload it (the fence notice's retry). */
+  /** Drop one level from the cache and reload it (the fence notice's retry,
+   *  a watch notice, or a landed mutation). */
   const retryDir = useCallback((dir: string) => {
     delete dataRef.current[dir]
     setData({ ...dataRef.current })
@@ -324,7 +572,7 @@ export function FileTree(props: {
    * directories below it, and reload the immediate parent so the new shape
    * shows without a full refresh tick.
    */
-  const pruneTree = (prefix: string): void => {
+  const pruneTree = useCallback((prefix: string): void => {
     const parent = parentOf(prefix)
     const under = (key: string): boolean => key === prefix || key.startsWith(`${prefix}/`) || key.startsWith(`${prefix}\\`)
     for (const key of Object.keys(dataRef.current)) {
@@ -332,22 +580,22 @@ export function FileTree(props: {
     }
     if (parent !== prefix) delete dataRef.current[parent]
     setData({ ...dataRef.current })
-    for (const dir of expanded) {
-      if (under(dir)) onToggle(dir)
+    for (const dir of propsRef.current.expanded) {
+      if (under(dir)) propsRef.current.onToggle(dir)
     }
     if (parent !== prefix) retryDir(parent)
-  }
+  }, [retryDir])
 
   /** Client-side twin of the server's name rule (the server re-validates). */
-  const validRename = (name: string): boolean =>
+  const validName = (name: string): boolean =>
     name !== '' && name !== '.' && name !== '..' && !name.includes('/') && !name.includes('\\')
 
   /** Commit the inline rename: trim, no-op guard, then fs.rename + settle. */
   const commitRename = (path: string, raw: string): void => {
     setRenaming(null)
     const name = raw.trim()
-    if (cwd === undefined || name === baseName(path) || !validRename(name)) {
-      if (name !== baseName(path) && !validRename(name)) setActionError(t('renameInvalid'))
+    if (cwd === undefined || name === baseName(path) || !validName(name)) {
+      if (name !== baseName(path) && !validName(name)) setActionError(t('renameInvalid'))
       return
     }
     api.fsRename({ sessionId, cwd }, path, name)
@@ -361,39 +609,39 @@ export function FileTree(props: {
       })
   }
 
-  /** Run the confirmed delete: fs.remove + settle + close affected tabs. */
-  const performDelete = (target: { path: string; isDir: boolean }): void => {
-    if (cwd === undefined) return
-    api.fsRemove({ sessionId, cwd }, target.path)
-      .then(() => {
-        setActionError(null)
-        pruneTree(target.path)
-        onPathDeleted?.(target.path, target.isDir)
-      })
-      .catch((error: unknown) => {
-        setActionError(error instanceof Error ? error.message : String(error))
-      })
-  }
-
   // The caller's refresh tick wipes the cache (declared BEFORE the load
-  // effect so the reload below sees the empty cache).
+  // effect so the reload below sees the empty cache) and invalidates every
+  // in-flight response, so a slow answer for the old generation can never
+  // land on top of the fresh listing.
   const lastTick = useRef(refreshTick)
   useEffect(() => {
     if (lastTick.current === refreshTick) return
     lastTick.current = refreshTick
+    generationRef.current += 1
+    for (const controller of controllersRef.current.values()) controller.abort()
+    controllersRef.current.clear()
     dataRef.current = {}
     setData({})
   }, [refreshTick])
 
   useEffect(() => {
     // Load the visible set; already-loaded levels (kept in the cache) are
-    // not refetched. Only the refresh tick wipes the cache.
+    // not refetched. Only the refresh tick wipes the cache. Every level
+    // starts its own fetch, so a tick reloads them all concurrently.
     const root = cwd
     if (root === undefined) return
     loadDir(root)
     for (const dir of expanded) loadDir(dir)
   }, [cwd, expanded, refreshTick, loadDir])
 
+  // A torn-down tree must not leave requests running against an unmounted
+  // component (their stores would be dropped anyway — this is lifecycle, not
+  // correctness, but it keeps the network honest).
+  useEffect(() => () => {
+    for (const controller of controllersRef.current.values()) controller.abort()
+    controllersRef.current.clear()
+  }, [])
+
   // Live refresh: the host watches the folders this tree has expanded and
   // names the one that changed, so exactly that level is dropped and
   // re-listed instead of the whole tree. Without it a folder listed once when
@@ -414,7 +662,7 @@ export function FileTree(props: {
   // ([data-dsh-panel-host]) is still programmatically scrollable — a deep
   // reveal shifted the whole panel, tab bar included, out of the viewport.
   useEffect(() => {
-    if (revealed.length === 0) return
+    if (revealed.length === 0 || propsRef.current.hidden === true) return
     const body = bodyRef.current
     if (body === null) return
     const row = body.querySelector<HTMLElement>('[data-dsh-revealed]')
@@ -437,31 +685,313 @@ export function FileTree(props: {
     })
   }, [])
 
-  /** The row's trailing actions: the @-reference button, or the copied label. */
-  const rowActions = (entry: FsEntry): ReactNode => {
-    if (copiedPath === entry.path) {
-      return <span className={css.explorerCopied}>{t('copied')}</span>
+  // ── Multi-selection ────────────────────────────────────────────────────
+  /** The selection's mirror for the stable callbacks (state itself re-renders). */
+  const selectedRef = useRef(selected)
+  /** Path → whether the row is a directory (the delete callback needs it). */
+  const kindRef = useRef(new Map<string, boolean>())
+  /** The visible rows in depth-first order: the Shift range's coordinate space. */
+  const visibleRowsRef = useRef<{ path: string; isDir: boolean }[]>([])
+  /** The expanded set for the stable callbacks. */
+  const expandedSetRef = useRef<Set<string>>(new Set())
+
+  const setSelection = useCallback((next: Set<string>): void => {
+    selectedRef.current = next
+    setSelected(next)
+  }, [])
+
+  /** Ctrl/Cmd+click: toggle one row and move the Shift anchor onto it. */
+  const toggleSelect = useCallback((path: string, isDir: boolean): void => {
+    const next = new Set(selectedRef.current)
+    if (next.has(path)) {
+      next.delete(path)
+    } else {
+      next.add(path)
+      kindRef.current.set(path, isDir)
     }
-    return (
-      <button
-        type="button"
-        className={css.explorerRef}
-        aria-label={t('referenceFile')}
-        title={t('referenceFile')}
-        onClick={(event) => {
-          event.stopPropagation()
-          onReferenceFile(entry.path, entry.isDir)
-        }}
-      >
-        {t('referenceFile')}
-      </button>
-    )
+    anchorRef.current = path
+    setSelection(next)
+  }, [setSelection])
+
+  /** Shift+click: select the visible range between the anchor and the row. */
+  const selectRange = useCallback((path: string, isDir: boolean): void => {
+    const rows = visibleRowsRef.current
+    const anchor = anchorRef.current
+    const from = anchor === null ? -1 : rows.findIndex(row => row.path === anchor)
+    const to = rows.findIndex(row => row.path === path)
+    // No usable anchor (or a row that scrolled out of the tree): behave like
+    // a plain Ctrl click, which also re-seats the anchor.
+    if (from === -1 || to === -1) {
+      toggleSelect(path, isDir)
+      return
+    }
+    const low = Math.min(from, to)
+    const high = Math.max(from, to)
+    const next = new Set(selectedRef.current)
+    for (let index = low; index <= high; index += 1) {
+      const row = rows[index]!
+      next.add(row.path)
+      kindRef.current.set(row.path, row.isDir)
+    }
+    // The anchor stays put: a second Shift+click re-ranges from the same start.
+    setSelection(next)
+  }, [setSelection, toggleSelect])
+
+  const clearSelection = useCallback((): void => {
+    if (selectedRef.current.size === 0) return
+    anchorRef.current = null
+    setSelection(new Set())
+  }, [setSelection])
+
+  const copySelectedPaths = useCallback((): void => {
+    void writeClipboard([...selectedRef.current].join('\n'))
+  }, [])
+
+  /** Run the confirmed single-row delete: fs.remove + settle + close tabs. */
+  const performDelete = (target: { path: string; isDir: boolean }): void => {
+    if (cwd === undefined) return
+    api.fsRemove({ sessionId, cwd }, target.path)
+      .then(() => {
+        setActionError(null)
+        pruneTree(target.path)
+        onPathDeleted?.(target.path, target.isDir)
+        anchorRef.current = null
+        setSelection(new Set())
+      })
+      .catch((error: unknown) => {
+        setActionError(error instanceof Error ? error.message : String(error))
+      })
   }
 
-  const openRowMenu = (event: MouseEvent, path: string, isDir: boolean): void => {
+  // ── Stable row actions ─────────────────────────────────────────────────
+  const handleActivate = useCallback((event: ActivateModifiers, path: string, isDir: boolean): void => {
+    if (event.ctrlKey || event.metaKey) {
+      toggleSelect(path, isDir)
+      return
+    }
+    if (event.shiftKey) {
+      selectRange(path, isDir)
+      return
+    }
+    // Plain click: the original semantics, plus dropping any selection.
+    clearSelection()
+    if (isDir) propsRef.current.onToggle(path)
+    else propsRef.current.onOpenFile(path)
+  }, [clearSelection, selectRange, toggleSelect])
+
+  const handleContextMenu = useCallback((event: MouseEvent<HTMLDivElement>, path: string, isDir: boolean): void => {
     event.preventDefault()
     event.stopPropagation()
+    // VSCode semantics: right-clicking outside the selection collapses it
+    // onto the row; right-clicking INSIDE it keeps the whole batch.
+    if (!selectedRef.current.has(path)) {
+      anchorRef.current = path
+      kindRef.current.set(path, isDir)
+      setSelection(new Set([path]))
+    }
+    setApps(null)
     setRowMenu({ path, isDir, x: event.clientX, y: event.clientY })
+  }, [setSelection])
+
+  const handleReference = useCallback((path: string, isDir: boolean): void => {
+    propsRef.current.onReferenceFile(path, isDir)
+  }, [])
+
+  const actions = useMemo<RowActions>(() => ({
+    activate: handleActivate,
+    contextMenu: handleContextMenu,
+    reference: handleReference,
+    dragOver: handleRowDragOver,
+    drop: handleDrop,
+  }), [handleActivate, handleContextMenu, handleReference, handleRowDragOver, handleDrop])
+
+  // ── New folder ─────────────────────────────────────────────────────────
+  const newFolderRef = useRef(newFolder)
+  newFolderRef.current = newFolder
+
+  /** Open the inline editor at the TOP of `dir`'s level (expanding it first). */
+  const startNewFolder = (dir: string): void => {
+    const live = propsRef.current
+    if (live.cwd !== undefined && dir !== live.cwd && !expandedSetRef.current.has(dir)) live.onToggle(dir)
+    setNewFolder({ dir, value: '' })
+  }
+
+  /**
+   * Commit the inline new-folder name: Enter, blur, or the editor's own
+   * cancel path. The ref guard makes the commit idempotent — a blur that
+   * lands after Enter must not fire a second mkdir.
+   */
+  const commitNewFolder = (dir: string, raw: string): void => {
+    if (newFolderRef.current === null) return
+    newFolderRef.current = null
+    setNewFolder(null)
+    const name = raw.trim()
+    const live = propsRef.current
+    if (live.cwd === undefined) return
+    if (!validName(name)) {
+      setActionError(t('newFolderInvalid'))
+      return
+    }
+    api.fsMkdir({ sessionId: live.sessionId, cwd: live.cwd }, dir, name)
+      .then(() => {
+        setActionError(null)
+        if (dir !== live.cwd && !expandedSetRef.current.has(dir)) live.onToggle(dir)
+        retryDir(dir)
+      })
+      .catch((error: unknown) => {
+        setActionError(error instanceof Error ? error.message : String(error))
+      })
+  }
+
+  const cancelNewFolder = (): void => {
+    newFolderRef.current = null
+    setNewFolder(null)
+  }
+
+  // ── Batch delete ───────────────────────────────────────────────────────
+  /**
+   * Delete every selected row, ONE AT A TIME (the host refuses nothing here,
+   * but a partial batch must be debuggable). The first failure stops the walk
+   * and lands in the error strip; already-removed rows settle as they go.
+   */
+  const performBatchDelete = (): void => {
+    const live = propsRef.current
+    if (live.cwd === undefined || deletingSelected) return
+    const paths = [...selectedRef.current]
+    setConfirmDeleteSelected(false)
+    if (paths.length === 0) return
+    const scope = { sessionId: live.sessionId, cwd: live.cwd }
+    setDeletingSelected(true)
+    void (async () => {
+      const removed: string[] = []
+      for (const path of paths) {
+        try {
+          await api.fsRemove(scope, path)
+        } catch (error: unknown) {
+          setActionError(error instanceof Error ? error.message : String(error))
+          // Keep the rows that were NOT removed selected, so a retry is one click.
+          const next = new Set(selectedRef.current)
+          for (const done of removed) next.delete(done)
+          setSelection(next)
+          setDeletingSelected(false)
+          return
+        }
+        setActionError(null)
+        pruneTree(path)
+        live.onPathDeleted?.(path, kindRef.current.get(path) ?? false)
+        removed.push(path)
+      }
+      setDeletingSelected(false)
+      clearSelection()
+    })()
+  }
+
+  // ── Open in app ────────────────────────────────────────────────────────
+  /** Report one failed hand-off (open / reveal / app listing) in the strip. */
+  const reportOpenFailure = useCallback((path: string): void => {
+    setActionError(t('openInAppFailed', { path }))
+  }, [])
+
+  /**
+   * The open menu's app rows are fetched while the menu is open: the host
+   * resolves a file's registered applications (or a directory's application
+   * catalogue). Availability is re-read per open — a host that cannot hand
+   * paths to the desktop hides the section entirely.
+   */
+  /**
+   * Whether the host can hand paths to a native desktop — probed ONCE per
+   * handle, on mount. The adapter starts in its `null` (unprobed) state, and
+   * only the probe publishes the answer, so the menu reads this state instead
+   * of the tri-state getter: reading `available()` alone left the whole
+   * section permanently invisible (nothing ever probed).
+   */
+  const [appReady, setAppReady] = useState(() => openInApp?.available() === true)
+
+  useEffect(() => {
+    if (openInApp === undefined) {
+      setAppReady(false)
+      return
+    }
+    // An answer the handle already carries is authoritative; only the
+    // unprobed (`null`) state needs the probe.
+    const known = openInApp.available()
+    if (known !== null) {
+      setAppReady(known)
+      return
+    }
+    let cancelled = false
+    void openInApp.probe().then((ok) => {
+      if (!cancelled) setAppReady(ok)
+    }).catch(() => {
+      if (!cancelled) setAppReady(false)
+    })
+    return () => { cancelled = true }
+  }, [openInApp])
+
+  useEffect(() => {
+    if (rowMenu === null || openInApp === undefined || !appReady) {
+      setApps(null)
+      return
+    }
+    let cancelled = false
+    const { path, isDir } = rowMenu
+    setApps(null)
+    const listing = isDir ? openInApp.directoryApps() : openInApp.fileApps(path)
+    void listing.then((entries) => {
+      if (cancelled) return
+      setApps({ path, entries })
+      if (entries === null) reportOpenFailure(path)
+    }).catch(() => {
+      if (cancelled) return
+      setApps({ path, entries: null })
+      reportOpenFailure(path)
+    })
+    return () => { cancelled = true }
+  }, [rowMenu, openInApp, appReady, reportOpenFailure])
+
+  const openWithApp = useCallback((path: string, application?: string): void => {
+    const handle = propsRef.current.openInApp
+    if (handle === undefined) return
+    const call = application === undefined ? handle.open(path) : handle.open(path, application)
+    void call.then((ok) => { if (!ok) reportOpenFailure(path) }).catch(() => { reportOpenFailure(path) })
+  }, [reportOpenFailure])
+
+  const revealPath = useCallback((path: string): void => {
+    const handle = propsRef.current.openInApp
+    if (handle === undefined) return
+    void handle.reveal(path).then((ok) => { if (!ok) reportOpenFailure(path) }).catch(() => { reportOpenFailure(path) })
+  }, [reportOpenFailure])
+
+  /**
+   * The menu's "open in app" section for one row: a heading label plus the
+   * host's rows (the default-application row first for files), a separator,
+   * and reveal-in-file-manager. Absent when the caller wired no handle or the
+   * host cannot open desktop paths; an empty/failed listing degrades to one
+   * disabled line so the section never silently disappears mid-interaction.
+   */
+  const openInAppEntries = (target: { path: string; isDir: boolean }): MenuEntry[] => {
+    if (openInApp === undefined || !appReady) return []
+    const head: MenuEntry = { type: 'label', id: 'open-in-app-label', text: t('openInApp') }
+    const entries = apps !== null && apps.path === target.path ? apps.entries : undefined
+    if (entries === undefined) return [head, { id: 'open-in-app-loading', label: t('loading'), disabled: true }]
+    if (entries === null || entries.length === 0) {
+      return [head, { id: 'open-in-app-empty', label: t('openInAppEmpty'), disabled: true }]
+    }
+    const rows: MenuItem[] = []
+    const fallback = entries.find(entry => entry.isDefault)
+    if (!target.isDir && fallback !== undefined) {
+      rows.push({ id: 'open-in-app:default', label: t('openInAppDefault'), icon: <AppGlyph entry={fallback} /> })
+    }
+    for (const entry of entries) {
+      if (!target.isDir && entry.isDefault) continue
+      rows.push({ id: `open-in-app:${entry.id}`, label: entry.name, icon: <AppGlyph entry={entry} /> })
+    }
+    return [
+      head,
+      ...rows,
+      { id: 'open-in-app-sep', type: 'separator' },
+      { id: 'reveal-in-file-manager', label: t('revealInFileManager'), icon: <IconFolderOpenRegular size={14} /> },
+    ]
   }
 
   /** Download a file through the host route (raw bytes, binary-safe). */
@@ -475,89 +1005,6 @@ export function FileTree(props: {
     anchor.remove()
   }
 
-  /** The menu label of one open target: a locale key for the built-ins, the
-   *  user's own name for custom editors, plus the SSH hint in remote mode. */
-  const openWithLabelOf = (target: OpenWithTarget): string => {
-    const name = target.nameKey !== undefined ? t(target.nameKey) : target.name
-    return openWithSsh === true && !target.localOnly ? `${name}${t('openWithSshSuffix')}` : name
-  }
-
-  /**
-   * The "open with" menu entries: the pinned targets as DIRECT rows, then
-   * the parent row with every target as a nested submenu. Both only render
-   * when the caller wired the feature and at least one target is visible.
-   */
-  const openWithEntries = (): MenuEntry[] => {
-    if (openWithTargets === undefined || onOpenWith === undefined || openWithTargets.length === 0) return []
-    const pinnedIds = openWithPinned ?? []
-    /** Brand marks for the built-ins (monochrome silhouettes, currentColor);
-     *  reveal gets the folder glyph, custom editors a generic code mark.
-     *  The compact menu's icon slot is 14px, so every mark renders at 14. */
-    const itemIcon = (target: OpenWithTarget): ReactNode => {
-      if (target.kind === 'reveal') return <VscFolderOpened size={14} />
-      if (target.id === 'vscode') return <IconVscode16 size={14} />
-      if (target.id === 'cursor') return <SiCursor size={14} />
-      if (target.id === 'zed') return <SiZedindustries size={14} />
-      return <IconCodeOutlineRegular size={14} />
-    }
-    const pinned = openWithTargets
-      .filter(target => pinnedIds.includes(target.id))
-      .map<MenuItem>(target => ({
-        id: `open-with:${target.id}`,
-        label: openWithLabelOf(target),
-        icon: itemIcon(target),
-      }))
-    const submenu = openWithTargets.map<MenuItem>(target => {
-      const pinnedNow = pinnedIds.includes(target.id)
-      return {
-        id: `open-with:${target.id}`,
-        label: (
-          <span className={css.openWithLabel}>
-            <span className={css.openWithName}>{openWithLabelOf(target)}</span>
-            {/* The pushpin: a span (never a button — the Menu row itself is
-                a button, so a nested interactive element would be invalid).
-                Clicking it pins/unpins the target at the menu's top level
-                WITHOUT selecting the row: the pin stops propagation, so the
-                menu stays open and the icon flips on the next render. */}
-            <span
-              role="button"
-              tabIndex={-1}
-              className={clsx(css.openWithPin, pinnedNow && css.openWithPinActive)}
-              aria-label={pinnedNow ? t('unpinOpenWith') : t('pinOpenWith')}
-              title={pinnedNow ? t('unpinOpenWith') : t('pinOpenWith')}
-              onClick={(event) => {
-                event.preventDefault()
-                event.stopPropagation()
-                onToggleOpenWithPin?.(target.id)
-              }}
-            >
-              {pinnedNow ? <VscPinned size={12} /> : <VscPin size={12} />}
-            </span>
-          </span>
-        ),
-        icon: itemIcon(target),
-      }
-    })
-    return [
-      ...pinned,
-      ...(pinned.length > 0 ? [{ id: 'open-with-sep', type: 'separator' } as MenuEntry] : []),
-      {
-        id: 'open-with-menu',
-        // The primitives Menu renders no chevron for submenu parents — the
-        // trailing arrow is supplied inside the label (full-width flex row,
-        // right-aligned), matching how the submenu rows right-align the pin.
-        label: (
-          <span className={css.openWithLabel}>
-            <span className={css.openWithName}>{t('openWithMenu')}</span>
-            <IconChevronRightOutlineRegular size={14} className={css.openWithChevron} aria-hidden />
-          </span>
-        ),
-        icon: <VscLinkExternal size={14} />,
-        submenu,
-      },
-    ]
-  }
-
   const root = cwd
 
   // Membership is tested per rendered row (deep trees run this thousands of
@@ -565,9 +1012,31 @@ export function FileTree(props: {
   // O(rows × expanded). One Set per render keeps it O(1) per row.
   const expandedSet = useMemo(() => new Set(expanded), [expanded])
   const revealedSet = useMemo(() => new Set(revealed), [revealed])
+  expandedSetRef.current = expandedSet
+
+  /** The tree's shared git status (the changes page reads the same snapshot);
+   *  a parked tab unsubscribes from the poll. */
+  const gitStatus = useGitStatus({ sessionId, cwd }, { visible: visible !== false })
+
+  // The Shift range walks the rows the user can actually see: depth-first,
+  // expanded state decides. Recomputed with the level cache, never rendered.
+  const visibleRows = useMemo(() => {
+    const rows: { path: string; isDir: boolean }[] = []
+    const walk = (dir: string): void => {
+      const level = data[dir]
+      if (level?.entries === undefined) return
+      for (const entry of level.entries) {
+        rows.push({ path: entry.path, isDir: entry.isDir })
+        if (entry.isDir && expandedSet.has(entry.path)) walk(entry.path)
+      }
+    }
+    if (root !== undefined) walk(root)
+    return rows
+  }, [data, expandedSet, root])
+  visibleRowsRef.current = visibleRows
 
   /**
-   * Focus + select the rename editor once, on mount. The callback identity
+   * Focus + select an inline editor once, on mount. The callback identity
    * must stay STABLE (useCallback []): an inline arrow re-runs on every
    * render (detach null → attach el), and focus()/select() mid-keystroke
    * would reselect the whole buffer while typing. A plain <input>, not the
@@ -593,7 +1062,7 @@ export function FileTree(props: {
     >
       {entry.isDir
         ? dirRowIcon(entry.path, expandedSet.has(entry.path))
-        : fileRowIcon(entry.path)}
+        : service !== undefined ? service.fileIcon(entry.path, 14) : builtinFileIcon(entry.path, 14)}
       <input
         ref={renameInputRef}
         className={css.explorerRenameInput}
@@ -618,139 +1087,181 @@ export function FileTree(props: {
     </div>
   )
 
+  /** The inline new-folder editor at the top of one level: the same
+   *  interaction contract as the rename editor (Enter commits, Escape
+   *  cancels, blur commits, IME guarded). */
+  const renderNewFolderRow = (dir: string, depth: number): ReactNode => (
+    <div className={clsx(css.explorerRow, css.explorerRenaming)} style={{ paddingLeft: depth * 22 + 6 }}>
+      {dirRowIcon(dir, true)}
+      <input
+        ref={renameInputRef}
+        className={css.explorerRenameInput}
+        value={newFolder?.value ?? ''}
+        placeholder={t('newFolderPlaceholder')}
+        aria-label={t('newFolder')}
+        spellCheck={false}
+        onChange={(event) => {
+          setNewFolder(prev => prev === null ? prev : { ...prev, value: event.target.value })
+        }}
+        onKeyDown={(event) => {
+          if (isImeComposition(event)) return
+          if (event.key === 'Enter') {
+            event.preventDefault()
+            commitNewFolder(dir, newFolder?.value ?? '')
+          } else if (event.key === 'Escape') {
+            event.preventDefault()
+            cancelNewFolder()
+          }
+        }}
+        onBlur={() => { commitNewFolder(dir, newFolder?.value ?? '') }}
+      />
+    </div>
+  )
+
   const renderLevel = (dir: string, depth: number): ReactNode => {
     const level = data[dir]
+    const head = newFolder?.dir === dir ? renderNewFolderRow(dir, depth) : null
     if (level === undefined) {
-      return <div className={css.explorerRow} style={{ paddingLeft: depth * 22 + 6 }}>{t('loading')}</div>
+      return (
+        <>
+          {head}
+          <div className={css.explorerRow} style={{ paddingLeft: depth * 22 + 6 }}>{t('loading')}</div>
+        </>
+      )
     }
     if (level.error !== undefined) {
       // The fence refusal becomes the friendly notice (reason + one-click
       // global off + immediate retry of this directory), never the raw
       // `path "..." is outside workspace` wire text.
-      if (isOutsideWorkspaceMessage(level.error)) {
-        return (
-          <div style={{ paddingLeft: depth * 22 + 6 }}>
-            <FenceErrorNotice store={store} onDisabled={() => { retryDir(dir) }} />
-          </div>
-        )
-      }
       return (
-        <div className={clsx(css.explorerRow, css.explorerError)} style={{ paddingLeft: depth * 22 + 6 }}>
-          {level.error}
-        </div>
+        <>
+          {head}
+          {isOutsideWorkspaceMessage(level.error)
+            ? (
+              <div style={{ paddingLeft: depth * 22 + 6 }}>
+                <FenceErrorNotice store={store} onDisabled={() => { retryDir(dir) }} />
+              </div>
+            )
+            : (
+              <div className={clsx(css.explorerRow, css.explorerError)} style={{ paddingLeft: depth * 22 + 6 }}>
+                {level.error}
+              </div>
+            )}
+        </>
       )
     }
     const entries = level.entries ?? []
-    return entries.map(entry => {
-      // The row being renamed renders as its editor (no button semantics:
-      // an editor is not a click target — and a nested interactive inside
-      // role="button" would be invalid anyway).
-      if (renaming?.path === entry.path) return renderRenameRow(entry, depth)
-      if (entry.isDir) {
-        const isOpen = expandedSet.has(entry.path)
-        return (
-          <div key={entry.path}>
-            <div
-              role="button"
-              tabIndex={0}
-              className={clsx(
-                css.explorerRow, css.explorerDir, entry.hidden && css.explorerHidden,
-                dropTarget === entry.path && css.explorerRowDropTarget,
-                revealedSet.has(entry.path) && css.explorerRowRevealed,
-              )}
-              data-dsh-revealed={revealedSet.has(entry.path) ? 'true' : undefined}
-              style={{ paddingLeft: depth * 22 + 6 }}
-              onClick={() => { onToggle(entry.path) }}
-              onKeyDown={(event) => {
-                if (event.key === 'Enter' || event.key === ' ') {
-                  event.preventDefault()
-                  onToggle(entry.path)
-                }
-              }}
-              onDragOver={(event) => { handleRowDragOver(event, entry.path) }}
-              onDrop={(event) => { handleDirDrop(event, entry.path) }}
-              onContextMenu={(event) => { openRowMenu(event, entry.path, true) }}
-            >
-              {dirRowIcon(entry.path, isOpen)}
-              <span className={css.explorerName}>{entry.name}</span>
-              {entry.isSymlink && <IconLinkOutlineRegular size={12} className={css.explorerSymlink} />}
-              {rowActions(entry)}
-            </div>
-            {isOpen && renderLevel(entry.path, depth + 1)}
-          </div>
-        )
-      }
-      return (
-        <div
-          key={entry.path}
-          role="button"
-          tabIndex={0}
-          className={clsx(
-            css.explorerRow, entry.hidden && css.explorerHidden, entry.broken && css.explorerBroken,
-            dropTarget === parentOf(entry.path) && css.explorerRowDropTarget,
-            revealedSet.has(entry.path) && css.explorerRowRevealed,
-          )}
-          data-dsh-revealed={revealedSet.has(entry.path) ? 'true' : undefined}
-          style={{ paddingLeft: depth * 22 + 6 }}
-          title={entry.broken ? `${entry.path} — ${t('brokenSymlink')}` : entry.path}
-          onClick={() => { onOpenFile(entry.path) }}
-          onKeyDown={(event) => {
-            if (event.key === 'Enter' || event.key === ' ') {
-              event.preventDefault()
-              onOpenFile(entry.path)
-            }
-          }}
-          onDragOver={(event) => { handleRowDragOver(event, parentOf(entry.path)) }}
-          onDrop={(event) => { handleFileDrop(event, entry.path) }}
-          onContextMenu={(event) => { openRowMenu(event, entry.path, false) }}
-        >
-          {fileRowIcon(entry.path)}
-          <span className={css.explorerName}>{entry.name}</span>
-          {entry.isSymlink && <IconLinkOutlineRegular size={12} className={css.explorerSymlink} />}
-          {rowActions(entry)}
-        </div>
-      )
-    })
+    return (
+      <>
+        {head}
+        {entries.map((entry) => {
+          // The row being renamed renders as its editor (no button semantics:
+          // an editor is not a click target — and a nested interactive inside
+          // role="button" would be invalid anyway).
+          if (renaming?.path === entry.path) return renderRenameRow(entry, depth)
+          if (entry.isDir) {
+            const isOpen = expandedSet.has(entry.path)
+            return (
+              <div key={entry.path}>
+                <DirRow
+                  entry={entry}
+                  depth={depth}
+                  expanded={isOpen}
+                  iconsVersion={iconsVersion}
+                  service={service}
+                  selected={selected.has(entry.path)}
+                  revealed={revealedSet.has(entry.path)}
+                  dropTarget={dropTarget === entry.path}
+                  gitChanged={gitStatus.dirHasChanges(entry.path)}
+                  copied={copiedPath === entry.path}
+                  actions={actions}
+                />
+                {isOpen && renderLevel(entry.path, depth + 1)}
+              </div>
+            )
+          }
+          return (
+            <FileRow
+              key={entry.path}
+              entry={entry}
+              depth={depth}
+              iconsVersion={iconsVersion}
+              service={service}
+              selected={selected.has(entry.path)}
+              revealed={revealedSet.has(entry.path)}
+              dropTarget={dropTarget === parentOf(entry.path)}
+              git={gitStatus.statusOf(entry.path)}
+              copied={copiedPath === entry.path}
+              actions={actions}
+            />
+          )
+        })}
+        {/* The host capped this directory's listing: say so instead of
+            silently showing a partial tree. */}
+        {level.truncated === true && <Notice kind="hint">{t('filesTruncated')}</Notice>}
+      </>
+    )
   }
 
   return (
     <div
       ref={bodyRef}
-      className={css.explorerBody}
+      className={clsx(css.explorerBody, hidden === true && css.explorerHiddenPane)}
+      hidden={hidden}
       onDragEnter={handleBodyDragEnter}
       onDragOver={handleBodyDragOver}
       onDragLeave={handleBodyDragLeave}
       onDrop={handleBodyDrop}
+      onClick={(event) => {
+        // A click on the body itself (below the last row) drops the selection.
+        if (event.target === event.currentTarget) clearSelection()
+      }}
+      onKeyDown={(event) => {
+        if (event.key === 'Escape') clearSelection()
+      }}
     >
       {root === undefined ? (
         <div className={css.explorerEmpty}>{t('noSession')}</div>
       ) : (
         <>
-          {/* The last mutation failure (rename/delete): dismissable, raw
-              server text — the same show-the-truth policy the fence notice
-              uses. Any later action or a fresh attempt clears it. */}
+          {/* The last mutation failure (rename/delete/mkdir/open-in-app):
+              dismissable, raw server text — the same show-the-truth policy the
+              fence notice uses. Any later action or a fresh attempt clears it. */}
           {actionError !== null && (
             <div className={css.explorerActionError} role="alert">
               <span className={css.explorerActionErrorText}>{actionError}</span>
-              <button
-                type="button"
-                className={css.explorerActionErrorClose}
-                aria-label={t('dismiss')}
+              <IconButton
+                size="sm"
+                label={t('dismiss')}
+                icon={<IconCloseFillRegular size={14} />}
                 onClick={() => { setActionError(null) }}
-              >
-                <IconCloseFillRegular size={14} />
-              </button>
+              />
             </div>
           )}
+          {selected.size > 0 && (
+            <SectionHeader
+              className={css.explorerSelectionBar}
+              label={t('filesSelected', { count: selected.size })}
+              action={(
+                <span className={css.explorerSelectionActions}>
+                  <Chip onClick={copySelectedPaths}>{t('copyPaths')}</Chip>
+                  <Chip onClick={() => { setConfirmDeleteSelected(true) }}>{t('deleteSelected')}</Chip>
+                  <Chip onClick={clearSelection}>{t('clearSelection')}</Chip>
+                </span>
+              )}
+            />
+          )}
           <div
             className={clsx(css.explorerRow, dropTarget === root && css.explorerRowDropTarget)}
             style={{ paddingLeft: 6 }}
             onDragOver={(event) => { handleRowDragOver(event, root) }}
             onDrop={(event) => { handleDirDrop(event, root) }}
-            onContextMenu={(event) => { openRowMenu(event, root, true) }}
+            onContextMenu={(event) => { handleContextMenu(event, root, true) }}
           >
             {dirRowIcon(root, true)}
-            <span className={css.explorerName}>{baseName(root)}</span>
+            <span className={clsx(css.explorerName, gitStatus.dirHasChanges(root) && css.explorerDirChanged)}>
+              {baseName(root)}
+            </span>
             {copiedPath === root
               ? <span className={css.explorerCopied}>{t('copied')}</span>
               : (
@@ -768,25 +1279,25 @@ export function FileTree(props: {
                 </button>
               )}
           </div>
-          {data[root] !== undefined && renderLevel(root, 1)}
+          {renderLevel(root, 1)}
         </>
       )}
       {dropOver && dropRect !== null && createPortal(
         /*
-         * The sidebar's drop surface, portaled to document.body at z-1001 —
+         * The sidebar's drop surface, portaled to document.body at z-1001+ —
          * above DSH's own whole-page drop mask (z-1000, see InputBar's
-         * document-level intake) so the two never compete. It dims the WHOLE
-         * viewport (the giant box-shadow spread on the zone frame is the
-         * mask; the zone rect itself stays clear), teaching the zone split:
-         * the dimmed conversation column still takes drops into the chat
-         * natively (this layer is pointer-inert), while the clear frame
-         * marks the tree as the workspace-upload zone. Deliberate exception
-         * to the "panel stays below the DSH float stack" rule: transient,
-         * and the drop always lands on the element beneath. The hint pill
-         * docks at the TOP edge of the zone — right under the search row,
-         * the first thing the eye meets — keeping the rows aimable.
+         * document-level intake) so the two never compete. A LIGHT mask dims
+         * the viewport: the dimmed conversation column still takes drops into
+         * the chat natively (this layer is pointer-inert), while the dashed
+         * frame marks the tree as the workspace-upload zone. Deliberate
+         * exception to the "panel stays below the DSH float stack" rule:
+         * transient, and the drop always lands on the element beneath. The
+         * hint pill docks at the TOP edge of the zone — right under the
+         * search row, the first thing the eye meets — keeping the rows
+         * aimable.
          */
         <>
+          <div className={css.uploadDropMask} />
           <div
             className={css.uploadDropZone}
             style={{
@@ -844,9 +1355,9 @@ export function FileTree(props: {
             ? [{ id: 'open-new-tab', label: t('openFileNewTab'), icon: <IconCodeOutlineRegular size={14} /> }]
             : []),
           ...(rowMenu?.isDir === false && onOpenFileSide !== undefined
-            ? [{ id: 'open-side', label: t('openFileSide'), icon: <VscFolderOpened size={14} /> }]
+            ? [{ id: 'open-side', label: t('openFileSide'), icon: <IconFolderOpenRegular size={14} /> }]
             : []),
-          ...openWithEntries(),
+          ...(rowMenu === null ? [] : openInAppEntries(rowMenu)),
           // Download applies to files only (the host route refuses directories).
           ...(rowMenu?.isDir === false
             ? [{ id: 'download', label: t('download'), icon: <IconDownloadOutlineRegular size={14} /> }]
@@ -855,6 +1366,10 @@ export function FileTree(props: {
           ...(rowMenu?.isDir === true
             ? [{ id: 'upload-here', label: t('uploadHere'), icon: <IconUploadOutline16 size={14} /> }]
             : []),
+          // New folder into a directory (incl. the workspace root row).
+          ...(rowMenu?.isDir === true
+            ? [{ id: 'new-folder', label: t('newFolder'), icon: <IconPlusOutlineRegular size={14} /> }]
+            : []),
           { id: 'relative', label: t('copyRelative'), icon: <IconCopyOutlineRegular size={14} /> },
           { id: 'absolute', label: t('copyAbsolute'), icon: <IconCopyOutlineRegular size={14} /> },
           // Explorer mutations close the menu; the workspace ROOT row is the
@@ -879,8 +1394,16 @@ export function FileTree(props: {
             onOpenFileSide?.(target.path)
             return
           }
-          if (id.startsWith('open-with:')) {
-            onOpenWith?.(id.slice('open-with:'.length), target.path)
+          if (id === 'open-in-app:default') {
+            openWithApp(target.path)
+            return
+          }
+          if (id.startsWith('open-in-app:')) {
+            openWithApp(target.path, id.slice('open-in-app:'.length))
+            return
+          }
+          if (id === 'reveal-in-file-manager') {
+            revealPath(target.path)
             return
           }
           if (id === 'download') {
@@ -892,6 +1415,10 @@ export function FileTree(props: {
             fileInputRef.current?.click()
             return
           }
+          if (id === 'new-folder') {
+            startNewFolder(target.path)
+            return
+          }
           if (id === 'rename') {
             setRenaming({ path: target.path, value: baseName(target.path) })
             return
@@ -912,35 +1439,38 @@ export function FileTree(props: {
         anchor={<span />}
       />
 
-      {/* The delete confirmation: destructive and permanent (no host trash),
-          so it always lands here first — the same Cancel/Confirm shape the
-          git lens uses for discard/revert/cherry-pick. */}
-      <Modal
+      {/* The single-row delete confirmation: destructive and permanent (no host
+          trash), so it always lands here first — the shared kit dialog, the
+          same shape the git lens uses for discard/revert/cherry-pick. */}
+      <ConfirmDialog
         open={confirmDelete !== null}
-        onClose={() => { setConfirmDelete(null) }}
         title={confirmDelete === null ? '' : t('deleteTitle', { name: confirmDelete.name })}
-        closeLabel={t('cancel')}
-        footer={(
-          <>
-            <Button variant="outline" onClick={() => { setConfirmDelete(null) }}>{t('cancel')}</Button>
-            <Button
-              variant="primary"
-              onClick={() => {
-                const pending = confirmDelete
-                if (pending === null) return
-                setConfirmDelete(null)
-                performDelete(pending)
-              }}
-            >
-              {t('delete')}
-            </Button>
-          </>
-        )}
-      >
-        <p className={css.explorerConfirmDesc}>
-          {confirmDelete === null ? '' : t(confirmDelete.isDir ? 'deleteDescDir' : 'deleteDescFile')}
-        </p>
-      </Modal>
+        description={confirmDelete === null ? '' : t(confirmDelete.isDir ? 'deleteDescDir' : 'deleteDescFile')}
+        confirmLabel={t('delete')}
+        cancelLabel={t('cancel')}
+        danger
+        onConfirm={() => {
+          const pending = confirmDelete
+          if (pending === null) return
+          setConfirmDelete(null)
+          performDelete(pending)
+        }}
+        onClose={() => { setConfirmDelete(null) }}
+      />
+
+      {/* The batch delete: one confirmation for the whole selection, then one
+          sequential fs.remove per row (the first failure stops the walk). */}
+      <ConfirmDialog
+        open={confirmDeleteSelected}
+        title={t('deleteSelectedTitle', { count: selected.size })}
+        description={t('deleteSelectedDesc')}
+        confirmLabel={t('deleteSelected')}
+        cancelLabel={t('cancel')}
+        danger
+        busy={deletingSelected}
+        onConfirm={performBatchDelete}
+        onClose={() => { setConfirmDeleteSelected(false) }}
+      />
     </div>
   )
 }
diff --git a/src/client/TreePanel.tsx b/src/client/TreePanel.tsx
index 5c888cb..5d0e278 100644
--- a/src/client/TreePanel.tsx
+++ b/src/client/TreePanel.tsx
@@ -1,11 +1,14 @@
 /**
  * The files window's tree surface: a global file-name search box on top
  * (300ms debounce; an in-flight search is aborted by the next keystroke)
- * over either the shared controlled FileTree (empty query) or the flat
- * result list (relative paths; click opens through the caller's mode-aware
- * open). Owns its refresh tick: the icon next to the search input clears
- * the tree cache. EditorHost docks it as the tab's right panel (wrapped in
- * a drag-resize handle) and provides the file context-menu open escapes.
+ * over the shared controlled FileTree. The results panel and the tree are
+ * BOTH mounted: the query only parks one of them (`hidden`), so clearing the
+ * search is free — the tree keeps its level cache and the live directory
+ * watcher (the old conditional render dropped both and refetched the whole
+ * visible set on every query change). Owns its refresh tick: the icon next to
+ * the search input clears the tree cache. EditorHost docks it as the tab's
+ * right panel (wrapped in a drag-resize handle) and provides the file
+ * context-menu open escapes.
  *
  * Uploads (header pickers, the tree's drag-drop and "upload here" menu)
  * all funnel through here: one session at a time, shown in a full-window
@@ -23,9 +26,10 @@ import type { BetterSidebarService } from './service.ts'
 import type { SidebarStore } from './state.ts'
 import { FileTree } from './FileTree.tsx'
 import { IconUploadOutline16 } from './icons.tsx'
-import type { OpenWithTarget } from './open-with.ts'
+import type { OpenInApp } from './open-in-app.ts'
 import { t } from './locales.ts'
 import { resolveSidebarPath } from './paths.ts'
+import { IconButton } from './ui/index.ts'
 import { UploadOverlay } from './UploadOverlay.tsx'
 import {
   summarizeResults, uploadHintText, uploadItemsFromFiles, uploadToDir,
@@ -56,25 +60,27 @@ export function TreePanel(props: {
   onOpenFileNewTab?: (path: string) => void
   /** File context-menu "open to the side" (passed through to FileTree). */
   onOpenFileSide?: (path: string) => void
-  /** The "open with" menu surface (passed through to FileTree; absent →
+  /** The host's open-in-app handle (passed through to FileTree; absent →
    *  the whole section is hidden). */
-  openWithTargets?: OpenWithTarget[]
-  openWithPinned?: string[]
-  openWithSsh?: boolean
-  onOpenWith?: (targetId: string, path: string) => void
-  onToggleOpenWithPin?: (targetId: string) => void
+  openInApp?: OpenInApp
   onReferenceFile: (path: string, isDir: boolean) => void
   /** A tree rename landed (passed through to FileTree for tab retargeting). */
   onPathRenamed?: (oldPath: string, newPath: string) => void
   /** A tree delete landed (passed through to FileTree for tab closing). */
   onPathDeleted?: (path: string, isDir: boolean) => void
+  /** Whether the owning tab is on screen: a parked tab stops the tree's git
+   *  polling (the shared status store pauses when nothing visible wants it). */
+  visible?: boolean
   /** Full-window presentation: the panel fills its host instead of docking
    *  at a fixed width. */
   full?: boolean
   /** The sidebar registry service (file-icon registrations; passed through to FileTree). */
   service?: BetterSidebarService
 }) {
-  const { sessionId, cwd, store, expanded, revealed, onToggle, onOpenFile, onOpenFileNewTab, onOpenFileSide, openWithTargets, openWithPinned, openWithSsh, onOpenWith, onToggleOpenWithPin, onReferenceFile, onPathRenamed, onPathDeleted, full, service } = props
+  const {
+    sessionId, cwd, store, expanded, revealed, onToggle, onOpenFile, onOpenFileNewTab, onOpenFileSide,
+    openInApp, onReferenceFile, onPathRenamed, onPathDeleted, visible, full, service,
+  } = props
   const [query, setQuery] = useState('')
   const [results, setResults] = useState<{ matches: string[]; truncated: boolean } | null>(null)
   const [error, setError] = useState<string | null>(null)
@@ -153,6 +159,7 @@ export function TreePanel(props: {
   const folderInputProps = { webkitdirectory: '' } as InputHTMLAttributes<HTMLInputElement>
 
   const needle = query.trim()
+  const searching = needle !== ''
   useEffect(() => {
     if (needle === '') {
       setResults(null)
@@ -188,35 +195,23 @@ export function TreePanel(props: {
           spellCheck={false}
           onChange={(event) => { setQuery(event.target.value) }}
         />
-        <button
-          type="button"
-          className={css.iconButton}
-          aria-label={t('refresh')}
-          title={t('refresh')}
+        <IconButton
+          label={t('refresh')}
+          icon={<IconRefreshOutlineRegular size={14} />}
           onClick={() => { setRefreshTick(tick => tick + 1) }}
-        >
-          <IconRefreshOutlineRegular size={14} />
-        </button>
-        <button
-          type="button"
-          className={css.iconButton}
-          aria-label={t('uploadFiles')}
-          title={t('uploadFiles')}
+        />
+        <IconButton
+          label={t('uploadFiles')}
+          icon={<IconUploadOutline16 size={14} />}
           disabled={busy}
           onClick={() => { fileInputRef.current?.click() }}
-        >
-          <IconUploadOutline16 size={14} />
-        </button>
-        <button
-          type="button"
-          className={css.iconButton}
-          aria-label={t('uploadFolder')}
-          title={t('uploadFolder')}
+        />
+        <IconButton
+          label={t('uploadFolder')}
+          icon={<IconFolderOpenRegular size={14} />}
           disabled={busy}
           onClick={() => { folderInputRef.current?.click() }}
-        >
-          <IconFolderOpenRegular size={14} />
-        </button>
+        />
         <input
           ref={fileInputRef}
           type="file"
@@ -242,53 +237,60 @@ export function TreePanel(props: {
       {uploadStatus !== '' && (
         <div className={clsx(css.editorSearchHint, uploadFailed && css.editorError)} title={uploadStatus}>{uploadStatus}</div>
       )}
-      {needle === '' ? (
-        <FileTree
-          sessionId={sessionId}
-          cwd={cwd}
-          store={store}
-          expanded={expanded}
-          revealed={revealed}
-          onToggle={onToggle}
-          onOpenFile={onOpenFile}
-          onOpenFileNewTab={onOpenFileNewTab}
-          onOpenFileSide={onOpenFileSide}
-          openWithTargets={openWithTargets}
-          openWithPinned={openWithPinned}
-          openWithSsh={openWithSsh}
-          onOpenWith={onOpenWith}
-          onToggleOpenWithPin={onToggleOpenWithPin}
-          onReferenceFile={onReferenceFile}
-          onPathRenamed={onPathRenamed}
-          onPathDeleted={onPathDeleted}
-          refreshTick={refreshTick}
-          onUploadRequest={startUpload}
-          busy={busy}
-          service={service}
-        />
-      ) : (
-        <div className={css.explorerBody}>
-          {error !== null && <div className={clsx(css.editorSearchHint, css.editorError)}>{error}</div>}
-          {error === null && results === null && <div className={css.editorSearchHint}>{t('loading')}</div>}
-          {error === null && results !== null && results.matches.length === 0 && (
-            <div className={css.editorSearchHint}>{t('editorSearchNoResults')}</div>
-          )}
-          {error === null && results !== null && results.matches.map(rel => (
-            <button
-              key={rel}
-              type="button"
-              className={css.editorSearchResult}
-              title={rel}
-              onClick={() => { onOpenFile(resolveSidebarPath(cwd, rel)) }}
-            >
-              {rel}
-            </button>
-          ))}
-          {error === null && results?.truncated === true && (
-            <div className={css.editorSearchHint}>{t('editorSearchTruncated')}</div>
-          )}
-        </div>
-      )}
+      {/* Search results: parked (not unmounted) while the query is empty. Its
+          contents render only for a live query — a parked panel must not put
+          state text (the loading line) into the panel's DOM. */}
+      <div
+        className={clsx(css.explorerBody, !searching && css.explorerHiddenPane)}
+        hidden={!searching}
+      >
+        {searching && (
+          <>
+            {error !== null && <div className={clsx(css.editorSearchHint, css.editorError)}>{error}</div>}
+            {error === null && results === null && <div className={css.editorSearchHint}>{t('loading')}</div>}
+            {error === null && results !== null && results.matches.length === 0 && (
+              <div className={css.editorSearchHint}>{t('editorSearchNoResults')}</div>
+            )}
+            {error === null && results !== null && results.matches.map(rel => (
+              <button
+                key={rel}
+                type="button"
+                className={css.editorSearchResult}
+                title={rel}
+                onClick={() => { onOpenFile(resolveSidebarPath(cwd, rel)) }}
+              >
+                {rel}
+              </button>
+            ))}
+            {error === null && results?.truncated === true && (
+              <div className={css.editorSearchHint}>{t('editorSearchTruncated')}</div>
+            )}
+          </>
+        )}
+      </div>
+      {/* The tree stays MOUNTED while searching: its level cache and the
+          directory watcher survive a query, so clearing the box is free. */}
+      <FileTree
+        sessionId={sessionId}
+        cwd={cwd}
+        store={store}
+        expanded={expanded}
+        revealed={revealed}
+        onToggle={onToggle}
+        onOpenFile={onOpenFile}
+        onOpenFileNewTab={onOpenFileNewTab}
+        onOpenFileSide={onOpenFileSide}
+        openInApp={openInApp}
+        onReferenceFile={onReferenceFile}
+        onPathRenamed={onPathRenamed}
+        onPathDeleted={onPathDeleted}
+        refreshTick={refreshTick}
+        onUploadRequest={startUpload}
+        busy={busy}
+        hidden={searching}
+        visible={visible !== false}
+        service={service}
+      />
       {upload !== null && (
         <UploadOverlay
           dir={upload.dir}
diff --git a/src/client/UploadOverlay.tsx b/src/client/UploadOverlay.tsx
index d6c0122..fd7bd12 100644
--- a/src/client/UploadOverlay.tsx
+++ b/src/client/UploadOverlay.tsx
@@ -39,7 +39,7 @@ export function UploadOverlay(props: {
     <div className={css.uploadOverlay} role="dialog" aria-modal="true" aria-label={t('uploadingTo', { dir })}>
       <div className={css.uploadOverlayCard}>
         <div className={css.uploadOverlayTitle} title={dir}>
-          <IconUploadOutline16 size={16} />
+          <IconUploadOutline16 size={14} />
           <span>{t('uploadingTo', { dir })}</span>
         </div>
         <div
diff --git a/src/client/api.ts b/src/client/api.ts
index b15607f..ad7394c 100644
--- a/src/client/api.ts
+++ b/src/client/api.ts
@@ -239,51 +239,6 @@ function gitPayload(scope: SessionScope, worktree: string | undefined, extra: Re
   return scopePayload(scope, { ...(worktree !== undefined && worktree !== '' ? { worktree } : {}), ...extra })
 }
 
-/** One external-open request from the file tree. */
-type OpenExternalPayload =
-  | { action: 'reveal'; path: string }
-  | { action: 'url'; url: string }
-
-/** The host route's success shape. */
-type OpenExternalResult = { started: boolean }
-
-/**
- * Remote VSCode-family URLs must be consumed on the browser/client machine:
- * the DSH host can be a headless remote server with no editor or DISPLAY.
- * Local editor URLs and reveal actions still belong to the host opener.
- */
-function shouldOpenExternalOnClient(payload: OpenExternalPayload): payload is { action: 'url'; url: string } {
-  if (payload.action !== 'url') return false
-  let parsed: URL
-  try {
-    parsed = new URL(payload.url)
-  } catch {
-    return false
-  }
-  return parsed.protocol !== 'http:'
-    && parsed.protocol !== 'https:'
-    && parsed.hostname === 'vscode-remote'
-    && parsed.pathname.startsWith('/ssh-remote+')
-}
-
-/**
- * Dispatch an external-open request to the correct machine. SSH remote-editor
- * URLs stay in the synchronous user-click chain and navigate the client so
- * its registered vscode:// / cursor:// handler can launch. Everything else
- * keeps using the DSH host route.
- */
-function openExternal(payload: OpenExternalPayload): Promise<OpenExternalResult> {
-  if (!shouldOpenExternalOnClient(payload)) {
-    return call<OpenExternalResult>('open.external', payload)
-  }
-  try {
-    window.location.assign(payload.url)
-    return Promise.resolve({ started: true })
-  } catch (error) {
-    return Promise.reject(error)
-  }
-}
-
 /** The sidebar API surface (session scope threaded through every call). */
 export const api = {
   sessionCwd: (scope: SessionScope, signal?: AbortSignal) =>
@@ -307,6 +262,11 @@ export const api = {
    *  row unlinks the link only). The UI confirms before calling this. */
   fsRemove: (scope: SessionScope, path: string) =>
     call<{ path: string }>('fs.remove', scopePayload(scope, { path })),
+  /** Create one directory row inside `path` (single-segment name; the server
+   *  refuses existing destinations, the workspace root, and — while the fence
+   *  is armed — anything resolving outside the workspace). */
+  fsMkdir: (scope: SessionScope, path: string, name: string) =>
+    call<{ path: string }>('fs.mkdir', scopePayload(scope, { path, name })),
   /** Upload one file's raw bytes into `dir` (keeps the folder tree via
    *  `relativePath`); the host streams it under the session workspace. */
   uploadFile: (scope: SessionScope, dir: string, relativePath: string, body: Blob, signal?: AbortSignal) =>
@@ -417,10 +377,6 @@ export const api = {
       patch,
       ...(expectedRevision !== undefined ? { expectedRevision } : {}),
     }),
-  /** External open for the file tree's "open with" menu. Remote SSH editor
-   *  URLs are launched on the browser/client machine; reveal and local URLs
-   *  keep using the host's platform opener. */
-  openExternal,
 }
 
 /** Absolute URL of the media route for one path (images only). */
diff --git a/src/client/builtins/tabs.tsx b/src/client/builtins/tabs.tsx
index 0222c34..2ea465a 100644
--- a/src/client/builtins/tabs.tsx
+++ b/src/client/builtins/tabs.tsx
@@ -19,7 +19,6 @@ import {
 import { t } from '../locales.ts'
 import { openSidebarFile } from '../sidebar-file.ts'
 import { EditorHost } from '../EditorHost.tsx'
-import { OpenWithSettings } from '../open-with-settings.tsx'
 import { ChangesTab, opCountOf } from '../changes/ChangesTab.tsx'
 import { DiffTab } from '../DiffTab.tsx'
 import { SubagentView } from '../SubagentView.tsx'
@@ -45,9 +44,9 @@ export function builtinTabs(): readonly TabDescriptor[] {
       // vs per-path windows) renders as an iconed select row under the
       // editor card's gear in the Side card settings page, followed by the
       // workspace fence switch (the host's containment guard over every
-      // sidebar filesystem route); the "open with" configuration (SSH host +
-      // custom editors) is the custom panel BELOW those rows — the settings
-      // seam renders rows first, custom panel after.
+      // sidebar filesystem route). The old "open with" configuration panel
+      // (SSH host + custom editors) is gone: external opening is the host's
+      // own open-in-app capability now, with nothing to configure here.
       settings: {
         toggles: [{
           key: 'editorExplorer',
@@ -73,16 +72,14 @@ export function builtinTabs(): readonly TabDescriptor[] {
           title: () => t('settingsFenceTitle'),
           desc: () => t('settingsFenceDesc'),
         }],
-        render: ({ pluginSettings, updatePluginSetting }) => (
-          <OpenWithSettings pluginSettings={pluginSettings} updatePluginSetting={updatePluginSetting} />
-        ),
       },
-      component: ({ ctx, store, scope, tab, expanded, revealed, onToggleDir, onReferenceFile }) => (
+      component: ({ ctx, store, scope, tab, visible, expanded, revealed, onToggleDir, onReferenceFile }) => (
         <EditorHost
           ctx={ctx}
           store={store}
           scope={scope}
           tab={tab}
+          visible={visible}
           expanded={expanded ?? []}
           revealed={revealed ?? []}
           onToggleDir={onToggleDir ?? (() => { /* no-op */ })}
diff --git a/src/client/changes/ChangesTab.tsx b/src/client/changes/ChangesTab.tsx
index a18cacb..6bb888d 100644
--- a/src/client/changes/ChangesTab.tsx
+++ b/src/client/changes/ChangesTab.tsx
@@ -2,27 +2,33 @@
  * The unified changes tab: one tab, two lenses on "what changed?" — Git
  * (repository truth: staged/unstaged files, commit box, history) and the
  * session round (agent truth: every file the model read, wrote, or edited).
- * Both lenses preview their selections in a shared resizable bottom pane
- * ({@link DiffPane}); git targets expand into the dedicated diff tab docked
- * in the workbench's diff pane. The active lens and the pane height persist
- * in the tab's meta, so the tab
- * reopens exactly where it was left.
+ * A 36px header carries the host {@link SegmentedControl} and the current
+ * lens's refresh action; both lenses preview their selections in a shared
+ * resizable bottom pane ({@link DiffPane}), and git targets expand into the
+ * dedicated diff tab docked in the workbench's diff pane. The active lens and
+ * the pane height persist in the tab's meta, so the tab reopens exactly where
+ * it was left.
  *
- * The session events ride the host's `changes.ops` route (the client
- * runtime exposes no event-log face): the tab pulls the delta past its
- * cursor while visible, folds it into ops, and publishes the op count to a
- * module-level cache the tab-strip badge reads.
+ * The session events ride the host's `changes.ops` route (the client runtime
+ * exposes no event-log face): the tab pulls the delta past its cursor and
+ * folds it into ops, and publishes the op count to a module-level cache the
+ * tab-strip badge reads. The pull is one catch-up whenever the tab becomes
+ * visible and then a cadence ONLY while the session lens is on screen — the
+ * git lens has no use for the session event log (and the shared git-status
+ * store owns its own poller).
  */
-import { useCallback, useEffect, useRef, useState } from 'react'
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
+import { IconRefreshOutlineRegular, SegmentedControl } from '@deepseek-ai/dsh-client-ui-primitives'
 import type { SidebarSessionEvent } from '../../context-types.ts'
 import type { TabComponentProps } from '../service.ts'
 import { t } from '../locales.ts'
 import { api } from '../api.ts'
 import { usePolling } from '../use-polling.ts'
 import type { SidebarDiffRef } from '../state.ts'
+import { IconButton, Notice } from '../ui/index.ts'
 import { GitLens } from './GitLens.tsx'
 import { SessionLens } from './SessionLens.tsx'
-import { DiffPane, diffTabOf, type ChangesPreview } from './DiffPane.tsx'
+import { DiffPane, clampPaneHeight, diffTabOf, type ChangesPreview } from './DiffPane.tsx'
 import { extractFileOps, knownContentBefore, type FileOp } from './ops.ts'
 import css from './changes.module.css'
 
@@ -51,18 +57,28 @@ interface ChangesMeta {
   previewH?: number
 }
 
+/** What the user selected to preview: a git ref, or the IDENTITY of a session
+ *  op. Holding the callId (not the op object) is what makes the pane follow
+ *  the op as it settles: every render re-derives the op from the latest fold,
+ *  so a running call turns into its result without the user re-clicking. */
+type PreviewSelection =
+  | { kind: 'git'; ref: SidebarDiffRef }
+  | { kind: 'op'; path: string; callId: string }
+
 export function ChangesTab({ ctx, store, scope, tab, visible, onOpenFile, onOpenDiff }: TabComponentProps) {
   const meta = (tab.meta ?? {}) as ChangesMeta
   const [lens, setLens] = useState<Lens>(meta.lens === 'session' ? 'session' : 'git')
-  const [preview, setPreview] = useState<ChangesPreview | null>(null)
-  const [paneHeight, setPaneHeight] = useState<number>(
-    typeof meta.previewH === 'number' && meta.previewH >= 140 ? meta.previewH : PANE_HEIGHT_DEFAULT,
-  )
+  const [selection, setSelection] = useState<PreviewSelection | null>(null)
+  const [paneHeight, setPaneHeight] = useState<number>(() => clampPaneHeight(
+    typeof meta.previewH === 'number' ? meta.previewH : PANE_HEIGHT_DEFAULT,
+  ))
+  /** The header refresh action for the Git lens (the lens owns its own queue). */
+  const [gitRefresh, setGitRefresh] = useState(0)
 
-  // ── Session-event accumulation: one pull on mount, then a 2.5s delta
-  //    poll while visible (paused otherwise; the next visible tick catches
-  //    up). The cursor is the last delivered seq, so each poll ships only
-  //    what the accumulator lacks. ────────────────────────────────────────
+  // ── Session-event accumulation: one catch-up pull when the tab becomes
+  //    visible, then a 2.5s delta poll while the SESSION lens is on screen.
+  //    The cursor is the last delivered seq, so each poll ships only what the
+  //    accumulator lacks. ───────────────────────────────────────────────────
   const eventsRef = useRef<readonly SidebarSessionEvent[]>([])
   // The fold of eventsRef as of the last poll. extractFileOps parses every
   // accumulated tool/call (up to EVENTS_CAP events); running it once per
@@ -72,13 +88,30 @@ export function ChangesTab({ ctx, store, scope, tab, visible, onOpenFile, onOpen
   const opsRef = useRef<readonly FileOp[]>([])
   const seqRef = useRef(0)
   const pollGen = useRef(0)
+  /** One delta request in flight at a time (the poller is fixed-interval, so a
+   *  slow host would otherwise run two pulls over the same cursor and append
+   *  the same delta twice). A pull that arrives while one is running is a
+   *  no-op: the in-flight answer already carries everything up to now. */
+  const pullingRef = useRef(false)
   const [opsError, setOpsError] = useState(false)
   const [tick, setTick] = useState(0)
-  const pull = useCallback(async (): Promise<void> => {
+  const pull = useCallback(async (signal?: AbortSignal): Promise<void> => {
     const generation = pollGen.current
+    if (pullingRef.current) return
+    pullingRef.current = true
     try {
-      const { events, lastSeq } = await api.changesOps(scope, seqRef.current)
-      if (generation !== pollGen.current) return
+      const { events, lastSeq } = await api.changesOps(scope, seqRef.current, signal)
+      // An aborted poll belongs to a torn-down run: its answer must never
+      // publish state (the transport may deliver it anyway).
+      if (generation !== pollGen.current || signal?.aborted === true) return
+      // Nothing new: KEEP the previous fold's identity. Re-folding an
+      // unchanged window produced a fresh array every 2.5s, which defeated
+      // every downstream memo — the session lens re-encoded each op body into
+      // a Blob to size it, on every idle tick.
+      if (events.length === 0 && lastSeq <= seqRef.current && opsRef.current.length > 0) {
+        setOpsError(false)
+        return
+      }
       if (events.length > 0) {
         const merged = [...eventsRef.current, ...events]
         eventsRef.current = merged.length > EVENTS_CAP ? merged.slice(merged.length - EVENTS_CAP) : merged
@@ -92,7 +125,9 @@ export function ChangesTab({ ctx, store, scope, tab, visible, onOpenFile, onOpen
     } catch {
       // Offline / route unavailable: keep the last fold; surface it inline
       // only while nothing has ever loaded.
-      if (generation === pollGen.current) setOpsError(true)
+      if (generation === pollGen.current && signal?.aborted !== true) setOpsError(true)
+    } finally {
+      pullingRef.current = false
     }
     // Granular scope fields: the scope object's identity churns, only its
     // sessionId / cwd fields gate the poll target.
@@ -105,15 +140,24 @@ export function ChangesTab({ ctx, store, scope, tab, visible, onOpenFile, onOpen
     seqRef.current = 0
     setOpsError(false)
   }, [scope.sessionId])
-  // One pull on every input change — mount, scope change, and visibility
-  // flip all re-pull (a hidden tab still catches up on the flip); only the
-  // poll CADENCE below is gated by visibility.
-  useEffect(() => { void pull() }, [visible, pull])
-  usePolling(visible, pull, { intervalMs: 2_500 })
+  // One catch-up whenever the tab becomes visible (the badge count follows the
+  // tab being opened); the CADENCE below runs only while this lens is showing.
+  useEffect(() => { if (visible) void pull() }, [visible, pull])
+  usePolling(visible && lens === 'session', pull, { intervalMs: 2_500 })
   // tick only forces the re-render; the fold reads the ref directly.
   void tick
   const ops = opsRef.current
 
+  /** The preview target of the current selection, re-derived every render so
+   *  an op that settled (or fell out of the window) is reflected immediately. */
+  const previewTarget = useMemo<ChangesPreview | null>(() => {
+    if (selection === null) return null
+    if (selection.kind === 'git') return selection
+    const op = ops.find(candidate => candidate.callId === selection.callId)
+    if (op === undefined) return null
+    return { kind: 'op', path: selection.path, op, prior: knownContentBefore(ops, selection.path, op) }
+  }, [selection, ops])
+
   /** Persist a meta patch onto the tab (lens choice, pane height). */
   const patchMeta = (patch: ChangesMeta): void => {
     ctx.get('betterSidebar')?.updateTab(tab.id, {
@@ -127,21 +171,29 @@ export function ChangesTab({ ctx, store, scope, tab, visible, onOpenFile, onOpen
     patchMeta({ lens: next })
   }
 
-  /** Preview one git change (worktree file or commit) from the Git lens. */
-  const previewGit = (ref: SidebarDiffRef): void => {
-    setPreview({ kind: 'git', ref })
+  /** The header's refresh action: the Git lens reloads through its own queue
+   *  (a click while a refresh is in flight is queued, not dropped), the
+   *  session lens re-pulls its event delta. */
+  const refreshCurrent = (): void => {
+    if (lens === 'git') setGitRefresh(value => value + 1)
+    else void pull()
   }
 
-  /** Preview one session op (with its best-effort prior content snapshot). */
+  /** Preview one git change (worktree file or commit) from the Git lens. */
+  const previewGit = (ref: SidebarDiffRef): void => {
+    setSelection({ kind: 'git', ref })
+  }
+
+  /** Preview one session op by callId (the tab re-derives it each render). */
   const previewOp = (path: string, op: FileOp): void => {
-    setPreview({ kind: 'op', path, op, prior: knownContentBefore(ops, path, op) })
+    setSelection({ kind: 'op', path, callId: op.callId })
   }
 
   /** Expand the current git preview into the dedicated diff tab, docked
    *  into the workbench's diff pane. */
   const expandPreview = (): void => {
-    if (preview?.kind !== 'git') return
-    onOpenDiff?.(diffTabOf(preview.ref))
+    if (previewTarget?.kind !== 'git') return
+    onOpenDiff?.(diffTabOf(previewTarget.ref))
   }
 
   const previewKey = (target: ChangesPreview): string => target.kind === 'git'
@@ -152,27 +204,23 @@ export function ChangesTab({ ctx, store, scope, tab, visible, onOpenFile, onOpen
 
   return (
     <div className={css.root}>
-      <div className={css.lensBar}>
-        <div className={css.lensSwitch} role="group" aria-label={t('changes')}>
-          <button
-            type="button"
-            className={css.lensButton}
-            data-active={lens === 'git' ? 'true' : undefined}
-            aria-pressed={lens === 'git'}
-            onClick={() => { chooseLens('git') }}
-          >
-            {t('changesGitLens')}
-          </button>
-          <button
-            type="button"
-            className={css.lensButton}
-            data-active={lens === 'session' ? 'true' : undefined}
-            aria-pressed={lens === 'session'}
-            onClick={() => { chooseLens('session') }}
-          >
-            {t('changesSessionLens')}
-          </button>
-        </div>
+      <div className={css.head}>
+        <SegmentedControl
+          id={`changes-lens-${tab.id}`}
+          value={lens}
+          options={[
+            { value: 'git', label: t('changesGitLens') },
+            { value: 'session', label: t('changesSessionLens') },
+          ]}
+          onChange={chooseLens}
+          label={t('changes')}
+        />
+        <IconButton
+          className={css.headAction}
+          icon={<IconRefreshOutlineRegular />}
+          label={t('refresh')}
+          onClick={refreshCurrent}
+        />
       </div>
       {lens === 'git'
         ? (
@@ -180,9 +228,10 @@ export function ChangesTab({ ctx, store, scope, tab, visible, onOpenFile, onOpen
             scope={scope}
             store={store}
             visible={visible}
+            refreshTick={gitRefresh}
             onOpenFile={onOpenFile ?? (() => { /* no-op */ })}
             onPreview={previewGit}
-            selectedRef={preview !== null && preview.kind === 'git' ? preview.ref : null}
+            selectedRef={previewTarget !== null && previewTarget.kind === 'git' ? previewTarget.ref : null}
           />
         )
         : (
@@ -190,20 +239,31 @@ export function ChangesTab({ ctx, store, scope, tab, visible, onOpenFile, onOpen
             ops={ops}
             loadError={opsError && ops.length === 0}
             onPreview={previewOp}
-            selectedCallId={preview !== null && preview.kind === 'op' ? preview.op.callId : null}
+            selectedCallId={selection !== null && selection.kind === 'op' ? selection.callId : null}
           />
         )}
-      {preview !== null && (
+      {previewTarget !== null && (
         <DiffPane
-          key={previewKey(preview)}
-          target={preview}
+          key={previewKey(previewTarget)}
+          target={previewTarget}
           scope={scope}
           height={paneHeight}
           onHeightCommit={(height) => { setPaneHeight(height); patchMeta({ previewH: height }) }}
-          onClose={() => { setPreview(null) }}
+          onClose={() => { setSelection(null) }}
           onExpand={expandPreview}
         />
       )}
+      {selection !== null && selection.kind === 'op' && previewTarget === null && (
+        <div className={css.paneGone}>
+          <Notice kind="warn">{t('changesOpGone')}</Notice>
+          <IconButton
+            size="sm"
+            icon={<IconRefreshOutlineRegular size={14} />}
+            label={t('changesClosePreview')}
+            onClick={() => { setSelection(null) }}
+          />
+        </div>
+      )}
     </div>
   )
 }
diff --git a/src/client/changes/DiffPane.tsx b/src/client/changes/DiffPane.tsx
index a785db3..7eb0c02 100644
--- a/src/client/changes/DiffPane.tsx
+++ b/src/client/changes/DiffPane.tsx
@@ -2,16 +2,16 @@
  * The changes tab's shared bottom preview pane: one selected target — a git
  * worktree change, a commit patch, or a session file op — rendered through
  * the unified diff stack (the same one the diff tab uses). Git targets load
- * on demand (refreshable, with the untracked full-addition fallback); op
- * targets are pure snapshots (diff / read view / error text). The pane is
- * resizable by drag (clamped; the height commits to the tab's persisted
- * meta on release) and by keyboard; git targets can expand into a dedicated
- * diff tab via the shell.
+ * through the shared {@link useGitDiffTarget} hook (refreshable, with the
+ * untracked full-addition fallback); op targets are pure snapshots (diff /
+ * read view / error text). The pane is resizable by drag (clamped; the
+ * height commits to the tab's persisted meta on release) and by keyboard;
+ * git targets can expand into a dedicated diff tab via the shell.
  */
 import { useEffect, useMemo, useRef, useState, type PointerEvent as ReactPointerEvent } from 'react'
 import { IconCloseOutlineRegular, IconRefreshOutlineRegular, IconRightUpOutlineRegular, MarkdownText } from '@deepseek-ai/dsh-client-ui-primitives'
 import type { SessionScope } from '../api.ts'
-import { api, htmlUrl } from '../api.ts'
+import { htmlUrl } from '../api.ts'
 import { t } from '../locales.ts'
 import { baseName } from '../paths.ts'
 import { resolveSidebarPath } from '../paths.ts'
@@ -21,7 +21,8 @@ import { DiffRows, ReadRows } from '../diff/DiffRows.tsx'
 import { PdfView } from '../PdfView.tsx'
 import { DiffFiles } from '../diff/DiffFiles.tsx'
 import { langOfPath } from '../diff/highlight.ts'
-import { buildDiffSegments, diffLines, diffStats, displayPath, foldRowsFromContents, parseUnifiedDiff, unifiedSegments, type DiffFile, type DiffRow, type FoldSegment } from '../diff/rows.ts'
+import { buildDiffSegments, diffLines, diffStats, parseUnifiedDiff, unifiedSegments, type DiffRow } from '../diff/rows.ts'
+import { useGitDiffTarget } from '../diff/use-git-diff.ts'
 import { parseReadContent, parseReadLines, type FileOp } from './ops.ts'
 import { redactText } from '../redact.ts'
 import { rewriteLocalImageUrls } from '../markdown-images.ts'
@@ -29,6 +30,7 @@ import { markdownTextProps } from '../markdown-labels.tsx'
 import { splitMermaidBlocks } from '../mermaid-blocks.ts'
 import { LazyMermaidMarkdown } from '../mermaid-lazy.tsx'
 import { createFrameBatcher } from '../frame-batcher.ts'
+import { Chip, IconButton, Notice, StatusBadge } from '../ui/index.ts'
 import css from './changes.module.css'
 import diffCss from '../diff/diff.module.css'
 
@@ -36,6 +38,16 @@ import diffCss from '../diff/diff.module.css'
 const HEIGHT_MIN = 140
 const HEIGHT_STEP = 24
 
+/**
+ * Clamp one pane height to the pane's own bounds: never below the content
+ * minimum, never above 70% of the window. Both the drag handler and the
+ * RESTORE path (a height persisted under a taller window) run through this,
+ * so a saved value can never open the pane taller than the viewport allows.
+ */
+export function clampPaneHeight(value: number): number {
+  return Math.min(Math.max(value, HEIGHT_MIN), Math.round(window.innerHeight * 0.7))
+}
+
 /** The redaction preference, persisted under the repo's sidebar storage
  *  prefix (see state.ts's `dsh-sidebar:v1`). */
 const REDACTION_KEY = 'dsh-sidebar:v1:redaction'
@@ -84,21 +96,10 @@ export function HtmlRenderPreview(props: { src: string; title: string }) {
   )
 }
 
-/** One header pill toggle — the redaction / reading / render toggles share
- *  the shape (on-state styling + aria-pressed). */
+/** One header pill toggle — the redaction / reading / render toggles share the
+ *  shape: the global {@link Chip} (its active state is the "on" picture). */
 function PaneToggle(props: { on: boolean; label: string; title?: string; onClick: () => void }) {
-  return (
-    <button
-      type="button"
-      className={css.mdToggle}
-      data-on={props.on ? 'true' : undefined}
-      aria-pressed={props.on}
-      title={props.title}
-      onClick={props.onClick}
-    >
-      {props.label}
-    </button>
-  )
+  return <Chip active={props.on} title={props.title} onClick={props.onClick}>{props.label}</Chip>
 }
 
 /** The reading-mode body of one markdown op target: the shared MarkdownText
@@ -157,146 +158,10 @@ export interface DiffPaneProps {
 }
 
 export function DiffPane({ target, scope, height, onHeightCommit, onClose, onExpand }: DiffPaneProps) {
-  // ── Git target loading (mirrors the diff tab: staged-side fallback, the
-  //    untracked full-addition fallback, refresh by tick). ─────────────────
-  const [tick, setTick] = useState(0)
-  const [loading, setLoading] = useState(target.kind === 'git')
-  const [error, setError] = useState<string | null>(null)
-  const [diffText, setDiffText] = useState<string | null>(null)
-  const [untracked, setUntracked] = useState<string | undefined>(undefined)
-  // The staged flag of the side ACTUALLY rendered: when the requested side's
-  // diff came back empty the load falls back to the other side, and the fold
-  // expansion must read that side's revisions (else the sliced line numbers
-  // land on the wrong contents).
-  const [effectiveStaged, setEffectiveStaged] = useState<boolean | null>(null)
+  // ── Git target loading (the shared loader: staged-side fallback, the
+  //    untracked full-addition fallback, refresh by tick, fold cache). ─────
   const gitRef = target.kind === 'git' ? target.ref : null
-  // The scope every git call of this target shares (repoRoot folded in when
-  // the ref carries one, exactly like the load effect's paneScope).
-  const gitScope = useMemo<SessionScope>(() => ({
-    sessionId: scope.sessionId,
-    cwd: scope.cwd,
-    ...(gitRef?.repoRoot !== undefined ? { repoRoot: gitRef.repoRoot } : {}),
-  }), [scope.sessionId, scope.cwd, gitRef?.repoRoot])
-
-  useEffect(() => {
-    if (gitRef === null) return
-    let cancelled = false
-    const paneScope: SessionScope = {
-      sessionId: scope.sessionId,
-      cwd: scope.cwd,
-      ...(gitRef.repoRoot !== undefined ? { repoRoot: gitRef.repoRoot } : {}),
-    }
-    setLoading(true)
-    setError(null)
-    setDiffText(null)
-    setUntracked(undefined)
-    setEffectiveStaged(null)
-    const load = async (): Promise<void> => {
-      try {
-        if (gitRef.kind === 'commit') {
-          const result = await api.gitCommitDiff(paneScope, gitRef.hashFull, gitRef.worktree)
-          if (!cancelled) setDiffText(result.diff)
-          return
-        }
-        let result = await api.gitDiff(paneScope, gitRef.path, gitRef.staged, gitRef.worktree)
-        if (result.diff === '') {
-          // The requested side is empty — try the OTHER side once (the change
-          // may have moved sides after the preview target was minted).
-          const other = await api.gitDiff(paneScope, gitRef.path, !gitRef.staged, gitRef.worktree)
-          if (other.diff !== '') {
-            result = other
-            if (!cancelled) setEffectiveStaged(!gitRef.staged)
-          }
-        }
-        if (result.diff !== '') {
-          if (!cancelled) setDiffText(result.diff)
-          return
-        }
-        // Empty diff: an untracked file (git diff never lists it) falls back
-        // to a full-file addition from its content.
-        if (gitRef.untracked === true && !gitRef.staged) {
-          const text = await api.fsRead(paneScope, resolveSidebarPath(gitRef.repoRoot ?? gitRef.worktree ?? scope.cwd, gitRef.path))
-          if (!cancelled && text.kind === 'text') {
-            setDiffText('')
-            setUntracked(text.content)
-          }
-          return
-        }
-        if (!cancelled) setDiffText('')
-      } catch (reason) {
-        if (!cancelled) setError(reason instanceof Error ? reason.message : String(reason))
-      } finally {
-        if (!cancelled) setLoading(false)
-      }
-    }
-    void load()
-    return () => { cancelled = true }
-  }, [gitRef, scope.sessionId, scope.cwd, tick])
-
-  // ── On-demand git fold expansion: a fold's hidden rows come from both
-  //    sides' full contents (git.show / fsRead), fetched ONCE per file so
-  //    sibling folds share the request, then sliced by each fold's line
-  //    ranges. The cache dies with the target or a refresh tick. ───────────
-  const foldContents = useRef(new Map<string, Promise<{ old: string; new: string }>>())
-  useEffect(() => { foldContents.current = new Map() }, [gitRef, tick])
-  const foldLoader = useMemo(() => {
-    if (gitRef === null) return undefined
-    const sidesOf = (file: DiffFile): Promise<{ old: string; new: string }> => {
-      // Both sides empty cannot cover a non-empty fold — treat it as a failed
-      // fetch so the fold degrades to the unavailable marker instead of
-      // silently expanding to nothing (the symptom of a bad rev or path
-      // reading null on both sides).
-      const ofSides = (oldContent: string | null, newContent: string | null): { old: string; new: string } => {
-        if ((oldContent ?? '') === '' && (newContent ?? '') === '') throw new Error('no content on either side')
-        return { old: oldContent ?? '', new: newContent ?? '' }
-      }
-      const fetchSides = async (): Promise<{ old: string; new: string }> => {
-        if (gitRef.kind === 'commit') {
-          // The patch's -m --first-parent shape: old side from the parent,
-          // new side from the commit (a root commit's parent read fails → '').
-          const [oldSide, newSide] = await Promise.all([
-            file.oldPath === '/dev/null'
-              ? Promise.resolve({ content: null })
-              : api.gitShow(gitScope, `${gitRef.hashFull}^`, displayPath(file.oldPath), gitRef.worktree),
-            file.newPath === '/dev/null'
-              ? Promise.resolve({ content: null })
-              : api.gitShow(gitScope, gitRef.hashFull, displayPath(file.newPath), gitRef.worktree),
-          ])
-          return ofSides(oldSide.content, newSide.content)
-        }
-        // Worktree change: staged is HEAD vs index, unstaged is index vs
-        // worktree (the worktree side reads the live file).
-        const staged = effectiveStaged ?? gitRef.staged
-        if (staged) {
-          const [oldSide, newSide] = await Promise.all([
-            file.oldPath === '/dev/null'
-              ? Promise.resolve({ content: null })
-              : api.gitShow(gitScope, 'HEAD', displayPath(file.oldPath), gitRef.worktree),
-            file.newPath === '/dev/null'
-              ? Promise.resolve({ content: null })
-              : api.gitShow(gitScope, ':0', displayPath(file.newPath), gitRef.worktree),
-          ])
-          return ofSides(oldSide.content, newSide.content)
-        }
-        const [oldSide, worktree] = await Promise.all([
-          file.oldPath === '/dev/null'
-            ? Promise.resolve({ content: null })
-            : api.gitShow(gitScope, ':0', displayPath(file.oldPath), gitRef.worktree),
-          api.fsRead(gitScope, resolveSidebarPath(gitRef.repoRoot ?? gitRef.worktree ?? scope.cwd, displayPath(file.newPath))).catch(() => null),
-        ])
-        return ofSides(oldSide.content, worktree !== null && worktree.kind === 'text' ? worktree.content : null)
-      }
-      const path = displayPath(file.newPath === '/dev/null' ? file.oldPath : file.newPath)
-      let promise = foldContents.current.get(path)
-      if (promise === undefined) {
-        promise = fetchSides()
-        foldContents.current.set(path, promise)
-      }
-      return promise
-    }
-    return (file: DiffFile, segment: FoldSegment): Promise<readonly DiffRow[]> =>
-      sidesOf(file).then(sides => foldRowsFromContents(segment, sides.old, sides.new))
-  }, [gitRef, gitScope, effectiveStaged, scope])
+  const { loading, error, diffText, untracked, refresh, resolveFold } = useGitDiffTarget(gitRef, scope)
 
   // ── Op target material (pure snapshots; the prior content came with the
   //    target so a running op shows what is already known). ────────────────
@@ -422,7 +287,7 @@ export function DiffPane({ target, scope, height, onHeightCommit, onClose, onExp
   //    shell). Arrow keys resize by a step for keyboard users. ────────────
   const [dragHeight, setDragHeight] = useState<number | null>(null)
   const paneHeight = dragHeight ?? height
-  const clamp = (value: number): number => Math.min(Math.max(value, HEIGHT_MIN), Math.round(window.innerHeight * 0.7))
+  const clamp = clampPaneHeight
   const dragOrigin = useRef<{ y: number; h: number } | null>(null)
   // Pointer streams fire several times per frame; one setState per event
   // re-rendered the whole pane at event cadence (see frame-batcher).
@@ -471,15 +336,15 @@ export function DiffPane({ target, scope, height, onHeightCommit, onClose, onExp
       />
       <div className={css.diffHead}>
         {target.kind === 'op' && (
-          <span className={css.diffKind} data-kind={target.op.kind}>
+          <StatusBadge tone={target.op.kind}>
             {t(target.op.kind === 'read' ? 'changesRead' : target.op.kind === 'write' ? 'changesWrite' : 'changesEdit')}
-          </span>
+          </StatusBadge>
         )}
         {target.kind === 'git' && target.ref.kind === 'worktree' && (
-          <span className={css.diffKind} data-kind="git">{target.ref.staged ? t('staged') : t('unstaged')}</span>
+          <StatusBadge tone="neutral">{target.ref.staged ? t('staged') : t('unstaged')}</StatusBadge>
         )}
         {target.kind === 'git' && target.ref.kind === 'commit' && (
-          <span className={css.diffKind} data-kind="git">{target.ref.hash}</span>
+          <StatusBadge tone="neutral">{target.ref.hash}</StatusBadge>
         )}
         <span className={css.diffPath} title={title}>{title}</span>
         {stats !== null && (stats.added > 0 || stats.deleted > 0) && (
@@ -490,25 +355,19 @@ export function DiffPane({ target, scope, height, onHeightCommit, onClose, onExp
         )}
         {target.kind === 'git' && (
           <>
-            <button
-              type="button"
-              className={css.iconButton}
-              aria-label={t('refresh')}
-              title={t('refresh')}
+            <IconButton
+              size="sm"
+              icon={<IconRefreshOutlineRegular size={14} />}
+              label={t('refresh')}
               disabled={loading}
-              onClick={() => { setTick(value => value + 1) }}
-            >
-              <IconRefreshOutlineRegular size={14} />
-            </button>
-            <button
-              type="button"
-              className={css.iconButton}
-              aria-label={t('changesOpenDiffTab')}
-              title={t('changesOpenDiffTab')}
+              onClick={refresh}
+            />
+            <IconButton
+              size="sm"
+              icon={<IconRightUpOutlineRegular size={14} />}
+              label={t('changesOpenDiffTab')}
               onClick={onExpand}
-            >
-              <IconRightUpOutlineRegular size={14} />
-            </button>
+            />
           </>
         )}
         {redactionHit && (
@@ -543,15 +402,12 @@ export function DiffPane({ target, scope, height, onHeightCommit, onClose, onExp
             onClick={() => { setRenderingPdf(value => !value) }}
           />
         )}
-        <button
-          type="button"
-          className={css.iconButton}
-          aria-label={t('changesClosePreview')}
-          title={t('changesClosePreview')}
+        <IconButton
+          size="sm"
+          icon={<IconCloseOutlineRegular size={14} />}
+          label={t('changesClosePreview')}
           onClick={onClose}
-        >
-          <IconCloseOutlineRegular size={14} />
-        </button>
+        />
       </div>
       {target.kind === 'op' && htmlOp && rendering && htmlRenderSrc !== ''
         ? <HtmlRenderPreview src={htmlRenderSrc} title={target.path} />
@@ -566,9 +422,9 @@ export function DiffPane({ target, scope, height, onHeightCommit, onClose, onExp
         : target.kind === 'op' && op !== null && op.isError
         ? (
           <div className={css.paneBody}>
-            <div className={css.readError} role="alert">
+            <Notice kind="error" className={css.readError}>
               {op.errorText ?? t('changesError')}
-            </div>
+            </Notice>
           </div>
         )
         : target.kind === 'op' && op !== null && op.kind === 'read'
@@ -582,26 +438,32 @@ export function DiffPane({ target, scope, height, onHeightCommit, onClose, onExp
               <div className={css.paneBody}>
                 {op !== null && op.kind === 'write'
                   && prior === undefined
-                  && <div className={css.priorUnknown}>{t('changesPriorUnknown')}</div>}
+                  && <Notice kind="hint" tone="inline">{t('changesPriorUnknown')}</Notice>}
                 <DiffRows key={target.op.callId} segments={opSegments} lang={opLang} />
               </div>
             )
             : loading
-              ? <div className={css.paneBody}><div className={css.gitPlaceholder}>{t('loading')}</div></div>
+              ? <div className={css.paneBody}><Notice kind="loading" tone="page">{t('loading')}</Notice></div>
               : error !== null
-                ? <div className={css.paneBody}><div className={css.gitError}>{t('diffLoadError')}: {error}</div></div>
+                ? (
+                  <div className={css.paneBody}>
+                    <Notice kind="error">{t('diffLoadError')}: {error}</Notice>
+                  </div>
+                )
                 : (
                   <div className={css.paneBody}>
-                    {diffText !== null && diffText !== '' && (
+                    {/* The untracked fallback has NO diff text (git diff never
+                        lists the file): its content is the whole render. */}
+                    {((diffText !== null && diffText !== '') || untracked !== undefined) && (
                       <DiffFiles
-                        diff={diffText}
-                        resolveFold={foldLoader}
+                        diff={diffText ?? ''}
+                        resolveFold={resolveFold}
                         untrackedPath={untracked !== undefined && target.ref.kind === 'worktree' ? target.ref.path : undefined}
                         untrackedContent={untracked}
                       />
                     )}
                     {diffText === '' && untracked === undefined && (
-                      <div className={css.gitEmpty}>{t('diffEmpty')}</div>
+                      <Notice kind="empty" tone="page">{t('diffEmpty')}</Notice>
                     )}
                   </div>
                 )}
diff --git a/src/client/changes/GitLens.tsx b/src/client/changes/GitLens.tsx
index 9a3bcae..7f7756b 100644
--- a/src/client/changes/GitLens.tsx
+++ b/src/client/changes/GitLens.tsx
@@ -1,19 +1,28 @@
 /**
- * The Git lens of the changes tab: repository truth — status list (staged vs
- * unstaged), stage/unstage, commit with a message box, branch switch, and a
- * VSCode-like history with branch decorations, author and relative time.
- * Clicking a changed file or a history row previews it in the tab's shared
- * bottom pane (see {@link DiffPane}); rows carry right-click context menus
- * with advanced operations (open in editor, discard, revert, cherry-pick,
- * copy paths/hashes). Refresh is manual + on mount/focus. While visible it
- * polls lightweight porcelain state so model-authored file changes appear
- * without a manual refresh. Everything here is the former standalone git
- * panel, re-homed as a lens.
+ * The Git lens of the changes tab: repository truth — the changed files
+ * (unstaged / staged), stage/unstage, commit with a message box, branch and
+ * checkout switching, and a VSCode-like history with decorations, author and
+ * relative time. Clicking a changed file or a history row previews it in the
+ * tab's shared bottom pane (see {@link DiffPane}); rows carry right-click
+ * context menus with advanced operations (open in editor, discard, revert,
+ * cherry-pick, copy paths/hashes).
+ *
+ * The git status itself is NOT fetched here: it comes from the plugin's one
+ * shared store (`ui/git-status.ts`), which the file tree also subscribes to,
+ * so both surfaces color/lists the same answer from a single poller. This
+ * component owns the checkout-derived surfaces a status call cannot answer
+ * (worktree inventory, branch choices, history) and every mutation.
+ *
+ * Two error channels, one each: the commit bar owns its single status line
+ * (commit / stage / discard / revert failures), and the lens owns the top
+ * banner (refresh, branch switch, history paging). Branch and history
+ * failures used to land under the commit box, which read as "your commit
+ * failed" for an action the user never ran.
  */
 import { useCallback, useEffect, useRef, useState, type MouseEvent, type ReactNode } from 'react'
 import {
   Button, IconCodeOutlineRegular, IconCopyOutlineRegular, IconPlusOutlineRegular,
-  IconRefreshOutlineRegular, IconTrashOutlineRegular, Input, Menu, Modal, writeClipboard,
+  IconTrashOutlineRegular, Input, Menu, writeClipboard,
 } from '@deepseek-ai/dsh-client-ui-primitives'
 import type { GitLogEntry, GitStatusEntry, GitStatusResult, GitWorktree, SessionScope } from '../api.ts'
 import { api } from '../api.ts'
@@ -22,35 +31,45 @@ import { baseName, isWithinWorkspace, relativeTo } from '../paths.ts'
 import { resolveSidebarPath } from '../paths.ts'
 import { relativeTime, t } from '../locales.ts'
 import type { SidebarDiffRef, SidebarStore } from '../state.ts'
+import {
+  ConfirmDialog, IconButton, Notice, SectionHeader, StatusBadge, invalidateGitStatus, statusOfXY,
+  useGitStatus, type GitFileStatus, type GitTone, type StatusTone,
+} from '../ui/index.ts'
 import css from './changes.module.css'
 
-/** The XY status letters a row badge shows (X = index, Y = worktree). */
-function badgeOf(entry: GitStatusEntry): string {
-  const index = entry.xy[0]
-  if (index !== undefined && index !== ' ' && index !== '?') return index
-  const worktree = entry.xy[1]
-  if (worktree !== undefined && worktree !== ' ' && worktree !== '?') return worktree
-  return '?'
-}
-
 /** Whether the entry carries STAGED (index) changes — the X letter is set. */
 function isStagedEntry(entry: GitStatusEntry): boolean {
-  const index = entry.xy[0]
-  return index !== undefined && index !== ' ' && index !== '?'
+  return statusOfXY(entry.xy)?.staged === true
 }
 
 /** Whether the entry carries UNSTAGED (worktree) changes — the Y letter is set
  *  (untracked `??` counts as unstaged: it is a worktree-only change). A file
  *  with both letters set ('MM') lands in BOTH sections. */
 function isUnstagedEntry(entry: GitStatusEntry): boolean {
-  if (entry.xy === '??') return true
-  const worktree = entry.xy[1]
-  return worktree !== undefined && worktree !== ' ' && worktree !== '?'
+  return statusOfXY(entry.xy)?.unstaged === true
 }
 
 /** Whether the entry is untracked (`??`): git diff never includes it. */
 function isUntracked(entry: GitStatusEntry): boolean {
-  return badgeOf(entry) === '?'
+  return entry.xy === '??'
+}
+
+/** The porcelain tone → the kit badge tone (a copy reads as a rename). */
+const BADGE_TONE: Record<GitTone, StatusTone> = {
+  modified: 'modified',
+  added: 'added',
+  deleted: 'deleted',
+  untracked: 'untracked',
+  renamed: 'renamed',
+  copied: 'renamed',
+  conflict: 'conflict',
+}
+
+/** Split a repo-relative path into the row's name (kept) and its directory
+ *  (dimmed context). */
+function splitPath(path: string): { name: string; dir: string } {
+  const at = path.lastIndexOf('/')
+  return at === -1 ? { name: path, dir: '' } : { name: path.slice(at + 1), dir: path.slice(0, at) }
 }
 
 /** The ref names of one log row's decorations (`HEAD -> main` → `main`), deduped. */
@@ -65,13 +84,13 @@ function refNames(refs: string): string[] {
   )]
 }
 
-/** One thrown value as display text (every error banner/row here normalizes
- *  through this so non-Error rejections never render as '[object Object]'). */
+/** One thrown value as display text (every error line here normalizes through
+ *  this so non-Error rejections never render as '[object Object]'). */
 function errorMessage(reason: unknown): string {
   return reason instanceof Error ? reason.message : String(reason)
 }
 
-/** The pending destructive action (discard / revert / cherry-pick), gated by a confirm modal. */
+/** The pending destructive action (discard / revert / cherry-pick), gated by a confirm dialog. */
 interface ConfirmState {
   title: string
   description: string
@@ -83,12 +102,53 @@ interface ConfirmState {
  *  floods the panel at once (the end of the log is reached by paging). */
 const LOG_BATCH = 20
 
-/** Every Nth silent poll re-lists worktrees (and re-runs auto-selection): the
- *  2s tick only needs the selected checkout's STATUS, and re-listing spawned
- *  a second git process per tick for a list that almost never changes — a
- *  linked checkout the agent creates mid-session is picked up within ~30s
- *  instead of 2s. */
-const WORKTREE_RECHECK_TICKS = 15
+/** Cadence of the background worktree re-list: the shared status store already
+ *  polls the selected checkout's status, so the inventory (a different call)
+ *  only needs to notice a linked checkout the agent created mid-session —
+ *  within ~30s, without a second git process per status tick. */
+const WORKTREE_POLL_MS = 30_000
+
+/** One changed file's row: badge letter + file name + dimmed directory +
+ *  the trailing stage/unstage action. The ONE renderer both sections use. */
+function ChangeRow(props: {
+  entry: GitStatusEntry
+  status: GitFileStatus | undefined
+  staged: boolean
+  busy: boolean
+  selected: boolean
+  onPreview(): void
+  onContextMenu(event: MouseEvent): void
+  onToggleStage(): void
+}): ReactNode {
+  const { entry, status, staged, busy, selected } = props
+  const { name, dir } = splitPath(entry.path)
+  const action = staged ? t('unstage') : t('stage')
+  return (
+    <div className={css.row} data-selected={selected ? 'true' : undefined}>
+      <button
+        type="button"
+        className={css.rowMain}
+        data-path={entry.path}
+        title={entry.path}
+        onClick={props.onPreview}
+        onContextMenu={props.onContextMenu}
+      >
+        <StatusBadge tone={status === undefined ? 'neutral' : BADGE_TONE[status.tone]}>
+          {status?.letter ?? '?'}
+        </StatusBadge>
+        <span className={css.rowName}>{name}</span>
+        {dir !== '' && <span className={css.rowDir}>{dir}</span>}
+      </button>
+      <IconButton
+        size="sm"
+        disabled={busy}
+        label={action}
+        icon={staged ? <IconTrashOutlineRegular size={14} /> : <IconPlusOutlineRegular size={14} />}
+        onClick={props.onToggleStage}
+      />
+    </div>
+  )
+}
 
 export interface GitLensProps {
   scope: SessionScope
@@ -99,26 +159,36 @@ export interface GitLensProps {
   onPreview: (ref: SidebarDiffRef) => void
   /** The ref currently previewed (row highlight); null when the pane is closed. */
   selectedRef: SidebarDiffRef | null
-  /** Poll only while the tab is actually visible. */
+  /** Poll the inventory only while the tab is actually visible. */
   visible: boolean
+  /** Bumped by the tab header's refresh action (0 = never asked). */
+  refreshTick?: number
 }
 
 export function GitLens(props: GitLensProps) {
-  const { scope, store, onOpenFile, onPreview, selectedRef, visible } = props
-  const [status, setStatus] = useState<GitStatusResult | null>(null)
+  const { scope, store, onOpenFile, onPreview, selectedRef, visible, refreshTick = 0 } = props
+
   const [worktrees, setWorktrees] = useState<GitWorktree[]>([])
   const [selectedWorktree, setSelectedWorktree] = useState<string | undefined>()
-  const [repoRoot, setRepoRoot] = useState<string | undefined>(undefined)
-  const [loading, setLoading] = useState(true)
-  const [error, setError] = useState<string | null>(null)
+  const [repoRoot, setRepoRoot] = useState<string | undefined>()
+  /** Every repository of the session workspace, kept once discovered: the
+   *  status of a SELECTED child reports only itself, so the selector's option
+   *  list cannot be re-derived from the current snapshot alone. */
+  const [repoChoices, setRepoChoices] = useState<string[]>([])
   const [branchNames, setBranchNames] = useState<string[]>([])
   const [logEntries, setLogEntries] = useState<GitLogEntry[]>([])
-  const [commitMsg, setCommitMsg] = useState('')
-  const [busy, setBusy] = useState(false)
-  const [commitError, setCommitError] = useState<string | null>(null)
   /** Whether the history was fully paged (a batch shorter than LOG_BATCH). */
   const [logEnded, setLogEnded] = useState(false)
   const [logLoadingMore, setLogLoadingMore] = useState(false)
+  /** The history's own failure state: an empty list must not claim "no commits"
+   *  when the log call failed. */
+  const [logFailed, setLogFailed] = useState(false)
+  const [commitMsg, setCommitMsg] = useState('')
+  const [busy, setBusy] = useState(false)
+  /** The commit bar's ONE status line (commit / stage / discard / revert). */
+  const [actionError, setActionError] = useState<string | null>(null)
+  /** The lens-level error banner (refresh / branch switch / history paging). */
+  const [viewError, setViewError] = useState<string | null>(null)
 
   /** The open file-row context menu (cursor position for the portaled Menu). */
   const [fileMenu, setFileMenu] = useState<{ entry: GitStatusEntry; staged: boolean; x: number; y: number } | null>(null)
@@ -126,189 +196,342 @@ export function GitLens(props: GitLensProps) {
   const [historyMenu, setHistoryMenu] = useState<{ entry: GitLogEntry; x: number; y: number } | null>(null)
   /** The pending destructive action awaiting confirmation. */
   const [confirm, setConfirm] = useState<ConfirmState | null>(null)
-  const refreshInFlight = useRef(false)
-  /** Monotonic request id: a manual worktree switch invalidates any older poll
-   *  before it can publish state from the previous checkout. */
-  const refreshGeneration = useRef(0)
-  const worktreeChosenByUser = useRef(false)
-  /** selectedWorktree read inside refresh without re-creating the callback:
-   *  avoids a spurious full refresh on every auto-select (the very state
-   *  change refresh writes back via setSelectedWorktree would recreate the
-   *  callback and re-trigger the mount effect — an N→N+1 fetch loop). */
+
+  /** The selected checkout, readable synchronously by the refresh chain
+   *  without making every callback depend on the state it writes. */
   const chosenPathRef = useRef<string | undefined>(undefined)
-  useEffect(() => { chosenPathRef.current = selectedWorktree }, [selectedWorktree])
-  /** Silent polls since the last worktree re-list (see WORKTREE_RECHECK_TICKS). */
-  const silentTickCount = useRef(0)
+  /** The automatic preference for a dirty linked checkout runs ONCE per
+   *  scope: after it (or after any explicit user choice) a later re-list
+   *  must never yank the view off the checkout the user is working in. */
+  const autoSelectDone = useRef(false)
+  /** The scope and repo the git calls target, readable at call time: a repo
+   *  switch refreshes with the NEW root even before React re-renders. */
+  const scopeRef = useRef<{ sessionId: string; cwd: string | undefined }>({ sessionId: scope.sessionId, cwd: scope.cwd })
+  const repoRootRef = useRef<string | undefined>(undefined)
+  /** Bumped whenever the scope resets: a late response of the previous scope
+   *  can never publish rows into the new one. */
+  const scopeGen = useRef(0)
+  /** The refresh chain's queue: a request landing while one runs is replayed
+   *  once after it settles — a manual refresh is never silently dropped. */
+  const gate = useRef({ inFlight: false, queued: false, queuedSilent: true })
 
-  const gitScope: SessionScope = repoRoot === undefined ? scope : { ...scope, repoRoot }
+  useEffect(() => { scopeRef.current = { sessionId: scope.sessionId, cwd: scope.cwd } }, [scope.sessionId, scope.cwd])
 
-  /** Publish a complete checkout-derived view. Status, branch choices and
-   *  history are one consistency unit: never mix rows from two worktrees. */
-  const refreshTarget = useCallback(async (
-    target: string | undefined,
-    options: { loading: boolean; generation: number },
-  ): Promise<void> => {
-    if (options.loading) setLoading(true)
-    setError(null)
-    try {
-      const [statusResult, branchResult, logResult] = await Promise.all([
-        api.gitStatus(gitScope, target),
-        api.gitBranch(gitScope, target).catch(() => ({ current: '', names: [] as string[] })),
-        api.gitLog(gitScope, LOG_BATCH, 0, target).catch(() => [] as GitLogEntry[]),
-      ])
-      if (options.generation !== refreshGeneration.current) return
-      setStatus(statusResult)
-      if (statusResult.root !== undefined && statusResult.root !== repoRoot) setRepoRoot(statusResult.root)
-      setBranchNames(branchResult.names)
-      setLogEntries(logResult)
-      setLogEnded(logResult.length < LOG_BATCH)
-    } catch (reason) {
-      if (options.generation === refreshGeneration.current) {
-        setError(errorMessage(reason))
-      }
-    } finally {
-      if (options.loading && options.generation === refreshGeneration.current) setLoading(false)
-    }
-    // Granular scope fields: the scope object's identity churns, only its
-    // sessionId / cwd fields gate the git target.
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [scope.sessionId, scope.cwd, repoRoot])
-
-  const refresh = useCallback(async (silent = false): Promise<void> => {
-    if (refreshInFlight.current) return
-    refreshInFlight.current = true
-    let generation = refreshGeneration.current
-    try {
-      // Fast path for the ordinary silent tick: the selected checkout's
-      // STATUS is all that changes between worktree re-lists (see
-      // WORKTREE_RECHECK_TICKS) — one git process instead of two.
-      if (silent && chosenPathRef.current !== undefined && (silentTickCount.current += 1) % WORKTREE_RECHECK_TICKS !== 0) {
-        const statusResult = await api.gitStatus(gitScope, chosenPathRef.current)
-        if (generation === refreshGeneration.current) setStatus(statusResult)
-        return
-      }
-      silentTickCount.current = 0
-      const listed = await api.gitWorktrees(scope)
-      if (generation !== refreshGeneration.current) return
-      setWorktrees(listed)
-      const selectedStillExists = listed.some(entry => entry.path === chosenPathRef.current)
-      let target = selectedStillExists ? chosenPathRef.current : listed.find(entry => entry.current)?.path
-      // DSH and other coding agents commonly create one linked checkout while
-      // the session remains rooted at the clean primary checkout. Select that
-      // checkout automatically only when the choice is unambiguous.
-      const current = listed.find(entry => entry.current)
-      const dirtyLinked = listed.filter(entry => !entry.current && entry.changes > 0)
-      if (!worktreeChosenByUser.current) {
-        target = (current?.changes ?? 0) === 0 && dirtyLinked.length === 1
-          ? dirtyLinked[0]!.path
-          : current?.path
-      }
-      const targetChanged = target !== chosenPathRef.current
-      if (targetChanged) {
-        // Changing the automatically selected checkout invalidates any direct
-        // target refresh that may still be resolving for the previous one.
-        generation = refreshGeneration.current += 1
-        chosenPathRef.current = target
-        setSelectedWorktree(target)
-        // Remove rows owned by the previous checkout immediately: keeping them
-        // interactive while the target changes could apply a destructive action
-        // to the new checkout with stale history from the old one.
-        setStatus(null)
-        setBranchNames([])
-        setLogEntries([])
-        setLogEnded(false)
-        setLogLoadingMore(false)
-      }
-      // A poll may update status alone only while staying on the same checkout.
-      // Any automatic selection change refreshes the complete derived view.
-      if (silent && !targetChanged) {
-        const statusResult = await api.gitStatus(gitScope, target)
-        if (generation === refreshGeneration.current) setStatus(statusResult)
-        return
-      }
-      await refreshTarget(target, { loading: !silent, generation })
-    } catch (reason) {
-      if (generation === refreshGeneration.current) {
-        setError(errorMessage(reason))
-        if (!silent) setLoading(false)
-      }
-    } finally {
-      refreshInFlight.current = false
-    }
-    // Granular scope fields: the scope object's identity churns, only its
-    // sessionId / cwd fields gate the refresh target.
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [scope.sessionId, scope.cwd, refreshTarget])
+  /** The session scope every git call of this lens targets right now. */
+  const gitScopeNow = useCallback((): SessionScope => {
+    const base = scopeRef.current
+    return repoRootRef.current === undefined ? { ...base } : { ...base, repoRoot: repoRootRef.current }
+  }, [])
 
+  // The status store keys on the checkout being LISTED: a selected child
+  // repository becomes the effective cwd, which is also what makes the status
+  // and the inventory agree after a repo switch.
+  // The status store keys on `worktree`; the PRIMARY checkout is exactly what
+  // an unscoped status call resolves to, so passing its path would mint a
+  // second key (and a second 2.5s `git status` poll) for the same answer the
+  // file tree already subscribes to. Only a LINKED checkout narrows the key.
+  const primaryWorktree = worktrees.find(entry => entry.current)?.path
+  const statusWorktree = selectedWorktree !== undefined && selectedWorktree !== primaryWorktree
+    ? selectedWorktree
+    : undefined
+  const status = useGitStatus(
+    { sessionId: scope.sessionId, cwd: repoRoot ?? scope.cwd },
+    { worktree: statusWorktree, visible },
+  )
+  const snapshot: GitStatusResult | null = status.snapshot
   useEffect(() => {
-    refreshGeneration.current += 1
-    refreshInFlight.current = false
-    worktreeChosenByUser.current = false
-    chosenPathRef.current = undefined
-    silentTickCount.current = 0
-    setSelectedWorktree(undefined)
-  }, [scope.sessionId, scope.cwd])
-  useEffect(() => { void refresh() }, [refresh])
+    const repositories = snapshot?.repositories
+    if (repositories !== undefined && repositories.length > 1) setRepoChoices(repositories)
+  }, [snapshot])
 
-  /** A user choice invalidates any older poll and atomically refreshes every
-   *  checkout-derived surface before destructive history actions can run. */
-  const chooseWorktree = (target: string): void => {
-    worktreeChosenByUser.current = true
+  /** Select one checkout (or none) and remember the choice synchronously. */
+  const selectWorktree = (target: string | undefined): void => {
     chosenPathRef.current = target
     setSelectedWorktree(target)
-    setStatus(null)
+  }
+
+  /** Drop every checkout-derived surface before another one loads. */
+  const clearDerived = (): void => {
     setBranchNames([])
     setLogEntries([])
     setLogEnded(false)
     setLogLoadingMore(false)
-    const generation = refreshGeneration.current += 1
-    void refreshTarget(target, { loading: true, generation })
+    setLogFailed(false)
+    setActionError(null)
   }
-  /** Switching the selected child repository must invalidate every
-   *  target-derived surface (status/history/log) before the asynchronous
-   *  refresh resolves; otherwise stale rows remain actionable while their
-   *  handlers already address the new repository. Mirrors chooseWorktree. */
+
+  /** Load the branch choices and the first history page of one checkout. */
+  const loadTarget = useCallback(async (target: string | undefined): Promise<void> => {
+    const generation = scopeGen.current
+    const gitScope = gitScopeNow()
+    const [branchResult, logResult] = await Promise.all([
+      api.gitBranch(gitScope, target).catch(() => ({ current: '', names: [] as string[] })),
+      api.gitLog(gitScope, LOG_BATCH, 0, target).then(
+        entries => ({ entries, failed: false }),
+        () => ({ entries: [] as GitLogEntry[], failed: true }),
+      ),
+    ])
+    if (generation !== scopeGen.current) return
+    setBranchNames(branchResult.names)
+    setLogEntries(logResult.entries)
+    setLogEnded(logResult.entries.length < LOG_BATCH)
+    setLogFailed(logResult.failed)
+  }, [gitScopeNow])
+
+  /** One listing pass: re-read the worktree inventory, apply the first-pass
+   *  automatic selection, then load the chosen checkout's derived surfaces.
+   *  The shared status store follows the same selection on its own. */
+  const runOnce = useCallback(async (silent: boolean, signal?: AbortSignal): Promise<void> => {
+    const generation = scopeGen.current
+    let listed: GitWorktree[]
+    try {
+      listed = await api.gitWorktrees(gitScopeNow(), signal)
+    } catch (reason) {
+      if (signal?.aborted !== true && generation === scopeGen.current) setViewError(errorMessage(reason))
+      return
+    }
+    if (signal?.aborted === true || generation !== scopeGen.current) return
+    setWorktrees(listed)
+    const current = listed.find(entry => entry.current)
+    const stillListed = chosenPathRef.current !== undefined
+      && listed.some(entry => entry.path === chosenPathRef.current)
+    let target = stillListed ? chosenPathRef.current : current?.path
+    if (!autoSelectDone.current) {
+      // DSH and other coding agents commonly create ONE linked checkout while
+      // the session remains rooted at the clean primary checkout. Select that
+      // checkout automatically only when the choice is unambiguous — and only
+      // on this first pass, never again.
+      const dirtyLinked = listed.filter(entry => !entry.current && entry.changes > 0)
+      if ((current?.changes ?? 0) === 0 && dirtyLinked.length === 1) {
+        target = dirtyLinked[0]!.path
+        autoSelectDone.current = true
+      } else if (current !== undefined) {
+        target = current.path
+        autoSelectDone.current = true
+      }
+    }
+    const targetChanged = target !== chosenPathRef.current
+    if (targetChanged) {
+      selectWorktree(target)
+      clearDerived()
+    }
+    // A silent tick only keeps the inventory (and its change counts) fresh.
+    if (silent && !targetChanged) return
+    await loadTarget(target)
+  }, [gitScopeNow, loadTarget])
+
+  /** Run one refresh, replaying a request that arrives mid-flight exactly once. */
+  const refresh = useCallback(async (silent = false, signal?: AbortSignal): Promise<void> => {
+    const current = gate.current
+    if (current.inFlight) {
+      current.queued = true
+      if (!silent) current.queuedSilent = false
+      return
+    }
+    current.inFlight = true
+    let nextSilent = silent
+    try {
+      for (;;) {
+        current.queued = false
+        current.queuedSilent = true
+        if (signal?.aborted === true) break
+        if (!nextSilent) setViewError(null)
+        await runOnce(nextSilent, signal)
+        if (!current.queued) break
+        nextSilent = current.queuedSilent
+      }
+    } finally {
+      current.inFlight = false
+    }
+  }, [runOnce])
+
+  // Mount / scope change: reset every piece of per-scope state, then load.
+  // A tab mounted while hidden loads nothing (its status store has no visible
+  // consumer either); the rising-edge catch-up below loads it on screen.
+  useEffect(() => {
+    scopeGen.current += 1
+    gate.current = { inFlight: false, queued: false, queuedSilent: true }
+    autoSelectDone.current = false
+    chosenPathRef.current = undefined
+    repoRootRef.current = undefined
+    setWorktrees([])
+    setSelectedWorktree(undefined)
+    setRepoRoot(undefined)
+    setRepoChoices([])
+    clearDerived()
+    setViewError(null)
+    if (visible) void refresh(false)
+    // Granular scope fields: the refresh identity is stable, only a real
+    // session/cwd change restarts the chain.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [scope.sessionId, scope.cwd])
+
+  // Becoming visible (or visible again): catch the derived surfaces up. The
+  // shared status re-fetches on the same edge (its store drops the snapshot
+  // when the last consumer goes away), so both halves of the lens agree.
+  const wasVisible = useRef(visible)
+  useEffect(() => {
+    const rising = visible && !wasVisible.current
+    wasVisible.current = visible
+    if (!rising) return
+    void refresh(false)
+    // Granular scope fields: only the visibility edge drives this effect.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [visible])
+
+  // The header's refresh action: re-read the inventory and derived surfaces,
+  // and force the SHARED status of this session (the file tree's colors too).
+  useEffect(() => {
+    if (refreshTick === 0) return
+    void refresh(false)
+    invalidateGitStatus(scope.sessionId)
+    // Only the tick drives this effect.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [refreshTick])
+
+  /** The inventory poll: a linked checkout created mid-session shows up
+   *  without a manual refresh (the status poll itself belongs to the store). */
+  const pollInventory = useCallback((signal: AbortSignal): Promise<void> => refresh(true, signal), [refresh])
+  usePolling(visible, pollInventory, { intervalMs: WORKTREE_POLL_MS, mode: 'self-scheduling' })
+
+  /** Run one mutating git action: lock the bar, refresh the shared status and
+   *  the derived surfaces on success, and report the failure in the commit
+   *  bar's single status line (never as an unhandled rejection). */
+  const runAction = async (
+    action: () => Promise<unknown>,
+    failure: (reason: unknown) => string = errorMessage,
+    onSuccess?: () => void,
+  ): Promise<void> => {
+    setBusy(true)
+    setActionError(null)
+    try {
+      await action()
+      onSuccess?.()
+      invalidateGitStatus(scope.sessionId)
+      await refresh(false)
+    } catch (reason) {
+      setActionError(failure(reason))
+    } finally {
+      setBusy(false)
+    }
+  }
+
+  const stageError = (reason: unknown): string => t('changesStageFailed', { message: errorMessage(reason) })
+
+  const stageEntry = (entry: GitStatusEntry, staged: boolean): void => {
+    void runAction(
+      () => (staged ? api.gitUnstage(gitScopeNow(), entry.path, selectedWorktree) : api.gitStage(gitScopeNow(), entry.path, selectedWorktree)),
+      stageError,
+    )
+  }
+
+  const stageAll = (staged: boolean): void => {
+    void runAction(
+      () => (staged ? api.gitUnstage(gitScopeNow(), undefined, selectedWorktree) : api.gitStage(gitScopeNow(), undefined, selectedWorktree)),
+      stageError,
+    )
+  }
+
+  const commit = (): void => {
+    const message = commitMsg.trim()
+    if (message === '' || busy) return
+    void runAction(() => api.gitCommit(gitScopeNow(), message, selectedWorktree), errorMessage, () => { setCommitMsg('') })
+  }
+
+  /** Switching the selected checkout changes which rows are legitimate to act
+   *  on: clear the derived surfaces before the asynchronous refresh resolves
+   *  so a stale history row can never run over the new checkout's repository. */
+  const chooseWorktree = (target: string): void => {
+    if (target === chosenPathRef.current) return
+    autoSelectDone.current = true
+    selectWorktree(target)
+    clearDerived()
+    void refresh(false)
+  }
+
+  /** Switching the selected child repository: both the inventory and the
+   *  status key follow the new root, and exactly ONE full refresh runs. The
+   *  checkout choice resets to the new repository's current one — an explicit
+   *  user choice never triggers the automatic linked-checkout preference. */
   const chooseRepo = (target: string): void => {
+    if (target === repoRoot) return
+    autoSelectDone.current = true
+    chosenPathRef.current = undefined
+    repoRootRef.current = target
+    setSelectedWorktree(undefined)
     setRepoRoot(target)
-    setStatus(null)
-    setBranchNames([])
-    setLogEntries([])
-    setLogEnded(false)
-    setLogLoadingMore(false)
-    // Re-list worktrees for the selected child (a workspace container's
-    // own worktree list is empty); keep the current linked-checkout choice
-    // unless it does not belong to the new repository.
-    const generation = refreshGeneration.current += 1
-    void refreshTarget(chosenPathRef.current ?? '', { loading: true, generation })
+    setWorktrees([])
+    clearDerived()
+    void refresh(false)
+  }
+
+  const checkout = async (branch: string): Promise<void> => {
+    if (branch === (snapshot?.branch ?? '') || busy) return
+    setBusy(true)
+    setViewError(null)
+    try {
+      await api.gitCheckout(gitScopeNow(), branch, selectedWorktree)
+      invalidateGitStatus(scope.sessionId)
+      await refresh(false)
+    } catch (reason) {
+      setViewError(`${t('checkoutError')}: ${errorMessage(reason)}`)
+    } finally {
+      setBusy(false)
+    }
+  }
+
+  /** Run one destructive operation after the confirm dialog, then refresh. */
+  const runConfirmed = (confirmState: ConfirmState): void => {
+    setConfirm(confirmState)
+  }
+
+  const confirmPending = (): void => {
+    const pending = confirm
+    if (pending === null) return
+    setConfirm(null)
+    void runAction(pending.onConfirm)
   }
-  /** The silent poll tick (the status-only fast path between worktree
-   *  re-lists, see refresh) — fixed 2s cadence while visible, no initial
-   *  burst (mount and scope changes already refresh above). */
-  const pollTick = useCallback((): Promise<void> => refresh(true), [refresh])
-  usePolling(visible, pollTick, { intervalMs: 2_000 })
 
   /** Append the next history page (lazy: only when the user asks for more). */
   const loadMoreLog = async (): Promise<void> => {
     if (logLoadingMore || logEnded) return
-    const generation = refreshGeneration.current
+    const generation = scopeGen.current
     const target = chosenPathRef.current
     setLogLoadingMore(true)
+    setViewError(null)
     try {
-      const next = await api.gitLog(gitScope, LOG_BATCH, logEntries.length, target)
-      // A worktree switch clears the old history and increments generation.
-      // Never append a late page from that checkout into the new one.
-      if (generation !== refreshGeneration.current || target !== chosenPathRef.current) return
+      const next = await api.gitLog(gitScopeNow(), LOG_BATCH, logEntries.length, target)
+      // A worktree switch clears the old history; never append a late page
+      // from that checkout into the new one.
+      if (generation !== scopeGen.current || target !== chosenPathRef.current) return
       setLogEntries(entries => [...entries, ...next])
       if (next.length < LOG_BATCH) setLogEnded(true)
     } catch (reason) {
-      if (generation === refreshGeneration.current && target === chosenPathRef.current) {
-        setCommitError(`${t('historyLoadError')}: ${errorMessage(reason)}`)
+      if (generation === scopeGen.current && target === chosenPathRef.current) {
+        setViewError(`${t('historyLoadError')}: ${errorMessage(reason)}`)
       }
     } finally {
-      if (generation === refreshGeneration.current && target === chosenPathRef.current) setLogLoadingMore(false)
+      if (generation === scopeGen.current && target === chosenPathRef.current) setLogLoadingMore(false)
     }
   }
 
+  /** Copy `text` to the clipboard (best-effort; no visual feedback needed — the menu closes). */
+  const copy = (text: string): void => {
+    void writeClipboard(text)
+  }
+
+  const openFileMenu = (event: MouseEvent, entry: GitStatusEntry, staged: boolean): void => {
+    event.preventDefault()
+    event.stopPropagation()
+    setFileMenu({ entry, staged, x: event.clientX, y: event.clientY })
+  }
+
+  const openHistoryMenu = (event: MouseEvent, entry: GitLogEntry): void => {
+    event.preventDefault()
+    event.stopPropagation()
+    setHistoryMenu({ entry, x: event.clientX, y: event.clientY })
+  }
+
   /** The preview ref for one changed file (one ref per path+side). */
   const worktreeRefOf = (entry: GitStatusEntry, staged: boolean): SidebarDiffRef => ({
     kind: 'worktree',
@@ -336,433 +559,324 @@ export function GitLens(props: GitLensProps) {
       && (selectedRef.worktree ?? '') === (selectedWorktree ?? '')
   }
 
-  const stageEntry = async (entry: GitStatusEntry, staged: boolean): Promise<void> => {
-    setBusy(true)
-    try {
-      if (staged) await api.gitUnstage(gitScope, entry.path, selectedWorktree)
-      else await api.gitStage(gitScope, entry.path, selectedWorktree)
-      await refresh()
-    } finally {
-      setBusy(false)
-    }
-  }
+  const entries = snapshot?.entries ?? []
+  const stagedEntries = entries.filter(isStagedEntry)
+  const unstagedEntries = entries.filter(isUnstagedEntry)
+  const isRepo = snapshot?.isRepo === true
+  const branch = snapshot?.branch ?? ''
+  const branchOptions = branch === '' ? branchNames : [branch, ...branchNames.filter(name => name !== branch)]
+  const clean = isRepo && stagedEntries.length === 0 && unstagedEntries.length === 0
 
-  const stageAll = async (staged: boolean): Promise<void> => {
-    setBusy(true)
-    try {
-      if (staged) await api.gitUnstage(gitScope, undefined, selectedWorktree)
-      else await api.gitStage(gitScope, undefined, selectedWorktree)
-      await refresh()
-    } finally {
-      setBusy(false)
-    }
-  }
-
-  const commit = async (): Promise<void> => {
-    const message = commitMsg.trim()
-    if (message === '' || busy) return
-    setBusy(true)
-    setCommitError(null)
-    try {
-      await api.gitCommit(gitScope, message, selectedWorktree)
-      setCommitMsg('')
-      await refresh()
-    } catch (reason) {
-      setCommitError(errorMessage(reason))
-    } finally {
-      setBusy(false)
-    }
-  }
-
-  const checkout = async (branch: string): Promise<void> => {
-    if (branch === status?.branch || busy) return
-    setBusy(true)
-    setCommitError(null)
-    try {
-      await api.gitCheckout(gitScope, branch, selectedWorktree)
-      await refresh()
-    } catch (reason) {
-      setCommitError(`${t('checkoutError')}: ${errorMessage(reason)}`)
-    } finally {
-      setBusy(false)
-    }
-  }
-
-  /** Run one destructive operation after the confirm modal, then refresh. */
-  const runConfirmed = (confirmState: ConfirmState): void => {
-    setConfirm({ ...confirmState, onConfirm: async () => {
-      setBusy(true)
-      setCommitError(null)
-      try {
-        await confirmState.onConfirm()
-        await refresh()
-      } catch (reason) {
-        setCommitError(errorMessage(reason))
-      } finally {
-        setBusy(false)
-      }
-    } })
-  }
-
-  /** Copy `text` to the clipboard (best-effort; no visual feedback needed — the menu closes). */
-  const copy = (text: string): void => {
-    void writeClipboard(text)
-  }
-
-  const openFileMenu = (event: MouseEvent, entry: GitStatusEntry, staged: boolean): void => {
-    event.preventDefault()
-    event.stopPropagation()
-    setFileMenu({ entry, staged, x: event.clientX, y: event.clientY })
-  }
-
-  const openHistoryMenu = (event: MouseEvent, entry: GitLogEntry): void => {
-    event.preventDefault()
-    event.stopPropagation()
-    setHistoryMenu({ entry, x: event.clientX, y: event.clientY })
-  }
-
-  const stagedEntries = (status?.entries ?? []).filter(isStagedEntry)
-  const unstagedEntries = (status?.entries ?? []).filter(isUnstagedEntry)
-
-  const renderEntry = (entry: GitStatusEntry, staged: boolean): ReactNode => {
-    const selected = isPreviewedWorktree(entry, staged)
-    return (
-      <div
-        key={`${staged ? 's' : 'u'}:${entry.path}`}
-        className={css.gitRow}
-        data-selected={selected ? 'true' : undefined}
-      >
-        <button
-          type="button"
-          className={css.gitRowMain}
-          title={entry.path}
-          onClick={() => { onPreview(worktreeRefOf(entry, staged)) }}
-          onContextMenu={(event) => { openFileMenu(event, entry, staged) }}
-        >
-          <span className={css.gitBadge} data-letter={badgeOf(entry)}>{badgeOf(entry)}</span>
-          <span className={css.gitName}>{entry.path}</span>
-        </button>
-        <button
-          type="button"
-          className={css.iconButton}
-          aria-label={staged ? t('unstage') : t('stage')}
-          title={staged ? t('unstage') : t('stage')}
-          disabled={busy}
-          onClick={() => { void stageEntry(entry, staged) }}
-        >
-          {staged ? <IconTrashOutlineRegular /> : <IconPlusOutlineRegular />}
-        </button>
-      </div>
-    )
-  }
+  /** One change row (the single renderer of both sections). */
+  const renderEntry = (entry: GitStatusEntry, staged: boolean): ReactNode => (
+    <ChangeRow
+      key={`${staged ? 's' : 'u'}:${entry.path}`}
+      entry={entry}
+      status={statusOfXY(entry.xy)}
+      staged={staged}
+      busy={busy}
+      selected={isPreviewedWorktree(entry, staged)}
+      onPreview={() => { onPreview(worktreeRefOf(entry, staged)) }}
+      onContextMenu={(event) => { openFileMenu(event, entry, staged) }}
+      onToggleStage={() => { stageEntry(entry, staged) }}
+    />
+  )
 
   return (
     <div className={css.git}>
-      {worktrees.length > 1 && (
-        <div className={css.gitWorktreeRow}>
-          <span className={css.gitWorktreeLabel}>{t('worktree')}</span>
-          <select
-            className={css.gitBranchSelect}
-            value={selectedWorktree ?? ''}
-            title={selectedWorktree}
-            disabled={busy}
-            onChange={(event) => { chooseWorktree(event.target.value) }}
-          >
-            {worktrees.map(entry => (
-              <option key={entry.path} value={entry.path}>
-                {entry.branch} · {baseName(entry.path)} ({entry.changes})
-              </option>
-            ))}
-          </select>
+      {(repoChoices.length > 1 || worktrees.length > 1 || branch !== '') && (
+        <div className={css.selectors}>
+          {repoChoices.length > 1 && (
+            <select
+              className={css.select}
+              value={repoRoot ?? ''}
+              title={repoRoot}
+              disabled={busy}
+              onChange={(event) => { chooseRepo(event.target.value) }}
+            >
+              {repoChoices.map(root => <option key={root} value={root}>{baseName(root)}</option>)}
+            </select>
+          )}
+          {worktrees.length > 1 && (
+            <select
+              className={css.select}
+              value={selectedWorktree ?? ''}
+              title={selectedWorktree}
+              disabled={busy}
+              onChange={(event) => { chooseWorktree(event.target.value) }}
+            >
+              {worktrees.map(entry => (
+                <option key={entry.path} value={entry.path}>
+                  {entry.branch} · {baseName(entry.path)} ({entry.changes})
+                </option>
+              ))}
+            </select>
+          )}
+          {branch !== '' && (branchOptions.length > 1
+            ? (
+              <select
+                className={css.select}
+                value={branch}
+                title={t('branch')}
+                disabled={busy}
+                onChange={(event) => { void checkout(event.target.value) }}
+              >
+                {branchOptions.map(name => <option key={name} value={name}>{name}</option>)}
+              </select>
+            )
+            : <span className={css.branchLabel} title={`${t('branch')}: ${branch}`}>{branch}</span>)}
         </div>
       )}
-      <div className={css.gitHeader}>
-        {(status?.repositories?.length ?? 0) > 1 && (
-          <select
-            className={css.gitBranchSelect}
-            value={repoRoot ?? ''}
-            title={repoRoot}
-            onChange={(event) => { chooseRepo(event.target.value) }}
-            disabled={busy}
-          >
-            {status!.repositories!.map(root => <option key={root} value={root}>{baseName(root)}</option>)}
-          </select>
-        )}
-        <select
-          className={css.gitBranchSelect}
-          value={status?.branch ?? ''}
-          onChange={(event) => { void checkout(event.target.value) }}
-          disabled={busy || (status !== null && !status.isRepo)}
-        >
-          {(status?.branch ?? '') !== '' && <option value={status!.branch}>{status!.branch}</option>}
-          {branchNames.filter(name => name !== status?.branch).map(name => <option key={name} value={name}>{name}</option>)}
-        </select>
-        <button
-          type="button"
-          className={css.iconButton}
-          aria-label={t('refresh')}
-          title={t('refresh')}
-          onClick={() => { void refresh() }}
-        >
-          <IconRefreshOutlineRegular size={14} />
-        </button>
-      </div>
 
-      {loading && <div className={css.gitPlaceholder}>{t('loading')}</div>}
-      {!loading && error !== null && <div className={css.gitError}>{error}</div>}
-      {!loading && status !== null && !status.isRepo && (
-        <div className={css.gitPlaceholder}>{t('notRepo')}</div>
-      )}
+      {viewError !== null && <Notice kind="error" role="alert">{viewError}</Notice>}
 
-      {status !== null && status.isRepo && (
+      {snapshot === null && status.loading && <Notice kind="loading" tone="page">{t('loading')}</Notice>}
+      {snapshot === null && !status.loading && status.error && <Notice kind="error" tone="page">{t('error')}</Notice>}
+      {snapshot !== null && !isRepo && <Notice kind="empty" tone="page">{t('notRepo')}</Notice>}
+      {snapshot?.truncated === true && <Notice kind="warn">{t('statusTruncated')}</Notice>}
+
+      {clean && <Notice kind="empty" tone="page">{t('changesClean')}</Notice>}
+
+      {isRepo && !clean && (
         <>
-          {status.truncated === true && (
-            <div className={css.gitEmpty}>{t('statusTruncated')}</div>
-          )}
-          <div className={css.gitSection}>
-            <div className={css.gitSectionHeader}>
-              <span>{t('staged')} ({stagedEntries.length})</span>
-              {stagedEntries.length > 0 && (
-                <button type="button" className={css.gitLink} disabled={busy} onClick={() => { void stageAll(true) }}>
-                  {t('unstageAll')}
-                </button>
-              )}
-            </div>
-            {stagedEntries.length === 0 && <div className={css.gitEmpty}>{t('noChanges')}</div>}
-            {stagedEntries.map(entry => renderEntry(entry, true))}
-          </div>
-          <div className={css.gitSection}>
-            <div className={css.gitSectionHeader}>
-              <span>{t('unstaged')} ({unstagedEntries.length})</span>
-              {unstagedEntries.length > 0 && (
-                <button type="button" className={css.gitLink} disabled={busy} onClick={() => { void stageAll(false) }}>
+          <SectionHeader
+            label={t('unstaged')}
+            count={unstagedEntries.length}
+            action={unstagedEntries.length > 0
+              ? (
+                <button type="button" className={css.link} disabled={busy} onClick={() => { stageAll(false) }}>
                   {t('stageAll')}
                 </button>
-              )}
-            </div>
-            {unstagedEntries.length === 0 && <div className={css.gitEmpty}>{t('noChanges')}</div>}
-            {unstagedEntries.map(entry => renderEntry(entry, false))}
-          </div>
+              )
+              : undefined}
+          />
+          {unstagedEntries.map(entry => renderEntry(entry, false))}
+          <SectionHeader
+            label={t('staged')}
+            count={stagedEntries.length}
+            action={stagedEntries.length > 0
+              ? (
+                <button type="button" className={css.link} disabled={busy} onClick={() => { stageAll(true) }}>
+                  {t('unstageAll')}
+                </button>
+              )
+              : undefined}
+          />
+          {stagedEntries.map(entry => renderEntry(entry, true))}
+        </>
+      )}
 
-          <div className={css.gitCommit}>
+      {isRepo && (
+        <div className={css.commitBar}>
+          <div className={css.commitRow}>
             <Input
-              className={css.gitCommitInput}
+              className={css.commitInput}
               placeholder={t('commitPlaceholder')}
               value={commitMsg}
               disabled={busy}
-              onChange={(event) => { setCommitMsg(event.target.value); setCommitError(null) }}
+              onChange={(event) => { setCommitMsg(event.target.value); setActionError(null) }}
               onKeyDown={(event) => {
-                if ((event.ctrlKey || event.metaKey) && event.key === 'Enter') void commit()
+                if ((event.ctrlKey || event.metaKey) && event.key === 'Enter') commit()
               }}
             />
-            <button
-              type="button"
-              className={css.gitCommitButton}
+            <Button
+              variant="primary"
+              size="sm"
               disabled={busy || commitMsg.trim() === '' || stagedEntries.length === 0}
-              onClick={() => { void commit() }}
+              onClick={commit}
             >
               {t('commit')}
+            </Button>
+          </div>
+          {actionError !== null && <Notice kind="error" tone="inline" role="alert">{actionError}</Notice>}
+        </div>
+      )}
+
+      {isRepo && (
+        <>
+          <SectionHeader label={t('history')} count={logEntries.length > 0 ? logEntries.length : undefined} />
+          {logEntries.length === 0 && logFailed && <Notice kind="error">{t('historyLoadError')}</Notice>}
+          {logEntries.length === 0 && !logFailed && logEnded && <Notice kind="empty" tone="page">{t('changesNoHistory')}</Notice>}
+          {logEntries.map(entry => (
+            <div
+              key={entry.hashFull}
+              role="button"
+              tabIndex={0}
+              className={css.logRow}
+              data-selected={selectedRef?.kind === 'commit' && selectedRef.hashFull === entry.hashFull ? 'true' : undefined}
+              title={`${entry.author} · ${entry.date}\n${entry.hashFull}`}
+              onClick={() => { onPreview(commitRefOf(entry)) }}
+              onKeyDown={(event) => {
+                if (event.key === 'Enter' || event.key === ' ') {
+                  event.preventDefault()
+                  onPreview(commitRefOf(entry))
+                }
+              }}
+              onContextMenu={(event) => { openHistoryMenu(event, entry) }}
+            >
+              <span className={css.logLine1}>
+                <span className={css.logHash}>{entry.hash}</span>
+                <span className={css.logSubject}>{entry.subject}</span>
+              </span>
+              <span className={css.logLine2}>
+                {refNames(entry.refs).map(ref => (
+                  <span key={ref} className={css.logRef}>{ref}</span>
+                ))}
+                <span className={css.logMeta}>{entry.author} · {relativeTime(entry.date)}</span>
+              </span>
+            </div>
+          ))}
+          {!logEnded && (
+            <button
+              type="button"
+              className={css.logMore}
+              disabled={logLoadingMore || busy}
+              onClick={() => { void loadMoreLog() }}
+            >
+              {logLoadingMore ? t('loading') : t('loadMore')}
             </button>
-          </div>
-          {commitError !== null && <div className={css.gitError}>{commitError}</div>}
-
-          <div className={css.gitSection}>
-            <div className={css.gitSectionHeader}><span>{t('history')}</span></div>
-            {logEntries.map(entry => (
-              <div
-                key={entry.hashFull}
-                role="button"
-                tabIndex={0}
-                className={css.gitLogRow}
-                data-selected={selectedRef?.kind === 'commit' && selectedRef.hashFull === entry.hashFull ? 'true' : undefined}
-                title={`${entry.author} · ${entry.date}\n${entry.hashFull}`}
-                onClick={() => { onPreview(commitRefOf(entry)) }}
-                onKeyDown={(event) => {
-                  if (event.key === 'Enter' || event.key === ' ') {
-                    event.preventDefault()
-                    onPreview(commitRefOf(entry))
-                  }
-                }}
-                onContextMenu={(event) => { openHistoryMenu(event, entry) }}
-              >
-                <span className={css.gitLogLine1}>
-                  <span className={css.gitLogHash}>{entry.hash}</span>
-                  <span className={css.gitLogSubject}>{entry.subject}</span>
-                </span>
-                <span className={css.gitLogLine2}>
-                  {refNames(entry.refs).map(ref => (
-                    <span key={ref} className={css.gitLogRef}>{ref}</span>
-                  ))}
-                  <span className={css.gitLogMeta}>{entry.author} · {relativeTime(entry.date)}</span>
-                </span>
-              </div>
-            ))}
-            {!logEnded && (
-              <button
-                type="button"
-                className={css.gitLogMore}
-                disabled={logLoadingMore || busy}
-                onClick={() => { void loadMoreLog() }}
-              >
-                {logLoadingMore ? t('loading') : t('loadMore')}
-              </button>
-            )}
-          </div>
-
-          {/*
-            The one shared file-row context menu, positioned at the right-click
-            cursor (portal so the panel's overflow clip cannot crop it).
-          */}
-          <Menu
-            open={fileMenu !== null}
-            onClose={() => { setFileMenu(null) }}
-            items={[
-              // A linked worktree outside the session workspace cannot be
-              // opened in the editor while the host's workspace fence is
-              // armed: it rejects every path under that checkout. Hide the
-              // action for that checkout so the menu does not offer a no-op
-              // that confuses the user; with the fence disarmed (the
-              // `workspaceFence` pref) the open is allowed through.
-              ...(fileMenu !== null && (store.getPrefs().workspaceFence === false || isWithinWorkspace(scope.cwd ?? '', resolveSidebarPath(repoRoot ?? selectedWorktree ?? scope.cwd, fileMenu.entry.path)))
-                ? [{ id: 'open', label: t('openEditor'), icon: <IconCodeOutlineRegular size={14} /> }]
-                : []),
-              fileMenu?.staged === true
-                ? { id: 'stage', label: t('unstage'), icon: <IconTrashOutlineRegular size={14} /> }
-                : { id: 'stage', label: t('stage'), icon: <IconPlusOutlineRegular size={14} /> },
-              ...(fileMenu !== null && !isUntracked(fileMenu.entry)
-                ? [{ id: 'discard', label: t('discard'), icon: <IconTrashOutlineRegular size={14} />, danger: true }]
-                : []),
-              { type: 'separator', id: 'sep1' },
-              { id: 'relative', label: t('copyRelative'), icon: <IconCopyOutlineRegular size={14} /> },
-              { id: 'absolute', label: t('copyAbsolute'), icon: <IconCopyOutlineRegular size={14} /> },
-            ]}
-            onSelect={(id) => {
-              const target = fileMenu
-              if (target === null) return
-              setFileMenu(null)
-              if (id === 'open') {
-                const resolved = resolveSidebarPath(repoRoot ?? selectedWorktree ?? scope.cwd, target.entry.path)
-                // Defense-in-depth: the menu hides this action when the
-                // resolved path escapes the session workspace, but a
-                // racing repo switch could still reach here with a path
-                // the host would reject. No-op in that case — unless the
-                // workspace fence is disarmed by pref.
-                if (store.getPrefs().workspaceFence !== false && !isWithinWorkspace(scope.cwd ?? '', resolved)) return
-                onOpenFile(resolved)
-                return
-              }
-              if (id === 'stage') {
-                void stageEntry(target.entry, target.staged)
-                return
-              }
-              if (id === 'discard') {
-                runConfirmed({
-                  title: t('discardTitle'),
-                  description: t('discardDesc', { path: target.entry.path }),
-                  confirmLabel: t('discard'),
-                  onConfirm: () => api.gitDiscard(gitScope, target.entry.path, selectedWorktree),
-                })
-                return
-              }
-              if (id === 'relative') {
-                copy(relativeTo(repoRoot ?? selectedWorktree ?? scope.cwd ?? '', target.entry.path))
-                return
-              }
-              if (id === 'absolute') copy(resolveSidebarPath(repoRoot ?? selectedWorktree ?? scope.cwd, target.entry.path))
-            }}
-            portal
-            compact
-            align="start"
-            getAnchorRect={() => (fileMenu === null ? null : new DOMRect(fileMenu.x, fileMenu.y, 0, 0))}
-            anchor={<span />}
-          />
-
-          {/* The shared history-row context menu. */}
-          <Menu
-            open={historyMenu !== null}
-            onClose={() => { setHistoryMenu(null) }}
-            items={[
-              { id: 'view', label: t('viewCommitDiff') },
-              { id: 'copyShort', label: t('copyShortHash'), icon: <IconCopyOutlineRegular size={14} /> },
-              { id: 'copyFull', label: t('copyFullHash'), icon: <IconCopyOutlineRegular size={14} /> },
-              { id: 'copySubject', label: t('copySubject'), icon: <IconCopyOutlineRegular size={14} /> },
-              { type: 'separator', id: 'sep2' },
-              { id: 'revert', label: t('revertCommit'), danger: true },
-              { id: 'cherryPick', label: t('cherryPickCommit'), danger: true },
-            ]}
-            onSelect={(id) => {
-              const target = historyMenu
-              if (target === null) return
-              setHistoryMenu(null)
-              if (id === 'view') {
-                onPreview(commitRefOf(target.entry))
-                return
-              }
-              if (id === 'copyShort') {
-                copy(target.entry.hash)
-                return
-              }
-              if (id === 'copyFull') {
-                copy(target.entry.hashFull)
-                return
-              }
-              if (id === 'copySubject') {
-                copy(target.entry.subject)
-                return
-              }
-              if (id === 'revert') {
-                runConfirmed({
-                  title: t('revertTitle'),
-                  description: t('revertDesc', { subject: target.entry.subject }),
-                  confirmLabel: t('revertCommit'),
-                  onConfirm: () => api.gitRevert(gitScope, target.entry.hashFull, selectedWorktree),
-                })
-                return
-              }
-              if (id === 'cherryPick') {
-                runConfirmed({
-                  title: t('cherryPickTitle'),
-                  description: t('cherryPickDesc', { subject: target.entry.subject }),
-                  confirmLabel: t('cherryPickCommit'),
-                  onConfirm: () => api.gitCherryPick(gitScope, target.entry.hashFull, selectedWorktree),
-                })
-              }
-            }}
-            portal
-            compact
-            align="start"
-            getAnchorRect={() => (historyMenu === null ? null : new DOMRect(historyMenu.x, historyMenu.y, 0, 0))}
-            anchor={<span />}
-          />
-
-          {/* Destructive actions land here first: Cancel / Confirm. */}
-          <Modal
-            open={confirm !== null}
-            onClose={() => { setConfirm(null) }}
-            title={confirm?.title ?? ''}
-            closeLabel={t('cancel')}
-            footer={(
-              <>
-                <Button variant="outline" onClick={() => { setConfirm(null) }}>{t('cancel')}</Button>
-                <Button
-                  variant="primary"
-                  disabled={busy}
-                  onClick={() => {
-                    const pending = confirm
-                    if (pending === null) return
-                    setConfirm(null)
-                    void pending.onConfirm()
-                  }}
-                >
-                  {confirm?.confirmLabel ?? ''}
-                </Button>
-              </>
-            )}
-          >
-            <p className={css.gitConfirmDesc}>{confirm?.description}</p>
-          </Modal>
+          )}
         </>
       )}
+
+      {/*
+        The one shared file-row context menu, positioned at the right-click
+        cursor (portal so the panel's overflow clip cannot crop it).
+      */}
+      <Menu
+        open={fileMenu !== null}
+        onClose={() => { setFileMenu(null) }}
+        items={[
+          // A linked worktree outside the session workspace cannot be
+          // opened in the editor while the host's workspace fence is
+          // armed: it rejects every path under that checkout. Hide the
+          // action for that checkout so the menu does not offer a no-op
+          // that confuses the user; with the fence disarmed (the
+          // `workspaceFence` pref) the open is allowed through.
+          ...(fileMenu !== null && (store.getPrefs().workspaceFence === false || isWithinWorkspace(scope.cwd ?? '', resolveSidebarPath(repoRoot ?? selectedWorktree ?? scope.cwd, fileMenu.entry.path)))
+            ? [{ id: 'open', label: t('openEditor'), icon: <IconCodeOutlineRegular size={14} /> }]
+            : []),
+          fileMenu?.staged === true
+            ? { id: 'stage', label: t('unstage'), icon: <IconTrashOutlineRegular size={14} /> }
+            : { id: 'stage', label: t('stage'), icon: <IconPlusOutlineRegular size={14} /> },
+          ...(fileMenu !== null && !isUntracked(fileMenu.entry)
+            ? [{ id: 'discard', label: t('discard'), icon: <IconTrashOutlineRegular size={14} />, danger: true }]
+            : []),
+          { type: 'separator', id: 'sep1' },
+          { id: 'relative', label: t('copyRelative'), icon: <IconCopyOutlineRegular size={14} /> },
+          { id: 'absolute', label: t('copyAbsolute'), icon: <IconCopyOutlineRegular size={14} /> },
+        ]}
+        onSelect={(id) => {
+          const target = fileMenu
+          if (target === null) return
+          setFileMenu(null)
+          if (id === 'open') {
+            const resolved = resolveSidebarPath(repoRoot ?? selectedWorktree ?? scope.cwd, target.entry.path)
+            // Defense-in-depth: the menu hides this action when the
+            // resolved path escapes the session workspace, but a
+            // racing repo switch could still reach here with a path
+            // the host would reject. No-op in that case — unless the
+            // workspace fence is disarmed by pref.
+            if (store.getPrefs().workspaceFence !== false && !isWithinWorkspace(scope.cwd ?? '', resolved)) return
+            onOpenFile(resolved)
+            return
+          }
+          if (id === 'stage') {
+            stageEntry(target.entry, target.staged)
+            return
+          }
+          if (id === 'discard') {
+            runConfirmed({
+              title: t('discardTitle'),
+              description: t('discardDesc', { path: target.entry.path }),
+              confirmLabel: t('discard'),
+              onConfirm: () => api.gitDiscard(gitScopeNow(), target.entry.path, selectedWorktree),
+            })
+            return
+          }
+          if (id === 'relative') {
+            copy(relativeTo(repoRoot ?? selectedWorktree ?? scope.cwd ?? '', target.entry.path))
+            return
+          }
+          if (id === 'absolute') copy(resolveSidebarPath(repoRoot ?? selectedWorktree ?? scope.cwd, target.entry.path))
+        }}
+        portal
+        compact
+        align="start"
+        getAnchorRect={() => (fileMenu === null ? null : new DOMRect(fileMenu.x, fileMenu.y, 0, 0))}
+        anchor={<span />}
+      />
+
+      {/* The shared history-row context menu. */}
+      <Menu
+        open={historyMenu !== null}
+        onClose={() => { setHistoryMenu(null) }}
+        items={[
+          { id: 'view', label: t('viewCommitDiff') },
+          { id: 'copyShort', label: t('copyShortHash'), icon: <IconCopyOutlineRegular size={14} /> },
+          { id: 'copyFull', label: t('copyFullHash'), icon: <IconCopyOutlineRegular size={14} /> },
+          { id: 'copySubject', label: t('copySubject'), icon: <IconCopyOutlineRegular size={14} /> },
+          { type: 'separator', id: 'sep2' },
+          { id: 'revert', label: t('revertCommit'), danger: true },
+          { id: 'cherryPick', label: t('cherryPickCommit'), danger: true },
+        ]}
+        onSelect={(id) => {
+          const target = historyMenu
+          if (target === null) return
+          setHistoryMenu(null)
+          if (id === 'view') {
+            onPreview(commitRefOf(target.entry))
+            return
+          }
+          if (id === 'copyShort') {
+            copy(target.entry.hash)
+            return
+          }
+          if (id === 'copyFull') {
+            copy(target.entry.hashFull)
+            return
+          }
+          if (id === 'copySubject') {
+            copy(target.entry.subject)
+            return
+          }
+          if (id === 'revert') {
+            runConfirmed({
+              title: t('revertTitle'),
+              description: t('revertDesc', { subject: target.entry.subject }),
+              confirmLabel: t('revertCommit'),
+              onConfirm: () => api.gitRevert(gitScopeNow(), target.entry.hashFull, selectedWorktree),
+            })
+            return
+          }
+          if (id === 'cherryPick') {
+            runConfirmed({
+              title: t('cherryPickTitle'),
+              description: t('cherryPickDesc', { subject: target.entry.subject }),
+              confirmLabel: t('cherryPickCommit'),
+              onConfirm: () => api.gitCherryPick(gitScopeNow(), target.entry.hashFull, selectedWorktree),
+            })
+          }
+        }}
+        portal
+        compact
+        align="start"
+        getAnchorRect={() => (historyMenu === null ? null : new DOMRect(historyMenu.x, historyMenu.y, 0, 0))}
+        anchor={<span />}
+      />
+
+      {/* Destructive actions land here first: Cancel / Confirm. */}
+      <ConfirmDialog
+        open={confirm !== null}
+        title={confirm?.title ?? ''}
+        description={confirm?.description ?? ''}
+        confirmLabel={confirm?.confirmLabel ?? ''}
+        cancelLabel={t('cancel')}
+        danger
+        busy={busy}
+        onConfirm={confirmPending}
+        onClose={() => { setConfirm(null) }}
+      />
     </div>
   )
 }
diff --git a/src/client/changes/SessionLens.tsx b/src/client/changes/SessionLens.tsx
index 8e33319..fec7a0e 100644
--- a/src/client/changes/SessionLens.tsx
+++ b/src/client/changes/SessionLens.tsx
@@ -7,15 +7,18 @@
  * arrive pre-folded from the tab (which owns the event poll); this
  * component is purely presentational.
  */
-import { useMemo, useState, type ReactNode } from 'react'
+import { useMemo, useState } from 'react'
 import { relativeTime, t } from '../locales.ts'
 import { groupByFile, type FileOp, type FileOpKind } from './ops.ts'
 import { formatBytes } from '../diff/rows.ts'
+import { Chip, Notice, StatusBadge } from '../ui/index.ts'
 import css from './changes.module.css'
 
 /** The op-kind filter chips: 'all' or one concrete kind. */
 type OpFilter = 'all' | FileOpKind
 
+const KIND_LABEL = { read: 'changesRead', write: 'changesWrite', edit: 'changesEdit' } as const
+
 export interface SessionLensProps {
   /** The folded file operations, newest first (the tab's poll owns them). */
   ops: readonly FileOp[]
@@ -41,19 +44,6 @@ export function SessionLens({ ops, loadError, onPreview, selectedCallId }: Sessi
     return map
   }, [ops])
 
-  const chip = (value: OpFilter, label: string, count: number): ReactNode => (
-    <button
-      type="button"
-      key={value}
-      className={css.filterChip}
-      data-active={filter === value ? 'true' : undefined}
-      onClick={() => { setFilter(value) }}
-      aria-pressed={filter === value}
-    >
-      {label}{value !== 'all' ? ` ${String(count)}` : ''}
-    </button>
-  )
-
   // Sizing a row's content constructs a Blob (a UTF-8 encode of the whole
   // edit) — that was per row PER RENDER, re-encoding every field on every
   // poll tick. ops keeps its identity between unchanged polls (see the
@@ -71,15 +61,24 @@ export function SessionLens({ ops, loadError, onPreview, selectedCallId }: Sessi
   return (
     <div className={css.session}>
       <div className={css.filterRow} role="group" aria-label={t('changesSessionLens')}>
-        {chip('all', t('changesFilterAll'), ops.length)}
-        {chip('write', t('changesWrite'), counts.get('write') ?? 0)}
-        {chip('edit', t('changesEdit'), counts.get('edit') ?? 0)}
-        {chip('read', t('changesRead'), counts.get('read') ?? 0)}
+        <Chip active={filter === 'all'} count={ops.length} onClick={() => { setFilter('all') }}>
+          {t('changesFilterAll')}
+        </Chip>
+        {(['write', 'edit', 'read'] as const).map(kind => (
+          <Chip
+            key={kind}
+            active={filter === kind}
+            count={counts.get(kind) ?? 0}
+            onClick={() => { setFilter(kind) }}
+          >
+            {t(KIND_LABEL[kind])}
+          </Chip>
+        ))}
       </div>
       <div className={css.sessionList}>
-        {loadError && <div className={css.loadError}>{t('changesLoadError')}</div>}
-        {ops.length === 0 && !loadError && <div className={css.empty}>{t('changesSessionEmpty')}</div>}
-        {ops.length > 0 && filteredOps.length === 0 && <div className={css.empty}>{t('changesFilterEmpty')}</div>}
+        {loadError && <Notice kind="error" role="alert">{t('changesLoadError')}</Notice>}
+        {ops.length === 0 && !loadError && <Notice kind="empty" tone="page">{t('changesSessionEmpty')}</Notice>}
+        {ops.length > 0 && filteredOps.length === 0 && <Notice kind="empty" tone="page">{t('changesFilterEmpty')}</Notice>}
         {[...groups.entries()].map(([path, fileOps]) => (
           <div key={path} className={css.fileGroup}>
             <div className={css.filePath} title={path}>{path}</div>
@@ -93,9 +92,7 @@ export function SessionLens({ ops, loadError, onPreview, selectedCallId }: Sessi
                 data-selected={selectedCallId === op.callId ? 'true' : undefined}
                 onClick={() => { onPreview(path, op) }}
               >
-                <span className={css.opKind} data-kind={op.kind}>
-                  {t(op.kind === 'read' ? 'changesRead' : op.kind === 'write' ? 'changesWrite' : 'changesEdit')}
-                </span>
+                <StatusBadge tone={op.kind}>{t(KIND_LABEL[op.kind])}</StatusBadge>
                 {op.running && <span className={css.opFlag}>{t('changesRunning')}</span>}
                 {op.isError && <span className={css.opFlagError}>{t('changesError')}</span>}
                 <span className={css.opMeta}>
diff --git a/src/client/changes/changes.module.css b/src/client/changes/changes.module.css
index b64aed6..5bcd6f5 100644
--- a/src/client/changes/changes.module.css
+++ b/src/client/changes/changes.module.css
@@ -1,18 +1,20 @@
-/* The unified changes tab: lens switcher + Git lens + session lens + the
-   shared preview pane. Semantic --dsw-alias tokens only (skin contract).
-   The git lens styles moved here from sidebar.module.css when the git panel
-   became a lens of this tab; the generic placeholder/empty/error trio stays
-   duplicated in both modules (the diff tab still owns its copy). */
+/* The unified changes tab: the 36px lens header + Git lens + session lens +
+   the shared preview pane. Token-only by contract (`tests/theme.spec.ts` scans
+   every module sheet) and cut to the plugin's native scale — 12px body, 11px
+   meta, 28px rows/controls, 2/3/4px radii (see
+   docs/plans/2026-09-27-files-changes-uiux.md §1).
 
-.root { display: flex; flex-direction: column; min-height: 0; height: 100%; background: var(--dsw-alias-bg-base); color: var(--dsw-alias-label-primary); font-size: 12px; }
+   The generic chrome — icon buttons, chips, section bands, badges, empty /
+   loading / error lines and the confirm dialog — now lives in
+   `src/client/ui/kit.module.css`; this sheet keeps only layout and the
+   surfaces unique to this tab. */
 
-/* ── Lens switcher ─────────────────────────────────────────────────────── */
+.root { display: flex; flex-direction: column; min-height: 0; height: 100%; background: var(--dsw-alias-bg-base); color: var(--dsw-alias-label-primary); font: var(--dsw-font-xxs-12); }
 
-.lensBar { flex: none; display: flex; align-items: center; padding: 8px 8px 4px 12px; }
-.lensSwitch { display: inline-flex; gap: 2px; padding: 2px; border: 1px solid var(--dsw-alias-border-l2); border-radius: 8px; }
-.lensButton { border: 0; border-radius: 6px; padding: 2px 10px; background: transparent; color: var(--dsw-alias-label-secondary); font: var(--dsw-font-xxxs-strong-11); cursor: pointer; }
-.lensButton:hover { color: var(--dsw-alias-label-primary); }
-.lensButton[data-active='true'] { background: var(--dsw-alias-interactive-bg-active); color: var(--dsw-alias-label-primary); }
+/* ── Lens header ───────────────────────────────────────────────────────── */
+
+.head { flex: none; display: flex; align-items: center; gap: 8px; height: 36px; padding: 0 8px 0 12px; border-bottom: 1px solid var(--dsw-alias-border-l1); }
+.headAction { margin-left: auto; }
 
 /* ── Git lens (the former git panel) ───────────────────────────────────── */
 
@@ -28,311 +30,134 @@
   overflow-x: hidden;
 }
 
-.gitHeader {
-  flex: none;
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  height: 36px;
-  padding: 0 8px 0 12px;
-}
+/* The selector band: branch / repository / worktree pickers (only rendered
+   for real choices) and nothing else — the counts live in the section bands. */
+.selectors { flex: none; display: flex; align-items: center; gap: 6px; padding: 6px 12px 0; }
 
-.gitWorktreeRow {
-  flex: none;
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  padding: 6px 8px 0 12px;
-}
-
-.gitWorktreeLabel {
-  flex: none;
-  color: var(--dsw-alias-label-tertiary);
-  font: var(--dsw-font-xxxs-11);
-}
-
-.gitBranchSelect {
+.select {
   flex: 1;
   min-width: 0;
-  height: 26px;
+  height: 28px;
   padding: 0 6px;
   border: 1px solid var(--dsw-alias-border-l2);
-  border-radius: 6px;
+  border-radius: 3px;
   background: var(--dsw-alias-bg-base);
   color: var(--dsw-alias-label-primary);
   font: var(--dsw-font-xxs-12);
 }
 
-.gitSection {
-  border-top: 1px solid var(--dsw-alias-border-l1);
-}
+/* A single branch has nothing to choose: it reads as the row's label. */
+.branchLabel { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--dsw-alias-label-secondary); font: var(--dsw-font-xxxs-11); }
 
-.gitSectionHeader {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 6px 12px 4px;
-  font: var(--dsw-font-xxxs-strong-11);
-  color: var(--dsw-alias-label-tertiary);
-  text-transform: uppercase;
-}
+/* The section band's text action ("stage all" / "unstage all"). */
+.link { border: none; background: transparent; padding: 0; font: var(--dsw-font-xxxs-strong-11); color: var(--dsw-alias-brand-primary); cursor: pointer; }
+.link:hover:not(:disabled) { text-decoration: underline; }
+.link:disabled { opacity: 0.4; cursor: default; }
 
-.gitLink {
-  border: none;
-  background: transparent;
-  font: var(--dsw-font-xxxs-11);
-  color: var(--dsw-alias-brand-primary);
-  cursor: pointer;
-  padding: 0;
-}
-
-.gitLink:hover:not(:disabled) {
-  text-decoration: underline;
-}
-
-.gitLink:disabled {
-  opacity: 0.4;
-  cursor: default;
-}
-
-.gitRow {
+/* One changed file: badge + name + dimmed directory + the trailing action. */
+.row {
   display: flex;
   align-items: center;
   gap: 6px;
-  min-height: 34px;
+  min-height: 28px;
   margin: 0 6px;
-  padding: 0 8px;
-  border-radius: 8px;
+  padding: 0 4px 0 8px;
+  border-radius: 4px;
   animation: dsh-row-in 150ms var(--ds-ease-in-out);
 }
+.row:hover { background: var(--dsw-alias-interactive-bg-hover); }
+.row[data-selected='true'] { background: var(--dsw-alias-interactive-bg-active); }
 
-.gitRow:hover {
-  background: var(--dsw-alias-interactive-bg-hover);
-}
-
-.gitRow[data-selected='true'] {
-  background: var(--dsw-alias-interactive-bg-active);
-}
-
-.gitRowMain {
+.rowMain {
   flex: 1;
   min-width: 0;
   display: flex;
-  align-items: center;
-  gap: 8px;
+  align-items: baseline;
+  gap: 6px;
   border: none;
   background: transparent;
-  padding: 3px 0;
+  padding: 0;
   cursor: pointer;
   text-align: left;
 }
 
-.gitBadge {
+.rowName { flex: none; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--dsw-alias-label-primary); }
+/* The directory is context, not identity: it shrinks first and stays quiet. */
+.rowDir { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--dsw-alias-label-tertiary); font: var(--dsw-font-xxxs-11); direction: rtl; text-align: left; }
+
+/* ── Commit bar (docked to the bottom edge of the scroll area) ─────────── */
+
+.commitBar {
+  position: sticky;
+  bottom: 0;
+  z-index: 1;
   flex: none;
-  width: 20px;
-  height: 16px;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: 4px;
-  font: var(--dsw-font-xxxs-strong-11);
-  background: var(--dsw-alias-interactive-bg-hover);
-  color: var(--dsw-alias-label-secondary);
-}
-
-/* Status-letter tint: A added / D deleted / M·R modified / C·U conflicts;
-   untracked '?' reads as a not-yet-added file, so it shares the added tint. */
-.gitBadge[data-letter='A'], .gitBadge[data-letter='?'] { color: var(--dsw-alias-state-success-primary); }
-.gitBadge[data-letter='D'] { color: var(--dsw-alias-state-error-primary); }
-.gitBadge[data-letter='M'], .gitBadge[data-letter='R'] { color: var(--dsw-alias-state-business-primary); }
-.gitBadge[data-letter='C'], .gitBadge[data-letter='U'] { color: var(--dsw-alias-state-warn-primary); }
-
-.gitName {
-  flex: 1;
-  min-width: 0;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  font: var(--dsw-font-s-14);
-  color: var(--dsw-alias-label-primary);
-}
-
-.gitEmpty {
-  padding: 4px 12px 8px;
-  font: var(--dsw-font-xxs-12);
-  color: var(--dsw-alias-label-tertiary);
-}
-
-.gitPlaceholder {
-  padding: 16px;
-  font: var(--dsw-font-xxs-12);
-  color: var(--dsw-alias-label-tertiary);
-  text-align: center;
-}
-
-.gitError {
-  padding: 8px 12px;
-  font: var(--dsw-font-xxs-12);
-  color: var(--dsw-alias-state-error-primary);
-  white-space: pre-wrap;
-}
-
-.gitConfirmDesc {
-  margin: 0;
-  font: var(--dsw-font-s-14);
-  color: var(--dsw-alias-label-primary);
-  white-space: pre-wrap;
-}
-
-.gitCommit {
   display: flex;
-  gap: 6px;
+  flex-direction: column;
+  gap: 4px;
   padding: 8px 12px;
   border-top: 1px solid var(--dsw-alias-border-l1);
-  align-items: center;
+  background: var(--dsw-alias-bg-base);
 }
+.commitRow { display: flex; align-items: center; gap: 6px; }
+.commitInput { flex: 1; min-width: 0; }
 
-.gitCommitInput {
-  flex: 1;
-  min-width: 0;
-}
-
-.gitCommitButton {
-  flex: none;
-  height: 26px;
-  padding: 0 12px;
-  border: none;
-  border-radius: 6px;
-  background: var(--dsw-alias-button-primary-fill);
-  color: var(--dsw-alias-label-primary-inverted);
-  font: var(--dsw-font-xxs-strong-12);
-  cursor: pointer;
-}
-
-.gitCommitButton:hover:not(:disabled) {
-  background: var(--dsw-alias-button-primary-hover);
-}
-
-.gitCommitButton:disabled {
-  opacity: 0.45;
-  cursor: default;
-}
+/* ── History ───────────────────────────────────────────────────────────── */
 
 /* A history row: line 1 = hash + subject, line 2 = ref badges + author/date
    (badges live on the second line so they never crowd the subject). */
-.gitLogRow {
+.logRow {
   display: flex;
   flex-direction: column;
   gap: 2px;
-  padding: 5px 12px;
+  padding: 4px 12px;
+  margin: 0 6px;
+  border-radius: 4px;
   cursor: pointer;
-  border-radius: 8px;
 }
+.logRow:hover { background: var(--dsw-alias-interactive-bg-hover); }
+.logRow[data-selected='true'] { background: var(--dsw-alias-interactive-bg-active); }
 
-.gitLogRow:hover {
-  background: var(--dsw-alias-interactive-bg-hover);
-}
+.logLine1 { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
+.logHash { flex: none; font: var(--dsw-font-markdown-code-block-small); color: var(--dsw-alias-label-tertiary); }
+.logLine2 { display: flex; align-items: center; gap: 6px; min-width: 0; flex-wrap: wrap; }
+.logRef { flex: none; padding: 0 5px; border: 1px solid var(--dsw-alias-border-l2); border-radius: 2px; font: var(--dsw-font-xxxs-strong-11); color: var(--dsw-alias-brand-primary); white-space: nowrap; }
+.logSubject { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--dsw-alias-label-primary); }
+.logMeta { font: var(--dsw-font-xxxs-11); color: var(--dsw-alias-label-tertiary); }
 
-.gitLogRow[data-selected='true'] {
-  background: var(--dsw-alias-interactive-bg-active);
-}
-
-.gitLogLine1 {
-  display: flex;
-  align-items: baseline;
-  gap: 8px;
-  min-width: 0;
-}
-
-.gitLogHash {
-  flex: none;
-  font: var(--dsw-font-markdown-code-block-small);
-  color: var(--dsw-alias-label-tertiary);
-}
-
-.gitLogLine2 {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  min-width: 0;
-  flex-wrap: wrap;
-}
-
-.gitLogRef {
-  flex: none;
-  padding: 0 5px;
-  border: 1px solid var(--dsw-alias-border-l2);
-  border-radius: 999px;
-  font: var(--dsw-font-xxxs-strong-11);
-  color: var(--dsw-alias-brand-primary);
-  white-space: nowrap;
-}
-
-.gitLogSubject {
-  flex: 1;
-  min-width: 0;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  font: var(--dsw-font-s-14);
-  color: var(--dsw-alias-label-primary);
-}
-
-.gitLogMeta {
-  font: var(--dsw-font-xxxs-11);
-  color: var(--dsw-alias-label-tertiary);
-}
-
-.gitLogMore {
+.logMore {
   display: block;
   width: calc(100% - 24px);
   margin: 4px 12px 8px;
-  padding: 6px 0;
+  height: 28px;
   border: 1px solid var(--dsw-alias-border-l2);
-  border-radius: 6px;
+  border-radius: 3px;
   background: transparent;
   font: var(--dsw-font-xxs-12);
   color: var(--dsw-alias-label-secondary);
   cursor: pointer;
 }
-
-.gitLogMore:hover:not(:disabled) {
-  background: var(--dsw-alias-interactive-bg-hover);
-  color: var(--dsw-alias-label-primary);
-}
-
-.gitLogMore:disabled {
-  opacity: 0.5;
-  cursor: default;
-}
+.logMore:hover:not(:disabled) { background: var(--dsw-alias-interactive-bg-hover); color: var(--dsw-alias-label-primary); }
+.logMore:disabled { opacity: 0.5; cursor: default; }
 
 /* ── Session lens (this round's files) ─────────────────────────────────── */
 
 .session { flex: 1; min-height: 0; display: flex; flex-direction: column; }
-
-.filterRow { flex: none; display: flex; gap: 4px; padding: 2px 8px 6px 12px; flex-wrap: wrap; }
-.filterChip { border: 1px solid var(--dsw-alias-border-l2); border-radius: 999px; padding: 1px 8px; background: transparent; color: var(--dsw-alias-label-secondary); font: var(--dsw-font-xxxs-11); cursor: pointer; }
-.filterChip:hover { color: var(--dsw-alias-label-primary); background: var(--dsw-alias-interactive-bg-hover); }
-.filterChip[data-active='true'] { background: var(--dsw-alias-interactive-bg-active); color: var(--dsw-alias-label-primary); border-color: transparent; }
-
+.filterRow { flex: none; display: flex; gap: 4px; padding: 6px 12px; flex-wrap: wrap; }
 .sessionList { flex: 1; min-height: 0; overflow-y: auto; padding: 0 6px 10px; }
-.empty { color: var(--dsw-alias-label-tertiary); padding: 24px 8px; text-align: center; }
-.loadError { margin: 4px 8px; padding: 6px 10px; border-left: 3px solid var(--dsw-alias-state-warn-primary); border-radius: 0 6px 6px 0; color: var(--dsw-alias-label-secondary); font-size: 11px; }
 
 .fileGroup { margin-bottom: 6px; }
 /* The group label sits between op blocks: extra head padding separates it from
    the previous file's rows, the first group starts flush. */
 .filePath { display: block; color: var(--dsw-alias-label-tertiary); font-family: var(--ds-font-family-code, monospace); font-size: 11px; padding: 6px 4px 2px; word-break: break-all; }
 .fileGroup:first-child .filePath { padding-top: 2px; }
-.opRow { display: flex; align-items: center; gap: 6px; width: 100%; border: 0; border-radius: 6px; background: transparent; color: var(--dsw-alias-label-primary); font: inherit; font-size: 11px; padding: 3px 5px; cursor: pointer; text-align: left; }
+
+.opRow { display: flex; align-items: center; gap: 6px; width: 100%; min-height: 24px; border: 0; border-radius: 4px; background: transparent; color: var(--dsw-alias-label-primary); font: inherit; font-size: 11px; padding: 0 5px; cursor: pointer; text-align: left; }
 .opRow:hover { background: var(--dsw-alias-interactive-bg-hover); }
 .opRow[data-selected='true'] { background: var(--dsw-alias-interactive-bg-active); }
 /* A failed op carries a quiet error inset bar (the flag chip names it). */
 .opRow[data-op-error='true'] { box-shadow: inset 2px 0 0 var(--dsw-alias-state-error-primary); }
-.opKind { border-radius: 4px; font-size: 10px; line-height: 16px; padding: 0 5px; background: var(--dsw-alias-interactive-bg-hover); color: var(--dsw-alias-label-secondary); flex: none; }
-.opKind[data-kind='write'] { color: var(--dsw-alias-state-success-primary); }
-.opKind[data-kind='edit'] { color: var(--dsw-alias-state-business-primary); }
-/* Size + relative time ride as one right-aligned cluster so the kind chips
+/* Size + relative time ride as one right-aligned cluster so the kind badges
    form a scannable left rail and the meta column stays flush right. */
 .opMeta { margin-left: auto; display: inline-flex; align-items: baseline; gap: 8px; flex: none; min-width: 0; }
 .opTime { color: var(--dsw-alias-label-tertiary); font-size: 10px; flex: none; }
@@ -342,10 +167,7 @@
 
 /* ── Shared preview pane ───────────────────────────────────────────────── */
 
-.redactBanner { flex: none; font: var(--dsw-font-xxxs-strong-11); padding: 2px 8px; border-radius: 7px; color: var(--dsw-alias-state-warn-primary); background: var(--dsw-alias-interactive-bg-hover); white-space: nowrap; }
-.mdToggle { flex: none; border: 1px solid var(--dsw-alias-border-l1); border-radius: 7px; background: transparent; color: var(--dsw-alias-label-secondary); font: var(--dsw-font-xxxs-strong-11); padding: 2px 8px; cursor: pointer; }
-.mdToggle:hover { background: var(--dsw-alias-interactive-bg-hover); color: var(--dsw-alias-label-primary); }
-.mdToggle[data-on='true'] { border-color: var(--dsw-alias-state-business-primary); color: var(--dsw-alias-state-business-primary); }
+.redactBanner { flex: none; font: var(--dsw-font-xxxs-strong-11); padding: 2px 8px; border-radius: 2px; color: var(--dsw-alias-state-warn-primary); background: var(--dsw-alias-interactive-bg-hover); white-space: nowrap; }
 .mdBody { padding: 12px 16px 20px; font: var(--dsw-font-xs-regular-13); line-height: 1.6; min-height: 0; overflow-y: auto; }
 .htmlPane { flex: 1; min-height: 0; display: flex; }
 .htmlFrame { flex: 1; width: 100%; border: none; background: var(--dsw-alias-bg-base); }
@@ -355,36 +177,18 @@
 .dragHandle::after { content: ''; position: absolute; left: calc(50% - 18px); top: 3px; width: 36px; height: 2px; border-radius: 1px; background: var(--dsw-alias-border-l2); }
 .dragHandle:hover::after, .dragHandle:focus-visible::after { background: var(--dsw-alias-state-business-primary); }
 .diffHead { display: flex; align-items: center; gap: 6px; padding: 3px 8px 3px 10px; border-bottom: 1px solid var(--dsw-alias-border-l1); }
-.diffKind { flex: none; border-radius: 4px; font-size: 10px; line-height: 16px; padding: 0 5px; background: var(--dsw-alias-interactive-bg-hover); color: var(--dsw-alias-label-secondary); }
-.diffKind[data-kind='git'] { color: var(--dsw-alias-brand-primary); }
-.diffKind[data-kind='write'] { color: var(--dsw-alias-state-success-primary); }
-.diffKind[data-kind='edit'] { color: var(--dsw-alias-state-business-primary); }
 /* The path keeps its tail (the file name is the identity; directories are
    context): an RTL paragraph renders an ASCII path in reading order while
    clipping its HEAD under the ellipsis. */
 .diffPath { flex: 1; direction: rtl; font-family: var(--ds-font-family-code, monospace); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--dsw-alias-label-primary); min-width: 0; }
 .diffStats { flex: none; display: inline-flex; gap: 5px; font-size: 10px; font-family: var(--ds-font-family-code, monospace); }
 
-.iconButton {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 24px;
-  height: 24px;
-  padding: 0;
-  border: none;
-  border-radius: 6px;
-  background: transparent;
-  color: var(--dsw-alias-label-secondary);
-  cursor: pointer;
-  flex: none;
-}
-.iconButton:hover:not(:disabled) { background: var(--dsw-alias-interactive-bg-hover); color: var(--dsw-alias-label-primary); }
-.iconButton:disabled { opacity: 0.4; cursor: default; }
-
 .paneBody { flex: 1; min-height: 0; overflow-y: auto; }
-.readError { color: var(--dsw-alias-state-error-primary); border-left: 3px solid var(--dsw-alias-state-error-primary); border-radius: 0 6px 6px 0; margin: 6px 8px; padding: 6px 10px; white-space: pre-wrap; word-break: break-word; }
-.priorUnknown { color: var(--dsw-alias-label-tertiary); font-size: 10px; padding: 3px 10px; }
+/* An op's error body: the kit's error ink with the row's inset bar. */
+.readError { border-left: 3px solid var(--dsw-alias-state-error-primary); margin: 6px 8px; padding: 6px 10px; word-break: break-word; }
+
+/* The op preview whose callId left the loaded event window. */
+.paneGone { flex: none; display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-top: 1px solid var(--dsw-alias-border-l1); }
 
 /* ── Shared bits ───────────────────────────────────────────────────────── */
 
@@ -393,15 +197,14 @@
   from { opacity: 0; }
 }
 
-/* Keyboard focus rings match the shared sidebar convention. */
-.gitLink:focus-visible, .gitRowMain:focus-visible, .gitLogRow:focus-visible,
-.gitCommitButton:focus-visible, .gitLogMore:focus-visible, .gitBranchSelect:focus-visible,
-.lensButton:focus-visible, .filterChip:focus-visible, .iconButton:focus-visible,
-.dragHandle:focus-visible {
+/* Keyboard focus rings match the shared sidebar convention (the kit atoms
+   carry their own). */
+.link:focus-visible, .rowMain:focus-visible, .logRow:focus-visible,
+.logMore:focus-visible, .select:focus-visible, .dragHandle:focus-visible {
   outline: 2px solid var(--dsw-alias-interactive-bg-hover-accent);
   outline-offset: -1px;
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .gitRow { animation: none; }
+  .row { animation: none; }
 }
diff --git a/src/client/diff/use-git-diff.ts b/src/client/diff/use-git-diff.ts
new file mode 100644
index 0000000..54dc86a
--- /dev/null
+++ b/src/client/diff/use-git-diff.ts
@@ -0,0 +1,183 @@
+/**
+ * The ONE loader behind every git diff surface: the changes tab's inline
+ * preview pane (`changes/DiffPane.tsx`) and the dedicated diff tab
+ * (`DiffTab.tsx`) used to carry byte-identical copies of three behaviors —
+ * the staged-side fallback (an empty requested side retries the other one),
+ * the untracked full-addition fallback (`git diff` never lists an untracked
+ * file, so its content is read through the media route), and the per-file
+ * fold-content cache the on-demand hunk expansion shares between sibling
+ * folds. They live here once so a fix in one surface cannot miss the other.
+ *
+ * The hook is inert (`loading:false`, no fetch) for a `null` ref, which is
+ * how the preview pane hosts non-git (session-op) targets.
+ */
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
+import type { SessionScope } from '../api.ts'
+import { api } from '../api.ts'
+import type { SidebarDiffRef } from '../state.ts'
+import { resolveSidebarPath } from '../paths.ts'
+import { displayPath, foldRowsFromContents, type DiffFile, type DiffRow, type FoldSegment } from './rows.ts'
+
+/** The loaded state of one git diff target. */
+export interface GitDiffTarget {
+  /** A fetch is in flight (true only while nothing has loaded yet, or after a refresh drops the data). */
+  loading: boolean
+  error: string | null
+  /** The patch text; `''` = the file genuinely has no text change. */
+  diffText: string | null
+  /** Untracked-file content rendered as a full addition (undefined otherwise). */
+  untracked: string | undefined
+  /** Re-read the diff (and drop the fold cache) with the next tick. */
+  refresh(): void
+  /** The on-demand fold loader `DiffFiles` forwards to its rows (undefined without a ref). */
+  resolveFold: ((file: DiffFile, segment: FoldSegment) => Promise<readonly DiffRow[]>) | undefined
+}
+
+/**
+ * Load one git diff target (worktree change or commit patch) and expose its
+ * on-demand fold expansion. `ref === null` keeps every value inert.
+ */
+export function useGitDiffTarget(ref: SidebarDiffRef | null, scope: SessionScope): GitDiffTarget {
+  const [tick, setTick] = useState(0)
+  const [loading, setLoading] = useState(ref !== null)
+  const [error, setError] = useState<string | null>(null)
+  const [diffText, setDiffText] = useState<string | null>(null)
+  const [untracked, setUntracked] = useState<string | undefined>(undefined)
+  // The staged flag of the side ACTUALLY rendered: when the requested side's
+  // diff came back empty the load falls back to the other side, and the fold
+  // expansion must read that side's revisions (else the sliced line numbers
+  // land on the wrong contents).
+  const [effectiveStaged, setEffectiveStaged] = useState<boolean | null>(null)
+
+  // Granular scope fields: the scope object's identity churns, only these
+  // three gate the target (the same rule the sibling call sites used).
+  const sessionId = scope.sessionId
+  const cwd = scope.cwd
+  const repoRoot = ref?.repoRoot
+  const gitScope = useMemo<SessionScope>(
+    () => ({ sessionId, cwd, ...(repoRoot !== undefined ? { repoRoot } : {}) }),
+    [sessionId, cwd, repoRoot],
+  )
+
+  useEffect(() => {
+    if (ref === null) return
+    let cancelled = false
+    const paneScope: SessionScope = { sessionId, cwd, ...(ref.repoRoot !== undefined ? { repoRoot: ref.repoRoot } : {}) }
+    setLoading(true)
+    setError(null)
+    setDiffText(null)
+    setUntracked(undefined)
+    setEffectiveStaged(null)
+    const load = async (): Promise<void> => {
+      try {
+        if (ref.kind === 'commit') {
+          const result = await api.gitCommitDiff(paneScope, ref.hashFull, ref.worktree)
+          if (!cancelled) setDiffText(result.diff)
+          return
+        }
+        let result = await api.gitDiff(paneScope, ref.path, ref.staged, ref.worktree)
+        if (result.diff === '') {
+          // The requested side is empty — try the OTHER side once (the change
+          // may have moved sides after the preview target was minted).
+          const other = await api.gitDiff(paneScope, ref.path, !ref.staged, ref.worktree)
+          if (other.diff !== '') {
+            result = other
+            if (!cancelled) setEffectiveStaged(!ref.staged)
+          }
+        }
+        if (result.diff !== '') {
+          if (!cancelled) setDiffText(result.diff)
+          return
+        }
+        // Empty diff: an untracked file (git diff never lists it) falls back
+        // to a full-file addition from its content. A child-repo path is
+        // relative to ref.repoRoot, not the session cwd or the linked-worktree
+        // root, so the read resolves against whichever the ref carries.
+        if (ref.untracked === true && !ref.staged) {
+          const text = await api.fsRead(paneScope, resolveSidebarPath(ref.repoRoot ?? ref.worktree ?? cwd, ref.path))
+          if (!cancelled) {
+            setDiffText('')
+            if (text.kind === 'text') setUntracked(text.content)
+          }
+          return
+        }
+        if (!cancelled) setDiffText('')
+      } catch (reason) {
+        if (!cancelled) setError(reason instanceof Error ? reason.message : String(reason))
+      } finally {
+        if (!cancelled) setLoading(false)
+      }
+    }
+    void load()
+    return () => { cancelled = true }
+  }, [ref, sessionId, cwd, tick])
+
+  // ── On-demand git fold expansion: a fold's hidden rows come from both
+  //    sides' full contents (git.show / fsRead), fetched ONCE per file so
+  //    sibling folds share the request, then sliced by each fold's line
+  //    ranges. The cache dies with the target or a refresh tick. ────────────
+  const foldContents = useRef(new Map<string, Promise<{ old: string; new: string }>>())
+  useEffect(() => { foldContents.current = new Map() }, [ref, tick])
+  const resolveFold = useMemo(() => {
+    if (ref === null) return undefined
+    const sidesOf = (file: DiffFile): Promise<{ old: string; new: string }> => {
+      // Both sides empty cannot cover a non-empty fold — treat it as a failed
+      // fetch so the fold degrades to the unavailable marker instead of
+      // silently expanding to nothing (the symptom of a bad rev or path
+      // reading null on both sides).
+      const ofSides = (oldContent: string | null, newContent: string | null): { old: string; new: string } => {
+        if ((oldContent ?? '') === '' && (newContent ?? '') === '') throw new Error('no content on either side')
+        return { old: oldContent ?? '', new: newContent ?? '' }
+      }
+      const fetchSides = async (): Promise<{ old: string; new: string }> => {
+        if (ref.kind === 'commit') {
+          // The patch's -m --first-parent shape: old side from the parent,
+          // new side from the commit (a root commit's parent read fails → '').
+          const [oldSide, newSide] = await Promise.all([
+            file.oldPath === '/dev/null'
+              ? Promise.resolve({ content: null })
+              : api.gitShow(gitScope, `${ref.hashFull}^`, displayPath(file.oldPath), ref.worktree),
+            file.newPath === '/dev/null'
+              ? Promise.resolve({ content: null })
+              : api.gitShow(gitScope, ref.hashFull, displayPath(file.newPath), ref.worktree),
+          ])
+          return ofSides(oldSide.content, newSide.content)
+        }
+        // Worktree change: staged is HEAD vs index, unstaged is index vs
+        // worktree (the worktree side reads the live file).
+        const staged = effectiveStaged ?? ref.staged
+        if (staged) {
+          const [oldSide, newSide] = await Promise.all([
+            file.oldPath === '/dev/null'
+              ? Promise.resolve({ content: null })
+              : api.gitShow(gitScope, 'HEAD', displayPath(file.oldPath), ref.worktree),
+            file.newPath === '/dev/null'
+              ? Promise.resolve({ content: null })
+              : api.gitShow(gitScope, ':0', displayPath(file.newPath), ref.worktree),
+          ])
+          return ofSides(oldSide.content, newSide.content)
+        }
+        const [oldSide, worktree] = await Promise.all([
+          file.oldPath === '/dev/null'
+            ? Promise.resolve({ content: null })
+            : api.gitShow(gitScope, ':0', displayPath(file.oldPath), ref.worktree),
+          api.fsRead(gitScope, resolveSidebarPath(ref.repoRoot ?? ref.worktree ?? cwd, displayPath(file.newPath))).catch(() => null),
+        ])
+        return ofSides(oldSide.content, worktree !== null && worktree.kind === 'text' ? worktree.content : null)
+      }
+      const path = displayPath(file.newPath === '/dev/null' ? file.oldPath : file.newPath)
+      let promise = foldContents.current.get(path)
+      if (promise === undefined) {
+        promise = fetchSides()
+        foldContents.current.set(path, promise)
+      }
+      return promise
+    }
+    return (file: DiffFile, segment: FoldSegment): Promise<readonly DiffRow[]> =>
+      sidesOf(file).then(sides => foldRowsFromContents(segment, sides.old, sides.new))
+  }, [ref, gitScope, effectiveStaged, cwd])
+
+  const refresh = useCallback((): void => { setTick(value => value + 1) }, [])
+
+  return { loading, error, diffText, untracked, refresh, resolveFold }
+}
diff --git a/src/client/index.tsx b/src/client/index.tsx
index da0fc88..30bea16 100644
--- a/src/client/index.tsx
+++ b/src/client/index.tsx
@@ -37,8 +37,16 @@ import './layout.css'
  *  (rc.8+) is the client module system the chunk loader resolves its
  *  externals through; `connection` (0.1.2-alpha.2+) is the Remote transport's
  *  recovery lifecycle the side chat's disconnect banner reads — Cordis guards
- *  service access without inject. */
-export const inject = ['slots', 'sessions', 'locale', 'modules', 'connection']
+ *  service access without inject.
+ *
+ *  `remote` / `remote.session` (0.1.7) are the Host Remote namespace the
+ *  "open in app" adapter calls (`canOpenWorkspacePath` /
+ *  `workspacePathApplications` / `openWorkspacePath`). BOTH entries are
+ *  required: Cordis validates the nested property access
+ *  (`ctx.get('remote').session`) against the inject list, and a missing
+ *  entry throws `cannot get property "remote.session" without inject` —
+ *  which, thrown from a render path, blanks the whole sidebar panel. */
+export const inject = ['slots', 'sessions', 'locale', 'modules', 'connection', 'remote', 'remote.session']
 
 /**
  * Error boundary over the sidebar tree (root scope): a render error in the
diff --git a/src/client/layout.css b/src/client/layout.css
index 3a3e798..f7d18cc 100644
--- a/src/client/layout.css
+++ b/src/client/layout.css
@@ -78,64 +78,3 @@ body[data-dsh-sidebar-dragging] #root [data-dsh-center-col] {
   #root [data-dsh-center-col] {
     transition: none;
   }
-}
-
-/* Context-menu submenu flip (viewport clamping for the portaled menus).
- *
- * The ui-primitives Menu clamps its main portal list into the viewport but
- * positions nested submenus with static CSS only — anchored at the parent
- * row's bottom, growing UP and to the RIGHT — with no clamp whatsoever.
- * Both defaults are the worst case for our menus: a tall "open with" submenu
- * escapes past the viewport top when the row menu opens near the top, and
- * past the right edge in a narrow workbench pane (a pane can be far narrower
- * than the card 218 + gap + submenu 165 a submenu needs).
- *
- * menu-flip.ts publishes `data-dsh-sidebar-submenu` on <body> — with the
- * words "down" and/or "left" — for exactly the lifetime of one of OUR
- * submenu-bearing menus (FileTree row menu, TabBar tab menu). The tokens
- * flip the growth direction; the attribute's absence restores the
- * primitive's own geometry untouched, and host-owned menus are never
- * affected because they never open while the attribute exists (each side
- * closes on the other's outside pointerdown).
- *
- * No max-height/overflow scroll cap here on purpose: overflow clipping
- * would cut the submenu's ::before hover bridge (the corridor that keeps
- * itemWrap's mouseleave from closing the card mid-crossing). */
-
-/* Visual tether, part 1 — the parent row stays lit while its submenu is
- * open. The primitive only styles :hover, so once the pointer crossed into
- * the side card the parent row's fill cleared and the floating card read as
- * unrelated. The Menu marks the open parent row with aria-expanded="true"
- * (host-rendered, stable), so the same hover token re-applies for the
- * submenu's whole lifetime. */
-body[data-dsh-sidebar-submenu] div[role="menu"] button[aria-expanded="true"] {
-  background: var(--dsw-alias-interactive-bg-hover);
-}
-
-/* Visual tether, part 2 — the side card hugs its parent (10px → 4px gap),
- * with the ::before hover corridor narrowed to match. Ordered BEFORE the
- * flip overrides below so their left/right flips still win. */
-body[data-dsh-sidebar-submenu] div[role="menu"] div[role="menu"] {
-  left: calc(100% + 4px);
-}
-
-body[data-dsh-sidebar-submenu] div[role="menu"] div[role="menu"]::before {
-  left: -4px;
-  width: 4px;
-}
-
-body[data-dsh-sidebar-submenu~="down"] div[role="menu"] div[role="menu"] {
-  top: -4px;
-  bottom: auto;
-}
-
-body[data-dsh-sidebar-submenu~="left"] div[role="menu"] div[role="menu"] {
-  left: auto;
-  right: calc(100% + 4px);
-}
-
-/* The hover bridge follows the card to the left side of the parent row. */
-body[data-dsh-sidebar-submenu~="left"] div[role="menu"] div[role="menu"]::before {
-  left: auto;
-  right: -4px;
-}
diff --git a/src/client/locales-ar.ts b/src/client/locales-ar.ts
index 50b4913..ca4d1bd 100644
--- a/src/client/locales-ar.ts
+++ b/src/client/locales-ar.ts
@@ -58,26 +58,31 @@ export const ar: Record<string, string> = {
   editorEmptyHint: 'اختر ملفاً من لوحة الشجرة أو من حقل المسار بالأعلى لبدء المعاينة',
   openFileNewTab: 'فتح في تبويب جديد',
   openFileSide: 'فتح إلى الجانب',
-  openWithMenu: 'فتح بواسطة',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: 'تثبيت في القائمة',
-  unpinOpenWith: 'إلغاء التثبيت',
-  openWithExplorer: 'مدير الملفات',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'مضيف SSH البعيد',
-  openWithSettingsSshDesc: 'فارغ = مساحة عمل محلية؛ مع user@host أو اسم مستعار SSH، تتحوّل فواتح عائلة VSCode إلى بروتوكول vscode-remote/ssh-remote ويُخفى مدير الملفات وZed والمحرّرات المخصّصة غير التابعة لعائلة VSCode من القائمة',
-  openWithSettingsSshPlaceholder: 'user@host أو اسم مستعار SSH',
-  openWithSettingsCustomTitle: 'محرّرات مخصّصة',
-  openWithSettingsCustomDesc: 'اسم + قالب URL (عنصر نائب {path}) + علامة عائلة VSCode؛ في الوضع البعيد، يمكن فقط لمحرّرات عائلة VSCode فتح مسار بعيد',
-  openWithSettingsAdd: 'إضافة',
-  openWithSettingsName: 'الاسم',
-  openWithSettingsTemplate: 'مثل cursor://file/{path}',
-  openWithSettingsFamily: 'عائلة VSCode',
-  openWithSettingsFamilyDesc: 'يتحدّث هذا المحرّر لهجة URL لـ VSCode (يدعم الفتح عبر SSH البعيد)',
-  openWithSettingsRemove: 'إزالة',
-  openWithSettingsInvalidHint: 'لن تظهر المحرّرات التي تفتقر إلى الاسم أو القالب (يلزم أن يحتوي على {path} ويبدأ بـ scheme://) في القائمة',
+  openInApp: 'فتح باستخدام',
+  openInAppDefault: 'فتح بالتطبيق الافتراضي',
+  openInAppEmpty: 'لا يوجد تطبيق يمكنه فتحه',
+  openInAppFailed: 'تعذّر الفتح: {path}',
+  revealInFileManager: 'إظهار في مدير الملفات',
+  filesSelected: 'تم تحديد {count}',
+  clearSelection: 'إلغاء التحديد',
+  copyPaths: 'نسخ المسارات',
+  deleteSelected: 'حذف المحدد',
+  deleteSelectedTitle: 'حذف {count} عنصراً محدداً؟',
+  deleteSelectedDesc: 'ستُحذف هذه الملفات والمجلدات نهائياً ولا يمكن استرجاعها.',
+  newFolder: 'مجلد جديد',
+  newFolderPlaceholder: 'اسم المجلد',
+  newFolderInvalid: 'اسم المجلد غير صالح',
+  filesTruncated: 'يحتوي هذا المجلد على عناصر كثيرة جداً؛ تُعرض العناصر الأولى فقط',
+  gitStatusModified: 'معدّل',
+  gitStatusAdded: 'مضاف',
+  gitStatusDeleted: 'محذوف',
+  gitStatusUntracked: 'غير متتبَّع',
+  gitStatusRenamed: 'أُعيدت تسميته',
+  gitStatusConflict: 'تعارض',
+  changesClean: 'لا توجد تغييرات في مساحة العمل',
+  changesNoHistory: 'لا يوجد سجل إيداعات بعد',
+  changesStageFailed: 'فشل الإدراج: {message}',
+  changesOpGone: 'لم تعد هذه العملية في سجل الجلسة',
   newTab: 'تبويب جديد',
   brokenSymlink: 'رابط رمزي معطوب',
   close: 'إغلاق',
@@ -121,7 +126,6 @@ export const ar: Record<string, string> = {
   error: 'فشل التحميل',
   retry: 'إعادة المحاولة',
   notRepo: 'هذا الدليل ليس مستودع git',
-  noChanges: 'لا تغييرات',
   statusTruncated: 'التغييرات كثيرة جدًا؛ يتم عرض أول 2000 إدخال فقط',
   stage: 'إدراج',
   unstage: 'إلغاء الإدراج',
diff --git a/src/client/locales-de.ts b/src/client/locales-de.ts
index b60b997..12ea9c9 100644
--- a/src/client/locales-de.ts
+++ b/src/client/locales-de.ts
@@ -43,26 +43,31 @@ export const de: Record<string, string> = {
   editorEmptyHint: 'Wählen Sie eine Datei aus dem Dateibaum rechts oder dem Pfadeingabefeld oben, um mit der Vorschau zu beginnen',
   openFileNewTab: 'In neuem Tab öffnen',
   openFileSide: 'Seitlich öffnen',
-  openWithMenu: 'Öffnen mit',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: 'Im Menü anheften',
-  unpinOpenWith: 'Lösen',
-  openWithExplorer: 'Dateimanager',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'SSH-Remote-Host',
-  openWithSettingsSshDesc: 'Leer = lokaler Arbeitsbereich; bei Angabe von user@host oder eines SSH-Alias verwenden die VSCode-Familienöffner das vscode-remote/ssh-remote-Protokoll, und Dateimanager / Zed / benutzerdefinierte Editoren außerhalb der VSCode-Familie werden im Menü ausgeblendet',
-  openWithSettingsSshPlaceholder: 'user@host oder SSH-Alias',
-  openWithSettingsCustomTitle: 'Benutzerdefinierte Editoren',
-  openWithSettingsCustomDesc: 'Name + URL-Vorlage ({path}-Platzhalter) + VSCode-Familien-Kennzeichen; im SSH-Modus können nur Editoren der VSCode-Familie Remote-Pfade öffnen',
-  openWithSettingsAdd: 'Hinzufügen',
-  openWithSettingsName: 'Name',
-  openWithSettingsTemplate: 'z. B. cursor://file/{path}',
-  openWithSettingsFamily: 'VSCode-Familie',
-  openWithSettingsFamilyDesc: 'Dieser Editor spricht das VSCode-URL-Protokoll (unterstützt SSH-Remote-Öffnen)',
-  openWithSettingsRemove: 'Entfernen',
-  openWithSettingsInvalidHint: 'Editoren ohne Namen oder mit Vorlage ohne {path} / scheme:// erscheinen nicht im Menü',
+  openInApp: 'Öffnen mit',
+  openInAppDefault: 'Mit Standard-App öffnen',
+  openInAppEmpty: 'Keine App kann diese Datei öffnen',
+  openInAppFailed: 'Öffnen fehlgeschlagen: {path}',
+  revealInFileManager: 'Im Dateimanager anzeigen',
+  filesSelected: '{count} ausgewählt',
+  clearSelection: 'Auswahl aufheben',
+  copyPaths: 'Pfade kopieren',
+  deleteSelected: 'Auswahl löschen',
+  deleteSelectedTitle: '{count} ausgewählte Elemente löschen?',
+  deleteSelectedDesc: 'Diese Dateien und Ordner werden endgültig gelöscht. Das lässt sich nicht rückgängig machen.',
+  newFolder: 'Neuer Ordner',
+  newFolderPlaceholder: 'Ordnername',
+  newFolderInvalid: 'Ungültiger Ordnername',
+  filesTruncated: 'Dieser Ordner enthält zu viele Einträge; nur die ersten werden angezeigt',
+  gitStatusModified: 'Geändert',
+  gitStatusAdded: 'Hinzugefügt',
+  gitStatusDeleted: 'Gelöscht',
+  gitStatusUntracked: 'Nicht verfolgt',
+  gitStatusRenamed: 'Umbenannt',
+  gitStatusConflict: 'Konflikt',
+  changesClean: 'Keine Änderungen im Arbeitsbereich',
+  changesNoHistory: 'Noch keine Commit-Historie',
+  changesStageFailed: 'Staging fehlgeschlagen: {message}',
+  changesOpGone: 'Dieser Vorgang ist nicht mehr im Sitzungsprotokoll',
   newTab: 'Neuer Tab',
   brokenSymlink: 'Defekter Symlink',
   close: 'Schließen',
@@ -106,7 +111,6 @@ export const de: Record<string, string> = {
   error: 'Laden fehlgeschlagen',
   retry: 'Erneut versuchen',
   notRepo: 'Dieses Verzeichnis ist kein Git-Repository',
-  noChanges: 'Keine Änderungen',
   statusTruncated: 'Zu viele Änderungen; nur die ersten 2000 Einträge werden angezeigt',
   stage: 'Stagen',
   unstage: 'Unstagen',
diff --git a/src/client/locales-fr.ts b/src/client/locales-fr.ts
index 203f19e..647d67a 100644
--- a/src/client/locales-fr.ts
+++ b/src/client/locales-fr.ts
@@ -50,26 +50,31 @@ export const fr: Record<string, string> = {
   editorEmptyHint: 'Choisissez un fichier dans l’arborescence à droite ou dans le champ de chemin ci-dessus pour commencer l’aperçu',
   openFileNewTab: 'Ouvrir dans un nouvel onglet',
   openFileSide: 'Ouvrir de côté',
-  openWithMenu: 'Ouvrir avec',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: 'Épingler au menu',
-  unpinOpenWith: 'Désépingler',
-  openWithExplorer: 'Explorateur de fichiers',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'Hôte distant SSH',
-  openWithSettingsSshDesc: 'Vide = espace de travail local ; avec un user@host ou un alias SSH, les ouvreurs de la famille VSCode passent aux protocoles vscode-remote/ssh-remote, et l’explorateur de fichiers / Zed / les éditeurs personnalisés hors famille VSCode sont masqués du menu',
-  openWithSettingsSshPlaceholder: 'user@host ou alias SSH',
-  openWithSettingsCustomTitle: 'Éditeurs personnalisés',
-  openWithSettingsCustomDesc: 'Nom + modèle d’URL (placeholder {path}) + famille VSCode ou non ; en mode SSH, seuls les éditeurs de la famille VSCode peuvent ouvrir un distant',
-  openWithSettingsAdd: 'Ajouter',
-  openWithSettingsName: 'Nom',
-  openWithSettingsTemplate: 'ex. cursor://file/{path}',
-  openWithSettingsFamily: 'Famille VSCode',
-  openWithSettingsFamilyDesc: 'Cet éditeur utilise le protocole d’URL de VSCode (prend en charge l’ouverture à distance via SSH)',
-  openWithSettingsRemove: 'Supprimer',
-  openWithSettingsInvalidHint: 'Les éditeurs sans nom ou sans modèle (contenant {path} et commençant par scheme://) n’apparaissent pas dans le menu',
+  openInApp: 'Ouvrir avec',
+  openInAppDefault: 'Ouvrir avec l’application par défaut',
+  openInAppEmpty: 'Aucune application ne peut l’ouvrir',
+  openInAppFailed: 'Impossible d’ouvrir : {path}',
+  revealInFileManager: 'Afficher dans le gestionnaire de fichiers',
+  filesSelected: '{count} élément(s) sélectionné(s)',
+  clearSelection: 'Effacer la sélection',
+  copyPaths: 'Copier les chemins',
+  deleteSelected: 'Supprimer la sélection',
+  deleteSelectedTitle: 'Supprimer {count} élément(s) sélectionné(s) ?',
+  deleteSelectedDesc: 'Ces fichiers et dossiers seront définitivement supprimés. Cette action est irréversible.',
+  newFolder: 'Nouveau dossier',
+  newFolderPlaceholder: 'Nom du dossier',
+  newFolderInvalid: 'Nom de dossier invalide',
+  filesTruncated: 'Ce dossier contient trop d’éléments ; seuls les premiers sont affichés',
+  gitStatusModified: 'Modifié',
+  gitStatusAdded: 'Ajouté',
+  gitStatusDeleted: 'Supprimé',
+  gitStatusUntracked: 'Non suivi',
+  gitStatusRenamed: 'Renommé',
+  gitStatusConflict: 'En conflit',
+  changesClean: 'Aucune modification dans le workspace',
+  changesNoHistory: 'Aucun commit pour l’instant',
+  changesStageFailed: 'Échec de l’indexation : {message}',
+  changesOpGone: 'Cette opération n’est plus dans le journal de la session',
   newTab: 'Nouvel onglet',
   brokenSymlink: 'Lien symbolique cassé',
   close: 'Fermer',
@@ -113,7 +118,6 @@ export const fr: Record<string, string> = {
   error: 'Échec du chargement',
   retry: 'Réessayer',
   notRepo: 'Ce répertoire n’est pas un dépôt git',
-  noChanges: 'Aucune modification',
   statusTruncated: 'Trop de modifications ; seules les 2000 premières entrées sont affichées',
   stage: 'Mettre en scène',
   unstage: 'Annuler la mise en scène',
diff --git a/src/client/locales-hi.ts b/src/client/locales-hi.ts
index 7f1a13c..7393594 100644
--- a/src/client/locales-hi.ts
+++ b/src/client/locales-hi.ts
@@ -57,26 +57,31 @@ export const hi: Record<string, string> = {
   editorEmptyHint: 'पूर्वावलोकन शुरू करने के लिए दाएँ फ़ाइल ट्री या ऊपर पथ इनपुट से फ़ाइल चुनें',
   openFileNewTab: 'नए टैब में खोलें',
   openFileSide: 'बाजू में खोलें',
-  openWithMenu: 'इसके साथ खोलें',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: 'मेन्यू पर पिन करें',
-  unpinOpenWith: 'पिन हटाएं',
-  openWithExplorer: 'फ़ाइल मैनेजर',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'SSH रिमोट होस्ट',
-  openWithSettingsSshDesc: 'खाली = स्थानीय वर्कस्पेस; user@host या SSH उपनाम के साथ, VSCode-परिवार ओपनर vscode-remote/ssh-remote प्रोटोकॉल पर स्विच हो जाते हैं और फ़ाइल मैनेजर / Zed / ग़ैर-VSCode-परिवार कस्टम एडिटर मेन्यू से छिप जाते हैं',
-  openWithSettingsSshPlaceholder: 'user@host या SSH उपनाम',
-  openWithSettingsCustomTitle: 'कस्टम एडिटर',
-  openWithSettingsCustomDesc: 'नाम + URL टेम्पलेट ({path} प्लेसहोल्डर) + VSCode-परिवार फ़्लैग; रिमोट मोड में केवल VSCode-परिवार एडिटर रिमोट पथ खोल सकते हैं',
-  openWithSettingsAdd: 'जोड़ें',
-  openWithSettingsName: 'नाम',
-  openWithSettingsTemplate: 'जैसे cursor://file/{path}',
-  openWithSettingsFamily: 'VSCode-परिवार',
-  openWithSettingsFamilyDesc: 'यह एडिटर VSCode URL बोली बोलता है (SSH-रिमोट खोलने का समर्थन)',
-  openWithSettingsRemove: 'हटाएं',
-  openWithSettingsInvalidHint: 'नाम या {path} / scheme:// के बिना टेम्पलेट वाले एडिटर मेन्यू में नहीं दिखते',
+  openInApp: 'इसके साथ खोलें',
+  openInAppDefault: 'डिफ़ॉल्ट ऐप से खोलें',
+  openInAppEmpty: 'इसे खोलने के लिए कोई ऐप नहीं',
+  openInAppFailed: 'खोल नहीं सका: {path}',
+  revealInFileManager: 'फ़ाइल मैनेजर में दिखाएँ',
+  filesSelected: '{count} चयनित',
+  clearSelection: 'चयन हटाएँ',
+  copyPaths: 'पथ कॉपी करें',
+  deleteSelected: 'चयनित हटाएँ',
+  deleteSelectedTitle: 'चयनित {count} आइटम हटाएँ?',
+  deleteSelectedDesc: 'ये फ़ाइलें और फ़ोल्डर हमेशा के लिए हटा दिए जाएँगे; इन्हें वापस नहीं लाया जा सकता।',
+  newFolder: 'नया फ़ोल्डर',
+  newFolderPlaceholder: 'फ़ोल्डर नाम',
+  newFolderInvalid: 'फ़ोल्डर नाम अमान्य है',
+  filesTruncated: 'इस फ़ोल्डर में बहुत अधिक प्रविष्टियाँ हैं; केवल शुरुआती कुछ दिखाई जा रही हैं',
+  gitStatusModified: 'संशोधित',
+  gitStatusAdded: 'जोड़ा गया',
+  gitStatusDeleted: 'हटाया गया',
+  gitStatusUntracked: 'अनट्रैक्ड',
+  gitStatusRenamed: 'नाम बदला गया',
+  gitStatusConflict: 'टकराव',
+  changesClean: 'वर्कस्पेस में कोई बदलाव नहीं',
+  changesNoHistory: 'अभी कोई कमिट इतिहास नहीं',
+  changesStageFailed: 'स्टेज विफल: {message}',
+  changesOpGone: 'यह कार्रवाई अब सत्र लॉग में नहीं है',
   newTab: 'नया टैब',
   brokenSymlink: 'टूटा सिमलिंक',
   close: 'बंद करें',
@@ -120,7 +125,6 @@ export const hi: Record<string, string> = {
   error: 'लोड विफल',
   retry: 'पुनः प्रयास',
   notRepo: 'यह डायरेक्टरी एक git रिपॉज़िटरी नहीं है',
-  noChanges: 'कोई बदलाव नहीं',
   statusTruncated: 'बहुत अधिक बदलाव; केवल पहली 2000 प्रविष्टियाँ दिखाई जा रही हैं',
   stage: 'स्टेज',
   unstage: 'अनस्टेज',
diff --git a/src/client/locales-id.ts b/src/client/locales-id.ts
index 934e287..709afd9 100644
--- a/src/client/locales-id.ts
+++ b/src/client/locales-id.ts
@@ -55,26 +55,31 @@ export const id: Record<string, string> = {
   editorEmptyHint: 'Pilih berkas dari panel pohon atau input path di atas untuk mulai pratinjau',
   openFileNewTab: 'Buka di Tab Baru',
   openFileSide: 'Buka di Samping',
-  openWithMenu: 'Buka dengan',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: 'Sematkan ke menu',
-  unpinOpenWith: 'Lepas sematan',
-  openWithExplorer: 'File Manager',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'Host remote SSH',
-  openWithSettingsSshDesc: 'Kosong = ruang kerja lokal; dengan user@host atau alias SSH, opener VSCode-family beralih ke protokol vscode-remote/ssh-remote dan File Manager / Zed / editor kustom non-VSCode-family disembunyikan dari menu',
-  openWithSettingsSshPlaceholder: 'user@host atau alias SSH',
-  openWithSettingsCustomTitle: 'Editor kustom',
-  openWithSettingsCustomDesc: 'Nama + template URL (placeholder {path}) + flag VSCode-family; dalam mode remote hanya editor VSCode-family yang dapat membuka path remote',
-  openWithSettingsAdd: 'Tambah',
-  openWithSettingsName: 'Nama',
-  openWithSettingsTemplate: 'mis. cursor://file/{path}',
-  openWithSettingsFamily: 'VSCode-family',
-  openWithSettingsFamilyDesc: 'Editor ini menggunakan dialek URL VSCode (mendukung pembukaan remote SSH)',
-  openWithSettingsRemove: 'Hapus',
-  openWithSettingsInvalidHint: 'Editor dengan nama hilang atau template tanpa {path} / scheme:// tidak ditampilkan di menu',
+  openInApp: 'Buka dengan',
+  openInAppDefault: 'Buka dengan aplikasi default',
+  openInAppEmpty: 'Tidak ada aplikasi yang bisa membukanya',
+  openInAppFailed: 'Gagal membuka: {path}',
+  revealInFileManager: 'Tampilkan di pengelola berkas',
+  filesSelected: '{count} dipilih',
+  clearSelection: 'Hapus pilihan',
+  copyPaths: 'Salin path',
+  deleteSelected: 'Hapus yang dipilih',
+  deleteSelectedTitle: 'Hapus {count} item yang dipilih?',
+  deleteSelectedDesc: 'Berkas dan folder ini akan dihapus permanen dan tidak bisa dikembalikan.',
+  newFolder: 'Folder baru',
+  newFolderPlaceholder: 'Nama folder',
+  newFolderInvalid: 'Nama folder tidak valid',
+  filesTruncated: 'Folder ini berisi terlalu banyak entri; hanya sebagian awal yang ditampilkan',
+  gitStatusModified: 'Dimodifikasi',
+  gitStatusAdded: 'Ditambahkan',
+  gitStatusDeleted: 'Dihapus',
+  gitStatusUntracked: 'Tidak dilacak',
+  gitStatusRenamed: 'Nama diubah',
+  gitStatusConflict: 'Konflik',
+  changesClean: 'Tidak ada perubahan di workspace',
+  changesNoHistory: 'Belum ada riwayat commit',
+  changesStageFailed: 'Gagal melakukan stage: {message}',
+  changesOpGone: 'Operasi ini tidak lagi ada di log sesi',
   newTab: 'Tab baru',
   brokenSymlink: 'Symlink rusak',
   close: 'Tutup',
@@ -118,7 +123,6 @@ export const id: Record<string, string> = {
   error: 'Gagal memuat',
   retry: 'Coba lagi',
   notRepo: 'Direktori ini bukan repositori git',
-  noChanges: 'Tidak ada perubahan',
   statusTruncated: 'Terlalu banyak perubahan; hanya 2000 entri pertama yang ditampilkan',
   stage: 'Stage',
   unstage: 'Unstage',
diff --git a/src/client/locales-it.ts b/src/client/locales-it.ts
index ce4c5bd..31a76a5 100644
--- a/src/client/locales-it.ts
+++ b/src/client/locales-it.ts
@@ -48,26 +48,31 @@ export const it: Record<string, string> = {
   editorEmptyHint: 'Scelga un file dal pannello dell’albero a destra o dal campo del percorso in alto per iniziare l’anteprima',
   openFileNewTab: 'Apri in una nuova scheda',
   openFileSide: 'Apri a lato',
-  openWithMenu: 'Apri con',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: 'Fissa al menu',
-  unpinOpenWith: 'Rimuovi dal fisso',
-  openWithExplorer: 'Esplora risorse',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'Host remoto SSH',
-  openWithSettingsSshDesc: 'Vuoto = spazio di lavoro locale; con un user@host o un alias SSH, gli apritori della famiglia VSCode passano al protocollo vscode-remote/ssh-remote e l’Esplora risorse / Zed / gli editor personalizzati non VSCode vengono nascosti dal menu',
-  openWithSettingsSshPlaceholder: 'user@host o alias SSH',
-  openWithSettingsCustomTitle: 'Editor personalizzati',
-  openWithSettingsCustomDesc: 'Nome + modello URL (segnaposto {path}) + flag famiglia VSCode; in modalità remota solo gli editor della famiglia VSCode possono aprire un percorso remoto',
-  openWithSettingsAdd: 'Aggiungi',
-  openWithSettingsName: 'Nome',
-  openWithSettingsTemplate: 'es. cursor://file/{path}',
-  openWithSettingsFamily: 'Famiglia VSCode',
-  openWithSettingsFamilyDesc: 'Questo editor usa il protocollo URL di VSCode (supporta aperture SSH remote)',
-  openWithSettingsRemove: 'Rimuovi',
-  openWithSettingsInvalidHint: 'Gli editor con nome mancante o modello senza {path} / scheme:// non vengono mostrati nel menu',
+  openInApp: 'Apri con',
+  openInAppDefault: 'Apri con l’app predefinita',
+  openInAppEmpty: 'Nessuna applicazione può aprirlo',
+  openInAppFailed: 'Impossibile aprire: {path}',
+  revealInFileManager: 'Mostra nel gestore file',
+  filesSelected: '{count} selezionati',
+  clearSelection: 'Annulla selezione',
+  copyPaths: 'Copia percorsi',
+  deleteSelected: 'Elimina selezione',
+  deleteSelectedTitle: 'Eliminare {count} elementi selezionati?',
+  deleteSelectedDesc: 'Questi file e cartelle saranno eliminati definitivamente. L’operazione non può essere annullata.',
+  newFolder: 'Nuova cartella',
+  newFolderPlaceholder: 'Nome cartella',
+  newFolderInvalid: 'Nome cartella non valido',
+  filesTruncated: 'Questa cartella contiene troppe voci; vengono mostrate solo le prime',
+  gitStatusModified: 'Modificato',
+  gitStatusAdded: 'Aggiunto',
+  gitStatusDeleted: 'Eliminato',
+  gitStatusUntracked: 'Non tracciato',
+  gitStatusRenamed: 'Rinominato',
+  gitStatusConflict: 'In conflitto',
+  changesClean: 'Nessuna modifica nel workspace',
+  changesNoHistory: 'Nessun commit per ora',
+  changesStageFailed: 'Staging non riuscito: {message}',
+  changesOpGone: 'Questa operazione non è più nel registro della sessione',
   newTab: 'Nuova scheda',
   brokenSymlink: 'Collegamento simbolico interrotto',
   close: 'Chiudi',
@@ -111,7 +116,6 @@ export const it: Record<string, string> = {
   error: 'Caricamento non riuscito',
   retry: 'Riprova',
   notRepo: 'Questa directory non è un repository git',
-  noChanges: 'Nessuna modifica',
   statusTruncated: 'Troppe modifiche; vengono mostrate solo le prime 2000 voci',
   stage: 'Prepara',
   unstage: 'Rimuovi dalla preparazione',
diff --git a/src/client/locales-ja.ts b/src/client/locales-ja.ts
index cf0b5a0..70bc83d 100644
--- a/src/client/locales-ja.ts
+++ b/src/client/locales-ja.ts
@@ -57,26 +57,31 @@ export const ja: Record<string, string> = {
   editorEmptyHint: '右のファイルツリーまたは上のパス入力欄からファイルを選んでプレビュー',
   openFileNewTab: '新しいタブで開く',
   openFileSide: '横に開く',
-  openWithMenu: 'アプリで開く',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: 'メニューに固定',
-  unpinOpenWith: '固定を解除',
-  openWithExplorer: 'エクスプローラー',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'SSH リモートホスト',
-  openWithSettingsSshDesc: '空欄 = ローカルワークスペース。user@host または SSH エイリアスを入力すると、VSCode 系の起動方法は vscode-remote/ssh-remote プロトコルに切り替わり、エクスプローラー / Zed / 非 VSCode 系カスタムエディターはメニューから非表示になります',
-  openWithSettingsSshPlaceholder: 'user@host または SSH エイリアス',
-  openWithSettingsCustomTitle: 'カスタムエディター',
-  openWithSettingsCustomDesc: '名前 + URL テンプレート（{path} プレースホルダー）+ VSCode 系かどうか。SSH モードでは VSCode 系のみリモートパスを開けます',
-  openWithSettingsAdd: '追加',
-  openWithSettingsName: '名前',
-  openWithSettingsTemplate: '例: cursor://file/{path}',
-  openWithSettingsFamily: 'VSCode 系',
-  openWithSettingsFamilyDesc: 'このエディターは VSCode の URL プロトコルを使います（SSH リモートオープンをサポート）',
-  openWithSettingsRemove: '削除',
-  openWithSettingsInvalidHint: '名前またはテンプレート（{path} を含み scheme:// で始まる必要あり）が未入力の編集者はメニューに表示されません',
+  openInApp: 'アプリで開く',
+  openInAppDefault: '既定のアプリで開く',
+  openInAppEmpty: '開けるアプリがありません',
+  openInAppFailed: '開けませんでした：{path}',
+  revealInFileManager: 'ファイルマネージャーで表示',
+  filesSelected: '{count} 件を選択中',
+  clearSelection: '選択を解除',
+  copyPaths: 'パスをコピー',
+  deleteSelected: '選択項目を削除',
+  deleteSelectedTitle: '選択した {count} 件を削除しますか？',
+  deleteSelectedDesc: 'これらのファイルとフォルダーは完全に削除され、元に戻せません。',
+  newFolder: '新しいフォルダー',
+  newFolderPlaceholder: 'フォルダー名',
+  newFolderInvalid: 'フォルダー名が無効です',
+  filesTruncated: 'このフォルダーの項目が多すぎるため、先頭の一部のみ表示しています',
+  gitStatusModified: '変更あり',
+  gitStatusAdded: '追加',
+  gitStatusDeleted: '削除',
+  gitStatusUntracked: '未追跡',
+  gitStatusRenamed: '名前変更',
+  gitStatusConflict: '競合',
+  changesClean: 'ワークスペースに変更はありません',
+  changesNoHistory: 'コミット履歴がまだありません',
+  changesStageFailed: 'ステージに失敗しました：{message}',
+  changesOpGone: 'この操作はセッションログに残っていません',
   newTab: '新しいタブ',
   brokenSymlink: '無効なシンボリックリンク',
   close: '閉じる',
@@ -120,7 +125,6 @@ export const ja: Record<string, string> = {
   error: '読み込みに失敗',
   retry: '再試行',
   notRepo: 'このディレクトリは git リポジトリではありません',
-  noChanges: '変更はありません',
   statusTruncated: '変更が多すぎるため、最初の 2000 件のみ表示しています',
   stage: 'ステージ',
   unstage: 'ステージ解除',
diff --git a/src/client/locales-ko.ts b/src/client/locales-ko.ts
index 68bf606..5742c59 100644
--- a/src/client/locales-ko.ts
+++ b/src/client/locales-ko.ts
@@ -49,26 +49,31 @@ export const ko: Record<string, string> = {
   editorEmptyHint: '오른쪽 파일 트리나 위쪽 경로 입력란에서 파일을 선택해 미리보기를 시작하세요',
   openFileNewTab: '새 Tab으로 열기',
   openFileSide: '측면에 열기',
-  openWithMenu: '앱에서 열기',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: '메뉴에 고정',
-  unpinOpenWith: '고정 해제',
-  openWithExplorer: '파일 탐색기',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'SSH 원격 호스트',
-  openWithSettingsSshDesc: '비워두면 로컬 작업 공간입니다. user@host 또는 SSH 별칭을 입력하면 VSCode 계열 열기 방식이 vscode-remote/ssh-remote 프로토콜을 사용하게 되며, 파일 탐색기 / Zed / 비 VSCode 계열 사용자 지정 편집기는 메뉴에서 숨겨집니다',
-  openWithSettingsSshPlaceholder: 'user@host 또는 SSH 별칭',
-  openWithSettingsCustomTitle: '사용자 지정 편집기',
-  openWithSettingsCustomDesc: '이름 + URL 템플릿({path} 자리 표시자) + VSCode 계열 여부. SSH 모드에서는 VSCode 계열만 원격을 열 수 있습니다',
-  openWithSettingsAdd: '추가',
-  openWithSettingsName: '이름',
-  openWithSettingsTemplate: '예: cursor://file/{path}',
-  openWithSettingsFamily: 'VSCode 계열',
-  openWithSettingsFamilyDesc: '이 편집기는 VSCode의 URL 프로토콜을 사용합니다(SSH 원격 열기 지원)',
-  openWithSettingsRemove: '삭제',
-  openWithSettingsInvalidHint: '이름이나 템플릿({path} 포함, scheme:// 로 시작해야 함)을 입력하지 않은 편집기는 메뉴에 표시되지 않습니다',
+  openInApp: '앱으로 열기',
+  openInAppDefault: '기본 앱으로 열기',
+  openInAppEmpty: '이 파일을 열 수 있는 앱이 없습니다',
+  openInAppFailed: '열 수 없습니다: {path}',
+  revealInFileManager: '파일 관리자에서 표시',
+  filesSelected: '{count}개 선택됨',
+  clearSelection: '선택 해제',
+  copyPaths: '경로 복사',
+  deleteSelected: '선택 항목 삭제',
+  deleteSelectedTitle: '선택한 {count}개 항목을 삭제할까요?',
+  deleteSelectedDesc: '이 파일과 폴더는 영구히 삭제되며 되돌릴 수 없습니다.',
+  newFolder: '새 폴더',
+  newFolderPlaceholder: '폴더 이름',
+  newFolderInvalid: '폴더 이름이 올바르지 않습니다',
+  filesTruncated: '이 폴더에 항목이 너무 많아 앞부분만 표시합니다',
+  gitStatusModified: '수정됨',
+  gitStatusAdded: '추가됨',
+  gitStatusDeleted: '삭제됨',
+  gitStatusUntracked: '추적 안 됨',
+  gitStatusRenamed: '이름 변경됨',
+  gitStatusConflict: '충돌',
+  changesClean: '워크스페이스에 변경 사항이 없습니다',
+  changesNoHistory: '아직 커밋 기록이 없습니다',
+  changesStageFailed: '스테이징 실패: {message}',
+  changesOpGone: '이 작업은 더 이상 세션 로그에 없습니다',
   newTab: '새 탭',
   brokenSymlink: '깨진 심볼릭 링크',
   close: '닫기',
@@ -112,7 +117,6 @@ export const ko: Record<string, string> = {
   error: '불러오기 실패',
   retry: '다시 시도',
   notRepo: '현재 디렉터리는 git 저장소가 아닙니다',
-  noChanges: '변경 사항 없음',
   statusTruncated: '변경 사항이 너무 많아 처음 2000개만 표시합니다',
   stage: '스테이징',
   unstage: '스테이징 해제',
diff --git a/src/client/locales-nl.ts b/src/client/locales-nl.ts
index eea28ff..c55e87e 100644
--- a/src/client/locales-nl.ts
+++ b/src/client/locales-nl.ts
@@ -55,26 +55,31 @@ export const nl: Record<string, string> = {
   editorEmptyHint: 'Kies een bestand uit het boompaneel of het pad-invoerveld hierboven om te beginnen met previewen',
   openFileNewTab: 'Openen in nieuw tabblad',
   openFileSide: 'Openen aan de zijkant',
-  openWithMenu: 'Openen met',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: 'Vastmaken aan menu',
-  unpinOpenWith: 'Losmaken',
-  openWithExplorer: 'Bestandsbeheerder',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'SSH externe host',
-  openWithSettingsSshDesc: 'Leeg = lokale werkruimte; met een user@host of SSH-alias schakelen VSCode-familie-openers over op het vscode-remote/ssh-remote protocol en worden de Bestandsbeheerder / Zed / niet-VSCode-familie custom editors verborgen uit het menu',
-  openWithSettingsSshPlaceholder: 'user@host of SSH-alias',
-  openWithSettingsCustomTitle: 'Aangepaste editors',
-  openWithSettingsCustomDesc: 'Naam + URL-sjabloon ({path} placeholder) + VSCode-familie-vlag; in externe modus kunnen alleen VSCode-familie-editors een extern pad openen',
-  openWithSettingsAdd: 'Toevoegen',
-  openWithSettingsName: 'Naam',
-  openWithSettingsTemplate: 'bijv. cursor://file/{path}',
-  openWithSettingsFamily: 'VSCode-familie',
-  openWithSettingsFamilyDesc: 'Deze editor spreekt het VSCode URL-dialect (ondersteunt SSH-externe openingen)',
-  openWithSettingsRemove: 'Verwijderen',
-  openWithSettingsInvalidHint: 'Editors met een ontbrekende naam of een sjabloon zonder {path} / scheme:// worden niet in het menu getoond',
+  openInApp: 'Openen met',
+  openInAppDefault: 'Openen met standaardapp',
+  openInAppEmpty: 'Geen app kan dit openen',
+  openInAppFailed: 'Kan niet openen: {path}',
+  revealInFileManager: 'Tonen in bestandsbeheerder',
+  filesSelected: '{count} geselecteerd',
+  clearSelection: 'Selectie wissen',
+  copyPaths: 'Paden kopiëren',
+  deleteSelected: 'Selectie verwijderen',
+  deleteSelectedTitle: '{count} geselecteerde items verwijderen?',
+  deleteSelectedDesc: 'Deze bestanden en mappen worden permanent verwijderd. Dit kan niet ongedaan worden gemaakt.',
+  newFolder: 'Nieuwe map',
+  newFolderPlaceholder: 'Mapnaam',
+  newFolderInvalid: 'Ongeldige mapnaam',
+  filesTruncated: 'Deze map bevat te veel items; alleen de eerste worden getoond',
+  gitStatusModified: 'Gewijzigd',
+  gitStatusAdded: 'Toegevoegd',
+  gitStatusDeleted: 'Verwijderd',
+  gitStatusUntracked: 'Niet gevolgd',
+  gitStatusRenamed: 'Hernoemd',
+  gitStatusConflict: 'Conflict',
+  changesClean: 'Geen wijzigingen in de workspace',
+  changesNoHistory: 'Nog geen commitgeschiedenis',
+  changesStageFailed: 'Stagen mislukt: {message}',
+  changesOpGone: 'Deze bewerking staat niet meer in het sessielogboek',
   newTab: 'Nieuw tabblad',
   brokenSymlink: 'Gebroken symlink',
   close: 'Sluiten',
@@ -118,7 +123,6 @@ export const nl: Record<string, string> = {
   error: 'Laden mislukt',
   retry: 'Opnieuw proberen',
   notRepo: 'Deze map is geen git-repository',
-  noChanges: 'Geen wijzigingen',
   statusTruncated: 'Te veel wijzigingen; alleen de eerste 2000 items worden weergegeven',
   stage: 'Stagen',
   unstage: 'Unstagen',
diff --git a/src/client/locales-pl.ts b/src/client/locales-pl.ts
index 2ca16e5..c454b3c 100644
--- a/src/client/locales-pl.ts
+++ b/src/client/locales-pl.ts
@@ -59,26 +59,31 @@ export const pl: Record<string, string> = {
   editorEmptyHint: 'Wybierz plik z panelu drzewa lub pola ścieżki powyżej, aby rozpocząć podgląd',
   openFileNewTab: 'Otwórz w nowej karcie',
   openFileSide: 'Otwórz z boku',
-  openWithMenu: 'Otwórz za pomocą',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: 'Przypnij do menu',
-  unpinOpenWith: 'Odepnij',
-  openWithExplorer: 'Menedżer plików',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'Zdalny host SSH',
-  openWithSettingsSshDesc: 'Puste = lokalny obszar roboczy; z user@host lub aliasem SSH otwieracze rodziny VSCode przełączają się na protokół vscode-remote/ssh-remote, a Menedżer plików / Zed / niestandardowe edytory spoza rodziny VSCode są ukrywane w menu',
-  openWithSettingsSshPlaceholder: 'user@host lub alias SSH',
-  openWithSettingsCustomTitle: 'Niestandardowe edytory',
-  openWithSettingsCustomDesc: 'Nazwa + szablon URL (zastępnik {path}) + flaga rodziny VSCode; w trybie zdalnym tylko edytory rodziny VSCode mogą otwierać ścieżkę zdalną',
-  openWithSettingsAdd: 'Dodaj',
-  openWithSettingsName: 'Nazwa',
-  openWithSettingsTemplate: 'np. cursor://file/{path}',
-  openWithSettingsFamily: 'Rodzina VSCode',
-  openWithSettingsFamilyDesc: 'Ten edytor używa dialektu URL VSCode (obsługuje otwieranie zdalne przez SSH)',
-  openWithSettingsRemove: 'Usuń',
-  openWithSettingsInvalidHint: 'Edytory z brakującą nazwą lub szablonem bez {path} / scheme:// nie są pokazywane w menu',
+  openInApp: 'Otwórz za pomocą',
+  openInAppDefault: 'Otwórz w domyślnej aplikacji',
+  openInAppEmpty: 'Brak aplikacji, która może to otworzyć',
+  openInAppFailed: 'Nie udało się otworzyć: {path}',
+  revealInFileManager: 'Pokaż w menedżerze plików',
+  filesSelected: 'Wybrano: {count}',
+  clearSelection: 'Wyczyść wybór',
+  copyPaths: 'Kopiuj ścieżki',
+  deleteSelected: 'Usuń wybrane',
+  deleteSelectedTitle: 'Usunąć {count} wybranych elementów?',
+  deleteSelectedDesc: 'Te pliki i foldery zostaną trwale usunięte. Tej operacji nie można cofnąć.',
+  newFolder: 'Nowy folder',
+  newFolderPlaceholder: 'Nazwa folderu',
+  newFolderInvalid: 'Nieprawidłowa nazwa folderu',
+  filesTruncated: 'Ten folder zawiera zbyt wiele pozycji; wyświetlane są tylko pierwsze',
+  gitStatusModified: 'Zmodyfikowany',
+  gitStatusAdded: 'Dodany',
+  gitStatusDeleted: 'Usunięty',
+  gitStatusUntracked: 'Nieśledzony',
+  gitStatusRenamed: 'Zmieniono nazwę',
+  gitStatusConflict: 'Konflikt',
+  changesClean: 'Brak zmian w obszarze roboczym',
+  changesNoHistory: 'Brak historii commitów',
+  changesStageFailed: 'Nie udało się wykonać stage: {message}',
+  changesOpGone: 'Tej operacji nie ma już w dzienniku sesji',
   newTab: 'Nowa karta',
   brokenSymlink: 'Uszkodzone dowiązanie symboliczne',
   close: 'Zamknij',
@@ -122,7 +127,6 @@ export const pl: Record<string, string> = {
   error: 'Ładowanie nie powiodło się',
   retry: 'Ponów',
   notRepo: 'Ten katalog nie jest repozytorium git',
-  noChanges: 'Brak zmian',
   statusTruncated: 'Zbyt wiele zmian; pokazywane jest tylko pierwsze 2000 wpisów',
   stage: 'Dodaj do indeksu',
   unstage: 'Usuń z indeksu',
diff --git a/src/client/locales-pt.ts b/src/client/locales-pt.ts
index f4c021b..26f3a67 100644
--- a/src/client/locales-pt.ts
+++ b/src/client/locales-pt.ts
@@ -40,26 +40,31 @@ export const pt: Record<string, string> = {
   editorEmptyHint: 'Escolha um arquivo na árvore do painel ou no campo de caminho acima para começar a pré-visualizar',
   openFileNewTab: 'Abrir em nova aba',
   openFileSide: 'Abrir ao lado',
-  openWithMenu: 'Abrir com',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: 'Fixar no menu',
-  unpinOpenWith: 'Desafixar',
-  openWithExplorer: 'Gerenciador de arquivos',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'Host remoto SSH',
-  openWithSettingsSshDesc: 'Vazio = workspace local; com user@host ou um alias SSH, os abridores da família VSCode passam a usar o protocolo vscode-remote/ssh-remote e o Gerenciador de arquivos / Zed / editores personalizados fora da família VSCode ficam ocultos do menu',
-  openWithSettingsSshPlaceholder: 'user@host ou alias SSH',
-  openWithSettingsCustomTitle: 'Editores personalizados',
-  openWithSettingsCustomDesc: 'Nome + modelo de URL (espaço reservado {path}) + sinalizador de família VSCode; no modo remoto, apenas editores da família VSCode podem abrir um caminho remoto',
-  openWithSettingsAdd: 'Adicionar',
-  openWithSettingsName: 'Nome',
-  openWithSettingsTemplate: 'ex.: cursor://file/{path}',
-  openWithSettingsFamily: 'Família VSCode',
-  openWithSettingsFamilyDesc: 'Este editor fala o dialeto de URL do VSCode (suporta aberturas SSH remotas)',
-  openWithSettingsRemove: 'Remover',
-  openWithSettingsInvalidHint: 'Editores com nome ausente ou modelo sem {path} / scheme:// não aparecem no menu',
+  openInApp: 'Abrir com',
+  openInAppDefault: 'Abrir com o aplicativo padrão',
+  openInAppEmpty: 'Nenhum aplicativo pode abri-lo',
+  openInAppFailed: 'Não foi possível abrir: {path}',
+  revealInFileManager: 'Mostrar no gerenciador de arquivos',
+  filesSelected: '{count} selecionados',
+  clearSelection: 'Limpar seleção',
+  copyPaths: 'Copiar caminhos',
+  deleteSelected: 'Excluir selecionados',
+  deleteSelectedTitle: 'Excluir {count} itens selecionados?',
+  deleteSelectedDesc: 'Estes arquivos e pastas serão excluídos permanentemente. Não será possível desfazer.',
+  newFolder: 'Nova pasta',
+  newFolderPlaceholder: 'Nome da pasta',
+  newFolderInvalid: 'Nome de pasta inválido',
+  filesTruncated: 'Esta pasta tem entradas demais; apenas as primeiras são exibidas',
+  gitStatusModified: 'Modificado',
+  gitStatusAdded: 'Adicionado',
+  gitStatusDeleted: 'Excluído',
+  gitStatusUntracked: 'Não rastreado',
+  gitStatusRenamed: 'Renomeado',
+  gitStatusConflict: 'Em conflito',
+  changesClean: 'Nenhuma alteração no workspace',
+  changesNoHistory: 'Ainda não há histórico de commits',
+  changesStageFailed: 'Falha ao preparar: {message}',
+  changesOpGone: 'Esta operação não está mais no registro da sessão',
   newTab: 'Nova aba',
   brokenSymlink: 'Symlink quebrado',
   close: 'Fechar',
@@ -103,7 +108,6 @@ export const pt: Record<string, string> = {
   error: 'Falha ao carregar',
   retry: 'Tentar novamente',
   notRepo: 'Este diretório não é um repositório git',
-  noChanges: 'Sem alterações',
   statusTruncated: 'Muitas alterações; exibindo apenas as primeiras 2000 entradas',
   stage: 'Preparar (stage)',
   unstage: 'Desfazer stage',
diff --git a/src/client/locales-ru.ts b/src/client/locales-ru.ts
index c52e8bd..0a7992e 100644
--- a/src/client/locales-ru.ts
+++ b/src/client/locales-ru.ts
@@ -53,26 +53,31 @@ export const ru: Record<string, string> = {
   editorEmptyHint: 'Выберите файл из дерева справа или введите путь выше, чтобы начать предпросмотр',
   openFileNewTab: 'Открыть в новой вкладке',
   openFileSide: 'Открыть сбоку',
-  openWithMenu: 'Открыть в приложении',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: 'Закрепить в меню',
-  unpinOpenWith: 'Открепить',
-  openWithExplorer: 'Проводник',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'Удалённый хост SSH',
-  openWithSettingsSshDesc: 'Пусто = локальная рабочая область; при указании user@host или псевдонима SSH способы открытия семейства VSCode переключаются на протокол vscode-remote/ssh-remote, а проводник / Zed / сторонние редакторы вне семейства VSCode скрываются из меню',
-  openWithSettingsSshPlaceholder: 'user@host или псевдоним SSH',
-  openWithSettingsCustomTitle: 'Собственные редакторы',
-  openWithSettingsCustomDesc: 'Имя + шаблон URL (плейсхолдер {path}) + признак семейства VSCode; в режиме SSH только редакторы семейства VSCode могут открывать удалённые пути',
-  openWithSettingsAdd: 'Добавить',
-  openWithSettingsName: 'Имя',
-  openWithSettingsTemplate: 'напр. cursor://file/{path}',
-  openWithSettingsFamily: 'Семейство VSCode',
-  openWithSettingsFamilyDesc: 'Этот редактор использует URL-протокол VSCode (поддерживает удалённое открытие по SSH)',
-  openWithSettingsRemove: 'Удалить',
-  openWithSettingsInvalidHint: 'Редакторы без имени или с шаблоном без {path} / scheme:// не появятся в меню',
+  openInApp: 'Открыть с помощью',
+  openInAppDefault: 'Открыть приложением по умолчанию',
+  openInAppEmpty: 'Нет приложения, которое может это открыть',
+  openInAppFailed: 'Не удалось открыть: {path}',
+  revealInFileManager: 'Показать в файловом менеджере',
+  filesSelected: 'Выбрано: {count}',
+  clearSelection: 'Снять выделение',
+  copyPaths: 'Копировать пути',
+  deleteSelected: 'Удалить выбранное',
+  deleteSelectedTitle: 'Удалить выбранные элементы ({count})?',
+  deleteSelectedDesc: 'Эти файлы и папки будут удалены безвозвратно. Отменить это действие нельзя.',
+  newFolder: 'Новая папка',
+  newFolderPlaceholder: 'Имя папки',
+  newFolderInvalid: 'Недопустимое имя папки',
+  filesTruncated: 'В этой папке слишком много элементов; показаны только первые',
+  gitStatusModified: 'Изменён',
+  gitStatusAdded: 'Добавлен',
+  gitStatusDeleted: 'Удалён',
+  gitStatusUntracked: 'Не отслеживается',
+  gitStatusRenamed: 'Переименован',
+  gitStatusConflict: 'Конфликт',
+  changesClean: 'В рабочей области нет изменений',
+  changesNoHistory: 'Истории коммитов пока нет',
+  changesStageFailed: 'Ошибка индексирования: {message}',
+  changesOpGone: 'Этой операции больше нет в журнале сессии',
   newTab: 'Новая вкладка',
   brokenSymlink: 'Сломанная символическая ссылка',
   close: 'Закрыть',
@@ -116,7 +121,6 @@ export const ru: Record<string, string> = {
   error: 'Ошибка загрузки',
   retry: 'Повторить',
   notRepo: 'Этот каталог не является git-репозиторием',
-  noChanges: 'Нет изменений',
   statusTruncated: 'Слишком много изменений; показаны только первые 2000 записей',
   stage: 'Индексировать',
   unstage: 'Убрать из индекса',
diff --git a/src/client/locales-sv.ts b/src/client/locales-sv.ts
index d0ff066..ade5136 100644
--- a/src/client/locales-sv.ts
+++ b/src/client/locales-sv.ts
@@ -40,26 +40,31 @@ export const sv: Record<string, string> = {
   editorEmptyHint: 'Välj en fil från trädpanelen eller sökvägsinmatningen ovan för att börja förhandsgranska',
   openFileNewTab: 'Öppna i ny flik',
   openFileSide: 'Öppna vid sidan',
-  openWithMenu: 'Öppna med',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: 'Fäst i meny',
-  unpinOpenWith: 'Lossa',
-  openWithExplorer: 'Filhanterare',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'SSH-fjärrvärd',
-  openWithSettingsSshDesc: 'Tomt = lokal arbetsyta; med user@host eller SSH-alias byter VSCode-familjens öppnare till vscode-remote/ssh-remote-protokollet och Filhanterare / Zed / icke-VSCode-familjens anpassade editorer döljs från menyn',
-  openWithSettingsSshPlaceholder: 'user@host eller SSH-alias',
-  openWithSettingsCustomTitle: 'Anpassade editorer',
-  openWithSettingsCustomDesc: 'Namn + URL-mall ({path}-platshållare) + VSCode-familj-flagga; i fjärrläge kan endast VSCode-familjens editorer öppna en fjärrsökväg',
-  openWithSettingsAdd: 'Lägg till',
-  openWithSettingsName: 'Namn',
-  openWithSettingsTemplate: 't.ex. cursor://file/{path}',
-  openWithSettingsFamily: 'VSCode-familj',
-  openWithSettingsFamilyDesc: 'Denna editor talar VSCode:s URL-dialekt (stöder SSH-fjärröppning)',
-  openWithSettingsRemove: 'Ta bort',
-  openWithSettingsInvalidHint: 'Editorer med saknat namn eller en mall utan {path} / scheme:// visas inte i menyn',
+  openInApp: 'Öppna med',
+  openInAppDefault: 'Öppna med standardapp',
+  openInAppEmpty: 'Ingen app kan öppna den',
+  openInAppFailed: 'Kunde inte öppna: {path}',
+  revealInFileManager: 'Visa i filhanteraren',
+  filesSelected: '{count} markerade',
+  clearSelection: 'Rensa markering',
+  copyPaths: 'Kopiera sökvägar',
+  deleteSelected: 'Ta bort markerade',
+  deleteSelectedTitle: 'Ta bort {count} markerade objekt?',
+  deleteSelectedDesc: 'Filerna och mapparna tas bort permanent. Det går inte att ångra.',
+  newFolder: 'Ny mapp',
+  newFolderPlaceholder: 'Mappnamn',
+  newFolderInvalid: 'Ogiltigt mappnamn',
+  filesTruncated: 'Mappen har för många poster; bara de första visas',
+  gitStatusModified: 'Ändrad',
+  gitStatusAdded: 'Tillagd',
+  gitStatusDeleted: 'Borttagen',
+  gitStatusUntracked: 'Spåras inte',
+  gitStatusRenamed: 'Omdöpt',
+  gitStatusConflict: 'Konflikt',
+  changesClean: 'Inga ändringar i arbetsytan',
+  changesNoHistory: 'Ingen commit-historik ännu',
+  changesStageFailed: 'Kunde inte köa: {message}',
+  changesOpGone: 'Åtgärden finns inte längre i sessionsloggen',
   newTab: 'Ny flik',
   brokenSymlink: 'Bruten symbolisk länk',
   close: 'Stäng',
@@ -103,7 +108,6 @@ export const sv: Record<string, string> = {
   error: 'Kunde inte ladda',
   retry: 'Försök igen',
   notRepo: 'Denna katalog är inte ett Git-arkiv',
-  noChanges: 'Inga ändringar',
   statusTruncated: 'För många ändringar; endast de första 2000 posterna visas',
   stage: 'Köa',
   unstage: 'Avköa',
diff --git a/src/client/locales-th.ts b/src/client/locales-th.ts
index 1fed493..d4cf2f1 100644
--- a/src/client/locales-th.ts
+++ b/src/client/locales-th.ts
@@ -57,26 +57,31 @@ export const th: Record<string, string> = {
   editorEmptyHint: 'เลือกไฟล์จากพาเนลต้นไม้ไฟล์หรือช่องกรอกพาธด้านบนเพื่อเริ่มพรีวิว',
   openFileNewTab: 'เปิดใน Tab ใหม่',
   openFileSide: 'เปิดด้านข้าง',
-  openWithMenu: 'เปิดด้วย',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: 'ปักหมุดในเมนู',
-  unpinOpenWith: 'ยกเลิกการปักหมุด',
-  openWithExplorer: 'ตัวจัดการไฟล์',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'โฮสต์ระยะไกล SSH',
-  openWithSettingsSshDesc: 'ว่าง = พื้นที่ทำงานในเครื่อง; เมื่อกรอก user@host หรือ alias SSH ตัวเปิดตระกูล VSCode จะสลับไปใช้โปรโตคอล vscode-remote/ssh-remote และตัวจัดการไฟล์ / Zed / ตัวแก้ไขที่กำหนดเองที่ไม่ใช่ตระกูล VSCode จะถูกซ่อนจากเมนู',
-  openWithSettingsSshPlaceholder: 'user@host หรือ alias SSH',
-  openWithSettingsCustomTitle: 'ตัวแก้ไขที่กำหนดเอง',
-  openWithSettingsCustomDesc: 'ชื่อ + เทมเพลต URL (placeholder {path}) + แฟล็กตระกูล VSCode; ในโหมดระยะไกลเฉพาะตัวแก้ไขตระกูล VSCode เท่านั้นที่เปิดพาธระยะไกลได้',
-  openWithSettingsAdd: 'เพิ่ม',
-  openWithSettingsName: 'ชื่อ',
-  openWithSettingsTemplate: 'เช่น cursor://file/{path}',
-  openWithSettingsFamily: 'ตระกูล VSCode',
-  openWithSettingsFamilyDesc: 'ตัวแก้ไขนี้ใช้โปรโตคอล URL ของ VSCode (รองรับการเปิดจากระยะไกลผ่าน SSH)',
-  openWithSettingsRemove: 'ลบ',
-  openWithSettingsInvalidHint: 'ตัวแก้ไขที่ไม่มีชื่อหรือเทมเพลตที่ไม่มี {path} / scheme:// จะไม่ปรากฏในเมนู',
+  openInApp: 'เปิดด้วย',
+  openInAppDefault: 'เปิดด้วยแอปเริ่มต้น',
+  openInAppEmpty: 'ไม่มีแอปที่เปิดไฟล์นี้ได้',
+  openInAppFailed: 'เปิดไม่สำเร็จ: {path}',
+  revealInFileManager: 'แสดงในตัวจัดการไฟล์',
+  filesSelected: 'เลือกแล้ว {count} รายการ',
+  clearSelection: 'ล้างการเลือก',
+  copyPaths: 'คัดลอกพาธ',
+  deleteSelected: 'ลบรายการที่เลือก',
+  deleteSelectedTitle: 'ลบ {count} รายการที่เลือกหรือไม่',
+  deleteSelectedDesc: 'ไฟล์และโฟลเดอร์เหล่านี้จะถูกลบอย่างถาวรและกู้คืนไม่ได้',
+  newFolder: 'โฟลเดอร์ใหม่',
+  newFolderPlaceholder: 'ชื่อโฟลเดอร์',
+  newFolderInvalid: 'ชื่อโฟลเดอร์ไม่ถูกต้อง',
+  filesTruncated: 'โฟลเดอร์นี้มีรายการมากเกินไป จึงแสดงเฉพาะส่วนแรก',
+  gitStatusModified: 'แก้ไขแล้ว',
+  gitStatusAdded: 'เพิ่มแล้ว',
+  gitStatusDeleted: 'ลบแล้ว',
+  gitStatusUntracked: 'ยังไม่ติดตาม',
+  gitStatusRenamed: 'เปลี่ยนชื่อแล้ว',
+  gitStatusConflict: 'มีความขัดแย้ง',
+  changesClean: 'ไม่มีการเปลี่ยนแปลงในเวิร์กสเปซ',
+  changesNoHistory: 'ยังไม่มีประวัติการ commit',
+  changesStageFailed: 'stage ไม่สำเร็จ: {message}',
+  changesOpGone: 'การดำเนินการนี้ไม่อยู่ในบันทึกเซสชันแล้ว',
   newTab: 'Tab ใหม่',
   brokenSymlink: 'Symlink เสีย',
   close: 'ปิด',
@@ -120,7 +125,6 @@ export const th: Record<string, string> = {
   error: 'โหลดล้มเหลว',
   retry: 'ลองอีกครั้ง',
   notRepo: 'ไดเรกทอรีนี้ไม่ใช่ git repository',
-  noChanges: 'ไม่มีการเปลี่ยนแปลง',
   statusTruncated: 'การเปลี่ยนแปลงมากเกินไป แสดงเพียง 2000 รายการแรก',
   stage: 'Stage',
   unstage: 'Unstage',
diff --git a/src/client/locales-tr.ts b/src/client/locales-tr.ts
index 31c3dd6..9cbbb44 100644
--- a/src/client/locales-tr.ts
+++ b/src/client/locales-tr.ts
@@ -57,26 +57,31 @@ export const tr: Record<string, string> = {
   editorEmptyHint: 'Önizlemeye başlamak için sağdaki dosya ağacından veya yukarıdaki yol girişinden bir dosya seçin',
   openFileNewTab: 'Yeni sekmede aç',
   openFileSide: 'Yana aç',
-  openWithMenu: 'Birlikte aç',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: 'Menüye sabitle',
-  unpinOpenWith: 'Sabitlemeyi kaldır',
-  openWithExplorer: 'Dosya yöneticisi',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'SSH uzak ana makine',
-  openWithSettingsSshDesc: 'Boş = yerel çalışma alanı; bir user@host veya SSH rumuzu verilirse VSCode ailesi açıcılar vscode-remote/ssh-remote protokolüne geçer ve Dosya yöneticisi / Zed / VSCode ailesi olmayan özel düzenleyiciler menüden gizlenir',
-  openWithSettingsSshPlaceholder: 'user@host veya SSH rumuzu',
-  openWithSettingsCustomTitle: 'Özel düzenleyiciler',
-  openWithSettingsCustomDesc: 'Ad + URL şablonu ({path} yer tutucusu) + VSCode ailesi bayrağı; uzak modda yalnızca VSCode ailesi düzenleyiciler uzak yolu açabilir',
-  openWithSettingsAdd: 'Ekle',
-  openWithSettingsName: 'Ad',
-  openWithSettingsTemplate: 'ör. cursor://file/{path}',
-  openWithSettingsFamily: 'VSCode ailesi',
-  openWithSettingsFamilyDesc: 'Bu düzenleyici VSCode URL dilini konuşur (SSH uzak açmayı destekler)',
-  openWithSettingsRemove: 'Kaldır',
-  openWithSettingsInvalidHint: 'Adı eksik veya {path}/scheme:// içermeyen şablonlu düzenleyiciler menüde gösterilmez',
+  openInApp: 'Birlikte aç',
+  openInAppDefault: 'Varsayılan uygulamayla aç',
+  openInAppEmpty: 'Bunu açabilecek bir uygulama yok',
+  openInAppFailed: 'Açılamadı: {path}',
+  revealInFileManager: 'Dosya yöneticisinde göster',
+  filesSelected: '{count} öğe seçildi',
+  clearSelection: 'Seçimi temizle',
+  copyPaths: 'Yolları kopyala',
+  deleteSelected: 'Seçilenleri sil',
+  deleteSelectedTitle: 'Seçili {count} öğe silinsin mi?',
+  deleteSelectedDesc: 'Bu dosyalar ve klasörler kalıcı olarak silinecek. Bu işlem geri alınamaz.',
+  newFolder: 'Yeni klasör',
+  newFolderPlaceholder: 'Klasör adı',
+  newFolderInvalid: 'Klasör adı geçersiz',
+  filesTruncated: 'Bu klasörde çok fazla öğe var; yalnızca ilk kısmı gösteriliyor',
+  gitStatusModified: 'Değiştirildi',
+  gitStatusAdded: 'Eklendi',
+  gitStatusDeleted: 'Silindi',
+  gitStatusUntracked: 'İzlenmiyor',
+  gitStatusRenamed: 'Yeniden adlandırıldı',
+  gitStatusConflict: 'Çakışma',
+  changesClean: 'Çalışma alanında değişiklik yok',
+  changesNoHistory: 'Henüz commit geçmişi yok',
+  changesStageFailed: 'Sahneleme başarısız: {message}',
+  changesOpGone: 'Bu işlem artık oturum günlüğünde değil',
   newTab: 'Yeni sekme',
   brokenSymlink: 'Bozuk sembolik bağ',
   close: 'Kapat',
@@ -120,7 +125,6 @@ export const tr: Record<string, string> = {
   error: 'Yükleme başarısız',
   retry: 'Yeniden dene',
   notRepo: 'Bu dizin bir git deposu değil',
-  noChanges: 'Değişiklik yok',
   statusTruncated: 'Çok fazla değişiklik var; yalnızca ilk 2000 giriş gösteriliyor',
   stage: 'Sahnele',
   unstage: 'Sahnelemeden kaldır',
diff --git a/src/client/locales-vi.ts b/src/client/locales-vi.ts
index e8a6fb9..ba728ba 100644
--- a/src/client/locales-vi.ts
+++ b/src/client/locales-vi.ts
@@ -57,26 +57,31 @@ export const vi: Record<string, string> = {
   editorEmptyHint: 'Chọn tệp từ cây tệp bên phải hoặc ô nhập đường dẫn phía trên để xem trước',
   openFileNewTab: 'Mở trong Tab mới',
   openFileSide: 'Mở ở bên cạnh',
-  openWithMenu: 'Mở bằng',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: 'Ghim vào menu',
-  unpinOpenWith: 'Bỏ ghim',
-  openWithExplorer: 'Trình quản lý tệp',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'Máy chủ từ xa SSH',
-  openWithSettingsSshDesc: 'Để trống cho không gian làm việc cục bộ; nhập user@host hoặc alias SSH, các trình mở họ VSCode sẽ chuyển sang giao thức vscode-remote/ssh-remote, Trình quản lý tệp / Zed / trình soạn thảo tùy chỉnh không phải VSCode sẽ ẩn khỏi menu',
-  openWithSettingsSshPlaceholder: 'user@host hoặc alias SSH',
-  openWithSettingsCustomTitle: 'Trình soạn thảo tùy chỉnh',
-  openWithSettingsCustomDesc: 'Tên + mẫu URL (placeholder {path}) + cờ họ VSCode; ở chế độ SSH chỉ họ VSCode mở được đường dẫn từ xa',
-  openWithSettingsAdd: 'Thêm',
-  openWithSettingsName: 'Tên',
-  openWithSettingsTemplate: 'vd: cursor://file/{path}',
-  openWithSettingsFamily: 'Họ VSCode',
-  openWithSettingsFamilyDesc: 'Trình soạn thảo này dùng giao thức URL của VSCode (hỗ trợ mở từ xa qua SSH)',
-  openWithSettingsRemove: 'Xóa',
-  openWithSettingsInvalidHint: 'Trình soạn thảo thiếu tên hoặc mẫu (cần chứa {path} và bắt đầu bằng scheme://) sẽ không xuất hiện trong menu',
+  openInApp: 'Mở bằng',
+  openInAppDefault: 'Mở bằng ứng dụng mặc định',
+  openInAppEmpty: 'Không có ứng dụng nào mở được tệp này',
+  openInAppFailed: 'Không mở được: {path}',
+  revealInFileManager: 'Hiển thị trong trình quản lý tệp',
+  filesSelected: 'Đã chọn {count}',
+  clearSelection: 'Bỏ chọn',
+  copyPaths: 'Sao chép đường dẫn',
+  deleteSelected: 'Xóa mục đã chọn',
+  deleteSelectedTitle: 'Xóa {count} mục đã chọn?',
+  deleteSelectedDesc: 'Các tệp và thư mục này sẽ bị xóa vĩnh viễn, không thể khôi phục.',
+  newFolder: 'Thư mục mới',
+  newFolderPlaceholder: 'Tên thư mục',
+  newFolderInvalid: 'Tên thư mục không hợp lệ',
+  filesTruncated: 'Thư mục này có quá nhiều mục; chỉ hiển thị phần đầu',
+  gitStatusModified: 'Đã sửa',
+  gitStatusAdded: 'Đã thêm',
+  gitStatusDeleted: 'Đã xóa',
+  gitStatusUntracked: 'Chưa theo dõi',
+  gitStatusRenamed: 'Đã đổi tên',
+  gitStatusConflict: 'Xung đột',
+  changesClean: 'Không có thay đổi trong workspace',
+  changesNoHistory: 'Chưa có lịch sử commit',
+  changesStageFailed: 'Stage thất bại: {message}',
+  changesOpGone: 'Thao tác này không còn trong nhật ký phiên',
   newTab: 'Tab mới',
   brokenSymlink: 'Symlink hỏng',
   close: 'Đóng',
@@ -120,7 +125,6 @@ export const vi: Record<string, string> = {
   error: 'Tải thất bại',
   retry: 'Thử lại',
   notRepo: 'Thư mục hiện tại không phải repo git',
-  noChanges: 'Không có thay đổi',
   statusTruncated: 'Quá nhiều thay đổi; chỉ hiển thị 2000 mục đầu tiên',
   stage: 'Stage',
   unstage: 'Unstage',
diff --git a/src/client/locales-zh-HK.ts b/src/client/locales-zh-HK.ts
index 8b189bd..54a5e51 100644
--- a/src/client/locales-zh-HK.ts
+++ b/src/client/locales-zh-HK.ts
@@ -72,26 +72,31 @@ export const zhHK: Record<string, string> = {
   editorEmptyHint: '從右側檔案樹或上方路徑輸入框選擇檔案開始預覽',
   openFileNewTab: '在新 Tab 中開啟',
   openFileSide: '在側邊開啟',
-  openWithMenu: '在應用程式中開啟',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: '固定到選單',
-  unpinOpenWith: '取消固定',
-  openWithExplorer: '檔案總管',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'SSH 遠端主機',
-  openWithSettingsSshDesc: '留空為本地工作區；填入 user@host 或 SSH 別名後，VSCode 系開啟方式將改用 vscode-remote/ssh-remote 協議，檔案總管 / Zed / 非 VSCode 系自訂編輯器將從選單隱藏',
-  openWithSettingsSshPlaceholder: 'user@host 或 SSH 別名',
-  openWithSettingsCustomTitle: '自訂編輯器',
-  openWithSettingsCustomDesc: '名稱 + URL 範本（{path} 佔位符）+ 是否 VSCode 系；SSH 模式下僅 VSCode 系可開啟遠端',
-  openWithSettingsAdd: '新增',
-  openWithSettingsName: '名稱',
-  openWithSettingsTemplate: '如 cursor://file/{path}',
-  openWithSettingsFamily: 'VSCode 系',
-  openWithSettingsFamilyDesc: '該編輯器使用 VSCode 的 URL 協議（支援 SSH 遠端開啟）',
-  openWithSettingsRemove: '刪除',
-  openWithSettingsInvalidHint: '名稱或範本（需含 {path} 且以 scheme:// 開頭）未填寫的編輯器不會出現在選單中',
+  openInApp: '開啟方式',
+  openInAppDefault: '用預設應用程式開啟',
+  openInAppEmpty: '沒有可用於開啟它的應用程式',
+  openInAppFailed: '無法開啟：{path}',
+  revealInFileManager: '在檔案總管中顯示',
+  filesSelected: '已選取 {count} 項',
+  clearSelection: '取消選取',
+  copyPaths: '複製路徑',
+  deleteSelected: '刪除所選',
+  deleteSelectedTitle: '刪除選取的 {count} 項？',
+  deleteSelectedDesc: '這些檔案與資料夾將被永久刪除，無法復原。',
+  newFolder: '新增資料夾',
+  newFolderPlaceholder: '資料夾名稱',
+  newFolderInvalid: '資料夾名稱無效',
+  filesTruncated: '此目錄項目過多，僅顯示前一部分',
+  gitStatusModified: '已修改',
+  gitStatusAdded: '新增',
+  gitStatusDeleted: '已刪除',
+  gitStatusUntracked: '未追蹤',
+  gitStatusRenamed: '已重新命名',
+  gitStatusConflict: '有衝突',
+  changesClean: '工作區沒有變更',
+  changesNoHistory: '還沒有提交歷史',
+  changesStageFailed: '暫存失敗：{message}',
+  changesOpGone: '此操作已不在工作階段記錄中',
   newTab: '新增標籤',
   brokenSymlink: '失效的符號連結',
   close: '關閉',
@@ -135,7 +140,6 @@ export const zhHK: Record<string, string> = {
   error: '載入失敗',
   retry: '重試',
   notRepo: '目前目錄不是 git 倉庫',
-  noChanges: '沒有變更',
   statusTruncated: '變更過多，僅顯示前 2000 條',
   stage: '暫存',
   unstage: '取消暫存',
diff --git a/src/client/locales-zh-MO.ts b/src/client/locales-zh-MO.ts
index 7229f76..0bd62ab 100644
--- a/src/client/locales-zh-MO.ts
+++ b/src/client/locales-zh-MO.ts
@@ -72,26 +72,31 @@ export const zhMO: Record<string, string> = {
   editorEmptyHint: '從右側檔案樹或上方路徑輸入框選擇檔案開始預覽',
   openFileNewTab: '在新 Tab 中開啟',
   openFileSide: '在側邊開啟',
-  openWithMenu: '在應用程式中開啟',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: '固定到選單',
-  unpinOpenWith: '取消固定',
-  openWithExplorer: '檔案總管',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'SSH 遠端主機',
-  openWithSettingsSshDesc: '留空為本地工作區；填入 user@host 或 SSH 別名後，VSCode 系開啟方式將改用 vscode-remote/ssh-remote 協議，檔案總管 / Zed / 非 VSCode 系自訂編輯器將從選單隱藏',
-  openWithSettingsSshPlaceholder: 'user@host 或 SSH 別名',
-  openWithSettingsCustomTitle: '自訂編輯器',
-  openWithSettingsCustomDesc: '名稱 + URL 範本（{path} 佔位符）+ 是否 VSCode 系；SSH 模式下僅 VSCode 系可開啟遠端',
-  openWithSettingsAdd: '新增',
-  openWithSettingsName: '名稱',
-  openWithSettingsTemplate: '如 cursor://file/{path}',
-  openWithSettingsFamily: 'VSCode 系',
-  openWithSettingsFamilyDesc: '該編輯器使用 VSCode 的 URL 協議（支援 SSH 遠端開啟）',
-  openWithSettingsRemove: '刪除',
-  openWithSettingsInvalidHint: '名稱或範本（需含 {path} 且以 scheme:// 開頭）未填寫的編輯器不會出現在選單中',
+  openInApp: '開啟方式',
+  openInAppDefault: '用預設應用程式開啟',
+  openInAppEmpty: '沒有可用於開啟它的應用程式',
+  openInAppFailed: '無法開啟：{path}',
+  revealInFileManager: '在檔案總管中顯示',
+  filesSelected: '已選取 {count} 項',
+  clearSelection: '取消選取',
+  copyPaths: '複製路徑',
+  deleteSelected: '刪除所選',
+  deleteSelectedTitle: '刪除選取的 {count} 項？',
+  deleteSelectedDesc: '這些檔案與資料夾將被永久刪除，無法復原。',
+  newFolder: '新增資料夾',
+  newFolderPlaceholder: '資料夾名稱',
+  newFolderInvalid: '資料夾名稱無效',
+  filesTruncated: '此目錄項目過多，僅顯示前一部分',
+  gitStatusModified: '已修改',
+  gitStatusAdded: '新增',
+  gitStatusDeleted: '已刪除',
+  gitStatusUntracked: '未追蹤',
+  gitStatusRenamed: '已重新命名',
+  gitStatusConflict: '有衝突',
+  changesClean: '工作區沒有變更',
+  changesNoHistory: '還沒有提交歷史',
+  changesStageFailed: '暫存失敗：{message}',
+  changesOpGone: '此操作已不在工作階段記錄中',
   newTab: '新增標籤',
   brokenSymlink: '失效的符號連結',
   close: '關閉',
@@ -135,7 +140,6 @@ export const zhMO: Record<string, string> = {
   error: '載入失敗',
   retry: '重試',
   notRepo: '目前目錄不是 git 倉庫',
-  noChanges: '沒有變更',
   statusTruncated: '變更過多，僅顯示前 2000 條',
   stage: '暫存',
   unstage: '取消暫存',
diff --git a/src/client/locales-zh-TW.ts b/src/client/locales-zh-TW.ts
index a28c831..bcf0efa 100644
--- a/src/client/locales-zh-TW.ts
+++ b/src/client/locales-zh-TW.ts
@@ -72,26 +72,31 @@ export const zhTW: Record<string, string> = {
   editorEmptyHint: '從右側檔案樹或上方路徑輸入框選擇檔案開始預覽',
   openFileNewTab: '在新 Tab 中開啟',
   openFileSide: '在側邊開啟',
-  openWithMenu: '在應用程式中開啟',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: '固定到選單',
-  unpinOpenWith: '取消固定',
-  openWithExplorer: '檔案總管',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'SSH 遠端主機',
-  openWithSettingsSshDesc: '留空為本地工作區；填入 user@host 或 SSH 別名後，VSCode 系開啟方式將改用 vscode-remote/ssh-remote 協議，檔案總管 / Zed / 非 VSCode 系自訂編輯器將從選單隱藏',
-  openWithSettingsSshPlaceholder: 'user@host 或 SSH 別名',
-  openWithSettingsCustomTitle: '自訂編輯器',
-  openWithSettingsCustomDesc: '名稱 + URL 範本（{path} 佔位符）+ 是否 VSCode 系；SSH 模式下僅 VSCode 系可開啟遠端',
-  openWithSettingsAdd: '新增',
-  openWithSettingsName: '名稱',
-  openWithSettingsTemplate: '如 cursor://file/{path}',
-  openWithSettingsFamily: 'VSCode 系',
-  openWithSettingsFamilyDesc: '該編輯器使用 VSCode 的 URL 協議（支援 SSH 遠端開啟）',
-  openWithSettingsRemove: '刪除',
-  openWithSettingsInvalidHint: '名稱或範本（需含 {path} 且以 scheme:// 開頭）未填寫的編輯器不會出現在選單中',
+  openInApp: '開啟方式',
+  openInAppDefault: '用預設應用程式開啟',
+  openInAppEmpty: '沒有可用來開啟它的應用程式',
+  openInAppFailed: '無法開啟：{path}',
+  revealInFileManager: '在檔案總管中顯示',
+  filesSelected: '已選取 {count} 項',
+  clearSelection: '取消選取',
+  copyPaths: '複製路徑',
+  deleteSelected: '刪除選取項目',
+  deleteSelectedTitle: '刪除選取的 {count} 個項目？',
+  deleteSelectedDesc: '這些檔案與資料夾將被永久刪除，無法復原。',
+  newFolder: '新增資料夾',
+  newFolderPlaceholder: '資料夾名稱',
+  newFolderInvalid: '資料夾名稱無效',
+  filesTruncated: '此目錄項目過多，僅顯示前一部分',
+  gitStatusModified: '已修改',
+  gitStatusAdded: '新增',
+  gitStatusDeleted: '已刪除',
+  gitStatusUntracked: '未追蹤',
+  gitStatusRenamed: '已重新命名',
+  gitStatusConflict: '有衝突',
+  changesClean: '工作區沒有變更',
+  changesNoHistory: '還沒有提交歷史',
+  changesStageFailed: '暫存失敗：{message}',
+  changesOpGone: '此操作已不在作業階段記錄中',
   newTab: '新增標籤',
   brokenSymlink: '失效的符號連結',
   close: '關閉',
@@ -135,7 +140,6 @@ export const zhTW: Record<string, string> = {
   error: '載入失敗',
   retry: '重試',
   notRepo: '目前目錄不是 git 倉庫',
-  noChanges: '沒有變更',
   statusTruncated: '變更過多，僅顯示前 2000 條',
   stage: '暫存',
   unstage: '取消暫存',
diff --git a/src/client/locales.ts b/src/client/locales.ts
index 51ea459..56f2f90 100644
--- a/src/client/locales.ts
+++ b/src/client/locales.ts
@@ -69,26 +69,31 @@ export const zh = {
   editorEmptyHint: '从右侧文件树或上方路径输入框选择文件开始预览',
   openFileNewTab: '在新 Tab 中打开',
   openFileSide: '在侧边打开',
-  openWithMenu: '在应用中打开',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: '固定到菜单',
-  unpinOpenWith: '取消固定',
-  openWithExplorer: '资源管理器',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'SSH 远端主机',
-  openWithSettingsSshDesc: '留空为本地工作区；填入 user@host 或 SSH 别名后，VSCode 系打开方式将改用 vscode-remote/ssh-remote 协议，资源管理器 / Zed / 非 VSCode 系自定义编辑器将从菜单隐藏',
-  openWithSettingsSshPlaceholder: 'user@host 或 SSH 别名',
-  openWithSettingsCustomTitle: '自定义编辑器',
-  openWithSettingsCustomDesc: '名称 + URL 模板（{path} 占位符）+ 是否 VSCode 系；SSH 模式下仅 VSCode 系可打开远端',
-  openWithSettingsAdd: '添加',
-  openWithSettingsName: '名称',
-  openWithSettingsTemplate: '如 cursor://file/{path}',
-  openWithSettingsFamily: 'VSCode 系',
-  openWithSettingsFamilyDesc: '该编辑器使用 VSCode 的 URL 协议（支持 SSH 远端打开）',
-  openWithSettingsRemove: '删除',
-  openWithSettingsInvalidHint: '名称或模板（需含 {path} 且以 scheme:// 开头）未填写的编辑器不会出现在菜单中',
+  openInApp: '打开方式',
+  openInAppDefault: '用默认应用打开',
+  openInAppEmpty: '没有可用于打开它的应用',
+  openInAppFailed: '无法打开：{path}',
+  revealInFileManager: '在文件管理器中显示',
+  filesSelected: '已选择 {count} 项',
+  clearSelection: '取消选择',
+  copyPaths: '复制路径',
+  deleteSelected: '删除所选',
+  deleteSelectedTitle: '删除选中的 {count} 项？',
+  deleteSelectedDesc: '这些文件与文件夹将被永久删除，无法恢复。',
+  newFolder: '新建文件夹',
+  newFolderPlaceholder: '文件夹名称',
+  newFolderInvalid: '文件夹名称无效',
+  filesTruncated: '该目录条目过多，仅显示前一部分',
+  gitStatusModified: '已修改',
+  gitStatusAdded: '新增',
+  gitStatusDeleted: '已删除',
+  gitStatusUntracked: '未跟踪',
+  gitStatusRenamed: '已重命名',
+  gitStatusConflict: '有冲突',
+  changesClean: '工作区没有变更',
+  changesNoHistory: '还没有提交历史',
+  changesStageFailed: '暂存失败：{message}',
+  changesOpGone: '该操作已不在会话记录中',
   newTab: '新建标签页',
   brokenSymlink: '失效的软链接',
   close: '关闭',
@@ -131,7 +136,6 @@ export const zh = {
   error: '加载失败',
   retry: '重试',
   notRepo: '当前目录不是 git 仓库',
-  noChanges: '没有变更',
   statusTruncated: '变更过多，仅显示前 2000 条',
   stage: '暂存',
   unstage: '取消暂存',
@@ -554,26 +558,31 @@ export const en: Record<keyof typeof zh, string> = {
   editorEmptyHint: 'Pick a file from the tree panel or the path input above to start previewing',
   openFileNewTab: 'Open in New Tab',
   openFileSide: 'Open to the Side',
-  openWithMenu: 'Open with',
-  openWithSshSuffix: ' (SSH)',
-  pinOpenWith: 'Pin to menu',
-  unpinOpenWith: 'Unpin',
-  openWithExplorer: 'File Manager',
-  openWithVscode: 'VS Code',
-  openWithCursor: 'Cursor',
-  openWithZed: 'Zed',
-  openWithSettingsSshTitle: 'SSH remote host',
-  openWithSettingsSshDesc: 'Empty = local workspace; with a user@host or SSH alias, VSCode-family openers switch to the vscode-remote/ssh-remote protocol and the File Manager / Zed / non-VSCode-family custom editors are hidden from the menu',
-  openWithSettingsSshPlaceholder: 'user@host or SSH alias',
-  openWithSettingsCustomTitle: 'Custom editors',
-  openWithSettingsCustomDesc: 'Name + URL template ({path} placeholder) + VSCode-family flag; in remote mode only VSCode-family editors can open a remote path',
-  openWithSettingsAdd: 'Add',
-  openWithSettingsName: 'Name',
-  openWithSettingsTemplate: 'e.g. cursor://file/{path}',
-  openWithSettingsFamily: 'VSCode-family',
-  openWithSettingsFamilyDesc: 'This editor speaks the VSCode URL dialect (supports SSH-remote opens)',
-  openWithSettingsRemove: 'Remove',
-  openWithSettingsInvalidHint: 'Editors with a missing name or a template without {path} / scheme:// are not shown in the menu',
+  openInApp: 'Open with',
+  openInAppDefault: 'Open with default app',
+  openInAppEmpty: 'No application can open it',
+  openInAppFailed: 'Could not open: {path}',
+  revealInFileManager: 'Reveal in File Manager',
+  filesSelected: '{count} selected',
+  clearSelection: 'Clear selection',
+  copyPaths: 'Copy paths',
+  deleteSelected: 'Delete selected',
+  deleteSelectedTitle: 'Delete {count} selected items?',
+  deleteSelectedDesc: 'These files and folders will be permanently deleted. This cannot be undone.',
+  newFolder: 'New folder',
+  newFolderPlaceholder: 'Folder name',
+  newFolderInvalid: 'Invalid folder name',
+  filesTruncated: 'This folder has too many entries; only the first ones are shown',
+  gitStatusModified: 'Modified',
+  gitStatusAdded: 'Added',
+  gitStatusDeleted: 'Deleted',
+  gitStatusUntracked: 'Untracked',
+  gitStatusRenamed: 'Renamed',
+  gitStatusConflict: 'Conflicted',
+  changesClean: 'No changes in the working tree',
+  changesNoHistory: 'No commits yet',
+  changesStageFailed: 'Staging failed: {message}',
+  changesOpGone: 'This operation is no longer in the session log',
   newTab: 'New tab',
   brokenSymlink: 'Broken symlink',
   close: 'Close',
@@ -616,7 +625,6 @@ export const en: Record<keyof typeof zh, string> = {
   error: 'Failed to load',
   retry: 'Retry',
   notRepo: 'This directory is not a git repository',
-  noChanges: 'No changes',
   statusTruncated: 'Too many changes; showing the first 2,000 entries',
   stage: 'Stage',
   unstage: 'Unstage',
@@ -1069,6 +1077,21 @@ export function attachLocale(service: {
  * @returns the translated text, or undefined when unavailable.
  */
 export function chatT(key: string, params?: Record<string, string | number>): string | undefined {
+  return hostT('chat', key, params)
+}
+
+/**
+ * Translate a key in one of the HOST's own locale namespaces. Same contract
+ * and same deliberately-untyped seam as {@link chatT} — the plugin reads host
+ * wording it would otherwise have to duplicate across 20 dictionaries (the
+ * chat activity line, the open-in-app application names).
+ *
+ * @param ns - host namespace (e.g. `'open-in-app'`).
+ * @param key - full namespace key (e.g. `'app.vscode'`).
+ * @param params - `{name}` placeholders to interpolate (the host does this).
+ * @returns the translated text, or undefined when unavailable.
+ */
+export function hostT(ns: string, key: string, params?: Record<string, string | number>): string | undefined {
   const service = localeService
   if (service === undefined) return undefined
   try {
@@ -1076,7 +1099,7 @@ export function chatT(key: string, params?: Record<string, string | number>): st
     // reference (`const bind = service.bind; bind('chat')`) throws
     // "Cannot read properties of undefined (reading 'bound')" — caught by the
     // real-host mount lane, invisible to closure fakes in unit tests.
-    const translate = service.bind?.('chat')
+    const translate = service.bind?.(ns)
     if (typeof translate !== 'function') return undefined
     const text = translate(key, params)
     return typeof text === 'string' && text !== '' && text !== key ? text : undefined
diff --git a/src/client/menu-flip.ts b/src/client/menu-flip.ts
deleted file mode 100644
index 7168fec..0000000
--- a/src/client/menu-flip.ts
+++ /dev/null
@@ -1,68 +0,0 @@
-/**
- * Submenu flip geometry for the portaled context menus.
- *
- * The primitives `Menu` clamps its main list into the viewport (portal mode,
- * 12px margin) but positions nested submenus with pure CSS — `bottom: -4px`
- * (grow UP from the parent row) and `left: calc(100% + 10px)` (open RIGHT of
- * the card) — with no viewport clamp at all. This sidebar lives docked on the
- * RIGHT edge of the window, so both defaults are the worst case here: a tall
- * "open with" submenu pokes past the viewport top when the row menu opens
- * near the top, and past the right edge whenever the panel is narrow.
- *
- * The host primitive is not ours to patch, so the fix is a body attribute
- * written while one of OUR submenu-bearing menus is open: layout.css flips
- * the submenu's growth direction per token. The attribute's lifetime IS the
- * scope — only our menus set it, and layout.css rules for
- * `div[role="menu"] div[role="menu"]` only apply while it exists, so
- * host-owned menus are never touched.
- */
-
-import { useEffect } from 'react'
-
-/** body attribute carrying the flip tokens (whitespace-separated words). */
-export const SUBMENU_FLIP_ATTR = 'data-dsh-sidebar-submenu'
-
-/**
- * Mirror of the primitive's submenu geometry (Menu.module.css): card
- * min-width 218 + card-to-submenu gap 10 + submenu min-width 163..165 +
- * viewport margin 12 ≈ 400px of right-hand room a right-growing submenu
- * needs. If the cursor is within that of the right edge, open left instead.
- * The estimate is conservative (the primitive's own clamp can only move the
- * card further left), so a wrong guess flips left unnecessarily — never into
- * a new overflow — and drifting from future host metrics degrades the same
- * way, back to today's behavior at worst.
- */
-const SUBMENU_RIGHT_ROOM = 400
-
-/** Below the vertical midpoint the parent row usually has more room above. */
-function isUpperHalf(y: number, vh: number): boolean {
-  return y < vh / 2
-}
-
-/**
- * The flip tokens for a menu opened at viewport coordinates (x, y):
- * `down` — open the submenu downward from the parent row (cursor in the
- * upper half; the sidebar's tab strip is always up there);
- * `left` — open the submenu leftward of the card (not enough right-hand
- * room). Empty string when the primitive's defaults already fit.
- */
-export function submenuFlipTokens(x: number, y: number, vw: number, vh: number): string {
-  const tokens: string[] = []
-  if (isUpperHalf(y, vh)) tokens.push('down')
-  if (x + SUBMENU_RIGHT_ROOM > vw) tokens.push('left')
-  return tokens.join(' ')
-}
-
-/**
- * Publish the flip tokens on <body> while the given cursor-anchored menu
- * state is open; clear them on close and on unmount (a menu left open by an
- * unmounting panel must not leave stale geometry on the shared body).
- * `menu` only needs the viewport coordinates the Menu anchored to.
- */
-export function useSubmenuFlip(menu: { x: number; y: number } | null): void {
-  useEffect(() => {
-    if (menu === null) return
-    document.body.setAttribute(SUBMENU_FLIP_ATTR, submenuFlipTokens(menu.x, menu.y, window.innerWidth, window.innerHeight))
-    return () => { document.body.removeAttribute(SUBMENU_FLIP_ATTR) }
-  }, [menu])
-}
diff --git a/src/client/open-in-app.ts b/src/client/open-in-app.ts
new file mode 100644
index 0000000..6ab2e2b
--- /dev/null
+++ b/src/client/open-in-app.ts
@@ -0,0 +1,214 @@
+/**
+ * The client half of "open with an application" — a thin adapter over DSH's
+ * OWN open-in-app capability, replacing the plugin's former home-grown
+ * vocabulary (URL templates, SSH hosts, custom editors, a spawn route).
+ *
+ * Two host facilities back this, and the adapter simply picks the right one:
+ *
+ * - The Host Remote (`ctx.remote.session`): `canOpenWorkspacePath()` reports
+ *   whether this deployment can hand a path to a native desktop,
+ *   `workspacePathApplications({path})` lists the OS handlers REGISTERED for
+ *   one file, and `openWorkspacePath({path, action?, application?})` opens a
+ *   path or reveals it in the file manager. The host validates the path and
+ *   the application id before spawning anything.
+ * - The host's webServer routes: `GET /open-in-app/apps` is the probed
+ *   application CATALOG (menu order) and `POST /open-in-app/open` launches
+ *   one catalog app on a DIRECTORY — the "open this workspace in VS Code"
+ *   gesture. Catalog ids are not file-handler ids, so `open()` tries the
+ *   Remote first and falls back to the catalog route.
+ *
+ * Everything degrades to "no control" when the host says the desktop is
+ * unavailable: the caller hides the section instead of offering dead rows.
+ */
+import { hostT } from './locales.ts'
+
+/** The host route paths (see `@deepseek-ai/dsh-host-open-in-app/shared`). */
+const APPS_PATH = '/open-in-app/apps'
+const ICON_PATH = '/open-in-app/icon'
+const OPEN_PATH = '/open-in-app/open'
+
+/** One application that can open the path. */
+export interface OpenInAppEntry {
+  /** Host-side id: an OS handler id for files, a catalog id for directories. */
+  id: string
+  /** Display name (the OS reports handlers; the catalog id is localized). */
+  name: string
+  /** PNG/SVG data URL for a handler, an icon route for a catalog app, else null. */
+  icon: string | null
+  /** Whether the OS reports it as the default handler (files only). */
+  isDefault: boolean
+}
+
+/** The adapter the pages consume. */
+export interface OpenInApp {
+  /** Whether the host can open paths on a desktop; null until probed. */
+  available(): boolean | null
+  /** Probe availability once (shared across callers). */
+  probe(): Promise<boolean>
+  /** The installed-application catalog, in host menu order (directories). */
+  directoryApps(): Promise<readonly OpenInAppEntry[]>
+  /** The OS handlers registered for one file, or null when the query failed. */
+  fileApps(path: string): Promise<readonly OpenInAppEntry[] | null>
+  /** Open a path with its default handler, or with one explicit application. */
+  open(path: string, application?: string): Promise<boolean>
+  /** Reveal a path in the OS file manager. */
+  reveal(path: string): Promise<boolean>
+}
+
+/** The slice of `ctx.remote.session` this module calls (structurally typed). */
+interface SessionRemote {
+  canOpenWorkspacePath(): Promise<{ ok: boolean; value?: boolean }>
+  workspacePathApplications(request: { path: string }): Promise<{ ok: boolean; value?: readonly RawFileApplication[] }>
+  openWorkspacePath(request: { path: string; action?: 'reveal'; application?: string }): Promise<{ ok: boolean }>
+}
+
+/** The host's `NativeFileApplication` shape. */
+interface RawFileApplication {
+  id: string
+  name: string
+  default: boolean
+  icon: string | null
+}
+
+/** A ctx that can resolve client services (the cordis client root). */
+interface CtxLike {
+  get(name: string): unknown
+}
+
+/** The host's `open-in-app` locale namespace, read through the plugin's bridge. */
+function appLabel(id: string): string {
+  const text = hostT('open-in-app', `app.${id}`)
+  if (text !== undefined) return text
+  // The namespace may be absent (host older than the capability): fall back to
+  // a readable form of the id itself.
+  return id.charAt(0).toUpperCase() + id.slice(1)
+}
+
+/**
+ * The remote namespace, or undefined when the client assembly lacks it.
+ *
+ * Cordis throws when a service (or a nested property of one) is read without
+ * a matching `inject` entry — the client bundle declares `remote` and
+ * `remote.session` for exactly this call, but a composition that mounts the
+ * sidebar without the Host Remote assembly must degrade to "no control"
+ * instead of taking a render down with it, so the read is guarded.
+ */
+function remoteOf(ctx: CtxLike): SessionRemote | undefined {
+  try {
+    const remote = ctx.get('remote') as { session?: SessionRemote } | undefined | null
+    const session = remote?.session
+    return session !== undefined && typeof session.openWorkspacePath === 'function' ? session : undefined
+  } catch {
+    return undefined
+  }
+}
+
+/** Build the adapter for one client ctx. */
+export function createOpenInApp(ctx: CtxLike): OpenInApp {
+  const remote = remoteOf(ctx)
+  /** Tri-state availability; one shared probe per page. */
+  let availability: boolean | null = null
+  let probing: Promise<boolean> | null = null
+
+  const probe = async (): Promise<boolean> => {
+    if (availability !== null) return availability
+    if (remote === undefined) {
+      availability = false
+      return false
+    }
+    probing ??= remote.canOpenWorkspacePath()
+      .then(result => {
+        availability = result.ok && result.value === true
+        return availability
+      })
+      .catch(() => {
+        availability = false
+        return false
+      })
+      .finally(() => { probing = null })
+    return probing
+  }
+
+  const directoryApps = async (): Promise<readonly OpenInAppEntry[]> => {
+    if (!await probe()) return []
+    try {
+      const response = await fetch(APPS_PATH)
+      if (!response.ok) return []
+      const payload = await response.json() as { apps?: unknown }
+      const ids = Array.isArray(payload.apps) ? payload.apps.filter((id): id is string => typeof id === 'string') : []
+      return ids.map(id => ({
+        id,
+        name: appLabel(id),
+        icon: `${ICON_PATH}/${encodeURIComponent(id)}`,
+        isDefault: false,
+      }))
+    } catch {
+      return []
+    }
+  }
+
+  const fileApps = async (path: string): Promise<readonly OpenInAppEntry[] | null> => {
+    if (remote === undefined || !await probe()) return null
+    try {
+      const result = await remote.workspacePathApplications({ path })
+      if (!result.ok || result.value === undefined) return null
+      return result.value.map(app => ({
+        id: app.id,
+        name: app.name,
+        icon: app.icon,
+        isDefault: app.default,
+      }))
+    } catch {
+      return null
+    }
+  }
+
+  const openViaRemote = async (path: string, application: string | undefined): Promise<boolean> => {
+    if (remote === undefined) return false
+    try {
+      const result = await remote.openWorkspacePath({
+        path,
+        ...(application !== undefined ? { application } : {}),
+      })
+      return result.ok
+    } catch {
+      return false
+    }
+  }
+
+  const open = async (path: string, application?: string): Promise<boolean> => {
+    if (await openViaRemote(path, application)) return true
+    // A catalog id is not a file-handler id: the host's directory route is the
+    // one that launches "VS Code on this folder".
+    if (application === undefined) return false
+    try {
+      const response = await fetch(OPEN_PATH, {
+        method: 'POST',
+        headers: { 'content-type': 'application/json' },
+        body: JSON.stringify({ app: application, path }),
+      })
+      return response.ok
+    } catch {
+      return false
+    }
+  }
+
+  const reveal = async (path: string): Promise<boolean> => {
+    if (remote === undefined) return false
+    try {
+      const result = await remote.openWorkspacePath({ path, action: 'reveal' })
+      return result.ok
+    } catch {
+      return false
+    }
+  }
+
+  return {
+    available: () => availability,
+    probe,
+    directoryApps,
+    fileApps,
+    open,
+    reveal,
+  }
+}
diff --git a/src/client/open-with-settings.tsx b/src/client/open-with-settings.tsx
deleted file mode 100644
index ee9604a..0000000
--- a/src/client/open-with-settings.tsx
+++ /dev/null
@@ -1,135 +0,0 @@
-/**
- * The editor tab's custom settings panel ("打开方式"): the file tree's
- * "open with" configuration — the optional SSH host marking the workspace as
- * remote, and the user-defined editors (name + URL template with `{path}` +
- * whether they speak the VSCode URL dialect). Persisted as the editor
- * blob's `openWith` key through the settings popup's `updatePluginSetting`.
- *
- * The popup renders the declarative rows (the editorExplorer picker) ABOVE
- * this panel — SettingsBody renders the custom panel after the row list, so
- * this component owns only its own section.
- */
-import { useState } from 'react'
-import { IconCloseOutlineRegular } from '@deepseek-ai/dsh-client-ui-primitives'
-import {
-  isValidCustomEditor,
-  newCustomEditorId,
-  parseOpenWithConfig,
-  type CustomEditor,
-  type OpenWithConfig,
-} from './open-with.ts'
-import { t } from './locales.ts'
-import css from './SideCardSection.module.css'
-
-export function OpenWithSettings(props: {
-  pluginSettings: Record<string, unknown>
-  updatePluginSetting: (key: string, value: unknown) => void
-}) {
-  const { pluginSettings, updatePluginSetting } = props
-  // Local draft seeded from the persisted blob (each commit re-renders the
-  // popup with the round-tripped prefs; the local state stays authoritative
-  // while the popup is open, so typing never fights an in-flight write).
-  const [draft, setDraft] = useState<OpenWithConfig>(() => parseOpenWithConfig(pluginSettings.openWith))
-
-  const commit = (next: OpenWithConfig): void => {
-    setDraft(next)
-    updatePluginSetting('openWith', next)
-  }
-
-  const setSshHost = (sshHost: string): void => commit({ ...draft, sshHost })
-
-  const patchCustom = (id: string, patch: Partial<CustomEditor>): void => {
-    commit({
-      ...draft,
-      customEditors: draft.customEditors.map(editor => editor.id === id ? { ...editor, ...patch } : editor),
-    })
-  }
-
-  const removeCustom = (id: string): void => {
-    commit({
-      ...draft,
-      customEditors: draft.customEditors.filter(editor => editor.id !== id),
-      // A removed editor can never stay pinned (the menu prunes unknown ids
-      // anyway; this keeps the blob clean).
-      pinned: draft.pinned.filter(pinnedId => pinnedId !== `custom:${id}`),
-    })
-  }
-
-  const addCustom = (): void => {
-    commit({
-      ...draft,
-      customEditors: [...draft.customEditors, { id: newCustomEditorId(), name: '', urlTemplate: '', isVscodeFamily: false }],
-    })
-  }
-
-  const hasInvalid = draft.customEditors.some(editor => !isValidCustomEditor(editor))
-
-  return (
-    <div className={css.popupRows}>
-      <div className={css.popupRow}>
-        <span className={css.rowText}>
-          <span className={css.title}>{t('openWithSettingsSshTitle')}</span>
-          <span className={css.desc}>{t('openWithSettingsSshDesc')}</span>
-        </span>
-        <input
-          className={css.typedInput}
-          value={draft.sshHost}
-          placeholder={t('openWithSettingsSshPlaceholder')}
-          spellCheck={false}
-          onChange={(event) => { setSshHost(event.target.value) }}
-        />
-      </div>
-      <div className={css.popupRow}>
-        <span className={css.rowText}>
-          <span className={css.title}>{t('openWithSettingsCustomTitle')}</span>
-          <span className={css.desc}>{t('openWithSettingsCustomDesc')}</span>
-        </span>
-        <span className={css.control}>
-          <button type="button" className={css.done} onClick={addCustom}>
-            {t('openWithSettingsAdd')}
-          </button>
-        </span>
-      </div>
-      {draft.customEditors.map(editor => (
-        <div key={editor.id} className={css.openWithEditorRow}>
-          <input
-            className={css.openWithEditorInput}
-            value={editor.name}
-            placeholder={t('openWithSettingsName')}
-            spellCheck={false}
-            onChange={(event) => { patchCustom(editor.id, { name: event.target.value }) }}
-          />
-          <input
-            className={css.openWithEditorTemplate}
-            value={editor.urlTemplate}
-            placeholder={t('openWithSettingsTemplate')}
-            spellCheck={false}
-            onChange={(event) => { patchCustom(editor.id, { urlTemplate: event.target.value }) }}
-          />
-          <label className={css.openWithFamily} title={t('openWithSettingsFamilyDesc')}>
-            <input
-              type="checkbox"
-              checked={editor.isVscodeFamily}
-              onChange={(event) => { patchCustom(editor.id, { isVscodeFamily: event.currentTarget.checked }) }}
-            />
-            <span>{t('openWithSettingsFamily')}</span>
-          </label>
-          <button
-            type="button"
-            className={css.openWithRemove}
-            aria-label={t('openWithSettingsRemove')}
-            title={t('openWithSettingsRemove')}
-            onClick={() => { removeCustom(editor.id) }}
-          >
-            <IconCloseOutlineRegular size={14} />
-          </button>
-        </div>
-      ))}
-      {hasInvalid && (
-        <div className={css.openWithHint} role="note">
-          {t('openWithSettingsInvalidHint')}
-        </div>
-      )}
-    </div>
-  )
-}
diff --git a/src/client/open-with.ts b/src/client/open-with.ts
deleted file mode 100644
index b255630..0000000
--- a/src/client/open-with.ts
+++ /dev/null
@@ -1,221 +0,0 @@
-/**
- * The file tree's "open with" vocabulary: which external editors / file
- * managers the context menu can hand a row's path to, how the per-user
- * configuration (custom editors, SSH host, pinned ids) is parsed out of the
- * persisted blob, and how the external URL is built (local `file` URLs and
- * VSCode-family SSH-remote URLs).
- *
- * Pure by design (no React / no `api`), so the whole surface is unit-testable
- * without a DOM or a host route. The menu and the settings panel only consume
- * the exported types and functions.
- */
-import type { CopyKey } from './locales.ts'
-
-/** One user-configured editor (persisted in `pluginSettings['editor'].openWith`). */
-export interface CustomEditor {
-  id: string
-  /** Human label shown in the menu (e.g. "Windsurf"). */
-  name: string
-  /** URL template with a `{path}` placeholder (e.g. `cursor://file/{path}`). */
-  urlTemplate: string
-  /** Whether the editor speaks the VSCode URL dialect — the only editors
-   *  with an SSH-remote form (`<scheme>://vscode-remote/ssh-remote+<host>/…`). */
-  isVscodeFamily: boolean
-}
-
-/** The per-user "open with" configuration (one key of the editor blob). */
-export interface OpenWithConfig {
-  /** SSH host (user@host or an ~/.ssh/config alias); '' = local workspace. */
-  sshHost: string
-  /** User-defined editors, appended after the built-ins. */
-  customEditors: CustomEditor[]
-  /** Ids of open-with targets pinned to the menu's top level
-   *  ('explorer' | 'vscode' | 'cursor' | 'zed' | 'custom:<id>'). */
-  pinned: string[]
-}
-
-/** One menu-visible open target (built-in or custom, SSH-filtered). */
-export interface OpenWithTarget {
-  /** Stable id (`explorer` / `vscode` / `cursor` / `zed` / `custom:<id>`). */
-  id: string
-  /** Locale key of a built-in label (custom editors carry `name` instead). */
-  nameKey?: CopyKey
-  /** User-defined label (custom editors only; '' for built-ins). */
-  name: string
-  /** 'reveal' = show in the OS file manager; 'url' = open a URL. */
-  kind: 'reveal' | 'url'
-  /** URL template with `{path}`; undefined for reveal targets. */
-  urlTemplate?: string
-  /** Whether the editor talks the VSCode URL dialect. */
-  isVscodeFamily: boolean
-  /** Hidden in SSH mode (a host-local opener cannot reach a remote path). */
-  localOnly: boolean
-}
-
-/** The default open-with configuration (fresh documents). */
-export const OPEN_WITH_DEFAULTS: OpenWithConfig = {
-  sshHost: '',
-  customEditors: [],
-  pinned: [],
-}
-
-/** The built-in open targets, in menu order. */
-export const OPEN_WITH_BUILTINS: readonly OpenWithTarget[] = [
-  {
-    id: 'explorer',
-    nameKey: 'openWithExplorer',
-    name: '',
-    kind: 'reveal',
-    isVscodeFamily: false,
-    localOnly: true,
-  },
-  {
-    id: 'vscode',
-    nameKey: 'openWithVscode',
-    name: '',
-    kind: 'url',
-    urlTemplate: 'vscode://file/{path}',
-    isVscodeFamily: true,
-    localOnly: false,
-  },
-  {
-    id: 'cursor',
-    nameKey: 'openWithCursor',
-    name: '',
-    kind: 'url',
-    urlTemplate: 'cursor://file/{path}',
-    isVscodeFamily: true,
-    localOnly: false,
-  },
-  {
-    id: 'zed',
-    nameKey: 'openWithZed',
-    name: '',
-    kind: 'url',
-    urlTemplate: 'zed://file/{path}',
-    isVscodeFamily: false,
-    localOnly: true,
-  },
-]
-
-/** Whether a persisted value makes a structurally valid custom-editor row.
- *  Name/template may be empty — the settings panel edits rows in place and
- *  an in-progress row must survive the round-trip; the MENU hides rows that
- *  fail the stricter {@link isValidCustomEditor} check. */
-function isCustomEditor(value: unknown): value is CustomEditor {
-  if (value === null || typeof value !== 'object' || Array.isArray(value)) return false
-  const record = value as Record<string, unknown>
-  return typeof record.id === 'string' && record.id !== ''
-    && typeof record.name === 'string'
-    && typeof record.urlTemplate === 'string'
-    && typeof record.isVscodeFamily === 'boolean'
-}
-
-/**
- * Parse the persisted `openWith` blob (tolerant): malformed fields fall back
- * to the defaults, malformed custom-editor rows are dropped, and pinned ids
- * are kept verbatim (unknown ids are pruned when the targets are resolved —
- * the menu is the only consumer of the resolved list).
- */
-export function parseOpenWithConfig(raw: unknown): OpenWithConfig {
-  if (raw === null || typeof raw !== 'object' || Array.isArray(raw)) return { ...OPEN_WITH_DEFAULTS }
-  const record = raw as Record<string, unknown>
-  const sshHost = typeof record.sshHost === 'string' ? record.sshHost : ''
-  const customEditors = Array.isArray(record.customEditors)
-    ? record.customEditors.filter(isCustomEditor)
-    : []
-  const pinned = Array.isArray(record.pinned)
-    ? record.pinned.filter((id): id is string => typeof id === 'string' && id !== '')
-    : []
-  return { sshHost, customEditors, pinned }
-}
-
-/** Whether a custom editor id belongs to this config (id prefix match). */
-function customIdOf(id: string): string {
-  return `custom:${id}`
-}
-
-/**
- * The menu-visible open targets, in order (built-ins then custom editors).
- * In SSH mode the local-only targets (the OS file manager, Zed, custom
- * editors without the VSCode dialect) are dropped — they cannot reach a
- * remote path. Unknown pinned ids are pruned here too.
- */
-export function resolveOpenWithTargets(config: OpenWithConfig): OpenWithTarget[] {
-  const ssh = config.sshHost.trim() !== ''
-  const targets: OpenWithTarget[] = [
-    ...OPEN_WITH_BUILTINS,
-    ...config.customEditors
-      .filter(isValidCustomEditor)
-      .map((editor): OpenWithTarget => ({
-        id: customIdOf(editor.id),
-        name: editor.name,
-        kind: 'url',
-        urlTemplate: editor.urlTemplate,
-        isVscodeFamily: editor.isVscodeFamily,
-        localOnly: !editor.isVscodeFamily,
-      })),
-  ]
-  return targets.filter(target => !(ssh && target.localOnly))
-}
-
-/** The SSH hint appended to a target's label in remote mode. */
-export function openWithSshActive(config: OpenWithConfig): boolean {
-  return config.sshHost.trim() !== ''
-}
-
-/**
- * The URL to open for one resolved target, or undefined when the target has
- * no URL form (reveal) or the template is malformed. The path is inserted
- * RAW into the template (browsers percent-encode as needed; VSCode-family
- * URL parsers consume the absolute path with its leading slash, e.g.
- * `vscode://file//home/u/f.ts` or `vscode://file/C:/Users/u/f.ts`).
- */
-export function openWithUrl(target: OpenWithTarget, path: string, config: OpenWithConfig): string | undefined {
-  if (target.kind !== 'url' || target.urlTemplate === undefined) return undefined
-  const normalized = normalizeUrlPath(path)
-  const ssh = openWithSshActive(config)
-  if (ssh && target.isVscodeFamily) {
-    const scheme = schemeOf(target.urlTemplate)
-    if (scheme === undefined) return undefined
-    // `ssh-remote+<host>` owns NO slash of its own: the path keeps its
-    // leading slash, so `/home/u/f.ts` lands as `…+host/home/u/f.ts`.
-    return `${scheme}://vscode-remote/ssh-remote+${config.sshHost.trim()}${normalized}`
-  }
-  if (!target.urlTemplate.includes('{path}') || !hasUrlScheme(target.urlTemplate)) return undefined
-  return target.urlTemplate.replace('{path}', normalized)
-}
-
-/** Whether a template starts with a `scheme://` prefix (the only shape the
- *  host's external opener accepts and the settings panel suggests). */
-function hasUrlScheme(template: string): boolean {
-  return /^[a-z][a-z0-9+.-]*:\/\//i.test(template)
-}
-
-/** The scheme of a URL template (the part before the first ':'), or undefined. */
-function schemeOf(template: string): string | undefined {
-  const at = template.indexOf(':')
-  if (at <= 0) return undefined
-  const scheme = template.slice(0, at)
-  return /^[a-z][a-z0-9+.-]*$/i.test(scheme) ? scheme : undefined
-}
-
-/** Normalize a filesystem path for embedding in a URL (backslashes → '/'). */
-export function normalizeUrlPath(path: string): string {
-  return path.replace(/\\/g, '/')
-}
-
-/** A fresh custom-editor id (uuid when available, time-based fallback). */
-export function newCustomEditorId(): string {
-  if (typeof crypto !== 'undefined' && typeof crypto.randomUUID === 'function') {
-    return crypto.randomUUID()
-  }
-  return `${Date.now().toString(36)}${Math.random().toString(36).slice(2)}`
-}
-
-/** Validate one custom-editor row before the settings panel accepts it. */
-export function isValidCustomEditor(row: { name: string; urlTemplate: string }): boolean {
-  return row.name.trim() !== ''
-    && row.urlTemplate.includes('{path}')
-    && /^[a-z][a-z0-9+.-]*:\/\//i.test(row.urlTemplate.trim())
-}
diff --git a/src/client/plugin-settings.ts b/src/client/plugin-settings.ts
deleted file mode 100644
index db6658f..0000000
--- a/src/client/plugin-settings.ts
+++ /dev/null
@@ -1,43 +0,0 @@
-/**
- * Pending-writes queue for the file tree's open-with config: pin toggles and
- * (outside the settings popup) config edits land in the sidebar prefs as
- * `pluginSettings['editor']`. Writes are serialized through one promise chain
- * so a quick burst of pin clicks can never read a stale pluginSettings map
- * and drop an earlier toggle; each write pushes the whole open map patch
- * through the revision-free settings route and adopts the returned document.
- *
- * (The settings popup has its own serialized commit — SideCardSection's —
- * so its rows and this helper rarely race; the shared route's last-write-wins
- * semantics cover the uncommon overlap.)
- */
-import { api } from './api.ts'
-import { parsePrefs } from './prefs.ts'
-import type { SidebarStore } from './state.ts'
-
-let queue: Promise<void> = Promise.resolve()
-
-/**
- * Merge one plugin-owned settings blob of one descriptor and persist it.
- * @param store - the sidebar store (its prefs are replaced by the write result).
- * @param descriptorId - the descriptor whose blob is patched ('editor' here).
- * @param updater - pure patch function; receives a shallow copy of the blob.
- */
-export function updatePluginSettings(
-  store: SidebarStore,
-  descriptorId: string,
-  updater: (blob: Record<string, unknown>) => Record<string, unknown>,
-): void {
-  queue = queue.then(async () => {
-    const prefs = store.getPrefs()
-    const blob = prefs.pluginSettings[descriptorId] ?? {}
-    const next = updater({ ...blob })
-    const view = await api.settingsUpdate({
-      pluginSettings: { ...prefs.pluginSettings, [descriptorId]: next },
-    })
-    store.setPrefs(parsePrefs(view.value))
-  }).catch((error: unknown) => {
-    // The pin stays visually unchanged (no optimistic flip) and the menu
-    // keeps working — the write failure is logged, not surfaced.
-    console.error('open-with settings write failed', error)
-  })
-}
diff --git a/src/client/sidebar.module.css b/src/client/sidebar.module.css
index d47c746..5a17ce4 100644
--- a/src/client/sidebar.module.css
+++ b/src/client/sidebar.module.css
@@ -664,11 +664,12 @@ body[data-dsh-sidebar-dragging] .bottomPanel {
   padding: 4px 8px 8px;
 }
 
-/* One tree row: the app's session-row cell (34px, radius 8, inset, hover
-   fill, 22px indent step, 14px ink) with a mount fade so expanding a
+/* One tree row: the plugin's native list rhythm (28px, radius 4, inset,
+   hover fill, 22px indent step, 12px ink) with a mount fade so expanding a
    directory reveals its children gently (stable keys keep existing rows from
    replaying it). */
 .explorerRow {
+  position: relative;
   display: flex;
   align-items: center;
   gap: 6px;
@@ -678,16 +679,16 @@ body[data-dsh-sidebar-dragging] .bottomPanel {
   box-sizing: border-box;
   width: 100%;
   max-width: 100%;
-  height: 34px;
+  height: 28px;
   padding: 0 8px;
   border: none;
   background: transparent;
-  font: var(--dsw-font-s-14);
+  font: var(--dsw-font-xxs-12);
   color: var(--dsw-alias-label-primary);
   text-align: left;
   cursor: pointer;
   white-space: nowrap;
-  border-radius: 8px;
+  border-radius: 4px;
   animation: dsh-row-in 150ms var(--ds-ease-in-out);
 }
 
@@ -695,6 +696,41 @@ body[data-dsh-sidebar-dragging] .bottomPanel {
   background: var(--dsw-alias-interactive-bg-hover);
 }
 
+/* A multi-selected row: the native selected fill plus the design's 2px
+   inset accent bar (a pseudo element, so metrics never shift between rows).
+   Distinct from the reveal tint below — a reveal is "here it is", a
+   selection is "this is the batch's member". */
+.explorerRowSelected {
+  background: var(--dsw-alias-interactive-bg-active);
+}
+
+.explorerRowSelected::before {
+  content: '';
+  position: absolute;
+  left: 0;
+  top: 4px;
+  bottom: 4px;
+  width: 2px;
+  border-radius: 1px;
+  background: var(--dsw-alias-state-business-primary);
+}
+
+/* Git-changed file names (VS Code's ink): the row keeps one class and the
+   tone arrives as a data attribute, so the mapping lives in one place. */
+.explorerGitName[data-git-tone='modified'] { color: var(--dsw-alias-state-warn-primary); }
+.explorerGitName[data-git-tone='added'] { color: var(--dsw-alias-state-success-primary); }
+.explorerGitName[data-git-tone='untracked'] { color: var(--dsw-alias-state-success-primary); }
+.explorerGitName[data-git-tone='deleted'] { color: var(--dsw-alias-state-error-primary); }
+.explorerGitName[data-git-tone='renamed'] { color: var(--dsw-alias-state-business-primary); }
+.explorerGitName[data-git-tone='copied'] { color: var(--dsw-alias-state-success-primary); }
+.explorerGitName[data-git-tone='conflict'] { color: var(--dsw-alias-state-error-primary); }
+
+/* A directory with a change anywhere below it: tinted, but never lettered
+   (the letter belongs to the file that actually changed). */
+.explorerDirChanged {
+  color: var(--dsw-alias-state-business-primary);
+}
+
 /* A "Show in folder" reveal highlight: the target row stays tinted until
    the transient reveal set is cleared (a reload starts unhighlighted).
    The DSH business-blue surface (the same source the host's nav items use
@@ -720,7 +756,7 @@ body[data-dsh-sidebar-dragging] .bottomPanel {
 }
 
 .explorerDir {
-  font: var(--dsw-font-s-strong-14);
+  font: var(--dsw-font-xxs-strong-12);
 }
 
 .explorerHidden {
@@ -748,9 +784,9 @@ body[data-dsh-sidebar-dragging] .bottomPanel {
   white-space: nowrap;
 }
 
-/* ── Inline rename editor ─────────────────────────────────────────────────
-   The row swaps its name span for a plain input (same row metrics: 34px
-   height, 6px gap, xxs type); only tokens, no hardcoded colors. */
+/* ── Inline rename / new-folder editor ───────────────────────────────────
+   The level's top (or a row) swaps in a plain input (same row metrics: 28px
+   height, 6px gap, 12px type); only tokens, no hardcoded colors. */
 .explorerRenaming {
   cursor: text;
 }
@@ -759,10 +795,10 @@ body[data-dsh-sidebar-dragging] .bottomPanel {
   box-sizing: border-box;
   flex: 1 1 auto;
   min-width: 0;
-  height: 24px;
+  height: 22px;
   padding: 0 6px;
   border: 1px solid var(--dsw-alias-state-business-primary);
-  border-radius: 6px;
+  border-radius: 3px;
   background: var(--dsw-alias-bg-layer-1);
   color: var(--dsw-alias-label-primary);
   font: var(--dsw-font-xxs-12);
@@ -796,33 +832,34 @@ body[data-dsh-sidebar-dragging] .bottomPanel {
   color: var(--dsw-alias-state-error-primary);
 }
 
-.explorerActionErrorClose {
-  flex: none;
+/* The multi-selection bar: the kit's 28px section band, sat above the root
+   row (it never covers a row, so the tree stays fully aimable). Only the
+   fill/rhythm differ from the kit band — geometry stays the kit's. */
+.explorerSelectionBar {
+  margin-bottom: 4px;
+  border-radius: 4px;
+  background: var(--dsw-alias-bg-layer-2);
+}
+
+.explorerSelectionActions {
   display: inline-flex;
   align-items: center;
-  justify-content: center;
-  width: 20px;
-  height: 20px;
-  padding: 0;
-  border: none;
-  border-radius: 5px;
-  background: transparent;
-  color: var(--dsw-alias-label-tertiary);
-  cursor: pointer;
+  gap: 4px;
 }
 
-.explorerActionErrorClose:hover {
-  background: var(--dsw-alias-interactive-bg-hover);
-  color: var(--dsw-alias-label-primary);
+/* The leading glyph of one "open in app" menu entry (the host's icon route
+   or a data URL). Fixed box: the menu's own icon slot sizing. */
+.explorerAppIcon {
+  display: block;
+  width: 14px;
+  height: 14px;
+  object-fit: contain;
 }
 
-/* The delete-confirmation modal's description paragraph (the git lens's
-   .gitConfirmDesc sibling — same quiet single-question look). */
-.explorerConfirmDesc {
-  margin: 0;
-  font: var(--dsw-font-s-14);
-  color: var(--dsw-alias-label-primary);
-  overflow-wrap: anywhere;
+/* The tree parked while the search results panel owns the surface (the tree
+   must stay MOUNTED: its level cache is the whole point). */
+.explorerHiddenPane {
+  display: none;
 }
 
 /* The hover-revealed @-reference button at the row's far right (and the
@@ -884,65 +921,92 @@ body[data-dsh-sidebar-dragging] .bottomPanel {
   text-align: center;
 }
 
-/* Drag a file/folder over a tree row: the target directory row gets a filled
-   highlight (drops land inside it; file rows target their parent directory).
-   The zone frame around the whole tree is the portaled .uploadDropZone. */
+/* Drag a file/folder over a tree row: the target directory row takes the
+   accent-tinted fill and a dashed business edge (drops land inside it; file
+   rows target their parent directory). The zone frame around the whole tree
+   is the portaled .uploadDropZone. */
 .explorerRowDropTarget {
-  background: var(--dsw-alias-interactive-bg-hover);
-  outline: 1px dashed var(--dsw-alias-interactive-bg-hover-accent);
+  background: var(--dsw-alias-interactive-bg-hover-accent);
+  outline: 1px dashed var(--dsw-alias-state-business-primary);
   outline-offset: -1px;
 }
 
+/* The drop mask: one pointer-inert scrim over the whole viewport, portaled
+   to document.body BELOW the zone frame — the panel-host float layer is
+   z-1000 (DSH's own page mask sits there too), so 1001/1002 keep this
+   transient surface on top. The mask is deliberately light: the conversation
+   column beneath it still takes drops into the chat natively, and the user
+   never loses sight of the tree. */
+.uploadDropMask {
+  position: fixed;
+  inset: 0;
+  z-index: 1001;
+  pointer-events: none;
+  background: color-mix(in srgb, var(--dsw-alias-bg-base) 62%, transparent);
+  animation: dsh-row-in 150ms var(--ds-ease-in-out);
+}
+
 /* The sidebar's drop surface: a pointer-inert frame portaled to
-   document.body, fixed over the explorer body's viewport rect at z-1001 —
-   above DSH's own whole-page drop mask (z-1000, see InputBar's
-   document-level intake). The giant box-shadow spread IS the full-viewport
-   mask (same token DSH uses for its drop mask): everything dims except the
-   zone rect, teaching the zone split — the dimmed conversation column still
-   takes drops into the chat natively, the clear frame marks the tree as the
-   workspace-upload zone. Deliberate exception to the "panel stays below the
-   DSH float stack" rule: transient and pointer-events none, so the drop
-   always lands on the row beneath. The hint pill docks at the TOP edge of
-   the zone (right under the search row, the first thing the eye meets),
-   leaving the rows — the actual drop targets — aimable. */
+   document.body, fixed over the explorer body's viewport rect. The hint pill
+   docks at the TOP edge of the zone (right under the search row, the first
+   thing the eye meets), leaving the rows — the actual drop targets —
+   aimable. */
 .uploadDropZone {
   position: fixed;
-  z-index: 1001;
+  z-index: 1002;
   pointer-events: none;
   display: flex;
   align-items: flex-start;
   justify-content: center;
   padding: 12px;
-  border: 2px dashed var(--dsw-alias-interactive-bg-hover-accent);
-  border-radius: 10px;
-  box-shadow: 0 0 0 200vmax var(--dsw-alias-bg-mask-drop);
+  border: 2px dashed var(--dsw-alias-border-l2);
+  border-radius: 8px;
+  background: color-mix(in srgb, var(--dsw-alias-state-business-primary) 4%, transparent);
   animation: dsh-row-in 150ms var(--ds-ease-in-out);
 }
 
 /* The zone's drop hero, docked at the TOP edge (right under the search
-   row, the first thing the eye meets): the colorful tray illustration over
-   the hint pill — stacked so the rows below stay aimable. */
+   row, the first thing the eye meets): the tray illustration over the hint
+   pill — stacked so the rows below stay aimable. */
 .uploadDropHero {
   display: flex;
   flex-direction: column;
   align-items: center;
-  gap: 10px;
+  gap: 8px;
   max-width: 100%;
   padding-top: 8px;
 }
 
+/* The drop art's two inks (the SVG strokes/fills take them via
+   currentColor): the accent for the rising arrow and the front card, a quiet
+   tint for the tray body and the back card, and the surface ink for the
+   motifs cut out of the cards. */
+.uploadDropArtPrimary {
+  color: var(--dsw-alias-state-business-primary);
+}
+
+.uploadDropArtAccent {
+  color: var(--dsw-alias-state-business-tertiary);
+}
+
+.uploadDropArtCut {
+  color: var(--dsw-alias-bg-layer-1);
+}
+
 .uploadDropZonePill {
   display: flex;
   align-items: center;
   gap: 6px;
+  box-sizing: border-box;
+  height: 28px;
   max-width: 100%;
-  padding: 6px 12px;
+  padding: 0 12px;
   border: 1px solid var(--dsw-alias-border-l2);
   border-radius: 999px;
-  background: var(--dsw-alias-bg-layer-2);
+  background: var(--dsw-alias-bg-layer-1);
   box-shadow: var(--dsw-shadow-lv2);
   color: var(--dsw-alias-label-primary);
-  font: var(--dsw-font-xxs-strong-12);
+  font: var(--dsw-font-xxxs-11);
 }
 
 .uploadDropZoneText {
@@ -959,7 +1023,7 @@ body[data-dsh-sidebar-dragging] .bottomPanel {
   top: 0;
   left: 0;
   bottom: 0;
-  z-index: 1002;
+  z-index: 1003;
   pointer-events: none;
   display: flex;
   align-items: center;
@@ -968,19 +1032,16 @@ body[data-dsh-sidebar-dragging] .bottomPanel {
   animation: dsh-row-in 150ms var(--ds-ease-in-out);
 }
 
-/* The invitation's content: the colorful photo-cards illustration over the
-   label — the drop overlay is this flow's one brand moment, so it gets the
-   color the rest of the UI never does (palette borrowed from DSH's native
-   drop illustration so the two zones read as one family). */
+/* The invitation's content: the photo-cards illustration over the label. */
 .uploadDropChatCard {
   display: flex;
   flex-direction: column;
   align-items: center;
-  gap: 12px;
+  gap: 10px;
   max-width: 100%;
   text-align: center;
   color: var(--dsw-alias-label-primary);
-  font: var(--dsw-font-s-strong-14);
+  font: var(--dsw-font-xxs-strong-12);
 }
 
 /* Full-window upload progress: blurred scrim + card (same mask/backdrop
@@ -1001,12 +1062,12 @@ body[data-dsh-sidebar-dragging] .bottomPanel {
 .uploadOverlayCard {
   display: flex;
   flex-direction: column;
-  gap: 12px;
-  min-width: 280px;
+  gap: 10px;
+  min-width: 240px;
   max-width: min(420px, calc(100% - 48px));
-  padding: 20px 24px;
-  border: 1px solid var(--dsw-alias-border-inverted);
-  border-radius: 24px;
+  padding: 16px;
+  border: 1px solid var(--dsw-alias-border-l2);
+  border-radius: 8px;
   background: var(--dsw-alias-bg-layer-2);
   box-shadow: var(--dsw-shadow-lv3);
 }
@@ -1014,8 +1075,8 @@ body[data-dsh-sidebar-dragging] .bottomPanel {
 .uploadOverlayTitle {
   display: flex;
   align-items: center;
-  gap: 8px;
-  font: var(--dsw-font-s-strong-14);
+  gap: 6px;
+  font: var(--dsw-font-xxs-strong-12);
   color: var(--dsw-alias-label-primary);
 }
 
@@ -1046,7 +1107,7 @@ body[data-dsh-sidebar-dragging] .bottomPanel {
 
 .uploadOverlayStatus {
   min-height: 1em;
-  font: var(--dsw-font-xxs-12);
+  font: var(--dsw-font-xxxs-11);
   font-variant-numeric: tabular-nums;
   color: var(--dsw-alias-label-tertiary);
   white-space: nowrap;
@@ -1057,9 +1118,9 @@ body[data-dsh-sidebar-dragging] .bottomPanel {
 .uploadOverlayCancel {
   align-self: flex-end;
   height: 28px;
-  padding: 0 14px;
+  padding: 0 12px;
   border: 1px solid var(--dsw-alias-border-l2);
-  border-radius: 8px;
+  border-radius: 4px;
   background: transparent;
   color: var(--dsw-alias-label-primary);
   font: var(--dsw-font-xxs-strong-12);
@@ -1222,13 +1283,16 @@ body[data-dsh-sidebar-dragging] .bottomPanel {
 
 .editorSearchResult {
   display: block;
+  box-sizing: border-box;
   width: 100%;
-  padding: 4px 8px;
+  height: 28px;
+  padding: 0 8px;
   border: none;
-  border-radius: 6px;
+  border-radius: 4px;
   background: transparent;
   color: var(--dsw-alias-label-primary);
   font: var(--dsw-font-xxs-12);
+  line-height: 28px;
   text-align: left;
   cursor: pointer;
   overflow: hidden;
@@ -2044,58 +2108,6 @@ body[data-dsh-sidebar-dragging] .bottomPanel {
   }
 }
 
-/* The file tree "open with" menu rows: the label area is a BLOCK-level flex
-   row that fills the primitives `.itemLabel` span (which is itself `flex: 1`
-   inside the row), so the trailing control — the pushpin on submenu rows,
-   the chevron on the submenu parent — docks at the row's far right, exactly
-   like the trailing check on selected rows of every other menu. */
-.openWithLabel {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  width: 100%;
-  min-width: 0;
-}
-
-.openWithName {
-  flex: 1 1 auto;
-  min-width: 0;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-/* The trailing "expands into a submenu" chevron on the open-with parent row
-   (the primitives Menu renders no arrow for submenu parents). */
-.openWithChevron {
-  flex: none;
-  color: var(--dsw-alias-label-tertiary);
-}
-
-/* The pushpin toggle on an "open with" submenu row: brand ink once the
-   target is pinned to the menu's top level. Sized for the compact menu's
-   26px rows (16px box, 12px glyph) — proportionate without overflowing. */
-.openWithPin {
-  flex: none;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 16px;
-  height: 16px;
-  border-radius: 5px;
-  color: var(--dsw-alias-label-tertiary);
-  cursor: pointer;
-}
-
-.openWithPin:hover {
-  background: var(--dsw-alias-interactive-bg-hover);
-  color: var(--dsw-alias-label-primary);
-}
-
-.openWithPinActive {
-  color: var(--dsw-alias-state-business-primary);
-}
-
 /* ── Markdown preview: raw-HTML runs + table of contents ─────────────────
    The HTML runs lifted out of the markdown source (MarkdownHtml.tsx) render
    as sanitized block leaves; the TOC is a zero-height sticky bar keeping the
diff --git a/src/client/ui/git-status.ts b/src/client/ui/git-status.ts
new file mode 100644
index 0000000..5870c88
--- /dev/null
+++ b/src/client/ui/git-status.ts
@@ -0,0 +1,300 @@
+/**
+ * The plugin's ONE git-status store.
+ *
+ * Before this module the git status was fetched by the changes tab alone
+ * (a 2 s poll inside `changes/GitLens.tsx`) while the file tree had no git
+ * data at all — so a VS Code-style "color the changed rows" feature would
+ * have added a SECOND poller of the same `git status --porcelain` call. The
+ * store keeps one snapshot per `sessionId + cwd + worktree`, one poller per
+ * key while at least one VISIBLE consumer is subscribed, and one path index
+ * built lazily per snapshot, so the tree (coloring) and the changes page
+ * (list) read the same answer.
+ *
+ * The path index is keyed case-insensitively with '/' separators: git reports
+ * repo-root-relative POSIX paths while the tree rows carry host paths (a
+ * Windows host mixes separators), and a color lookup must not depend on that
+ * difference. The cost is that two paths differing only in case share an
+ * entry — invisible in the tree, which lists one of them anyway.
+ *
+ * Coalescing: a `refresh()` that lands while a fetch is in flight is queued
+ * once and re-run when it settles — never dropped (the old `GitLens.refresh`
+ * returned early, so a click during the poll silently did nothing).
+ */
+import { useCallback, useEffect, useSyncExternalStore } from 'react'
+import { api, type GitStatusResult } from '../api.ts'
+
+/** The semantic class of one changed path (drives the row's ink). */
+export type GitTone =
+  | 'modified' | 'added' | 'deleted' | 'untracked' | 'renamed' | 'copied' | 'conflict'
+
+/** One path's git state, derived from its two-letter porcelain code. */
+export interface GitFileStatus {
+  /** Display letter: the index side wins, else the worktree side ('??' → 'U'). */
+  letter: string
+  tone: GitTone
+  /** The index (staged) side carries a change. */
+  staged: boolean
+  /** The worktree (unstaged) side carries a change. */
+  unstaged: boolean
+}
+
+/** The porcelain letter → tone rule (both sides share one vocabulary). */
+function toneOfLetter(letter: string): GitTone | undefined {
+  switch (letter) {
+    case 'M': return 'modified'
+    case 'T': return 'modified'
+    case 'A': return 'added'
+    case 'D': return 'deleted'
+    case 'R': return 'renamed'
+    case 'C': return 'copied'
+    case 'U': return 'conflict'
+    default: return undefined
+  }
+}
+
+/**
+ * Derive one path's status from its porcelain `XY` code, or `undefined` for a
+ * clean (`'  '`) or ignored (`'!!'`) entry. Untracked (`??`) reports 'U' —
+ * git's own letter for "not in the index" would be a blank.
+ */
+export function statusOfXY(xy: string): GitFileStatus | undefined {
+  if (xy === '??') return { letter: 'U', tone: 'untracked', staged: false, unstaged: true }
+  if (xy.length < 2 || xy === '!!') return undefined
+  const x = xy[0]!
+  const y = xy[1]!
+  if (x === ' ' && y === ' ') return undefined
+  const staged = x !== ' ' && x !== '?'
+  const unstaged = y !== ' ' && y !== '?'
+  // A conflict (any unmerged combination) outranks a plain modification: the
+  // user must act on it first, so it owns the row's ink.
+  const conflict = x === 'U' || y === 'U' || (x === 'A' && y === 'A') || (x === 'D' && y === 'D')
+  const tone = conflict
+    ? 'conflict'
+    : toneOfLetter(x !== ' ' && x !== '?' ? x : y) ?? 'modified'
+  return {
+    letter: x !== ' ' && x !== '?' ? x : y,
+    tone,
+    staged,
+    unstaged,
+  }
+}
+
+/** The store's normalized path key (case-insensitive, '/' separators). */
+function normPath(path: string): string {
+  return path.replace(/\\/g, '/').replace(/\/+$/, '').toLowerCase()
+}
+
+/** Join a repo-root-relative git path onto the repo root. */
+function joinRoot(root: string, rel: string): string {
+  const base = root.replace(/[\\/]+$/, '')
+  return `${base}/${rel.replace(/^[\\/]+/, '')}`
+}
+
+interface Index {
+  /** Normalized absolute path → status (files only). */
+  files: Map<string, GitFileStatus>
+  /** Normalized absolute directories that contain at least one changed file. */
+  dirs: Set<string>
+}
+
+/** Build the lookup index for one snapshot (once per snapshot, O(rows × depth)). */
+function buildIndex(snapshot: GitStatusResult): Index {
+  const files = new Map<string, GitFileStatus>()
+  const dirs = new Set<string>()
+  const root = snapshot.root
+  if (!snapshot.isRepo || root === undefined) return { files, dirs }
+  for (const entry of snapshot.entries) {
+    const status = statusOfXY(entry.xy)
+    if (status === undefined) continue
+    const absolute = normPath(joinRoot(root, entry.path))
+    files.set(absolute, status)
+    let at = absolute.lastIndexOf('/')
+    while (at > 0) {
+      const dir = absolute.slice(0, at)
+      if (dirs.has(dir)) break
+      dirs.add(dir)
+      at = dir.lastIndexOf('/')
+    }
+  }
+  return { files, dirs }
+}
+
+interface Slot {
+  key: string
+  sessionId: string
+  cwd: string | undefined
+  worktree: string | undefined
+  snapshot: GitStatusResult | null
+  loading: boolean
+  error: boolean
+  version: number
+  /** Bumped per fetch so a late response from an older fetch is dropped. */
+  generation: number
+  running: boolean
+  pending: boolean
+  visible: number
+  pollMs: number
+  timer: number | undefined
+  listeners: Set<() => void>
+  index: Index | null
+  /** The snapshot the current index was built from (identity compare). */
+  indexSource: GitStatusResult | null
+}
+
+const slots = new Map<string, Slot>()
+
+function slotOf(sessionId: string, cwd: string | undefined, worktree: string | undefined): Slot {
+  const key = `${sessionId}\u0000${cwd ?? ''}\u0000${worktree ?? ''}`
+  const existing = slots.get(key)
+  if (existing !== undefined) return existing
+  const slot: Slot = {
+    key, sessionId, cwd, worktree,
+    snapshot: null, loading: false, error: false, version: 0, generation: 0,
+    running: false, pending: false, visible: 0, pollMs: 2_500, timer: undefined,
+    listeners: new Set(),
+    index: null, indexSource: null,
+  }
+  slots.set(key, slot)
+  return slot
+}
+
+function notify(slot: Slot): void {
+  slot.version += 1
+  for (const listener of slot.listeners) listener()
+}
+
+/** Fetch one snapshot; a concurrent call just marks the slot dirty. */
+function fetchSlot(slot: Slot): void {
+  if (slot.running) {
+    slot.pending = true
+    return
+  }
+  slot.running = true
+  const generation = ++slot.generation
+  slot.loading = slot.snapshot === null
+  notify(slot)
+  const scope = { sessionId: slot.sessionId, ...(slot.cwd !== undefined ? { cwd: slot.cwd } : {}) }
+  api.gitStatus(scope, slot.worktree)
+    .then((snapshot) => {
+      if (generation !== slot.generation) return
+      slot.snapshot = snapshot
+      slot.error = false
+    })
+    .catch(() => {
+      if (generation !== slot.generation) return
+      slot.error = true
+    })
+    .finally(() => {
+      if (generation !== slot.generation) return
+      slot.running = false
+      slot.loading = false
+      notify(slot)
+      if (slot.pending) {
+        slot.pending = false
+        fetchSlot(slot)
+      }
+    })
+}
+
+function startTimer(slot: Slot): void {
+  if (slot.timer !== undefined) return
+  slot.timer = window.setInterval(() => { fetchSlot(slot) }, slot.pollMs)
+}
+
+function stopTimer(slot: Slot): void {
+  if (slot.timer === undefined) return
+  window.clearInterval(slot.timer)
+  slot.timer = undefined
+}
+
+function retain(slot: Slot): void {
+  slot.visible += 1
+  if (slot.visible === 1) {
+    if (slot.snapshot === null) fetchSlot(slot)
+    startTimer(slot)
+  }
+}
+
+function release(slot: Slot): void {
+  slot.visible = Math.max(0, slot.visible - 1)
+  if (slot.visible === 0) {
+    stopTimer(slot)
+    // No consumer left: drop the snapshot so a later mount re-reads the truth
+    // instead of coloring rows from a stale answer.
+    slot.snapshot = null
+    slot.index = null
+    slot.indexSource = null
+    notify(slot)
+  }
+}
+
+/** The index for the current snapshot, rebuilt only when the snapshot changed. */
+function indexOf(slot: Slot): Index {
+  if (slot.index === null || slot.indexSource !== slot.snapshot) {
+    slot.index = slot.snapshot === null ? { files: new Map(), dirs: new Set() } : buildIndex(slot.snapshot)
+    slot.indexSource = slot.snapshot
+  }
+  return slot.index
+}
+
+/**
+ * Force a re-read of one session's git status (after stage/commit/discard,
+ * or from a manual refresh). Queues one fetch when another is in flight.
+ * Every live key of that session is refreshed, so the tree and the changes
+ * page never disagree.
+ */
+export function invalidateGitStatus(sessionId: string): void {
+  for (const slot of slots.values()) {
+    if (slot.sessionId === sessionId) fetchSlot(slot)
+  }
+}
+
+/** The consumer-facing view of one key's status. */
+export interface GitStatusView {
+  /** The last snapshot, or null before the first answer. */
+  snapshot: GitStatusResult | null
+  loading: boolean
+  error: boolean
+  /** Re-read now (queued when a fetch is already in flight). */
+  refresh(): void
+  /** The status of one absolute path, or undefined when clean/unknown. */
+  statusOf(absolutePath: string): GitFileStatus | undefined
+  /** Whether `absoluteDir` or anything under it has a change. */
+  dirHasChanges(absoluteDir: string): boolean
+}
+
+/**
+ * Subscribe to the shared git status of one session (optionally of one
+ * linked worktree). The poll runs while `visible` is true, at `pollMs`.
+ */
+export function useGitStatus(
+  scope: { sessionId: string; cwd?: string },
+  options: { worktree?: string; visible?: boolean; pollMs?: number } = {},
+): GitStatusView {
+  const { worktree, visible = true, pollMs = 2_500 } = options
+  const slot = slotOf(scope.sessionId, scope.cwd, worktree)
+  const subscribe = useCallback((listener: () => void) => {
+    slot.listeners.add(listener)
+    return () => { slot.listeners.delete(listener) }
+  }, [slot])
+  useSyncExternalStore(subscribe, () => slot.version)
+
+  useEffect(() => {
+    slot.pollMs = pollMs
+    if (!visible) return undefined
+    retain(slot)
+    return () => { release(slot) }
+  }, [slot, visible, pollMs])
+
+  const refresh = useCallback(() => { fetchSlot(slot) }, [slot])
+  const statusOf = useCallback(
+    (absolutePath: string) => indexOf(slot).files.get(normPath(absolutePath)),
+    [slot],
+  )
+  const dirHasChanges = useCallback(
+    (absoluteDir: string) => indexOf(slot).dirs.has(normPath(absoluteDir)),
+    [slot],
+  )
+
+  return { snapshot: slot.snapshot, loading: slot.loading, error: slot.error, refresh, statusOf, dirHasChanges }
+}
diff --git a/src/client/ui/index.ts b/src/client/ui/index.ts
new file mode 100644
index 0000000..2f35805
--- /dev/null
+++ b/src/client/ui/index.ts
@@ -0,0 +1,13 @@
+/**
+ * The global UI kit's public face. Pages import from HERE (`./ui/index.ts`)
+ * so the component set is one reviewable surface; the modules behind it stay
+ * free to split further without touching call sites.
+ */
+export {
+  Chip, ConfirmDialog, IconButton, Notice, SectionHeader, StatusBadge,
+  type StatusTone,
+} from './kit.tsx'
+export {
+  invalidateGitStatus, statusOfXY, useGitStatus,
+  type GitFileStatus, type GitStatusView, type GitTone,
+} from './git-status.ts'
diff --git a/src/client/ui/kit.module.css b/src/client/ui/kit.module.css
new file mode 100644
index 0000000..7f17b17
--- /dev/null
+++ b/src/client/ui/kit.module.css
@@ -0,0 +1,219 @@
+/*
+ * The global kit's sheet. Token-only by contract: `tests/theme.spec.ts`
+ * scans every `src/client/**\/*.module.css` and rejects a `color:`
+ * declaration whose value does not dereference a `--dsw-*` / `--ds-*` token.
+ *
+ * Scale (see docs/plans/2026-09-27-files-changes-uiux.md §1): 12px body,
+ * 11px meta, 28px controls, 2/3/4/8px radii — the tasks page's native scale,
+ * which the files and changes pages are being cut to.
+ */
+
+/* ── IconButton ─────────────────────────────────────────────────────────── */
+
+.iconButton {
+  box-sizing: border-box;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex: none;
+  padding: 0;
+  border: none;
+  background: none;
+  color: var(--dsw-alias-label-secondary);
+  cursor: pointer;
+  border-radius: 3px;
+}
+
+.iconButtonMd {
+  width: 28px;
+  height: 28px;
+}
+
+.iconButtonSm {
+  width: 24px;
+  height: 24px;
+  border-radius: 3px;
+}
+
+.iconButton:hover:not(:disabled) {
+  background: var(--dsw-alias-interactive-bg-hover);
+  color: var(--dsw-alias-label-primary);
+}
+
+.iconButton:focus-visible {
+  outline: 2px solid var(--dsw-alias-interactive-bg-hover-accent);
+  outline-offset: -1px;
+}
+
+.iconButton:disabled {
+  opacity: 0.4;
+  cursor: default;
+}
+
+.iconButtonActive {
+  color: var(--dsw-alias-state-business-primary);
+}
+
+.iconButtonDanger {
+  color: var(--dsw-alias-state-error-primary);
+}
+
+/* ── Chip ───────────────────────────────────────────────────────────────── */
+
+.chip {
+  box-sizing: border-box;
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  height: 22px;
+  padding: 0 8px;
+  border: 1px solid var(--dsw-alias-border-l2);
+  border-radius: 999px;
+  background: none;
+  color: var(--dsw-alias-label-secondary);
+  font: var(--dsw-font-xxxs-11);
+  white-space: nowrap;
+  cursor: pointer;
+}
+
+.chip:hover:not(:disabled) {
+  background: var(--dsw-alias-interactive-bg-hover);
+  color: var(--dsw-alias-label-primary);
+}
+
+.chip:disabled {
+  opacity: 0.4;
+  cursor: default;
+}
+
+/* Rest / hover / selected are three different pictures: the selected chip
+   keeps a filled accent-tinted surface AND the accent edge, so a hovered
+   neighbour never reads as selected. */
+.chipActive,
+.chipActive:hover {
+  background: var(--dsw-alias-interactive-bg-hover-accent);
+  border-color: var(--dsw-alias-state-business-primary);
+  color: var(--dsw-alias-label-primary);
+}
+
+.chipLabel {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.chipCount {
+  color: var(--dsw-alias-label-tertiary);
+  font-variant-numeric: tabular-nums;
+}
+
+.chipActive .chipCount {
+  color: var(--dsw-alias-label-secondary);
+}
+
+/* ── SectionHeader ──────────────────────────────────────────────────────── */
+
+.sectionHeader {
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  width: 100%;
+  height: 28px;
+  padding: 0 12px;
+  border-bottom: 1px solid var(--dsw-alias-border-l1);
+  font: var(--dsw-font-xxs-strong-12);
+  color: var(--dsw-alias-label-secondary);
+}
+
+.sectionLabel {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.sectionCount {
+  flex: none;
+  font: var(--dsw-font-xxxs-11);
+  font-variant-numeric: tabular-nums;
+  color: var(--dsw-alias-label-tertiary);
+}
+
+/* The band's one trailing action is pushed to the right edge. */
+.sectionAction {
+  margin-left: auto;
+  display: inline-flex;
+  align-items: center;
+  flex: none;
+}
+
+/* ── Notice ─────────────────────────────────────────────────────────────── */
+
+.notice {
+  box-sizing: border-box;
+  font: var(--dsw-font-xxs-12);
+  color: var(--dsw-alias-label-tertiary);
+  white-space: pre-wrap;
+}
+
+.noticeWell {
+  padding: 4px 12px 8px;
+}
+
+.noticePage {
+  padding: 16px;
+  text-align: center;
+}
+
+.noticeInline {
+  padding: 0;
+  font-size: 10px;
+  line-height: 1.45;
+}
+
+.noticeError {
+  color: var(--dsw-alias-state-error-primary);
+}
+
+.noticeWarn {
+  color: var(--dsw-alias-state-warn-primary);
+}
+
+.noticeHint {
+  color: var(--dsw-alias-label-tertiary);
+}
+
+/* ── ConfirmDialog ──────────────────────────────────────────────────────── */
+
+.confirmDesc {
+  margin: 0;
+  font: var(--dsw-font-s-14);
+  color: var(--dsw-alias-label-primary);
+}
+
+.confirmDesc[data-danger='true'] {
+  color: var(--dsw-alias-label-primary);
+}
+
+/* ── StatusBadge ────────────────────────────────────────────────────────── */
+
+.statusBadge {
+  flex: none;
+  padding: 0 4px;
+  border-radius: 2px;
+  font: var(--dsw-font-xxxs-strong-11);
+  font-family: var(--ds-font-family-code, monospace);
+  color: var(--dsw-alias-label-secondary);
+}
+
+.statusBadge[data-tone='modified'] { color: var(--dsw-alias-state-warn-primary); }
+.statusBadge[data-tone='added'] { color: var(--dsw-alias-state-success-primary); }
+.statusBadge[data-tone='untracked'] { color: var(--dsw-alias-state-success-primary); }
+.statusBadge[data-tone='deleted'] { color: var(--dsw-alias-state-error-primary); }
+.statusBadge[data-tone='renamed'] { color: var(--dsw-alias-state-business-primary); }
+.statusBadge[data-tone='conflict'] { color: var(--dsw-alias-state-error-primary); }
+.statusBadge[data-tone='read'] { color: var(--dsw-alias-state-success-primary); }
+.statusBadge[data-tone='write'] { color: var(--dsw-alias-state-business-primary); }
+.statusBadge[data-tone='edit'] { color: var(--dsw-alias-state-warn-primary); }
+.statusBadge[data-tone='neutral'] { color: var(--dsw-alias-label-tertiary); }
diff --git a/src/client/ui/kit.tsx b/src/client/ui/kit.tsx
new file mode 100644
index 0000000..9a738a3
--- /dev/null
+++ b/src/client/ui/kit.tsx
@@ -0,0 +1,188 @@
+/**
+ * The plugin's GLOBAL UI atoms — the one place the files page, the changes
+ * page, the tasks page and every future page take their row chrome, badges,
+ * state lines and confirmations from.
+ *
+ * Why they exist: the repo carried 14 duplicated empty/error/hint classes
+ * across four stylesheets (two of them byte-identical), two copies of the
+ * Cancel/Confirm modal, five icon-button recipes (including a class-NAME
+ * collision: `.iconButton` was a 28px circle in one sheet and a 24px square
+ * in another) and five chip/toggle recipes. These components own those
+ * pictures ONCE, cut to the plugin's native scale (see
+ * `docs/plans/2026-09-27-files-changes-uiux.md` §1): 12px body, 11px meta,
+ * 28px controls/rows, 2/3/4/8px radii, one accent.
+ *
+ * Skin contract: every paint comes from `kit.module.css` and resolves to a
+ * `--dsw-*` / `--ds-*` token (`tests/theme.spec.ts` scans the sheet).
+ */
+import { type MouseEvent, type ReactNode } from 'react'
+import clsx from 'clsx'
+import { Button, Modal } from '@deepseek-ai/dsh-client-ui-primitives'
+import css from './kit.module.css'
+
+/**
+ * A 28px (`md`) or 24px (`sm`) square glyph button — the ONE icon button of
+ * the plugin. Callers that need a pressed state pass `active`; the danger
+ * tone only recolors the glyph/hover, never the geometry.
+ */
+export function IconButton(props: {
+  icon: ReactNode
+  /** Accessible name; also the default hover title. */
+  label: string
+  title?: string
+  onClick(event: MouseEvent<HTMLButtonElement>): void
+  size?: 'md' | 'sm'
+  active?: boolean
+  disabled?: boolean
+  danger?: boolean
+  className?: string | undefined
+}): ReactNode {
+  const { icon, label, title, onClick, size = 'md', active, disabled, danger } = props
+  return (
+    <button
+      type="button"
+      className={clsx(css.iconButton, size === 'sm' ? css.iconButtonSm : css.iconButtonMd,
+        active === true && css.iconButtonActive, danger === true && css.iconButtonDanger, props.className)}
+      aria-label={label}
+      title={title ?? label}
+      disabled={disabled}
+      aria-pressed={active}
+      onClick={(event) => { onClick(event) }}
+    >
+      {icon}
+    </button>
+  )
+}
+
+/**
+ * A small toggle chip (filters, list switches). `count` renders as a trailing
+ * figure in the meta rung; the chip's rest / hover / selected states are three
+ * different pictures (a bare fill swap reads as hover).
+ */
+export function Chip(props: {
+  children: ReactNode
+  active?: boolean
+  count?: number
+  title?: string
+  disabled?: boolean
+  onClick(): void
+  className?: string | undefined
+}): ReactNode {
+  return (
+    <button
+      type="button"
+      className={clsx(css.chip, props.active === true && css.chipActive, props.className)}
+      data-active={props.active === true ? 'true' : undefined}
+      aria-pressed={props.active === true}
+      title={props.title}
+      disabled={props.disabled}
+      onClick={() => { props.onClick() }}
+    >
+      <span className={css.chipLabel}>{props.children}</span>
+      {props.count !== undefined && <span className={css.chipCount}>{props.count}</span>}
+    </button>
+  )
+}
+
+/**
+ * A 28px section band: a label (with an optional count) that may carry ONE
+ * trailing action. The hairline under it is the page's only section divider.
+ */
+export function SectionHeader(props: {
+  label: ReactNode
+  count?: number
+  action?: ReactNode
+  className?: string | undefined
+  children?: ReactNode
+}): ReactNode {
+  return (
+    <div className={clsx(css.sectionHeader, props.className)}>
+      <span className={css.sectionLabel}>{props.label}</span>
+      {props.count !== undefined && <span className={css.sectionCount}>{props.count}</span>}
+      {props.children}
+      {props.action !== undefined && <span className={css.sectionAction}>{props.action}</span>}
+    </div>
+  )
+}
+
+/**
+ * The plugin's state lines: empty / loading / error / warn / hint.
+ * `tone` picks the geometry (`page` = centered 16px block, `well` = the
+ * compact 4/12/8 line inside a list, `inline` = 10px micro copy).
+ */
+export function Notice(props: {
+  kind: 'empty' | 'loading' | 'error' | 'warn' | 'hint'
+  tone?: 'page' | 'well' | 'inline'
+  role?: string
+  className?: string | undefined
+  children: ReactNode
+}): ReactNode {
+  const tone = props.tone ?? 'well'
+  return (
+    <div
+      className={clsx(css.notice, tone === 'page' ? css.noticePage : tone === 'inline' ? css.noticeInline : css.noticeWell,
+        props.kind === 'error' && css.noticeError, props.kind === 'warn' && css.noticeWarn,
+        (props.kind === 'hint' || props.kind === 'loading') && css.noticeHint, props.className)}
+      data-kind={props.kind}
+      role={props.role ?? (props.kind === 'error' ? 'alert' : undefined)}
+    >
+      {props.children}
+    </div>
+  )
+}
+
+/**
+ * The ONE confirmation dialog: a quiet single-question body and a
+ * Cancel/Confirm footer, with `busy` locking both actions while the action
+ * runs. Destructive callers pass `danger` so the primary button reads as one.
+ */
+export function ConfirmDialog(props: {
+  open: boolean
+  title: string
+  description: string
+  confirmLabel: string
+  cancelLabel: string
+  danger?: boolean
+  busy?: boolean
+  onConfirm(): void
+  onClose(): void
+}): ReactNode {
+  return (
+    <Modal
+      open={props.open}
+      onClose={props.onClose}
+      title={props.title}
+      closeLabel={props.cancelLabel}
+      footer={(
+        <>
+          <Button variant="outline" disabled={props.busy} onClick={props.onClose}>{props.cancelLabel}</Button>
+          <Button variant="primary" disabled={props.busy} onClick={props.onConfirm}>{props.confirmLabel}</Button>
+        </>
+      )}
+    >
+      <p className={css.confirmDesc} data-danger={props.danger === true ? 'true' : undefined}>{props.description}</p>
+    </Modal>
+  )
+}
+
+/**
+ * The status vocabulary shared by git rows, session-op rows and diff kinds.
+ * `neutral` is the fallback for a kind the caller has no tone for.
+ */
+export type StatusTone =
+  | 'modified' | 'added' | 'deleted' | 'untracked' | 'renamed'
+  | 'conflict' | 'read' | 'write' | 'edit' | 'neutral'
+
+/** A compact status badge: a git letter, an op kind, a diff tag. */
+export function StatusBadge(props: {
+  tone: StatusTone
+  title?: string
+  className?: string | undefined
+  children: ReactNode
+}): ReactNode {
+  return (
+    <span className={clsx(css.statusBadge, props.className)} data-tone={props.tone} title={props.title}>
+      {props.children}
+    </span>
+  )
+}
diff --git a/src/client/use-dir-watch.ts b/src/client/use-dir-watch.ts
index 177ec03..8f8c2f2 100644
--- a/src/client/use-dir-watch.ts
+++ b/src/client/use-dir-watch.ts
@@ -13,7 +13,7 @@
  * that one cached level and re-lists it. Folders the reader collapsed are
  * un-watched, so a long session does not accumulate handles.
  */
-import { useEffect, useRef } from 'react'
+import { useEffect, useMemo, useRef } from 'react'
 
 /** One server frame: a stale directory, a watch verdict, or a refusal. */
 interface FsWatchFrame {
@@ -47,15 +47,23 @@ const RETRY_MAX_MS = 15_000
 export function useDirectoryWatch(options: DirectoryWatchOptions): void {
   const { sessionId, root, dirs, onStale } = options
   // The expanded set is a fresh array on every render, so neither the socket
-  // effect nor the staleness callback may depend on their identity.
-  const wantedRef = useRef<string[]>([])
-  wantedRef.current = root === undefined ? [...dirs] : [root, ...dirs]
+  // effect nor the staleness callback may depend on their identity. The
+  // CONTENT key (NUL-joined paths — no path can contain one) is what the
+  // arrays are derived from, so a re-render with the same expanded set
+  // rebuilds neither the wanted list nor the effect dependency.
+  const dirsKey = dirs.join('\u0000')
+  const wanted = useMemo(() => {
+    const listed = dirsKey === '' ? [] : dirsKey.split('\u0000')
+    return root === undefined ? listed : [root, ...listed]
+  }, [root, dirsKey])
+  const wantedRef = useRef(wanted)
+  wantedRef.current = wanted
   const staleRef = useRef(onStale)
   staleRef.current = onStale
   /** Set by the socket effect; reconciles the host's watch set with the tree's. */
   const reconcileRef = useRef<() => void>(() => {})
   // One string per expanded-set change: a stable dependency for the effect below.
-  const wantedKey = wantedRef.current.join('\u0000')
+  const wantedKey = useMemo(() => wanted.join('\u0000'), [wanted])
 
   useEffect(() => {
     if (sessionId === undefined) return
diff --git a/src/fs-operations.ts b/src/fs-operations.ts
index 4908a30..c2b3392 100644
--- a/src/fs-operations.ts
+++ b/src/fs-operations.ts
@@ -182,6 +182,46 @@ export async function renameWorkspaceEntry(input: WorkspaceRenameInput): Promise
   return { path: safeDestination }
 }
 
+/** Inputs of one new directory row. */
+export interface WorkspaceMkdirInput {
+  /** The session workspace root; the new directory must stay inside it. */
+  cwd: string
+  /** Absolute path of the PARENT row as the tree displays it (a directory). */
+  path: string
+  /** The new directory's base name (single segment — mkdir never nests). */
+  name: string
+  /** Whether workspace containment is enforced (the `workspaceFence` setting; on by default). */
+  fence?: boolean
+}
+
+/**
+ * Create one directory inside an existing tree row: `<path>/<name>`.
+ * The name must be a single path segment; an existing destination is refused
+ * (mkdir would otherwise fail with EEXIST anyway, but the explicit check
+ * yields the same "already exists" sentence rename uses); the parent must
+ * resolve inside the (fence-checked) workspace.
+ *
+ * @throws SidebarError with a wire code for shape, containment and existence
+ * failures.
+ */
+export async function mkdirWorkspaceEntry(input: WorkspaceMkdirInput): Promise<{ path: string }> {
+  const { cwd, path, name, fence = true } = input
+  if (name === '' || name === '.' || name === '..' || name.includes('/') || name.includes('\\')) {
+    throw new SidebarError('bad-request', 'name must be a single path segment', 400)
+  }
+  const { absolute } = await resolveEntry(cwd, path, fence)
+  const destination = await ensureWorkspaceWritePath(cwd, join(absolute, name), fence)
+  if (await pathExists(destination)) {
+    throw new SidebarError('fs-error', `"${name}" already exists`, 409)
+  }
+  try {
+    await mkdir(destination)
+  } catch (error) {
+    throw new SidebarError('fs-error', `cannot create "${name}": ${error instanceof Error ? error.message : String(error)}`, 400)
+  }
+  return { path: destination }
+}
+
 /** Inputs of one tree-row delete. */
 export interface WorkspaceRemoveInput {
   /** The session workspace root; the removed entry must stay inside it. */
diff --git a/src/index.ts b/src/index.ts
index 8b47ffe..1e97343 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -30,14 +30,13 @@ import {
 } from './config.ts'
 import { parentOf, requireAbsolute, listDirectory, rootLabel } from './fs-tree.ts'
 import { resolveSessionPath } from './session-path.ts'
-import { renameWorkspaceEntry, removeWorkspaceEntry, writeWorkspaceUpload } from './fs-operations.ts'
+import { mkdirWorkspaceEntry, renameWorkspaceEntry, removeWorkspaceEntry, writeWorkspaceUpload } from './fs-operations.ts'
 import { ensureWorkspacePath, ensureWorkspaceWritePath } from './path-security.ts'
 import { searchFiles } from './fs-search.ts'
 import { decodeHtmlUrl } from './html-route.ts'
 import { isTrustedApiRequest } from './trust-fence.ts'
 import { registerBundleRoute } from './bundle-route.ts'
 import { createDirectoryWatchers, type DirectoryWatchers } from './fs-watch.ts'
-import { launchExternal } from './open-external.ts'
 import * as git from './git.ts'
 import { SettingsConflictError } from '@deepseek-ai/dsh-settings'
 import { AgentOpenRegistry, registerOpenTool, type AgentOpenRequest } from './agent-opens.ts'
@@ -336,6 +335,17 @@ function buildApi(
         fence: fenceEnabledOf(getSettings),
       })
     },
+    // The tree's "new folder": one directory inside an existing row, with
+    // the same single-segment/existence/containment rules as rename.
+    'fs.mkdir': async (payload) => {
+      const { cwd } = await cwdOf(payload)
+      return mkdirWorkspaceEntry({
+        cwd,
+        path: requireString(payload, 'path'),
+        name: requireString(payload, 'name'),
+        fence: fenceEnabledOf(getSettings),
+      })
+    },
     // The tree row's delete (permanent — the host has no trash): recursive
     // for directories, unlinks a symlink row without touching its target.
     'fs.remove': async (payload) => {
@@ -519,19 +529,6 @@ function buildApi(
         throw new SidebarError('settings-rejected', error instanceof Error ? error.message : String(error), 400)
       }
     },
-    // External open for the file tree's "open with" menu: reveal a path in
-    // the OS file manager, or hand a custom-scheme URL (vscode://,
-    // cursor://, zed://, custom editors) to its registered handler. The
-    // client is a browser renderer where raw scheme navigation is
-    // unreliable, so the launch always goes through the host — the same
-    // fence as every other route, argv-only (no shell interpolation).
-    'open.external': (payload) => {
-      const record = payload as { action?: unknown } | null
-      const action = record?.action
-      if (action === 'reveal') return launchExternal('reveal', requireString(payload, 'path'))
-      if (action === 'url') return launchExternal('url', requireString(payload, 'url'))
-      throw new SidebarError('bad-request', 'action must be "reveal" or "url"')
-    },
     // Side Chat: create a side-thread child seeded with the parent's full
     // log up to now, deliver follow-ups (cold-resuming when the thread's
     // agent is gone), abort a running thread, and release a thread's agent.
diff --git a/src/open-external.ts b/src/open-external.ts
deleted file mode 100644
index 6a1ef67..0000000
--- a/src/open-external.ts
+++ /dev/null
@@ -1,89 +0,0 @@
-/**
- * External open actions for the file tree's "open with" menu: hand a path to
- * the OS file manager (reveal/select) or launch a URL scheme's registered
- * handler (vscode://, cursor://, zed://, custom schemes).
- *
- * The client runs in a browser / DSH Desktop renderer where a raw `vscode://`
- * navigation is unreliable, so both actions fan out through this host route
- * and spawn the platform opener with an argv array (no shell interpolation).
- * The command builders are pure — the platform is injectable — so every
- * per-platform branch is unit-testable without spawning anything.
- */
-import { spawn } from 'node:child_process'
-import { parentOf, requireAbsolute } from './fs-tree.ts'
-import { SidebarError } from './wire.ts'
-
-/** The two external open actions the route accepts. */
-export type OpenExternalAction = 'reveal' | 'url'
-
-/** One platform opener invocation (argv array — never a shell string). */
-export interface ExternalCommand {
-  command: string
-  args: string[]
-}
-
-/** Reveal/select a path in the OS file manager. On Linux there is no common
- *  select protocol — the containing directory is opened instead (KISS). */
-export function revealCommand(path: string, platform: NodeJS.Platform = process.platform): ExternalCommand {
-  switch (platform) {
-    case 'darwin':
-      return { command: 'open', args: ['-R', path] }
-    // Explorer expects `/select,<path>` as one argument. Keep the spawn
-    // shell-free: a command shell would reinterpret valid path characters.
-    case 'win32':
-      return { command: 'explorer.exe', args: [`/select,${path}`] }
-    default: {
-      const parent = parentOf(path)
-      return { command: 'xdg-open', args: [parent ?? path] }
-    }
-  }
-}
-
-/** Hand a custom-scheme URL to the OS protocol handler. */
-export function urlCommand(url: string, platform: NodeJS.Platform = process.platform): ExternalCommand {
-  switch (platform) {
-    case 'darwin':
-      return { command: 'open', args: [url] }
-    // url.dll,FileProtocolHandler launches the registered protocol handler;
-    // `cmd /c start "" <url>` is the fallback if rundll32 misbehaves.
-    case 'win32':
-      return { command: 'rundll32.exe', args: ['url.dll,FileProtocolHandler', url] }
-    default:
-      return { command: 'xdg-open', args: [url] }
-  }
-}
-
-/** Validate a URL-scheme open target: a parseable custom-scheme URL (never
- *  http/https — those would only dump the URL into a browser tab). */
-export function validateExternalUrl(raw: string): string {
-  if (!/^[a-z][a-z0-9+.-]*:\/\//i.test(raw)) {
-    throw new SidebarError('bad-request', 'url must be a custom-scheme URL')
-  }
-  let url: URL
-  try {
-    url = new URL(raw)
-  } catch {
-    throw new SidebarError('bad-request', 'invalid url')
-  }
-  if (url.protocol === 'http:' || url.protocol === 'https:') {
-    throw new SidebarError('bad-request', 'only custom-scheme urls can be opened externally')
-  }
-  return raw
-}
-
-/**
- * Launch one external open action and return immediately (detached, no
- * stdio). Spawn failures are reported through the child's 'error' event —
- * by then the route already returned, so the event is swallowed (the OS
- * dialog about a missing handler is the user-visible outcome either way).
- */
-export function launchExternal(action: OpenExternalAction, value: string): { started: true } {
-  const platform = process.platform
-  const spec = action === 'reveal'
-    ? revealCommand(requireAbsolute(value), platform)
-    : urlCommand(validateExternalUrl(value), platform)
-  const child = spawn(spec.command, spec.args, { detached: true, stdio: 'ignore' })
-  child.on('error', () => { /* opener missing/denied: handled by the OS */ })
-  child.unref()
-  return { started: true }
-}
diff --git a/tests/builtins.spec.ts b/tests/builtins.spec.ts
index 777aa00..f489b9b 100644
--- a/tests/builtins.spec.ts
+++ b/tests/builtins.spec.ts
@@ -154,9 +154,9 @@ describe('built-in tab registrations', () => {
     // The workspace fence switch rides the same card as a plain boolean row.
     expect(toggles[1]?.title).toBeDefined()
     expect(toggles[1]?.desc).toBeDefined()
-    // The open-with configuration (SSH host + custom editors) is the custom
-    // panel rendered below the declarative rows.
-    expect(service.getTab('editor')?.settings?.render).toBeDefined()
+    // External opening is the host's own open-in-app capability now: the
+    // editor card has no custom settings panel left to render.
+    expect(service.getTab('editor')?.settings?.render).toBeUndefined()
   })
 
   it('every built-in tab carries the settings-surface icon', () => {
diff --git a/tests/changes-tab.spec.tsx b/tests/changes-tab.spec.tsx
index 87b4413..45dd711 100644
--- a/tests/changes-tab.spec.tsx
+++ b/tests/changes-tab.spec.tsx
@@ -1,18 +1,23 @@
 /**
- * The unified changes tab shell: the lens switcher swaps the Git lens for
- * the session lens, a Git-lens file row opens the shared preview pane
- * (loaded through the mocked git API, rendered by the shared DiffFiles
- * stack), and the session ops ride the mocked `changes.ops` poll — the
- * event poll, the op fold and the badge cache all live in the tab.
+ * The unified changes tab shell: the 36px header's lens switcher swaps the
+ * Git lens for the session lens, a Git-lens file row opens the shared preview
+ * pane (loaded through the mocked git API, rendered by the shared DiffFiles
+ * stack), and the session ops ride the mocked `changes.ops` poll — the event
+ * poll, the op fold and the badge cache all live in the tab.
+ *
+ * The copy assertions below pin the zh strings (the test environment's
+ * navigator may be a real Node one with an en locale), so a bare substring
+ * check cannot accidentally pass on a different message.
  */
 // @vitest-environment jsdom
-import { afterEach, describe, expect, it, vi } from 'vitest'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 import { createElement } from 'react'
 import { createRoot, type Root } from 'react-dom/client'
 import { act } from 'react-dom/test-utils'
 import { ChangesTab, opCountOf } from '../src/client/changes/ChangesTab.tsx'
 import { createSidebarStore } from '../src/client/state.ts'
 import { api, type GitStatusResult, type GitWorktree } from '../src/client/api.ts'
+import { t } from '../src/client/locales.ts'
 import type { Context } from '../src/context-types.ts'
 import type { SidebarTab } from '../src/client/state.ts'
 
@@ -42,7 +47,7 @@ function mount(root: Root, tab: SidebarTab = { id: 'git', type: 'git', title: 'C
       store: createSidebarStore(),
       scope: { sessionId: 'session', cwd: MAIN },
       tab,
-      visible: false,
+      visible: true,
       onOpenFile: () => {},
       onOpenDiff: () => {},
     }))
@@ -60,11 +65,21 @@ function mockGit(entries: Array<{ path: string; xy: string }>): void {
   vi.spyOn(api, 'gitLog').mockResolvedValue([])
 }
 
+/** One lens tab of the header's segmented control. */
+function lensTab(container: HTMLElement, label: string): HTMLButtonElement | undefined {
+  return [...container.querySelectorAll<HTMLButtonElement>('[role="tab"]')]
+    .find(tab => tab.textContent === label)
+}
+
 async function flushEffects(): Promise<void> {
   await act(async () => { await Promise.resolve() })
   await act(async () => { await Promise.resolve() })
 }
 
+beforeEach(() => {
+  Object.defineProperty(globalThis.navigator, 'language', { value: 'zh-CN', configurable: true })
+})
+
 afterEach(() => {
   vi.restoreAllMocks()
   document.body.innerHTML = ''
@@ -91,10 +106,11 @@ describe('ChangesTab', () => {
       mount(root)
       await flushEffects()
 
-      // Git lens: the file row from the mocked status (badge letter + path).
-      const row = [...container.querySelectorAll<HTMLButtonElement>('button')]
-        .find(button => button.textContent?.includes('src/a.ts'))
+      // Git lens: the changed-file row (badge letter + split name/directory).
+      const row = container.querySelector<HTMLButtonElement>('button[data-path="src/a.ts"]')
       expect(row).toBeDefined()
+      expect(row!.textContent).toContain('a.ts')
+      expect(row!.textContent).toContain('src')
 
       // Clicking the row previews inline (no diff tab minted): the shared
       // renderer draws the added row.
@@ -103,11 +119,9 @@ describe('ChangesTab', () => {
       expect(container.textContent).toContain('new')
 
       // The preview survives a lens switch (it is a dock, not lens state).
-      const group = container.querySelector('[role="group"]')
-      const sessionButton = [...group!.querySelectorAll<HTMLButtonElement>('button')]
-        .find(button => button.getAttribute('aria-pressed') === 'false')
-      expect(sessionButton).toBeDefined()
-      await act(async () => { sessionButton!.click() })
+      const sessionTab = lensTab(container, t('changesSessionLens'))
+      expect(sessionTab).toBeDefined()
+      await act(async () => { sessionTab!.click() })
       expect(container.textContent).toContain('src/a.ts')
     } finally {
       act(() => { root.unmount() })
@@ -127,13 +141,13 @@ describe('ChangesTab', () => {
       mount(root)
       await flushEffects()
 
-      // The tab pulled once on mount and published the op count.
+      // Opening the tab pulls once and publishes the op count (the tab-strip
+      // badge reads this cache).
       expect(ops).toHaveBeenCalled()
       expect(opCountOf('session')).toBe(2)
 
-      const group = container.querySelector('[role="group"]')
-      const buttons = [...group!.querySelectorAll<HTMLButtonElement>('button')]
-      await act(async () => { buttons[1]!.click() })
+      const sessionTab = lensTab(container, t('changesSessionLens'))
+      await act(async () => { sessionTab!.click() })
       // Two files grouped, newest first; the write chip carries its count.
       expect(container.textContent).toContain('src/b.ts')
       expect(container.textContent).toContain('src/a.ts')
@@ -168,10 +182,8 @@ describe('ChangesTab', () => {
       await flushEffects()
 
       // Session lens: open the read op's preview.
-      const group = container.querySelector('[role="group"]')
-      const sessionButton = [...group!.querySelectorAll<HTMLButtonElement>('button')]
-        .find(button => button.getAttribute('aria-pressed') === 'false')
-      await act(async () => { sessionButton!.click() })
+      const sessionTab = lensTab(container, t('changesSessionLens'))
+      await act(async () => { sessionTab!.click() })
       const row = container.querySelector<HTMLButtonElement>('button[data-op-kind="read"]')
       expect(row).toBeDefined()
       expect(container.textContent).toContain('notes.md')
@@ -201,4 +213,228 @@ describe('ChangesTab', () => {
       container.remove()
     }
   })
+
+  it('renders exactly one clean empty state, and the history has its own', async () => {
+    mockGit([])
+
+    const container = document.createElement('div')
+    document.body.append(container)
+    const root: Root = createRoot(container)
+    try {
+      mount(root)
+      await flushEffects()
+
+      // A clean repository says it ONCE: both sections (unstaged/staged) used
+      // to print their own "no changes" line under the same message.
+      const empties = [...container.querySelectorAll<HTMLElement>('[data-kind="empty"]')]
+        .map(node => node.textContent)
+      expect(empties).toEqual([t('changesClean'), t('changesNoHistory')])
+      // The two section bands are not rendered at all when nothing changed.
+      expect(container.querySelectorAll('[data-path]')).toHaveLength(0)
+    } finally {
+      act(() => { root.unmount() })
+      container.remove()
+    }
+  })
+
+  it('reports a failed stage action in the commit bar and catches it (no unhandled rejection)', async () => {
+    mockGit([{ path: 'src/a.ts', xy: ' M' }])
+    vi.spyOn(api, 'gitStage').mockRejectedValue(new Error('index.lock exists'))
+
+    const container = document.createElement('div')
+    document.body.append(container)
+    const root: Root = createRoot(container)
+    try {
+      mount(root)
+      await flushEffects()
+
+      const stage = container.querySelector<HTMLButtonElement>(`button[aria-label="${t('stage')}"]`)
+      expect(stage).toBeDefined()
+      await act(async () => { stage!.click() })
+      await flushEffects()
+
+      const alert = [...container.querySelectorAll<HTMLElement>('[role="alert"]')]
+        .find(node => (node.textContent ?? '').includes(t('changesStageFailed', { message: 'index.lock exists' })))
+      expect(alert).toBeDefined()
+      // The ONE status line sits in the commit bar, directly under its input row.
+      const input = container.querySelector(`input[placeholder="${t('commitPlaceholder')}"]`)
+      expect(input).not.toBeNull()
+      expect(alert!.previousElementSibling?.contains(input)).toBe(true)
+    } finally {
+      act(() => { root.unmount() })
+      container.remove()
+    }
+  })
+
+  it('re-derives the previewed op from the latest fold when it settles', async () => {
+    mockGit([])
+    vi.spyOn(api, 'changesOps')
+      // The call starts running: no result yet, so the write has no payload.
+      .mockResolvedValueOnce({
+        events: [{ type: 'tool/call', seq: 1, time: 1, data: { name: 'write', callId: 'w1', arguments: JSON.stringify({ file_path: 'notes.txt' }) } }],
+        lastSeq: 1,
+      })
+      // The result lands in a later delta and settles the same callId.
+      .mockResolvedValueOnce({
+        events: [{ type: 'tool/result', seq: 2, time: 2, data: { message: { source: { kind: 'tool', callId: 'w1' }, content: [{ type: 'tool-result', content: [{ type: 'text', text: 'settled-body' }] }] } } }],
+        lastSeq: 2,
+      })
+      .mockResolvedValue({ events: [], lastSeq: 2 })
+
+    const container = document.createElement('div')
+    document.body.append(container)
+    const root: Root = createRoot(container)
+    try {
+      mount(root)
+      await flushEffects()
+      const sessionTab = lensTab(container, t('changesSessionLens'))
+      await act(async () => { sessionTab!.click() })
+
+      const row = container.querySelector<HTMLButtonElement>('button[data-op-kind="write"]')
+      expect(row).toBeDefined()
+      await act(async () => { row!.click() })
+      await flushEffects()
+      expect(container.textContent).toContain(t('changesPriorUnknown'))
+      expect(container.textContent).not.toContain('settled-body')
+
+      // The header's refresh pulls the delta; the SAME preview must pick the
+      // settled payload up without the user re-clicking the row.
+      const refresh = container.querySelector<HTMLButtonElement>(`button[aria-label="${t('refresh')}"]`)
+      expect(refresh).not.toBeNull()
+      await act(async () => { refresh!.click() })
+      await flushEffects()
+      expect(container.textContent).toContain('settled-body')
+    } finally {
+      act(() => { root.unmount() })
+      container.remove()
+    }
+  })
+
+  it('shows a history failure instead of claiming there are no commits', async () => {
+    mockGit([])
+    vi.spyOn(api, 'gitLog').mockRejectedValue(new Error('bad object'))
+
+    const container = document.createElement('div')
+    document.body.append(container)
+    const root: Root = createRoot(container)
+    try {
+      mount(root)
+      await flushEffects()
+
+      expect(container.textContent).toContain(t('historyLoadError'))
+      expect(container.textContent).not.toContain(t('changesNoHistory'))
+    } finally {
+      act(() => { root.unmount() })
+      container.remove()
+    }
+  })
+
+  it('keeps the preview redaction toggle working (a secret file masks by default)', async () => {
+    mockGit([])
+    localStorage.removeItem('dsh-sidebar:v1:redaction')
+    vi.spyOn(api, 'changesOps').mockResolvedValue({
+      events: [
+        { type: 'tool/call', seq: 1, time: 1, data: { name: 'read', callId: 'r1', arguments: JSON.stringify({ file_path: 'C:/repo/main/.env' }) } },
+        { type: 'tool/result', seq: 2, time: 2, data: { message: { source: { kind: 'tool', callId: 'r1' }, content: [{ type: 'tool-result', content: [{ type: 'text', text: '<content>1: OPENAI_API_KEY=sk-abcdefghijklmnop</content>' }] }] } } },
+      ],
+      lastSeq: 2,
+    })
+
+    const container = document.createElement('div')
+    document.body.append(container)
+    const root: Root = createRoot(container)
+    try {
+      mount(root)
+      await flushEffects()
+      const sessionTab = lensTab(container, t('changesSessionLens'))
+      await act(async () => { sessionTab!.click() })
+      const row = container.querySelector<HTMLButtonElement>('button[data-op-kind="read"]')
+      await act(async () => { row!.click() })
+      await flushEffects()
+
+      // Redaction is on by default: the secret never reaches the DOM.
+      expect(container.textContent).toContain('[REDACTED]')
+      expect(container.textContent).not.toContain('sk-abcdefghijklmnop')
+
+      // The kit toggle (a Chip) turns it off, and only then does the raw value
+      // render; toggling back masks it again.
+      const byLabel = (label: string): HTMLButtonElement | undefined =>
+        [...container.querySelectorAll<HTMLButtonElement>('button')]
+          .find(button => (button.textContent ?? '') === label)
+      const on = byLabel(t('changesRedactOnLabel'))
+      expect(on).toBeDefined()
+      await act(async () => { on!.click() })
+      await flushEffects()
+      expect(container.textContent).toContain('sk-abcdefghijklmnop')
+      const off = byLabel(t('changesRedactOffLabel'))
+      expect(off).toBeDefined()
+      await act(async () => { off!.click() })
+      await flushEffects()
+      expect(container.textContent).not.toContain('sk-abcdefghijklmnop')
+    } finally {
+      act(() => { root.unmount() })
+      container.remove()
+      localStorage.removeItem('dsh-sidebar:v1:redaction')
+    }
+  })
+
+  it('clamps the restored preview height to the pane bounds', async () => {
+    mockGit([{ path: 'src/a.ts', xy: ' M' }])
+    vi.spyOn(api, 'gitDiff').mockResolvedValue({
+      diff: 'diff --git a/src/a.ts b/src/a.ts\n--- a/src/a.ts\n+++ b/src/a.ts\n@@ -1 +1 @@\n-old\n+new\n',
+    })
+
+    /** Open the pane with one persisted height and read back the rendered one. */
+    const paneHeightFor = async (previewH: number): Promise<string | undefined> => {
+      const container = document.createElement('div')
+      document.body.append(container)
+      const root: Root = createRoot(container)
+      try {
+        mount(root, { id: 'git', type: 'git', title: 'Changes', meta: { previewH } })
+        await flushEffects()
+        const row = container.querySelector<HTMLButtonElement>('button[data-path="src/a.ts"]')
+        expect(row).not.toBeNull()
+        await act(async () => { row!.click() })
+        await flushEffects()
+        return container.querySelector<HTMLElement>('[role="separator"]')?.parentElement?.style.height
+      } finally {
+        act(() => { root.unmount() })
+        container.remove()
+      }
+    }
+
+    // A height saved under a taller window cannot open past the pane's cap...
+    expect(await paneHeightFor(5000)).toBe(`${String(Math.round(window.innerHeight * 0.7))}px`)
+    // ...and an unusably small one is raised to the content minimum.
+    expect(await paneHeightFor(50)).toBe('140px')
+  })
+
+  it('polls the session events only while the session lens is on screen', async () => {
+    vi.useFakeTimers()
+    mockGit([])
+    const ops = vi.spyOn(api, 'changesOps').mockResolvedValue({ events: [], lastSeq: 0 })
+
+    const container = document.createElement('div')
+    document.body.append(container)
+    const root: Root = createRoot(container)
+    try {
+      mount(root)
+      await flushEffects()
+      // Opening the tab is one catch-up pull (the badge count follows it).
+      expect(ops).toHaveBeenCalledTimes(1)
+      await act(async () => { await vi.advanceTimersByTimeAsync(10_000) })
+      // The git lens has no use for the session event log: no cadence at all.
+      expect(ops).toHaveBeenCalledTimes(1)
+
+      const sessionTab = lensTab(container, t('changesSessionLens'))
+      await act(async () => { sessionTab!.click() })
+      await act(async () => { await vi.advanceTimersByTimeAsync(5_000) })
+      // On screen: the 2.5s delta cadence runs.
+      expect(ops.mock.calls.length).toBeGreaterThan(1)
+    } finally {
+      act(() => { root.unmount() })
+      container.remove()
+      vi.useRealTimers()
+    }
+  })
 })
diff --git a/tests/diff-git-target.spec.tsx b/tests/diff-git-target.spec.tsx
new file mode 100644
index 0000000..7da3b11
--- /dev/null
+++ b/tests/diff-git-target.spec.tsx
@@ -0,0 +1,184 @@
+/**
+ * The shared git-diff loader (`diff/use-git-diff.ts`) sits behind BOTH diff
+ * surfaces: the changes tab's inline preview pane and the dedicated diff tab.
+ * These tests drive each surface through the hook — the staged-side fallback,
+ * the untracked full-addition fallback, and the per-file fold cache two
+ * sibling folds share — so a future change to one surface cannot silently
+ * change the other.
+ */
+// @vitest-environment jsdom
+import { afterEach, describe, expect, it, vi } from 'vitest'
+import { createElement } from 'react'
+import { createRoot, type Root } from 'react-dom/client'
+import { act } from 'react-dom/test-utils'
+import { DiffPane } from '../src/client/changes/DiffPane.tsx'
+import { DiffTab } from '../src/client/DiffTab.tsx'
+import { api } from '../src/client/api.ts'
+import type { SessionScope } from '../src/client/api.ts'
+import type { SidebarDiffRef } from '../src/client/state.ts'
+
+import { setupReactAct } from './test-utils.ts'
+setupReactAct()
+
+const SCOPE: SessionScope = { sessionId: 's1', cwd: '/p' }
+
+const STAGED_PATCH = [
+  'diff --git a/src/a.ts b/src/a.ts',
+  '--- a/src/a.ts',
+  '+++ b/src/a.ts',
+  '@@ -1 +1 @@',
+  '-old',
+  '+staged-side',
+].join('\n')
+
+/** A three-hunk patch of one file: two gap folds (lines 2..11 and 13..29). */
+const TWO_GAP_PATCH = [
+  'diff --git a/src/a.ts b/src/a.ts',
+  '--- a/src/a.ts',
+  '+++ b/src/a.ts',
+  '@@ -1 +1 @@',
+  '-old',
+  '+new',
+  '@@ -12 +12 @@',
+  '-tail',
+  '+tail2',
+  '@@ -30 +30 @@',
+  '-end',
+  '+end2',
+].join('\n')
+
+const CONTENT = Array.from({ length: 40 }, (_value, index) => `line-${String(index + 1)}`).join('\n')
+
+async function flushEffects(): Promise<void> {
+  for (let round = 0; round < 4; round += 1) await act(async () => { await Promise.resolve() })
+}
+
+afterEach(() => { vi.restoreAllMocks() })
+
+describe('useGitDiffTarget through the inline preview pane (DiffPane)', () => {
+  it('falls back to the other side when the requested side has no diff', async () => {
+    const worktree: SidebarDiffRef = { kind: 'worktree', path: 'src/a.ts', staged: false }
+    const gitDiff = vi.spyOn(api, 'gitDiff').mockImplementation(async (_scope, _path, staged) => ({
+      diff: staged ? STAGED_PATCH : '',
+    }))
+
+    const container = document.createElement('div')
+    document.body.append(container)
+    const root: Root = createRoot(container)
+    try {
+      act(() => {
+        root.render(createElement(DiffPane, {
+          target: { kind: 'git', ref: worktree },
+          scope: SCOPE,
+          height: 300,
+          onHeightCommit: () => {},
+          onClose: () => {},
+          onExpand: () => {},
+        }))
+      })
+      await flushEffects()
+
+      // The requested (unstaged) side came back empty, so the pane retried the
+      // staged side and rendered THAT patch.
+      expect(gitDiff).toHaveBeenNthCalledWith(1, expect.anything(), 'src/a.ts', false, undefined)
+      expect(gitDiff).toHaveBeenNthCalledWith(2, expect.anything(), 'src/a.ts', true, undefined)
+      expect(container.textContent).toContain('staged-side')
+    } finally {
+      act(() => { root.unmount() })
+      container.remove()
+    }
+  })
+
+  it('renders an untracked file as a full-file addition from its content', async () => {
+    const worktree: SidebarDiffRef = { kind: 'worktree', path: 'src/new.ts', staged: false, untracked: true }
+    vi.spyOn(api, 'gitDiff').mockResolvedValue({ diff: '' })
+    const read = vi.spyOn(api, 'fsRead').mockResolvedValue({ kind: 'text', content: 'brand-new-line', truncated: false })
+
+    const container = document.createElement('div')
+    document.body.append(container)
+    const root: Root = createRoot(container)
+    try {
+      act(() => {
+        root.render(createElement(DiffPane, {
+          target: { kind: 'git', ref: worktree },
+          scope: SCOPE,
+          height: 300,
+          onHeightCommit: () => {},
+          onClose: () => {},
+          onExpand: () => {},
+        }))
+      })
+      await flushEffects()
+
+      expect(read).toHaveBeenCalledWith(expect.anything(), '/p/src/new.ts')
+      expect(container.textContent).toContain('brand-new-line')
+    } finally {
+      act(() => { root.unmount() })
+      container.remove()
+    }
+  })
+})
+
+describe('useGitDiffTarget through the dedicated diff tab (DiffTab)', () => {
+  it('loads a commit patch into the shared renderer', async () => {
+    vi.spyOn(api, 'gitCommitDiff').mockResolvedValue({ diff: STAGED_PATCH })
+
+    const container = document.createElement('div')
+    document.body.append(container)
+    const root: Root = createRoot(container)
+    try {
+      act(() => {
+        root.render(createElement(DiffTab, {
+          sessionId: 's1',
+          cwd: '/p',
+          diff: { kind: 'commit', hash: 'abc1234', hashFull: 'a'.repeat(40), subject: 'subject' },
+        }))
+      })
+      await flushEffects()
+      expect(container.textContent).toContain('staged-side')
+    } finally {
+      act(() => { root.unmount() })
+      container.remove()
+    }
+  })
+
+  it('fetches each side of a file ONCE for two sibling fold expansions', async () => {
+    vi.spyOn(api, 'gitDiff').mockResolvedValue({ diff: TWO_GAP_PATCH })
+    const show = vi.spyOn(api, 'gitShow').mockResolvedValue({ content: CONTENT })
+    const read = vi.spyOn(api, 'fsRead').mockResolvedValue({ kind: 'text', content: CONTENT, truncated: false })
+
+    const container = document.createElement('div')
+    document.body.append(container)
+    const root: Root = createRoot(container)
+    try {
+      act(() => {
+        root.render(createElement(DiffTab, {
+          sessionId: 's1',
+          cwd: '/p',
+          diff: { kind: 'worktree', path: 'src/a.ts', staged: false },
+        }))
+      })
+      await flushEffects()
+
+      const firstFold = container.querySelector<HTMLElement>('[data-expandable="true"]')
+      expect(firstFold).not.toBeNull()
+      await act(async () => { firstFold!.click() })
+      expect(show).toHaveBeenCalledTimes(1)
+      expect(read).toHaveBeenCalledTimes(1)
+      expect(container.textContent).toContain('line-5')
+
+      // The second gap is the SAME file: the cache serves it without a fetch.
+      // (An expanded fold keeps its marker in the DOM, so the second one is
+      // the second marker in document order.)
+      const folds = container.querySelectorAll<HTMLElement>('[data-expandable="true"]')
+      expect(folds).toHaveLength(2)
+      await act(async () => { folds[1]!.click() })
+      expect(show).toHaveBeenCalledTimes(1)
+      expect(read).toHaveBeenCalledTimes(1)
+      expect(container.textContent).toContain('line-20')
+    } finally {
+      act(() => { root.unmount() })
+      container.remove()
+    }
+  })
+})
diff --git a/tests/file-tree-dir-watch.spec.tsx b/tests/file-tree-dir-watch.spec.tsx
new file mode 100644
index 0000000..8810604
--- /dev/null
+++ b/tests/file-tree-dir-watch.spec.tsx
@@ -0,0 +1,158 @@
+/**
+ * The client half of the file tree's live refresh: one socket per session,
+ * the expanded set announced as `watch` frames, directories that left the
+ * set unwatched, and a `dir`-only frame routed to the staleness callback
+ * while a refusal (`ok: false`) is NOT (a fenced/unwatchable directory must
+ * not re-list forever).
+ *
+ * The identity guard: the hook derives its wanted set from the CONTENT of
+ * `dirs` (a NUL-joined key), so a caller re-rendering with a fresh array of
+ * the same directories reconciles nothing.
+ */
+// @vitest-environment jsdom
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+import { createElement, type ReactNode } from 'react'
+import { createRoot, type Root } from 'react-dom/client'
+import { act } from 'react-dom/test-utils'
+import { useDirectoryWatch } from '../src/client/use-dir-watch.ts'
+
+import { setupReactAct } from './test-utils.ts'
+setupReactAct()
+
+/** The smallest WebSocket the hook talks to: `send` records the frames. */
+class FakeSocket {
+  static instances: FakeSocket[] = []
+  static readonly OPEN = 1
+  static readonly CONNECTING = 0
+  readonly url: string
+  readyState = FakeSocket.CONNECTING
+  sent: string[] = []
+  onopen: (() => void) | null = null
+  onmessage: ((event: { data: string }) => void) | null = null
+  onclose: (() => void) | null = null
+  closed = false
+
+  constructor(url: string) {
+    this.url = url
+    FakeSocket.instances.push(this)
+  }
+
+  send(frame: string): void { this.sent.push(frame) }
+  close(): void { this.closed = true; this.readyState = 3 }
+  /** The host's connection acknowledgement. */
+  open(): void { this.readyState = FakeSocket.OPEN; this.onopen?.() }
+  /** One host frame (a watch confirmation, a refusal, or a stale notice). */
+  frame(payload: unknown): void { this.onmessage?.({ data: JSON.stringify(payload) }) }
+  /** The frames the hook sent, as parsed objects. */
+  frames(): { op: string; path: string }[] {
+    return this.sent.map(frame => JSON.parse(frame) as { op: string; path: string })
+  }
+}
+
+function Probe(props: { dirs: string[]; onStale: (dir: string) => void }): ReactNode {
+  useDirectoryWatch({ sessionId: 's1', root: '/tmp', dirs: props.dirs, onStale: props.onStale })
+  return null
+}
+
+interface Harness {
+  rerender: (dirs: string[]) => void
+  socket: () => FakeSocket
+  unmount: () => void
+}
+
+function mountProbe(onStale: (dir: string) => void): Harness {
+  const container = document.createElement('div')
+  document.body.append(container)
+  const root: Root = createRoot(container)
+  const render = (dirs: string[]): void => { root.render(createElement(Probe, { dirs, onStale })) }
+  act(() => { render(['/tmp/a']) })
+  return {
+    rerender: (dirs: string[]) => { act(() => { render(dirs) }) },
+    socket: () => {
+      const socket = FakeSocket.instances[0]
+      if (socket === undefined) throw new Error('no socket opened')
+      return socket
+    },
+    unmount: () => { act(() => { root.unmount() }); container.remove() },
+  }
+}
+
+beforeEach(() => {
+  FakeSocket.instances = []
+  vi.stubGlobal('WebSocket', FakeSocket)
+})
+
+afterEach(() => {
+  document.body.innerHTML = ''
+  vi.unstubAllGlobals()
+})
+
+describe('useDirectoryWatch', () => {
+  it('announces the root plus the expanded set once the socket opens', () => {
+    const harness = mountProbe(() => {})
+    const socket = harness.socket()
+    expect(socket.url).toContain('/sidebar/ws/fs-watch')
+    expect(socket.url).toContain('sessionId=s1')
+    // Nothing is sent before the connection opens.
+    expect(socket.sent).toEqual([])
+    act(() => { socket.open() })
+    expect(socket.frames()).toEqual([
+      { op: 'watch', path: '/tmp' },
+      { op: 'watch', path: '/tmp/a' },
+    ])
+    harness.unmount()
+  })
+
+  it('sends nothing when a re-render repeats the same directories in a fresh array', () => {
+    const harness = mountProbe(() => {})
+    const socket = harness.socket()
+    act(() => { socket.open() })
+    const before = socket.sent.length
+    harness.rerender(['/tmp/a'])
+    expect(FakeSocket.instances).toHaveLength(1)
+    expect(socket.sent.length).toBe(before)
+    harness.unmount()
+  })
+
+  it('watches the new directory and unwatches the one the host confirmed', () => {
+    const harness = mountProbe(() => {})
+    const socket = harness.socket()
+    act(() => { socket.open() })
+    // The host confirms both watches with its own resolved paths.
+    act(() => {
+      socket.frame({ dir: '/tmp', ok: true })
+      socket.frame({ dir: '/tmp/a', ok: true })
+    })
+    harness.rerender(['/tmp/b'])
+    expect(socket.frames().slice(-3)).toEqual([
+      { op: 'watch', path: '/tmp' },
+      { op: 'watch', path: '/tmp/b' },
+      { op: 'unwatch', path: '/tmp/a' },
+    ])
+    harness.unmount()
+  })
+
+  it('routes a stale notice to the callback and ignores a refusal', () => {
+    const onStale = vi.fn()
+    const harness = mountProbe(onStale)
+    const socket = harness.socket()
+    act(() => { socket.open() })
+    // A refusal (fenced path / watcher cap) must NOT re-list.
+    act(() => { socket.frame({ dir: '/tmp/a', ok: false }) })
+    expect(onStale).not.toHaveBeenCalled()
+    act(() => { socket.frame({ dir: '/tmp/a' }) })
+    expect(onStale).toHaveBeenCalledWith('/tmp/a')
+    // A malformed frame is ignored outright.
+    act(() => { socket.frame({ nope: 1 }) })
+    expect(onStale).toHaveBeenCalledTimes(1)
+    harness.unmount()
+  })
+
+  it('closes the socket on unmount', () => {
+    const harness = mountProbe(() => {})
+    const socket = harness.socket()
+    act(() => { socket.open() })
+    harness.unmount()
+    expect(socket.closed).toBe(true)
+  })
+})
diff --git a/tests/file-tree-drop.spec.tsx b/tests/file-tree-drop.spec.tsx
index 3a549b1..85ce1d8 100644
--- a/tests/file-tree-drop.spec.tsx
+++ b/tests/file-tree-drop.spec.tsx
@@ -36,6 +36,9 @@ vi.mock('../src/client/api.ts', () => ({
         { name: 'a.ts', path: '/tmp/a.ts', isDir: false },
       ],
     }),
+    // The tree reads the shared git-status store; a non-repo answer keeps
+    // every row plain (this spec is about the drop surface).
+    gitStatus: async () => ({ isRepo: false, entries: [] }),
   },
   downloadUrl: () => '/sidebar/file',
 }))
diff --git a/tests/file-tree-git-status.spec.tsx b/tests/file-tree-git-status.spec.tsx
new file mode 100644
index 0000000..f044cf2
--- /dev/null
+++ b/tests/file-tree-git-status.spec.tsx
@@ -0,0 +1,145 @@
+/**
+ * FileTree git ink (VS Code style): the tree reads the plugin's SHARED
+ * `useGitStatus` store — a changed file's name takes its tone class and a
+ * letter badge whose tooltip is the status word, a directory with a change
+ * anywhere below it is tinted without a letter, a clean file stays plain, and
+ * a non-repo (or unavailable git) degrades silently to plain rows.
+ */
+// @vitest-environment jsdom
+import { beforeAll, afterEach, describe, expect, it, vi } from 'vitest'
+import { createElement } from 'react'
+import { createRoot, type Root } from 'react-dom/client'
+import { act } from 'react-dom/test-utils'
+import type { GitStatusResult } from '../src/client/api.ts'
+import { FileTree } from '../src/client/FileTree.tsx'
+import { createSidebarStore } from '../src/client/state.ts'
+
+import { setupReactAct } from './test-utils.ts'
+setupReactAct()
+
+// vitest 4.1.11+ follows the OS locale; pin en-US so the badge tooltip is English.
+beforeAll(() => {
+  Object.defineProperty(window.navigator, 'language', { value: 'en-US', configurable: true })
+})
+
+const { gitStatus } = vi.hoisted(() => ({ gitStatus: vi.fn() }))
+
+vi.mock('../src/client/api.ts', () => ({
+  api: {
+    fsTree: async () => ({
+      path: '/tmp',
+      entries: [
+        { name: 'sub', path: '/tmp/sub', isDir: true },
+        { name: 'a.ts', path: '/tmp/a.ts', isDir: false },
+        { name: 'b.ts', path: '/tmp/b.ts', isDir: false },
+      ],
+      truncated: false,
+    }),
+    gitStatus,
+  },
+  downloadUrl: () => '/sidebar/file',
+  isOutsideWorkspaceMessage: () => false,
+}))
+
+const REPO: GitStatusResult = {
+  isRepo: true,
+  root: '/tmp',
+  entries: [
+    { path: 'a.ts', xy: ' M' },
+    // A change strictly BELOW /tmp/sub: the directory is tinted, the file
+    // itself is not rendered (its level is collapsed).
+    { path: 'sub/inner.ts', xy: '??' },
+  ],
+}
+
+interface Harness {
+  container: HTMLDivElement
+  unmount: () => void
+}
+
+async function mountTree(): Promise<Harness> {
+  const container = document.createElement('div')
+  document.body.append(container)
+  const root: Root = createRoot(container)
+  await act(async () => {
+    root.render(createElement(FileTree, {
+      sessionId: 'git-spec',
+      cwd: '/tmp',
+      store: createSidebarStore(),
+      expanded: [],
+      revealed: [],
+      onToggle: () => {},
+      onOpenFile: () => {},
+      onReferenceFile: () => {},
+      refreshTick: 0,
+      onUploadRequest: () => {},
+      busy: false,
+    }))
+    // Settle the shared store's fetch (it starts in FileTree's mount effect).
+    await Promise.resolve()
+    await Promise.resolve()
+  })
+  return {
+    container,
+    unmount: () => { act(() => { root.unmount() }); container.remove() },
+  }
+}
+
+/** One tree row by its displayed name. */
+function rowByName(container: HTMLElement, name: string): HTMLElement {
+  const row = [...container.querySelectorAll<HTMLElement>('[role="button"]')]
+    .find(el => el.querySelector('[class*="explorerName"]')?.textContent === name)
+  if (row === undefined) throw new Error(`row not found: ${name}`)
+  return row
+}
+
+function nameSpan(row: HTMLElement): HTMLElement {
+  return row.querySelector<HTMLElement>('[class*="explorerName"]')!
+}
+
+let harness: Harness
+afterEach(() => {
+  harness.unmount()
+  document.body.innerHTML = ''
+  gitStatus.mockReset()
+})
+
+describe('FileTree git ink', () => {
+  it('tints a changed file name and badges its porcelain letter', async () => {
+    gitStatus.mockResolvedValue(REPO)
+    harness = await mountTree()
+    const row = rowByName(harness.container, 'a.ts')
+    expect(nameSpan(row).getAttribute('data-git-tone')).toBe('modified')
+    expect(nameSpan(row).className).toContain('explorerGitName')
+    const badge = row.querySelector<HTMLElement>('[class*="statusBadge"]')
+    expect(badge?.textContent).toBe('M')
+    expect(badge?.getAttribute('data-tone')).toBe('modified')
+    expect(badge?.getAttribute('title')).toBe('Modified')
+  })
+
+  it('tints a directory that contains a change below it, without a letter', async () => {
+    gitStatus.mockResolvedValue(REPO)
+    harness = await mountTree()
+    const row = rowByName(harness.container, 'sub')
+    expect(nameSpan(row).className).toContain('explorerDirChanged')
+    expect(row.querySelector('[class*="statusBadge"]')).toBeNull()
+  })
+
+  it('leaves a clean file plain', async () => {
+    gitStatus.mockResolvedValue(REPO)
+    harness = await mountTree()
+    const row = rowByName(harness.container, 'b.ts')
+    expect(nameSpan(row).getAttribute('data-git-tone')).toBeNull()
+    expect(row.querySelector('[class*="statusBadge"]')).toBeNull()
+  })
+
+  it('degrades silently outside a repository', async () => {
+    gitStatus.mockResolvedValue({ isRepo: false, entries: [] })
+    harness = await mountTree()
+    const file = rowByName(harness.container, 'a.ts')
+    expect(nameSpan(file).getAttribute('data-git-tone')).toBeNull()
+    expect(nameSpan(file).className).not.toContain('explorerGitName')
+    const dir = rowByName(harness.container, 'sub')
+    expect(nameSpan(dir).className).not.toContain('explorerDirChanged')
+  })
+})
diff --git a/tests/file-tree-multiselect.spec.tsx b/tests/file-tree-multiselect.spec.tsx
new file mode 100644
index 0000000..231dcf7
--- /dev/null
+++ b/tests/file-tree-multiselect.spec.tsx
@@ -0,0 +1,246 @@
+/**
+ * FileTree multi-selection (VS Code semantics): Ctrl/Cmd+click toggles one
+ * row and seats the Shift anchor, Shift+click selects the visible range from
+ * that anchor, Escape and a blank click clear the selection, and a right
+ * click outside the selection collapses it onto the row. A non-empty
+ * selection shows the batch bar (count + copy paths / delete / clear); the
+ * batch delete confirms once, removes sequentially, and stops on the first
+ * failure with the error strip.
+ *
+ * The other half of the contract is what must NOT change: an unmodified click
+ * still opens a file / toggles a directory and drops the selection.
+ */
+// @vitest-environment jsdom
+import { beforeAll, afterEach, describe, expect, it, vi } from 'vitest'
+import { createElement } from 'react'
+import { createRoot, type Root } from 'react-dom/client'
+import { act } from 'react-dom/test-utils'
+import { FileTree } from '../src/client/FileTree.tsx'
+import { createSidebarStore } from '../src/client/state.ts'
+
+import { setupReactAct } from './test-utils.ts'
+setupReactAct()
+
+// vitest 4.1.11+ follows the OS locale; pin en-US so the bar's copy is English.
+beforeAll(() => {
+  Object.defineProperty(window.navigator, 'language', { value: 'en-US', configurable: true })
+})
+
+const { fsRemove, fsTree } = vi.hoisted(() => ({
+  fsRemove: vi.fn(async (_scope: unknown, path: string) => ({ path })),
+  fsTree: vi.fn(async () => ({
+    path: '/tmp',
+    entries: [
+      { name: 'sub', path: '/tmp/sub', isDir: true },
+      { name: 'a.ts', path: '/tmp/a.ts', isDir: false },
+      { name: 'b.ts', path: '/tmp/b.ts', isDir: false },
+    ],
+    truncated: false,
+  })),
+}))
+
+vi.mock('../src/client/api.ts', () => ({
+  api: {
+    fsTree,
+    fsRemove,
+    // The tree reads the shared git-status store; a non-repo answer keeps
+    // every row plain (this spec is about the selection).
+    gitStatus: async () => ({ isRepo: false, entries: [] }),
+  },
+  downloadUrl: () => '/sidebar/file',
+  isOutsideWorkspaceMessage: () => false,
+}))
+
+interface Harness {
+  container: HTMLDivElement
+  opened: string[]
+  toggled: string[]
+  unmount: () => void
+}
+
+async function mountTree(expanded: string[] = []): Promise<Harness> {
+  const container = document.createElement('div')
+  document.body.append(container)
+  const root: Root = createRoot(container)
+  const opened: string[] = []
+  const toggled: string[] = []
+  await act(async () => {
+    root.render(createElement(FileTree, {
+      sessionId: 's1',
+      cwd: '/tmp',
+      store: createSidebarStore(),
+      expanded,
+      revealed: [],
+      onToggle: (path: string) => { toggled.push(path) },
+      onOpenFile: (path: string) => { opened.push(path) },
+      onReferenceFile: () => {},
+      refreshTick: 0,
+      onUploadRequest: () => {},
+      busy: false,
+    }))
+  })
+  return {
+    container,
+    opened,
+    toggled,
+    unmount: () => { act(() => { root.unmount() }); container.remove() },
+  }
+}
+
+/** One tree row by its displayed name. */
+function rowByName(container: HTMLElement, name: string): HTMLElement {
+  const row = [...container.querySelectorAll<HTMLElement>('[role="button"]')]
+    .find(el => el.querySelector('[class*="explorerName"]')?.textContent === name)
+  if (row === undefined) throw new Error(`row not found: ${name}`)
+  return row
+}
+
+function click(el: Element, init: MouseEventInit = {}): void {
+  act(() => { el.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true, ...init })) })
+}
+
+function rightClick(el: Element): void {
+  act(() => {
+    el.dispatchEvent(new MouseEvent('contextmenu', { bubbles: true, cancelable: true, clientX: 20, clientY: 30 }))
+  })
+}
+
+function pressEscape(el: Element): void {
+  act(() => { el.dispatchEvent(new KeyboardEvent('keydown', { key: 'Escape', bubbles: true, cancelable: true })) })
+}
+
+/** The batch bar (the kit's section band carries the page class). */
+function selectionBar(container: HTMLElement): HTMLElement | null {
+  return container.querySelector<HTMLElement>('[class*="explorerSelectionBar"]')
+}
+
+/** The names of the rows currently rendered as selected. */
+function selectedNames(container: HTMLElement): string[] {
+  return [...container.querySelectorAll<HTMLElement>('[class*="explorerRowSelected"]')]
+    .map(row => row.querySelector('[class*="explorerName"]')?.textContent ?? '')
+}
+
+/** One batch-bar action by its label. */
+function barAction(container: HTMLElement, label: string): HTMLElement {
+  const button = [...(selectionBar(container)?.querySelectorAll<HTMLElement>('button') ?? [])]
+    .find(el => el.textContent === label)
+  if (button === undefined) throw new Error(`bar action not found: ${label}`)
+  return button
+}
+
+let harness: Harness
+afterEach(() => {
+  harness.unmount()
+  document.body.innerHTML = ''
+  fsRemove.mockReset()
+  fsRemove.mockImplementation(async (_scope: unknown, path: string) => ({ path }))
+  fsTree.mockClear()
+})
+
+describe('FileTree multi-selection', () => {
+  it('keeps the unmodified click semantics and drops the selection', async () => {
+    harness = await mountTree()
+    click(rowByName(harness.container, 'a.ts'), { ctrlKey: true })
+    expect(selectionBar(harness.container)).not.toBeNull()
+    // A plain click opens the file (and clears the batch).
+    click(rowByName(harness.container, 'b.ts'))
+    expect(harness.opened).toEqual(['/tmp/b.ts'])
+    expect(selectionBar(harness.container)).toBeNull()
+    // A plain click on a directory row still toggles it.
+    click(rowByName(harness.container, 'sub'))
+    expect(harness.toggled).toEqual(['/tmp/sub'])
+    expect(harness.opened).toEqual(['/tmp/b.ts'])
+  })
+
+  it('Ctrl/Cmd+click toggles rows and the bar counts them', async () => {
+    harness = await mountTree()
+    click(rowByName(harness.container, 'a.ts'), { ctrlKey: true })
+    expect(selectedNames(harness.container)).toEqual(['a.ts'])
+    expect(selectionBar(harness.container)?.textContent).toContain('1 selected')
+    click(rowByName(harness.container, 'b.ts'), { metaKey: true })
+    expect(selectedNames(harness.container)).toEqual(['a.ts', 'b.ts'])
+    expect(selectionBar(harness.container)?.textContent).toContain('2 selected')
+    // Toggling the same row off again leaves exactly the other one.
+    click(rowByName(harness.container, 'b.ts'), { ctrlKey: true })
+    expect(selectedNames(harness.container)).toEqual(['a.ts'])
+  })
+
+  it('Shift+click selects the visible range from the Ctrl-seated anchor', async () => {
+    harness = await mountTree()
+    // The anchor is 'b.ts' (the last visible row), so the range reaches 'a.ts'.
+    click(rowByName(harness.container, 'b.ts'), { ctrlKey: true })
+    click(rowByName(harness.container, 'a.ts'), { shiftKey: true })
+    expect(selectedNames(harness.container)).toEqual(['a.ts', 'b.ts'])
+    // A collapsed directory between two rows is part of the visible order.
+    click(rowByName(harness.container, 'sub'), { shiftKey: true })
+    expect(selectedNames(harness.container)).toEqual(['sub', 'a.ts', 'b.ts'])
+  })
+
+  it('Escape, the bar\'s Clear selection, and a click on the tree body all clear the selection', async () => {
+    harness = await mountTree()
+    click(rowByName(harness.container, 'a.ts'), { ctrlKey: true })
+    pressEscape(harness.container.querySelector('[class*="explorerBody"]')!)
+    expect(selectionBar(harness.container)).toBeNull()
+    click(rowByName(harness.container, 'a.ts'), { ctrlKey: true })
+    act(() => { barAction(harness.container, 'Clear selection').click() })
+    expect(selectionBar(harness.container)).toBeNull()
+    click(rowByName(harness.container, 'a.ts'), { ctrlKey: true })
+    click(harness.container.querySelector('[class*="explorerBody"]')!)
+    expect(selectionBar(harness.container)).toBeNull()
+  })
+
+  it('right-click collapses the selection onto an unselected row and keeps a selected one', async () => {
+    harness = await mountTree()
+    click(rowByName(harness.container, 'a.ts'), { ctrlKey: true })
+    click(rowByName(harness.container, 'b.ts'), { ctrlKey: true })
+    // The row is already part of the selection: the whole batch survives.
+    rightClick(rowByName(harness.container, 'b.ts'))
+    expect(selectedNames(harness.container)).toEqual(['a.ts', 'b.ts'])
+    // An unselected row collapses the batch onto itself.
+    rightClick(rowByName(harness.container, 'sub'))
+    expect(selectedNames(harness.container)).toEqual(['sub'])
+  })
+
+  it('copies every selected absolute path, newline separated', async () => {
+    const writeText = vi.fn(async () => {})
+    Object.defineProperty(window.navigator, 'clipboard', { value: { writeText }, configurable: true })
+    harness = await mountTree()
+    click(rowByName(harness.container, 'a.ts'), { ctrlKey: true })
+    click(rowByName(harness.container, 'b.ts'), { ctrlKey: true })
+    await act(async () => { barAction(harness.container, 'Copy paths').click() })
+    expect(writeText).toHaveBeenCalledWith('/tmp/a.ts\n/tmp/b.ts')
+  })
+
+  it('deletes the whole selection through one confirmation, sequentially', async () => {
+    harness = await mountTree()
+    click(rowByName(harness.container, 'a.ts'), { ctrlKey: true })
+    click(rowByName(harness.container, 'b.ts'), { ctrlKey: true })
+    act(() => { barAction(harness.container, 'Delete selected').click() })
+    const dialog = document.querySelector('[role="dialog"]')
+    expect(dialog?.textContent).toContain('Delete 2 selected items?')
+    const confirm = [...document.querySelectorAll<HTMLElement>('button')]
+      .find(el => el.textContent === 'Delete selected' && el.closest('[role="dialog"]') !== null)!
+    await act(async () => { confirm.click() })
+    expect(fsRemove.mock.calls.map(call => call[1])).toEqual(['/tmp/a.ts', '/tmp/b.ts'])
+    expect(selectionBar(harness.container)).toBeNull()
+  })
+
+  it('stops the batch at the first failure and reports it in the strip', async () => {
+    // The first path lands; the second refuses — the walk must stop there.
+    fsRemove
+      .mockImplementationOnce(async (_scope: unknown, path: string) => ({ path }))
+      .mockRejectedValueOnce(new Error('boom: refused'))
+    harness = await mountTree()
+    click(rowByName(harness.container, 'a.ts'), { ctrlKey: true })
+    click(rowByName(harness.container, 'b.ts'), { ctrlKey: true })
+    act(() => { barAction(harness.container, 'Delete selected').click() })
+    const confirm = [...document.querySelectorAll<HTMLElement>('button')]
+      .find(el => el.textContent === 'Delete selected' && el.closest('[role="dialog"]') !== null)!
+    await act(async () => { confirm.click() })
+    // Two attempts, in selection order, and nothing after the refusal.
+    expect(fsRemove.mock.calls.map(call => call[1])).toEqual(['/tmp/a.ts', '/tmp/b.ts'])
+    expect(harness.container.querySelector('[role="alert"]')?.textContent).toContain('boom: refused')
+    // The removed row left the selection; the refused one stays for a retry.
+    expect(selectedNames(harness.container)).toEqual(['b.ts'])
+  })
+})
diff --git a/tests/file-tree-new-folder.spec.tsx b/tests/file-tree-new-folder.spec.tsx
new file mode 100644
index 0000000..bb4f79b
--- /dev/null
+++ b/tests/file-tree-new-folder.spec.tsx
@@ -0,0 +1,253 @@
+/**
+ * FileTree "new folder": the directory rows (and the workspace root row)
+ * offer it in the context menu; choosing it inserts the inline editor at the
+ * TOP of that level (expanding a collapsed directory first), and the editor
+ * follows the rename contract — Enter commits through `api.fsMkdir` with the
+ * parent directory + single-segment name, Escape cancels, blur commits, an
+ * invalid name reports `newFolderInvalid` and never reaches the API, and a
+ * server failure lands in the dismissable strip.
+ */
+// @vitest-environment jsdom
+import { beforeAll, afterEach, describe, expect, it, vi } from 'vitest'
+import { createElement, useState, type ReactNode } from 'react'
+import { createRoot, type Root } from 'react-dom/client'
+import { act } from 'react-dom/test-utils'
+import { FileTree } from '../src/client/FileTree.tsx'
+import { createSidebarStore } from '../src/client/state.ts'
+
+import { setupReactAct } from './test-utils.ts'
+setupReactAct()
+
+// vitest 4.1.11+ follows the OS locale; pin en-US so menu copy is English.
+beforeAll(() => {
+  Object.defineProperty(window.navigator, 'language', { value: 'en-US', configurable: true })
+})
+
+const { fsMkdir, fsTree } = vi.hoisted(() => ({
+  fsMkdir: vi.fn(async (_scope: unknown, _path: string, name: string) => ({ path: `/tmp/${name}` })),
+  // `listingFor` is a hoisted function declaration, so the factory may
+  // reference it; it only runs when the mock is called (after module init).
+  fsTree: vi.fn(async (_scope: unknown, path: string) => listingFor(path)),
+}))
+
+vi.mock('../src/client/api.ts', () => ({
+  api: {
+    fsTree,
+    fsMkdir,
+    // The tree reads the shared git-status store; a non-repo answer keeps
+    // every row plain (this spec is about folder creation).
+    gitStatus: async () => ({ isRepo: false, entries: [] }),
+  },
+  downloadUrl: () => '/sidebar/file',
+  isOutsideWorkspaceMessage: () => false,
+}))
+
+const ROOT_ENTRIES = [
+  { name: 'sub', path: '/tmp/sub', isDir: true },
+  { name: 'a.ts', path: '/tmp/a.ts', isDir: false },
+]
+
+/** Per-directory listings: /tmp/sub must NOT list itself (a real host never
+ *  returns a directory inside its own listing). */
+function listingFor(path: string): { path: string; entries: typeof ROOT_ENTRIES; truncated: boolean } {
+  return {
+    path,
+    entries: path === '/tmp/sub' ? [{ name: 'inner.txt', path: '/tmp/sub/inner.txt', isDir: false }] : ROOT_ENTRIES,
+    truncated: false,
+  }
+}
+
+interface Harness {
+  container: HTMLDivElement
+  /** Directories the tree asked the caller to expand/collapse. */
+  toggled: string[]
+  unmount: () => void
+}
+
+/**
+ * The real caller owns the expansion set (EditorHost holds it in the store),
+ * so the harness does too: a toggle really expands the tree and loads the
+ * level beneath it.
+ */
+function mountTree(initialExpanded: string[] = []): Harness {
+  const container = document.createElement('div')
+  document.body.append(container)
+  const root: Root = createRoot(container)
+  const toggled: string[] = []
+  function Host(): ReactNode {
+    const [expanded, setExpanded] = useState<string[]>(initialExpanded)
+    return createElement(FileTree, {
+      sessionId: 's1',
+      cwd: '/tmp',
+      store: createSidebarStore(),
+      expanded,
+      revealed: [],
+      onToggle: (path: string) => {
+        toggled.push(path)
+        setExpanded(current => current.includes(path) ? current.filter(item => item !== path) : [...current, path])
+      },
+      onOpenFile: () => {},
+      onReferenceFile: () => {},
+      refreshTick: 0,
+      onUploadRequest: () => {},
+      busy: false,
+    })
+  }
+  act(() => { root.render(createElement(Host)) })
+  return {
+    container,
+    toggled,
+    unmount: () => { act(() => { root.unmount() }); container.remove() },
+  }
+}
+
+/** One tree row by its displayed name (the root row included). */
+function rowByName(container: HTMLElement, name: string): HTMLElement {
+  const row = [...container.querySelectorAll<HTMLElement>('[class*="explorerRow"]')]
+    .find(el => el.querySelector('[class*="explorerName"]')?.textContent === name)
+  if (row === undefined) throw new Error(`row not found: ${name}`)
+  return row
+}
+
+function openMenu(container: HTMLElement, name: string): void {
+  const event = new MouseEvent('contextmenu', { bubbles: true, cancelable: true, clientX: 20, clientY: 30 })
+  act(() => { rowByName(container, name).dispatchEvent(event) })
+}
+
+function menuLabels(): string[] {
+  return [...document.querySelectorAll<HTMLElement>('[role="menuitem"]')].map(el => el.textContent ?? '')
+}
+
+function clickMenuitem(label: string): void {
+  const item = [...document.querySelectorAll<HTMLElement>('[role="menuitem"]')]
+    .find(el => el.textContent === label)
+  if (item === undefined) throw new Error(`menuitem not found: ${label}`)
+  act(() => { item.click() })
+}
+
+/** Set a controlled input's value the React way (native setter + input). */
+function setNativeValue(el: HTMLInputElement, value: string): void {
+  const setter = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, 'value')?.set
+  if (setter === undefined) throw new Error('no native value setter')
+  setter.call(el, value)
+  el.dispatchEvent(new Event('input', { bubbles: true }))
+}
+
+function pressKey(el: HTMLElement, key: string): void {
+  el.dispatchEvent(new KeyboardEvent('keydown', { key, bubbles: true, cancelable: true }))
+}
+
+function editorInput(container: HTMLElement): HTMLInputElement {
+  const input = container.querySelector<HTMLInputElement>('input[class*="explorerRenameInput"]')
+  if (input === null) throw new Error('inline editor not rendered')
+  return input
+}
+
+/** The editor row's indent (depth * 22 + 6) — proof of WHICH level hosts it. */
+function editorIndent(container: HTMLElement): string {
+  return editorInput(container).closest<HTMLElement>('[class*="explorerRow"]')?.style.paddingLeft ?? ''
+}
+
+let harness: Harness
+afterEach(() => {
+  harness.unmount()
+  document.body.innerHTML = ''
+  fsMkdir.mockReset()
+  fsMkdir.mockImplementation(async (_scope: unknown, _path: string, name: string) => ({ path: `/tmp/${name}` }))
+  fsTree.mockReset()
+  fsTree.mockImplementation(async (_scope: unknown, path: string) => listingFor(path))
+})
+
+describe('FileTree new folder', () => {
+  it('offers the entry on directory rows (the root included, never on files)', async () => {
+    harness = mountTree()
+    await act(async () => {})
+    openMenu(harness.container, 'sub')
+    expect(menuLabels()).toContain('New folder')
+    openMenu(harness.container, 'tmp')
+    expect(menuLabels()).toContain('New folder')
+    openMenu(harness.container, 'a.ts')
+    expect(menuLabels()).not.toContain('New folder')
+  })
+
+  it('inserts the editor at the root level and commits through api.fsMkdir', async () => {
+    harness = mountTree()
+    await act(async () => {})
+    openMenu(harness.container, 'tmp')
+    clickMenuitem('New folder')
+    const input = editorInput(harness.container)
+    expect(input.placeholder).toBe('Folder name')
+    // The root level's rows sit at depth 1 (22 + 6); the editor replaces the
+    // level's first row.
+    expect(editorIndent(harness.container)).toBe('28px')
+    setNativeValue(input, 'newdir')
+    const listings = fsTree.mock.calls.length
+    await act(async () => { pressKey(input, 'Enter') })
+    expect(fsMkdir).toHaveBeenCalledWith({ sessionId: 's1', cwd: '/tmp' }, '/tmp', 'newdir')
+    expect(harness.container.querySelector('input[class*="explorerRenameInput"]')).toBeNull()
+    // The level was dropped and re-listed, so the new folder shows up.
+    expect(fsTree.mock.calls.length).toBeGreaterThan(listings)
+  })
+
+  it('expands a collapsed directory, edits at ITS level, and creates there', async () => {
+    harness = mountTree()
+    await act(async () => {})
+    openMenu(harness.container, 'sub')
+    clickMenuitem('New folder')
+    // The collapsed directory is expanded so its level can host the editor.
+    expect(harness.toggled).toEqual(['/tmp/sub'])
+    expect(editorIndent(harness.container)).toBe('50px')
+    setNativeValue(editorInput(harness.container), 'inner')
+    await act(async () => { pressKey(editorInput(harness.container), 'Enter') })
+    expect(fsMkdir).toHaveBeenCalledWith({ sessionId: 's1', cwd: '/tmp' }, '/tmp/sub', 'inner')
+  })
+
+  it('Escape cancels without touching the API', async () => {
+    harness = mountTree()
+    await act(async () => {})
+    openMenu(harness.container, 'tmp')
+    clickMenuitem('New folder')
+    const input = editorInput(harness.container)
+    setNativeValue(input, 'newdir')
+    await act(async () => { pressKey(input, 'Escape') })
+    expect(fsMkdir).not.toHaveBeenCalled()
+    expect(harness.container.querySelector('input[class*="explorerRenameInput"]')).toBeNull()
+  })
+
+  it('rejects an invalid name client-side with the strip, no API call', async () => {
+    harness = mountTree()
+    await act(async () => {})
+    openMenu(harness.container, 'tmp')
+    clickMenuitem('New folder')
+    const input = editorInput(harness.container)
+    setNativeValue(input, 'a/b')
+    await act(async () => { pressKey(input, 'Enter') })
+    expect(fsMkdir).not.toHaveBeenCalled()
+    expect(harness.container.querySelector('[role="alert"]')?.textContent).toContain('Invalid folder name')
+  })
+
+  it('lands a server refusal in the dismissable strip', async () => {
+    fsMkdir.mockRejectedValueOnce(new Error('boom: exists'))
+    harness = mountTree()
+    await act(async () => {})
+    openMenu(harness.container, 'tmp')
+    clickMenuitem('New folder')
+    const input = editorInput(harness.container)
+    setNativeValue(input, 'sub')
+    await act(async () => { pressKey(input, 'Enter') })
+    expect(fsMkdir).toHaveBeenCalledTimes(1)
+    expect(harness.container.querySelector('[role="alert"]')?.textContent).toContain('boom: exists')
+  })
+
+  it('commits on blur (the same contract the rename editor has)', async () => {
+    harness = mountTree()
+    await act(async () => {})
+    openMenu(harness.container, 'tmp')
+    clickMenuitem('New folder')
+    const input = editorInput(harness.container)
+    setNativeValue(input, 'blurred')
+    // React delegates onBlur from the native focusout event.
+    await act(async () => { input.dispatchEvent(new FocusEvent('focusout', { bubbles: true })) })
+    expect(fsMkdir).toHaveBeenCalledWith({ sessionId: 's1', cwd: '/tmp' }, '/tmp', 'blurred')
+  })
+})
diff --git a/tests/file-tree-open-in-app.spec.tsx b/tests/file-tree-open-in-app.spec.tsx
new file mode 100644
index 0000000..a8eb01e
--- /dev/null
+++ b/tests/file-tree-open-in-app.spec.tsx
@@ -0,0 +1,291 @@
+/**
+ * FileTree "open in app" menu (the host's own capability, replacing the
+ * plugin's removed open-with chain): a file row lists the host's registered
+ * applications — the default-application row first, then one row per app —
+ * followed by reveal-in-file-manager; a directory row lists the host's
+ * application catalogue plus reveal. Clicking a row hands the absolute path
+ * (plus the application id when one was chosen) to the injected handle, a
+ * listing that yields nothing degrades to one DISABLED row, a host that
+ * cannot open desktop paths hides the whole section, and a failure lands in
+ * the tree's error strip.
+ */
+// @vitest-environment jsdom
+import { beforeAll, afterEach, describe, expect, it, vi } from 'vitest'
+import { createElement } from 'react'
+import { createRoot, type Root } from 'react-dom/client'
+import { act } from 'react-dom/test-utils'
+import { FileTree } from '../src/client/FileTree.tsx'
+import { createOpenInApp, type OpenInApp, type OpenInAppEntry } from '../src/client/open-in-app.ts'
+import { createSidebarStore } from '../src/client/state.ts'
+
+import { setupReactAct } from './test-utils.ts'
+setupReactAct()
+
+// vitest 4.1.11+ follows the OS locale; pin en-US so menu copy is English.
+beforeAll(() => {
+  Object.defineProperty(window.navigator, 'language', { value: 'en-US', configurable: true })
+})
+
+vi.mock('../src/client/api.ts', () => ({
+  api: {
+    fsTree: async () => ({
+      path: '/tmp',
+      entries: [
+        { name: 'sub', path: '/tmp/sub', isDir: true },
+        { name: 'a.ts', path: '/tmp/a.ts', isDir: false },
+      ],
+      truncated: false,
+    }),
+    // The tree reads the shared git-status store; a non-repo answer keeps
+    // every row plain (this spec is about the open-in-app section).
+    gitStatus: async () => ({ isRepo: false, entries: [] }),
+  },
+  downloadUrl: () => '/sidebar/file',
+  isOutsideWorkspaceMessage: () => false,
+}))
+
+/** What the host reports for a file (the default entry first). */
+const FILE_APPS: readonly OpenInAppEntry[] = [
+  { id: 'textedit', name: 'TextEdit', icon: null, isDefault: true },
+  { id: 'vscode', name: 'VS Code', icon: 'data:image/svg+xml,%3Csvg/%3E', isDefault: false },
+]
+
+/** What the host reports for a directory (no default concept). */
+const DIRECTORY_APPS: readonly OpenInAppEntry[] = [
+  { id: 'vscode', name: 'VS Code', icon: null, isDefault: false },
+  { id: 'finder', name: 'Finder', icon: null, isDefault: false },
+]
+
+interface Handle {
+  openInApp: OpenInApp
+  open: ReturnType<typeof vi.fn>
+  reveal: ReturnType<typeof vi.fn>
+  fileApps: ReturnType<typeof vi.fn>
+  directoryApps: ReturnType<typeof vi.fn>
+}
+
+function makeHandle(overrides: Partial<OpenInApp> = {}): Handle {
+  const open = vi.fn(async () => true)
+  const reveal = vi.fn(async () => true)
+  const fileApps = vi.fn(async () => FILE_APPS)
+  const directoryApps = vi.fn(async () => DIRECTORY_APPS)
+  const openInApp: OpenInApp = {
+    available: () => true,
+    probe: async () => true,
+    directoryApps,
+    fileApps,
+    open,
+    reveal,
+    ...overrides,
+  }
+  return { openInApp, open, reveal, fileApps, directoryApps }
+}
+
+interface Harness {
+  container: HTMLDivElement
+  unmount: () => void
+}
+
+async function mountTree(handle?: Handle): Promise<Harness> {
+  const container = document.createElement('div')
+  document.body.append(container)
+  const root: Root = createRoot(container)
+  await act(async () => {
+    root.render(createElement(FileTree, {
+      sessionId: 's1',
+      cwd: '/tmp',
+      store: createSidebarStore(),
+      expanded: [],
+      revealed: [],
+      onToggle: () => {},
+      onOpenFile: () => {},
+      onOpenFileNewTab: () => {},
+      onOpenFileSide: () => {},
+      ...(handle !== undefined ? { openInApp: handle.openInApp } : {}),
+      onReferenceFile: () => {},
+      refreshTick: 0,
+      onUploadRequest: () => {},
+      busy: false,
+    }))
+    // Settle the async app listing the row menu triggers.
+    await Promise.resolve()
+    await Promise.resolve()
+  })
+  return {
+    container,
+    unmount: () => { act(() => { root.unmount() }); container.remove() },
+  }
+}
+
+/** The row whose label text matches (rows are role="button" divs). */
+function rowByName(container: HTMLElement, name: string): HTMLElement {
+  const row = [...container.querySelectorAll<HTMLElement>('[role="button"]')]
+    .find(el => el.querySelector('[class*="explorerName"]')?.textContent === name)
+  if (row === undefined) throw new Error(`row not found: ${name}`)
+  return row
+}
+
+/** Open one row's context menu and settle the async app listing. */
+async function openMenu(container: HTMLElement, name: string): Promise<void> {
+  await act(async () => {
+    rowByName(container, name).dispatchEvent(
+      new MouseEvent('contextmenu', { bubbles: true, cancelable: true, clientX: 20, clientY: 30 }),
+    )
+    await Promise.resolve()
+    await Promise.resolve()
+  })
+}
+
+function menuItems(): HTMLElement[] {
+  return [...document.querySelectorAll<HTMLElement>('[role="menuitem"]')]
+}
+
+function menuLabels(): string[] {
+  return menuItems().map(item => item.textContent ?? '')
+}
+
+function clickMenuitem(label: string): void {
+  const item = menuItems().find(el => el.textContent === label)
+  if (item === undefined) throw new Error(`menuitem not found: ${label}`)
+  act(() => { item.click() })
+}
+
+let harness: Harness
+afterEach(() => {
+  harness.unmount()
+  document.body.innerHTML = ''
+})
+
+describe('FileTree open-in-app menu', () => {
+  it('lists the default application, the registered apps and reveal for a file row', async () => {
+    const handle = makeHandle()
+    harness = await mountTree(handle)
+    await openMenu(harness.container, 'a.ts')
+    expect(handle.fileApps).toHaveBeenCalledWith('/tmp/a.ts')
+    // The section heading is a non-interactive label row.
+    expect(document.body.textContent).toContain('Open with')
+    expect(menuLabels()).toContain('Open with default app')
+    expect(menuLabels()).toContain('VS Code')
+    expect(menuLabels()).toContain('Reveal in File Manager')
+    // The default row's glyph is the default app's own icon slot.
+    expect(menuItems().some(item => item.querySelector('img[class*="explorerAppIcon"]') !== null)).toBe(true)
+  })
+
+  it('hands the path (and the chosen application id) to the open handle', async () => {
+    const handle = makeHandle()
+    harness = await mountTree(handle)
+    await openMenu(harness.container, 'a.ts')
+    clickMenuitem('Open with default app')
+    expect(handle.open).toHaveBeenCalledWith('/tmp/a.ts')
+    // Selecting closes the menu entirely.
+    expect(menuItems()).toHaveLength(0)
+    await openMenu(harness.container, 'a.ts')
+    clickMenuitem('VS Code')
+    expect(handle.open).toHaveBeenCalledWith('/tmp/a.ts', 'vscode')
+    await openMenu(harness.container, 'a.ts')
+    clickMenuitem('Reveal in File Manager')
+    expect(handle.reveal).toHaveBeenCalledWith('/tmp/a.ts')
+  })
+
+  it('lists the host catalogue for a directory row, with no default row', async () => {
+    const handle = makeHandle()
+    harness = await mountTree(handle)
+    await openMenu(harness.container, 'sub')
+    expect(handle.directoryApps).toHaveBeenCalled()
+    expect(handle.fileApps).not.toHaveBeenCalled()
+    expect(menuLabels()).not.toContain('Open with default app')
+    expect(menuLabels()).toEqual(expect.arrayContaining(['VS Code', 'Finder', 'Reveal in File Manager']))
+    clickMenuitem('Finder')
+    expect(handle.open).toHaveBeenCalledWith('/tmp/sub', 'finder')
+  })
+
+  it('degrades to one DISABLED row when the host knows no application', async () => {
+    const handle = makeHandle({ fileApps: async () => [] })
+    harness = await mountTree(handle)
+    await openMenu(harness.container, 'a.ts')
+    const empty = menuItems().find(item => item.textContent === 'No application can open it')
+    expect(empty).toBeDefined()
+    expect((empty as HTMLButtonElement).disabled).toBe(true)
+  })
+
+  it('reports a failed hand-off in the error strip', async () => {
+    const handle = makeHandle({ fileApps: async () => null })
+    harness = await mountTree(handle)
+    await openMenu(harness.container, 'a.ts')
+    expect(harness.container.querySelector('[role="alert"]')?.textContent).toContain('Could not open: /tmp/a.ts')
+  })
+
+  it('reports a hand-off the host refused (open resolving false)', async () => {
+    const handle = makeHandle()
+    handle.open.mockResolvedValue(false)
+    harness = await mountTree(handle)
+    await openMenu(harness.container, 'a.ts')
+    await act(async () => { clickMenuitem('VS Code'); await Promise.resolve(); await Promise.resolve() })
+    expect(harness.container.querySelector('[role="alert"]')?.textContent).toContain('Could not open: /tmp/a.ts')
+  })
+
+  it('hides the whole section when the host cannot open desktop paths', async () => {
+    const handle = makeHandle({ available: () => false })
+    harness = await mountTree(handle)
+    await openMenu(harness.container, 'a.ts')
+    expect(handle.fileApps).not.toHaveBeenCalled()
+    expect(menuLabels()).not.toContain('Reveal in File Manager')
+    expect(document.body.textContent).not.toContain('Open with')
+  })
+
+  it('hides the section when no handle was injected at all', async () => {
+    harness = await mountTree()
+    await openMenu(harness.container, 'a.ts')
+    expect(menuLabels()).not.toContain('Reveal in File Manager')
+    expect(document.body.textContent).not.toContain('Open with')
+  })
+
+  it('probes the tri-state handle before deciding the section is unavailable', async () => {
+    // The REAL adapter starts with `available() === null` and only publishes
+    // an answer when `probe()` runs: a tree that reads the getter without
+    // probing would hide the section forever. This case pins that lifecycle
+    // with a handle that mimics it exactly.
+    let probed = false
+    let probes = 0
+    const handle = makeHandle({
+      available: () => (probed ? true : null),
+      probe: async () => { probed = true; probes += 1; return true },
+    })
+    harness = await mountTree(handle)
+    expect(handle.fileApps).not.toHaveBeenCalled()
+    await openMenu(harness.container, 'a.ts')
+    expect(handle.fileApps).toHaveBeenCalledWith('/tmp/a.ts')
+    expect(menuLabels()).toContain('Open with default app')
+    expect(menuLabels()).toContain('VS Code')
+    expect(probes).toBe(1)
+  })
+
+  it('drives the real host adapter end to end: probe, list, open, reveal', async () => {
+    // No hand-written handle here — the production adapter over a fake Host
+    // Remote, so the wiring (probe → fileApps → open/reveal) cannot drift.
+    const calls = { canOpen: 0, applications: [] as string[], open: [] as { path: string; application?: string }[] }
+    const openInApp = createOpenInApp({
+      get: (name) => name !== 'remote' ? undefined : {
+        session: {
+          canOpenWorkspacePath: async () => { calls.canOpen += 1; return { ok: true, value: true } },
+          workspacePathApplications: async (request: { path: string }) => {
+            calls.applications.push(request.path)
+            return { ok: true, value: [{ id: 'textedit', name: 'TextEdit', default: true, icon: null }] }
+          },
+          openWorkspacePath: async (request: { path: string; application?: string }) => {
+            calls.open.push({ path: request.path, ...(request.application !== undefined ? { application: request.application } : {}) })
+            return { ok: true }
+          },
+        },
+      },
+    })
+    expect(openInApp.available()).toBeNull()
+    harness = await mountTree({ openInApp } as Handle)
+    await openMenu(harness.container, 'a.ts')
+    expect(calls.canOpen).toBe(1)
+    expect(calls.applications).toEqual(['/tmp/a.ts'])
+    expect(menuLabels()).toContain('Open with default app')
+    await act(async () => { clickMenuitem('Open with default app'); await Promise.resolve() })
+    expect(calls.open).toEqual([{ path: '/tmp/a.ts' }])
+  })
+})
diff --git a/tests/file-tree-open-with.spec.tsx b/tests/file-tree-open-with.spec.tsx
deleted file mode 100644
index 97fba71..0000000
--- a/tests/file-tree-open-with.spec.tsx
+++ /dev/null
@@ -1,248 +0,0 @@
-/**
- * FileTree "open with" context menu: a file row's right-click menu gains the
- * pinned direct rows and the parent submenu row; the submenu lists every
- * resolved target with a per-row pushpin, pinning never selects/closes the
- * menu, and selecting a child invokes the caller's open handler with the
- * row's absolute path. When the caller wires nothing, the section is absent.
- */
-// @vitest-environment jsdom
-import { beforeAll, afterEach, describe, expect, it, vi } from 'vitest'
-import { createElement } from 'react'
-import { createRoot, type Root } from 'react-dom/client'
-import { act } from 'react-dom/test-utils'
-import { FileTree } from '../src/client/FileTree.tsx'
-import { createSidebarStore } from '../src/client/state.ts'
-import type { OpenWithTarget } from '../src/client/open-with.ts'
-
-// The act() environment flag (React 18.2 reads it before flushing effects).
-import { setupReactAct } from './test-utils.ts'
-setupReactAct()
-
-// vitest 4.1.11+ follows the OS locale; pin en-US so menu copy is English.
-beforeAll(() => {
-  Object.defineProperty(window.navigator, 'language', { value: 'en-US', configurable: true })
-})
-
-vi.mock('../src/client/api.ts', () => ({
-  api: {
-    fsTree: async () => ({
-      entries: [{ name: 'a.ts', path: '/tmp/a.ts', isDir: false }],
-    }),
-  },
-  downloadUrl: () => '/sidebar/file',
-}))
-
-/** The resolved target list a caller (EditorHost) would hand FileTree. */
-const targets: OpenWithTarget[] = [
-  { id: 'explorer', nameKey: 'openWithExplorer', name: '', kind: 'reveal', isVscodeFamily: false, localOnly: true },
-  { id: 'vscode', nameKey: 'openWithVscode', name: '', kind: 'url', urlTemplate: 'vscode://file/{path}', isVscodeFamily: true, localOnly: false },
-  { id: 'cursor', nameKey: 'openWithCursor', name: '', kind: 'url', urlTemplate: 'cursor://file/{path}', isVscodeFamily: true, localOnly: false },
-  { id: 'zed', nameKey: 'openWithZed', name: '', kind: 'url', urlTemplate: 'zed://file/{path}', isVscodeFamily: false, localOnly: true },
-  { id: 'custom:w', name: 'Windsurf', kind: 'url', urlTemplate: 'windsurf://file/{path}', isVscodeFamily: false, localOnly: false },
-]
-
-interface Harness {
-  container: HTMLDivElement
-  onOpenWith: ReturnType<typeof vi.fn>
-  onToggleOpenWithPin: ReturnType<typeof vi.fn>
-  unmount: () => void
-}
-
-async function mountTree(overrides: {
-  openWithTargets?: OpenWithTarget[]
-  openWithPinned?: string[]
-  openWithSsh?: boolean
-} = {}): Promise<Harness> {
-  const container = document.createElement('div')
-  document.body.append(container)
-  const root: Root = createRoot(container)
-  const onOpenWith = vi.fn()
-  const onToggleOpenWithPin = vi.fn()
-  // Property-presence semantics: an explicit `openWithTargets: undefined`
-  // must reach FileTree (the section hides) instead of falling back.
-  const has = (key: 'openWithTargets' | 'openWithPinned' | 'openWithSsh'): boolean =>
-    Object.prototype.hasOwnProperty.call(overrides, key)
-  await act(async () => {
-    root.render(createElement(FileTree, {
-      sessionId: 's1',
-      cwd: '/tmp',
-      store: createSidebarStore(),
-      expanded: [],
-      revealed: [],
-      onToggle: () => {},
-      onOpenFile: () => {},
-      onOpenFileNewTab: () => {},
-      onOpenFileSide: () => {},
-      openWithTargets: has('openWithTargets') ? overrides.openWithTargets : targets,
-      openWithPinned: has('openWithPinned') ? overrides.openWithPinned : ['vscode'],
-      openWithSsh: has('openWithSsh') ? overrides.openWithSsh : false,
-      onOpenWith,
-      onToggleOpenWithPin,
-      onReferenceFile: () => {},
-      refreshTick: 0,
-      onUploadRequest: () => {},
-      busy: false,
-    }))
-  })
-  return {
-    container,
-    onOpenWith,
-    onToggleOpenWithPin,
-    unmount: () => { act(() => { root.unmount() }) },
-  }
-}
-
-/** The file row of the one-level tree (role="button" with the name span). */
-function fileRow(container: HTMLDivElement): HTMLElement {
-  const row = [...container.querySelectorAll<HTMLElement>('[role="button"]')]
-    .find(el => el.querySelector('[class*="explorerName"]')?.textContent === 'a.ts')
-  if (row === undefined) throw new Error('file row not found')
-  return row
-}
-
-/** Open the row's context menu at a fixed cursor position. */
-function openMenu(container: HTMLDivElement): void {
-  const event = new MouseEvent('contextmenu', { bubbles: true, cancelable: true, clientX: 20, clientY: 30 })
-  act(() => { fileRow(container).dispatchEvent(event) })
-}
-
-describe('FileTree open-with menu', () => {
-  let harness: Harness
-  afterEach(() => {
-    harness.unmount()
-    document.body.innerHTML = ''
-  })
-
-  it('renders the pinned direct row and the submenu parent for a file row', async () => {
-    harness = await mountTree()
-    openMenu(harness.container)
-    const items = [...document.querySelectorAll<HTMLElement>('[role="menuitem"]')]
-    // The pinned VS Code sits at the top level (before the submenu parent).
-    expect(items.map(item => item.textContent?.trim())).toContain('VS Code')
-    const parent = items.find(item => item.getAttribute('aria-haspopup') === 'menu')
-    expect(parent?.textContent).toContain('Open with')
-    // The submenu parent carries the trailing chevron affordance (the
-    // primitives Menu renders no arrow of its own), right-aligned inside a
-    // full-width label row — the same structure the submenu children use.
-    expect(parent?.querySelector('[class*="openWithChevron"]')).not.toBeNull()
-    expect(parent?.querySelector('[class*="openWithLabel"]')).not.toBeNull()
-  })
-
-  it('opens the submenu on click and lists every target with pin toggles', async () => {
-    harness = await mountTree()
-    openMenu(harness.container)
-    const parent = [...document.querySelectorAll<HTMLElement>('[role="menuitem"]')]
-      .find(item => item.getAttribute('aria-haspopup') === 'menu')
-    expect(parent).toBeDefined()
-    act(() => { parent!.click() })
-    // Sub child rows = menuitems inside the nested menu.
-    const children = [...document.querySelectorAll<HTMLElement>('[role="menu"] [role="menu"] [role="menuitem"]')]
-    expect(children.map(item => item.textContent?.trim())).toEqual([
-      'File Manager', 'VS Code', 'Cursor', 'Zed', 'Windsurf',
-    ])
-    expect(children.every(item => item.querySelector('[class*="openWithPin"]') !== null)).toBe(true)
-    // Pinned state is announced per row (and swaps the pushpin glyph).
-    const vscodeRow = children.find(item => item.textContent?.trim() === 'VS Code')
-    const cursorRow0 = children.find(item => item.textContent?.trim() === 'Cursor')
-    expect(vscodeRow?.querySelector('[aria-label="Unpin"]')).not.toBeNull()
-    expect(cursorRow0?.querySelector('[aria-label="Pin to menu"]')).not.toBeNull()
-  })
-
-  it('pin click toggles without selecting the row or closing the menu', async () => {
-    harness = await mountTree()
-    openMenu(harness.container)
-    const parent = [...document.querySelectorAll<HTMLElement>('[role="menuitem"]')]
-      .find(item => item.getAttribute('aria-haspopup') === 'menu')
-    act(() => { parent!.click() })
-    const cursorRow = [...document.querySelectorAll<HTMLElement>('[role="menu"] [role="menu"] [role="menuitem"]')]
-      .find(item => item.textContent?.trim() === 'Cursor')
-    const pin = cursorRow!.querySelector<HTMLElement>('[class*="openWithPin"]')
-    expect(pin).not.toBeNull()
-    act(() => { pin!.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true })) })
-    expect(harness.onToggleOpenWithPin).toHaveBeenCalledWith('cursor')
-    expect(harness.onOpenWith).not.toHaveBeenCalled()
-    // The menu (and the submenu) stayed open.
-    expect(document.querySelector('[role="menu"] [role="menu"]')).not.toBeNull()
-  })
-
-  it('selecting a submenu child invokes onOpenWith with the row path and closes the menu', async () => {
-    harness = await mountTree()
-    openMenu(harness.container)
-    const parent = [...document.querySelectorAll<HTMLElement>('[role="menuitem"]')]
-      .find(item => item.getAttribute('aria-haspopup') === 'menu')
-    act(() => { parent!.click() })
-    const zedRow = [...document.querySelectorAll<HTMLElement>('[role="menu"] [role="menu"] [role="menuitem"]')]
-      .find(item => item.textContent?.trim() === 'Zed')
-    act(() => { zedRow!.click() })
-    expect(harness.onOpenWith).toHaveBeenCalledWith('zed', '/tmp/a.ts')
-    // Selecting closes the row menu entirely.
-    expect(document.querySelector('[role="menu"] [role="menu"]')).toBeNull()
-    expect(document.querySelector('[role="menuitem"]')).toBeNull()
-  })
-
-  it('appends the SSH hint to VSCode-family labels in remote mode', async () => {
-    harness = await mountTree({
-      openWithSsh: true,
-      openWithTargets: targets.filter(target => !target.localOnly),
-      openWithPinned: [],
-    })
-    openMenu(harness.container)
-    const parent = [...document.querySelectorAll<HTMLElement>('[role="menuitem"]')]
-      .find(item => item.getAttribute('aria-haspopup') === 'menu')
-    act(() => { parent!.click() })
-    const children = [...document.querySelectorAll<HTMLElement>('[role="menu"] [role="menu"] [role="menuitem"]')]
-    expect(children.map(item => item.textContent?.trim())).toEqual([
-      'VS Code (SSH)', 'Cursor (SSH)', 'Windsurf (SSH)',
-    ])
-  })
-
-  it('hides the whole section when the caller wires no targets', async () => {
-    harness = await mountTree({ openWithTargets: undefined })
-    openMenu(harness.container)
-    const items = [...document.querySelectorAll<HTMLElement>('[role="menuitem"]')]
-    expect(items.some(item => item.textContent?.includes('Open with'))).toBe(false)
-    expect(items.some(item => item.getAttribute('aria-haspopup') === 'menu')).toBe(false)
-  })
-})
-
-describe('FileTree open-with menu flip geometry (submenu clamping)', () => {
-  const ATTR = 'data-dsh-sidebar-submenu'
-
-  let harness: Harness
-  afterEach(() => {
-    harness.unmount()
-    document.body.innerHTML = ''
-    document.body.removeAttribute(ATTR)
-  })
-
-  it('publishes "down" for a top-of-tree opening and clears on selection', async () => {
-    harness = await mountTree()
-    // openMenu() right-clicks at (20, 30) — the upper half, plenty of right
-    // room in jsdom's default viewport.
-    openMenu(harness.container)
-    expect(document.body.getAttribute(ATTR)).toBe('down')
-    const parent = [...document.querySelectorAll<HTMLElement>('[role="menuitem"]')]
-      .find(item => item.getAttribute('aria-haspopup') === 'menu')
-    act(() => { parent!.click() })
-    const zedRow = [...document.querySelectorAll<HTMLElement>('[role="menu"] [role="menu"] [role="menuitem"]')]
-      .find(item => item.textContent?.trim() === 'Zed')
-    act(() => { zedRow!.click() })
-    expect(document.querySelector('[role="menuitem"]')).toBeNull()
-    expect(document.body.hasAttribute(ATTR)).toBe(false)
-  })
-
-  it('adds "left" when the cursor sits within the right-hand submenu room', async () => {
-    harness = await mountTree()
-    const nearRight = new MouseEvent('contextmenu', { bubbles: true, cancelable: true, clientX: window.innerWidth - 10, clientY: 30 })
-    act(() => { fileRow(harness.container).dispatchEvent(nearRight) })
-    expect(document.body.getAttribute(ATTR)).toBe('down left')
-  })
-
-  it('clears the attribute on unmount with the menu still open', async () => {
-    harness = await mountTree()
-    openMenu(harness.container)
-    expect(document.body.getAttribute(ATTR)).toBe('down')
-    harness.unmount()
-    expect(document.body.hasAttribute(ATTR)).toBe(false)
-  })
-})
diff --git a/tests/file-tree-rename-delete.spec.tsx b/tests/file-tree-rename-delete.spec.tsx
index 8d29687..57df5b6 100644
--- a/tests/file-tree-rename-delete.spec.tsx
+++ b/tests/file-tree-rename-delete.spec.tsx
@@ -38,6 +38,9 @@ vi.mock('../src/client/api.ts', () => ({
     }),
     fsRename,
     fsRemove,
+    // The tree reads the shared git-status store; a non-repo answer keeps
+    // every row plain (this spec is about rename/delete).
+    gitStatus: async () => ({ isRepo: false, entries: [] }),
   },
   downloadUrl: () => '/sidebar/file',
   isOutsideWorkspaceMessage: () => false,
diff --git a/tests/file-tree-reveal-scroll.spec.tsx b/tests/file-tree-reveal-scroll.spec.tsx
index 0d21cab..a4eed7e 100644
--- a/tests/file-tree-reveal-scroll.spec.tsx
+++ b/tests/file-tree-reveal-scroll.spec.tsx
@@ -34,6 +34,9 @@ vi.mock('../src/client/api.ts', () => ({
         { name: 'a.ts', path: '/tmp/a.ts', isDir: false },
       ],
     }),
+    // The tree reads the shared git-status store; a non-repo answer keeps
+    // every row plain (this spec is about the reveal scroll).
+    gitStatus: async () => ({ isRepo: false, entries: [] }),
   },
   downloadUrl: () => '/sidebar/file',
 }))
diff --git a/tests/file-tree-row-memo.spec.tsx b/tests/file-tree-row-memo.spec.tsx
new file mode 100644
index 0000000..658138c
--- /dev/null
+++ b/tests/file-tree-row-memo.spec.tsx
@@ -0,0 +1,134 @@
+/**
+ * FileTree row memoization (the tree's performance contract): rows are
+ * `React.memo` components fed stable callbacks and per-row booleans, so an
+ * interaction that touches ONE row must re-render that row only — not the
+ * whole tree. The evidence is the icon resolver: it runs inside the row
+ * component, so counting its calls counts the rows that re-rendered.
+ */
+// @vitest-environment jsdom
+import { beforeAll, afterEach, describe, expect, it, vi } from 'vitest'
+import { createElement } from 'react'
+import { createRoot, type Root } from 'react-dom/client'
+import { act } from 'react-dom/test-utils'
+import { FileTree } from '../src/client/FileTree.tsx'
+import type { BetterSidebarService } from '../src/client/service.ts'
+import { createSidebarStore } from '../src/client/state.ts'
+
+import { setupReactAct } from './test-utils.ts'
+setupReactAct()
+
+// vitest 4.1.11+ follows the OS locale; pin en-US so any copy is English.
+beforeAll(() => {
+  Object.defineProperty(window.navigator, 'language', { value: 'en-US', configurable: true })
+})
+
+vi.mock('../src/client/api.ts', () => ({
+  api: {
+    fsTree: async () => ({
+      path: '/tmp',
+      entries: [
+        { name: 'sub', path: '/tmp/sub', isDir: true },
+        { name: 'a.ts', path: '/tmp/a.ts', isDir: false },
+        { name: 'b.ts', path: '/tmp/b.ts', isDir: false },
+        { name: 'c.ts', path: '/tmp/c.ts', isDir: false },
+      ],
+      truncated: false,
+    }),
+    // The tree reads the shared git-status store; a non-repo answer keeps
+    // every row plain (its arrival must not defeat the memo bail-out either).
+    gitStatus: async () => ({ isRepo: false, entries: [] }),
+  },
+  downloadUrl: () => '/sidebar/file',
+  isOutsideWorkspaceMessage: () => false,
+}))
+
+/** The icon resolutions per render: one per row that actually re-rendered. */
+const fileIcons: string[] = []
+const folderIcons: string[] = []
+
+/** A minimal registry service: the counters ARE the re-render probe. */
+const service = {
+  subscribe: () => () => {},
+  fileIcon: (path: string) => { fileIcons.push(path); return null },
+  folderIcon: (path: string) => { folderIcons.push(path); return null },
+} as unknown as BetterSidebarService
+
+interface Harness {
+  container: HTMLDivElement
+  unmount: () => void
+}
+
+async function mountTree(): Promise<Harness> {
+  const container = document.createElement('div')
+  document.body.append(container)
+  const root: Root = createRoot(container)
+  await act(async () => {
+    root.render(createElement(FileTree, {
+      sessionId: 'memo-spec',
+      cwd: '/tmp',
+      store: createSidebarStore(),
+      expanded: [],
+      revealed: [],
+      onToggle: () => {},
+      onOpenFile: () => {},
+      onReferenceFile: () => {},
+      refreshTick: 0,
+      onUploadRequest: () => {},
+      busy: false,
+      service,
+    }))
+    await Promise.resolve()
+    await Promise.resolve()
+  })
+  return {
+    container,
+    unmount: () => { act(() => { root.unmount() }); container.remove() },
+  }
+}
+
+/** One tree row by its displayed name. */
+function rowByName(container: HTMLElement, name: string): HTMLElement {
+  const row = [...container.querySelectorAll<HTMLElement>('[role="button"]')]
+    .find(el => el.querySelector('[class*="explorerName"]')?.textContent === name)
+  if (row === undefined) throw new Error(`row not found: ${name}`)
+  return row
+}
+
+function fireDragOver(el: Element): void {
+  const event = new Event('dragover', { bubbles: true, cancelable: true })
+  Object.defineProperty(event, 'dataTransfer', { value: { types: ['Files'], dropEffect: '' } })
+  act(() => { el.dispatchEvent(event) })
+}
+
+let harness: Harness
+afterEach(() => {
+  harness.unmount()
+  document.body.innerHTML = ''
+  fileIcons.length = 0
+  folderIcons.length = 0
+})
+
+describe('FileTree row memoization', () => {
+  it('re-renders only the toggled row on a Ctrl+click selection change', async () => {
+    harness = await mountTree()
+    fileIcons.length = 0
+    act(() => {
+      rowByName(harness.container, 'a.ts')
+        .dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true, ctrlKey: true }))
+    })
+    // The other three file rows kept their last render (memo bailed out).
+    expect(fileIcons).toEqual(['/tmp/a.ts'])
+  })
+
+  it('re-renders only the hovered directory row while a drag retargets', async () => {
+    harness = await mountTree()
+    folderIcons.length = 0
+    fileIcons.length = 0
+    fireDragOver(rowByName(harness.container, 'sub'))
+    // Every parent render resolves the ROOT row's icon; the memoized dir row
+    // resolves its own exactly once (its unhovered render was cached), and
+    // the file rows (whose drop target is the untouched /tmp) never re-render.
+    expect(folderIcons.filter(path => path === '/tmp/sub')).toEqual(['/tmp/sub'])
+    expect(fileIcons).toEqual([])
+  })
+})
diff --git a/tests/file-tree-search-persist.spec.tsx b/tests/file-tree-search-persist.spec.tsx
new file mode 100644
index 0000000..e89a990
--- /dev/null
+++ b/tests/file-tree-search-persist.spec.tsx
@@ -0,0 +1,190 @@
+/**
+ * The files panel's search surface and level-cache life-cycle:
+ *
+ * - Typing a query parks the tree (`hidden`) instead of unmounting it, so
+ *   clearing the box restores the SAME level cache — `fs.tree` is not called
+ *   again (the old conditional render dropped the tree and refetched the
+ *   whole visible set on every query change).
+ * - The refresh affordance wipes the cache and reloads concurrently, and a
+ *   response from the previous generation is DROPPED even when it lands last.
+ * - A level the host truncated says so instead of silently showing a partial
+ *   directory.
+ */
+// @vitest-environment jsdom
+import { beforeAll, afterEach, describe, expect, it, vi } from 'vitest'
+import { createElement } from 'react'
+import { createRoot, type Root } from 'react-dom/client'
+import { act } from 'react-dom/test-utils'
+import { createSidebarStore } from '../src/client/state.ts'
+import { TreePanel } from '../src/client/TreePanel.tsx'
+
+import { setupReactAct } from './test-utils.ts'
+setupReactAct()
+
+// vitest 4.1.11+ follows the OS locale; pin en-US so the panel's copy is English.
+beforeAll(() => {
+  Object.defineProperty(window.navigator, 'language', { value: 'en-US', configurable: true })
+})
+
+interface Listing {
+  path: string
+  entries: { name: string; path: string; isDir: boolean }[]
+  truncated: boolean
+}
+
+/** The default host answer: one file at /tmp. */
+function defaultListing(path: string): Listing {
+  return { path, entries: [{ name: 'a.ts', path: '/tmp/a.ts', isDir: false }], truncated: false }
+}
+
+const { fsTree, fsSearch } = vi.hoisted(() => ({
+  fsTree: vi.fn(async (_scope: unknown, path: string) => defaultListing(path)),
+  fsSearch: vi.fn(async () => ({ matches: ['a.ts'], truncated: false })),
+}))
+
+vi.mock('../src/client/api.ts', () => ({
+  api: {
+    fsTree,
+    fsSearch,
+    // The tree reads the shared git-status store; a non-repo answer keeps
+    // every row plain.
+    gitStatus: async () => ({ isRepo: false, entries: [] }),
+  },
+  downloadUrl: () => '/sidebar/file',
+  isOutsideWorkspaceMessage: () => false,
+}))
+
+interface Harness {
+  container: HTMLDivElement
+  unmount: () => void
+}
+
+function mountPanel(): Harness {
+  const container = document.createElement('div')
+  document.body.append(container)
+  const root: Root = createRoot(container)
+  act(() => {
+    root.render(createElement(TreePanel, {
+      sessionId: 's1',
+      cwd: '/tmp',
+      store: createSidebarStore(),
+      expanded: [],
+      revealed: [],
+      onToggle: () => {},
+      onOpenFile: () => {},
+      onReferenceFile: () => {},
+    }))
+  })
+  return {
+    container,
+    unmount: () => { act(() => { root.unmount() }); container.remove() },
+  }
+}
+
+/**
+ * The tree surface: the body that carries row-name spans (the search results
+ * panel is a body too, but its rows are plain buttons with no name span).
+ * Finding it while parked is itself the "still mounted" probe.
+ */
+function treeBody(container: HTMLElement): HTMLElement {
+  const body = [...container.querySelectorAll<HTMLElement>('div[class*="explorerBody"]')]
+    .find(el => el.querySelector('[class*="explorerName"]') !== null)
+  if (body === undefined) throw new Error('tree body not mounted')
+  return body
+}
+
+function resultsBody(container: HTMLElement): HTMLElement {
+  const tree = treeBody(container)
+  const body = [...container.querySelectorAll<HTMLElement>('div[class*="explorerBody"]')]
+    .find(el => el !== tree)
+  if (body === undefined) throw new Error('results body not mounted')
+  return body
+}
+
+/** Type a query the React way and let the 300ms debounce elapse. */
+async function search(container: HTMLElement, query: string): Promise<void> {
+  const input = container.querySelector<HTMLInputElement>('input[class*="editorSearchInput"]')!
+  const setter = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, 'value')!.set!
+  await act(async () => {
+    setter.call(input, query)
+    input.dispatchEvent(new Event('input', { bubbles: true }))
+  })
+  await act(async () => { await new Promise<void>(resolve => { window.setTimeout(resolve, 350) }) })
+}
+
+let harness: Harness
+afterEach(() => {
+  harness.unmount()
+  document.body.innerHTML = ''
+  fsTree.mockReset()
+  fsTree.mockImplementation(async (_scope: unknown, path: string) => defaultListing(path))
+  fsSearch.mockClear()
+})
+
+describe('TreePanel search keeps the tree mounted', () => {
+  it('parks the tree instead of unmounting it, so clearing the query keeps the level cache', async () => {
+    harness = mountPanel()
+    await act(async () => {})
+    expect(fsTree).toHaveBeenCalledTimes(1)
+    expect(treeBody(harness.container).hasAttribute('hidden')).toBe(false)
+    expect(harness.container.textContent).toContain('a.ts')
+
+    await search(harness.container, 'a')
+    expect(fsSearch).toHaveBeenCalledTimes(1)
+    // The tree is still in the document — just parked.
+    expect(treeBody(harness.container).hasAttribute('hidden')).toBe(true)
+    expect(resultsBody(harness.container).hasAttribute('hidden')).toBe(false)
+    expect(resultsBody(harness.container).textContent).toContain('a.ts')
+
+    await search(harness.container, '')
+    expect(treeBody(harness.container).hasAttribute('hidden')).toBe(false)
+    expect(resultsBody(harness.container).hasAttribute('hidden')).toBe(true)
+    // No second listing: the cache (and the expansion state) survived.
+    expect(fsTree).toHaveBeenCalledTimes(1)
+  })
+})
+
+describe('TreePanel refresh and truncated levels', () => {
+  it('drops a level response that lands after the cache was wiped', async () => {
+    // The FIRST listing never settles until the test resolves it; the refresh
+    // click starts the second one, which answers immediately.
+    let resolveStale: (listing: Listing) => void = () => {}
+    fsTree.mockImplementationOnce(async () => await new Promise<Listing>(resolve => { resolveStale = resolve }))
+    harness = mountPanel()
+    await act(async () => {})
+    // The pending level shows nothing yet (its rows are not known).
+    expect(harness.container.textContent).not.toContain('a.ts')
+
+    // Manual refresh: cache wiped, new generation, concurrent re-list.
+    const refresh = harness.container.querySelector<HTMLButtonElement>('button[aria-label="Refresh"]')!
+    await act(async () => {
+      refresh.dispatchEvent(new MouseEvent('click', { bubbles: true }))
+      await Promise.resolve()
+      await Promise.resolve()
+    })
+    expect(fsTree).toHaveBeenCalledTimes(2)
+    expect(harness.container.textContent).toContain('a.ts')
+
+    // The stale first answer arrives LAST and must be discarded.
+    await act(async () => {
+      resolveStale({ path: '/tmp', entries: [{ name: 'stale.ts', path: '/tmp/stale.ts', isDir: false }], truncated: false })
+      await Promise.resolve()
+      await Promise.resolve()
+    })
+    expect(harness.container.textContent).not.toContain('stale.ts')
+    expect(harness.container.textContent).toContain('a.ts')
+  })
+
+  it('surfaces a truncated level instead of hiding it', async () => {
+    fsTree.mockImplementation(async (_scope: unknown, path: string) => ({
+      path,
+      entries: [{ name: 'a.ts', path: '/tmp/a.ts', isDir: false }],
+      truncated: true,
+    }))
+    harness = mountPanel()
+    await act(async () => {})
+    const notice = [...harness.container.querySelectorAll<HTMLElement>('[data-kind="hint"]')]
+      .find(el => el.textContent?.includes('too many entries'))
+    expect(notice).toBeDefined()
+  })
+})
diff --git a/tests/fs-mkdir.spec.ts b/tests/fs-mkdir.spec.ts
new file mode 100644
index 0000000..429e9dd
--- /dev/null
+++ b/tests/fs-mkdir.spec.ts
@@ -0,0 +1,82 @@
+/**
+ * The host's "new folder" mutation (`fs.mkdir` route → mkdirWorkspaceEntry):
+ * shape rules, existence refusal, containment under the fence, the root row
+ * as a legal PARENT, and the happy path against a real temporary filesystem.
+ */
+import { mkdtemp, mkdir, readdir, realpath, rm, symlink, writeFile } from 'node:fs/promises'
+import { tmpdir } from 'node:os'
+import { join } from 'node:path'
+import { afterEach, beforeEach, describe, expect, it } from 'vitest'
+import { mkdirWorkspaceEntry } from '../src/fs-operations.ts'
+
+let root: string
+/** The workspace root as the host will report it (macOS /tmp is a symlink). */
+let realRoot: string
+
+beforeEach(async () => {
+  root = await mkdtemp(join(tmpdir(), 'dsh-mkdir-'))
+  realRoot = await realpath(root)
+})
+
+afterEach(async () => {
+  await rm(root, { recursive: true, force: true })
+})
+
+/** The wire code of a rejected call (the route maps it to an HTTP status). */
+async function codeOf(run: () => Promise<unknown>): Promise<string> {
+  try {
+    await run()
+  } catch (error) {
+    return (error as { code?: string }).code ?? 'no-code'
+  }
+  return 'resolved'
+}
+
+describe('mkdirWorkspaceEntry', () => {
+  it('creates one directory inside the named row and returns its absolute path', async () => {
+    await mkdir(join(root, 'sub'))
+    const result = await mkdirWorkspaceEntry({ cwd: root, path: join(root, 'sub'), name: 'fresh' })
+    expect(result.path).toBe(join(realRoot, 'sub', 'fresh'))
+    expect(await readdir(join(root, 'sub'))).toEqual(['fresh'])
+  })
+
+  it('accepts the workspace root itself as the parent', async () => {
+    const result = await mkdirWorkspaceEntry({ cwd: root, path: root, name: 'top' })
+    expect(result.path).toBe(join(realRoot, 'top'))
+    expect(await readdir(root)).toEqual(['top'])
+  })
+
+  it('refuses a name that is not a single path segment', async () => {
+    expect(await codeOf(() => mkdirWorkspaceEntry({ cwd: root, path: root, name: 'a/b' }))).toBe('bad-request')
+    expect(await codeOf(() => mkdirWorkspaceEntry({ cwd: root, path: root, name: '..' }))).toBe('bad-request')
+    expect(await codeOf(() => mkdirWorkspaceEntry({ cwd: root, path: root, name: '' }))).toBe('bad-request')
+  })
+
+  it('refuses an existing destination with the same conflict code as rename', async () => {
+    await mkdir(join(root, 'taken'))
+    expect(await codeOf(() => mkdirWorkspaceEntry({ cwd: root, path: root, name: 'taken' }))).toBe('fs-error')
+  })
+
+  it('refuses a parent outside the workspace while the fence is armed, and allows it when disarmed', async () => {
+    const outside = await mkdtemp(join(tmpdir(), 'dsh-outside-'))
+    try {
+      await writeFile(join(outside, 'marker.txt'), 'x')
+      expect(await codeOf(() => mkdirWorkspaceEntry({ cwd: root, path: outside, name: 'nope' }))).toBe('forbidden')
+      // The fence is the guard, not the path shape: disarmed, the same call lands.
+      const result = await mkdirWorkspaceEntry({ cwd: root, path: outside, name: 'allowed', fence: false })
+      expect(result.path).toBe(join(await realpath(outside), 'allowed'))
+    } finally {
+      await rm(outside, { recursive: true, force: true })
+    }
+  })
+
+  it('refuses to create INSIDE a symlink that escapes the workspace', async () => {
+    const outside = await mkdtemp(join(tmpdir(), 'dsh-link-'))
+    try {
+      await symlink(outside, join(root, 'escape'))
+      expect(await codeOf(() => mkdirWorkspaceEntry({ cwd: root, path: join(root, 'escape'), name: 'nope' }))).toBe('forbidden')
+    } finally {
+      await rm(outside, { recursive: true, force: true })
+    }
+  })
+})
diff --git a/tests/git-view-worktree.spec.tsx b/tests/git-view-worktree.spec.tsx
index e3a1b8a..c19f9c5 100644
--- a/tests/git-view-worktree.spec.tsx
+++ b/tests/git-view-worktree.spec.tsx
@@ -3,6 +3,11 @@
  * and history must always come from the same checkout. A stale history row is
  * especially dangerous because its revert/cherry-pick action targets the
  * currently selected checkout.
+ *
+ * The status itself now comes from the shared git-status store (one snapshot
+ * per session+cwd+worktree, one poller), so these tests observe the selection
+ * through the rows it renders and through the scope each git call receives —
+ * including the `repoRoot` a container's worktree listing must carry.
  */
 // @vitest-environment jsdom
 import { afterEach, describe, expect, it, vi } from 'vitest'
@@ -12,12 +17,15 @@ import { act } from 'react-dom/test-utils'
 import { GitLens } from '../src/client/changes/GitLens.tsx'
 import { createSidebarStore } from '../src/client/state.ts'
 import { api, type GitLogEntry, type GitStatusResult, type GitWorktree } from '../src/client/api.ts'
+import { t } from '../src/client/locales.ts'
 
 import { setupReactAct } from './test-utils.ts'
 setupReactAct()
 
 const MAIN = 'C:/repo/main'
 const AGENT = 'C:/repo/agent'
+/** A second linked checkout some tests introduce on a later inventory pass. */
+const AGENT_2 = 'C:/repo/agent-2'
 
 const inventories: GitWorktree[] = [
   { path: MAIN, branch: 'main', current: true, changes: 0 },
@@ -25,6 +33,7 @@ const inventories: GitWorktree[] = [
 ]
 
 function statusFor(target?: string): GitStatusResult {
+  if (target === AGENT_2) return { isRepo: true, branch: 'agent-2', entries: [{ path: 'agent-2-change.ts', xy: ' M' }] }
   return target === AGENT
     ? { isRepo: true, branch: 'agent', entries: [{ path: 'agent-change.ts', xy: ' M' }] }
     : { isRepo: true, branch: 'main', entries: [{ path: 'main-change.ts', xy: ' M' }] }
@@ -51,8 +60,29 @@ function deferred<T>(): { promise: Promise<T>; resolve: (value: T) => void } {
 }
 
 async function flushEffects(): Promise<void> {
-  await act(async () => { await Promise.resolve() })
-  await act(async () => { await Promise.resolve() })
+  // Each round drains one promise hop: the refresh chain (listing → branch/log
+  // → state) is several hops deep, and a shallow flush would assert on rows
+  // that are still in flight.
+  for (let round = 0; round < 5; round += 1) await act(async () => { await Promise.resolve() })
+}
+
+/** Mount one GitLens. Visible by default: a hidden tab owns no live git data
+ *  — the shared status store only polls/loads while a consumer is on screen. */
+function mountGit(
+  root: Root,
+  options: { scope?: { sessionId: string; cwd?: string }; refreshTick?: number; visible?: boolean } = {},
+): void {
+  act(() => {
+    root.render(createElement(GitLens, {
+      scope: options.scope ?? { sessionId: 'session', cwd: MAIN },
+      store: createSidebarStore(),
+      onOpenFile: () => {},
+      onPreview: () => {},
+      selectedRef: null,
+      visible: options.visible ?? true,
+      refreshTick: options.refreshTick ?? 0,
+    }))
+  })
 }
 
 afterEach(() => { vi.restoreAllMocks() })
@@ -71,16 +101,7 @@ describe('GitLens (changes tab, git lens) linked-worktree consistency', () => {
     document.body.append(container)
     const root: Root = createRoot(container)
     try {
-      await act(async () => {
-        root.render(createElement(GitLens, {
-          scope: { sessionId: 'session', cwd: MAIN },
-          store: createSidebarStore(),
-          onOpenFile: () => {},
-          onPreview: () => {},
-          selectedRef: null,
-          visible: false,
-        }))
-      })
+      mountGit(root)
       await flushEffects()
 
       const selects = container.querySelectorAll<HTMLSelectElement>('select')
@@ -130,16 +151,7 @@ describe('GitLens (changes tab, git lens) linked-worktree consistency', () => {
     document.body.append(container)
     const root: Root = createRoot(container)
     try {
-      await act(async () => {
-        root.render(createElement(GitLens, {
-          scope: { sessionId: 'session', cwd: MAIN },
-          store: createSidebarStore(),
-          onOpenFile: () => {},
-          onPreview: () => {},
-          selectedRef: null,
-          visible: false,
-        }))
-      })
+      mountGit(root)
       await flushEffects()
 
       const worktreeSelect = container.querySelectorAll<HTMLSelectElement>('select')[0]!
@@ -164,4 +176,248 @@ describe('GitLens (changes tab, git lens) linked-worktree consistency', () => {
       container.remove()
     }
   })
+
+  it('lists a selected child repository with its repoRoot, running one full refresh', async () => {
+    const WS = 'C:/ws'
+    const REPO_A = 'C:/ws/a'
+    const REPO_B = 'C:/ws/b'
+    const repoBWorktrees: GitWorktree[] = [
+      { path: REPO_B, branch: 'b-main', current: true, changes: 0 },
+      { path: 'C:/ws/b-agent', branch: 'b-agent', current: false, changes: 2 },
+    ]
+    const worktrees = vi.spyOn(api, 'gitWorktrees').mockImplementation(async (scope) => (
+      scope.repoRoot === REPO_B ? repoBWorktrees : []
+    ))
+    const status = vi.spyOn(api, 'gitStatus').mockImplementation(async (scope) => (
+      scope.cwd === REPO_B
+        ? { isRepo: true, branch: 'b-main', entries: [], root: REPO_B, repositories: [REPO_B] }
+        : { isRepo: true, branch: 'a-main', entries: [], root: REPO_A, repositories: [REPO_A, REPO_B] }
+    ))
+    vi.spyOn(api, 'gitBranch').mockImplementation(async (scope) => (
+      scope.repoRoot === REPO_B ? { current: 'b-main', names: ['b-main'] } : { current: 'a-main', names: ['a-main'] }
+    ))
+    vi.spyOn(api, 'gitLog').mockResolvedValue([])
+
+    const container = document.createElement('div')
+    document.body.append(container)
+    const root: Root = createRoot(container)
+    try {
+      mountGit(root, { scope: { sessionId: 'session', cwd: WS } })
+      await flushEffects()
+
+      // The workspace container's two child repositories are the repo choices.
+      const repoSelect = container.querySelectorAll<HTMLSelectElement>('select')[0]!
+      expect([...repoSelect.options].map(option => option.textContent)).toEqual(['a', 'b'])
+      const listingsBefore = worktrees.mock.calls.length
+
+      await act(async () => {
+        Object.getOwnPropertyDescriptor(HTMLSelectElement.prototype, 'value')!.set!.call(repoSelect, REPO_B)
+        repoSelect.dispatchEvent(new Event('change', { bubbles: true }))
+      })
+      await flushEffects()
+
+      // The listing carries the selected repoRoot — a container's own listing
+      // is empty, so the child checkout's linked worktrees only appear when the
+      // selection rides along.
+      expect(worktrees.mock.calls.at(-1)![0]).toMatchObject({ sessionId: 'session', cwd: WS, repoRoot: REPO_B })
+      // Exactly ONE full refresh for the switch (not a burst).
+      expect(worktrees.mock.calls.length).toBe(listingsBefore + 1)
+      // The shared status follows the same selection.
+      expect(status.mock.calls.some(([scope]) => scope.cwd === REPO_B)).toBe(true)
+      const worktreeSelect = container.querySelectorAll<HTMLSelectElement>('select')[1]!
+      expect(worktreeSelect.value).toBe(REPO_B)
+    } finally {
+      act(() => { root.unmount() })
+      container.remove()
+    }
+  })
+
+  it('never yanks the view off the auto-selected checkout on a later re-list', async () => {
+    const LATER: GitWorktree[] = [
+      { path: MAIN, branch: 'main', current: true, changes: 0 },
+      { path: AGENT, branch: 'agent', current: false, changes: 0 },
+      { path: AGENT_2, branch: 'agent-2', current: false, changes: 5 },
+    ]
+    vi.spyOn(api, 'gitWorktrees')
+      .mockResolvedValueOnce(inventories)
+      .mockResolvedValue(LATER)
+    vi.spyOn(api, 'gitStatus').mockImplementation(async (_scope, target) => statusFor(target))
+    vi.spyOn(api, 'gitBranch').mockImplementation(async (_scope, target) => ({
+      current: target === AGENT ? 'agent' : 'main',
+      names: target === AGENT ? ['agent'] : ['main'],
+    }))
+    vi.spyOn(api, 'gitLog').mockImplementation(async (_scope, _count, _skip, target) => logFor(target))
+
+    const container = document.createElement('div')
+    document.body.append(container)
+    const root: Root = createRoot(container)
+    try {
+      mountGit(root)
+      await flushEffects()
+      const worktreeSelect = container.querySelectorAll<HTMLSelectElement>('select')[0]!
+      expect(worktreeSelect.value).toBe(AGENT)
+
+      // A later inventory pass prefers the brand-new dirty checkout; the user
+      // never chose a checkout, but the ONE automatic pass already ran.
+      mountGit(root, { refreshTick: 1 })
+      await flushEffects()
+
+      expect(worktreeSelect.value).toBe(AGENT)
+      expect(container.textContent).toContain('agent-change.ts')
+      expect(container.textContent).not.toContain('agent-2-change.ts')
+    } finally {
+      act(() => { root.unmount() })
+      container.remove()
+    }
+  })
+
+  it('queues a manual refresh that lands while a refresh is in flight', async () => {
+    const held = deferred<GitWorktree[]>()
+    const worktrees = vi.spyOn(api, 'gitWorktrees')
+      .mockReturnValueOnce(held.promise)
+      .mockResolvedValue(inventories)
+    vi.spyOn(api, 'gitStatus').mockImplementation(async (_scope, target) => statusFor(target))
+    vi.spyOn(api, 'gitBranch').mockImplementation(async (_scope, target) => ({
+      current: target === AGENT ? 'agent' : 'main',
+      names: target === AGENT ? ['agent'] : ['main'],
+    }))
+    vi.spyOn(api, 'gitLog').mockImplementation(async (_scope, _count, _skip, target) => logFor(target))
+
+    const container = document.createElement('div')
+    document.body.append(container)
+    const root: Root = createRoot(container)
+    try {
+      mountGit(root)
+      await flushEffects()
+      expect(worktrees).toHaveBeenCalledTimes(1)
+
+      // The header's refresh action lands while the mount pass is in flight.
+      mountGit(root, { refreshTick: 1 })
+      await flushEffects()
+      // Queued, not dropped and not started in parallel.
+      expect(worktrees).toHaveBeenCalledTimes(1)
+
+      held.resolve([])
+      await flushEffects()
+      // The queued pass ran and its listing landed: the dirty linked checkout
+      // is selected and its rows are the ones on screen.
+      expect(worktrees).toHaveBeenCalledTimes(2)
+      expect(container.textContent).toContain('agent-change.ts')
+    } finally {
+      act(() => { root.unmount() })
+      container.remove()
+    }
+  })
+
+  it('stays quiet while hidden and catches up when the tab becomes visible', async () => {
+    const worktrees = vi.spyOn(api, 'gitWorktrees').mockResolvedValue(inventories)
+    const status = vi.spyOn(api, 'gitStatus').mockImplementation(async (_scope, target) => statusFor(target))
+    vi.spyOn(api, 'gitBranch').mockImplementation(async (_scope, target) => ({
+      current: target === AGENT ? 'agent' : 'main',
+      names: target === AGENT ? ['agent'] : ['main'],
+    }))
+    vi.spyOn(api, 'gitLog').mockImplementation(async (_scope, _count, _skip, target) => logFor(target))
+
+    const container = document.createElement('div')
+    document.body.append(container)
+    const root: Root = createRoot(container)
+    try {
+      // Mounted in a background pane: no fetch at all (no git processes for a
+      // tab nobody is looking at).
+      mountGit(root, { visible: false })
+      await flushEffects()
+      expect(worktrees).not.toHaveBeenCalled()
+      expect(status).not.toHaveBeenCalled()
+
+      // Bringing the tab on screen loads the lens through one pass.
+      mountGit(root, { visible: true })
+      await flushEffects()
+      expect(worktrees).toHaveBeenCalledTimes(1)
+      expect(status).toHaveBeenCalled()
+      expect(container.textContent).toContain('agent-change.ts')
+      expect(container.textContent).toContain('Agent checkout commit')
+    } finally {
+      act(() => { root.unmount() })
+      container.remove()
+    }
+  })
+
+  it('hands the inventory poll its AbortSignal and stops it when hidden', async () => {
+    vi.useFakeTimers()
+    const worktrees = vi.spyOn(api, 'gitWorktrees').mockResolvedValue(inventories)
+    vi.spyOn(api, 'gitStatus').mockImplementation(async (_scope, target) => statusFor(target))
+    vi.spyOn(api, 'gitBranch').mockImplementation(async (_scope, target) => ({
+      current: target === AGENT ? 'agent' : 'main',
+      names: target === AGENT ? ['agent'] : ['main'],
+    }))
+    vi.spyOn(api, 'gitLog').mockImplementation(async (_scope, _count, _skip, target) => logFor(target))
+
+    const container = document.createElement('div')
+    document.body.append(container)
+    const root: Root = createRoot(container)
+    try {
+      mountGit(root)
+      await flushEffects()
+      expect(worktrees).toHaveBeenCalledTimes(1)
+
+      // The 30s inventory cadence fires and carries the poller's signal.
+      await act(async () => { await vi.advanceTimersByTimeAsync(30_000) })
+      await flushEffects()
+      expect(worktrees.mock.calls.length).toBe(2)
+      const signal = worktrees.mock.calls[1]![1]
+      expect(signal).toBeInstanceOf(AbortSignal)
+
+      // Hiding the tab tears the poll down and aborts its signal: a slow host
+      // answer can no longer publish state.
+      mountGit(root, { visible: false })
+      await flushEffects()
+      expect((signal as AbortSignal).aborted).toBe(true)
+      const callsWhileHidden = worktrees.mock.calls.length
+      await act(async () => { await vi.advanceTimersByTimeAsync(120_000) })
+      expect(worktrees.mock.calls.length).toBe(callsWhileHidden)
+    } finally {
+      act(() => { root.unmount() })
+      container.remove()
+      vi.useRealTimers()
+    }
+  })
+
+  it('keeps branch switch and history failures out of the commit bar', async () => {
+    vi.spyOn(api, 'gitWorktrees').mockResolvedValue([
+      { path: MAIN, branch: 'main', current: true, changes: 1 },
+    ])
+    vi.spyOn(api, 'gitStatus').mockResolvedValue({
+      isRepo: true, branch: 'main', entries: [{ path: 'src/a.ts', xy: ' M' }],
+    })
+    vi.spyOn(api, 'gitBranch').mockResolvedValue({ current: 'main', names: ['main', 'feature'] })
+    vi.spyOn(api, 'gitLog').mockResolvedValue([])
+    vi.spyOn(api, 'gitCheckout').mockRejectedValue(new Error('dirty worktree'))
+
+    const container = document.createElement('div')
+    document.body.append(container)
+    const root: Root = createRoot(container)
+    try {
+      mountGit(root)
+      await flushEffects()
+
+      const branchSelect = container.querySelectorAll<HTMLSelectElement>('select')[0]!
+      await act(async () => {
+        Object.getOwnPropertyDescriptor(HTMLSelectElement.prototype, 'value')!.set!.call(branchSelect, 'feature')
+        branchSelect.dispatchEvent(new Event('change', { bubbles: true }))
+      })
+      await flushEffects()
+
+      const banner = [...container.querySelectorAll<HTMLElement>('[role="alert"]')]
+        .find(node => (node.textContent ?? '').includes(`${t('checkoutError')}: dirty worktree`))
+      expect(banner).toBeDefined()
+      const input = container.querySelector(`input[placeholder="${t('commitPlaceholder')}"]`)
+      expect(input).not.toBeNull()
+      // The commit bar owns only its own status line: the branch failure is
+      // rendered ABOVE it, never under the commit input.
+      expect(banner!.compareDocumentPosition(input!) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy()
+    } finally {
+      act(() => { root.unmount() })
+      container.remove()
+    }
+  })
 })
diff --git a/tests/menu-flip.spec.tsx b/tests/menu-flip.spec.tsx
deleted file mode 100644
index c9742fc..0000000
--- a/tests/menu-flip.spec.tsx
+++ /dev/null
@@ -1,122 +0,0 @@
-/**
- * The context-menu submenu flip geometry: the pure token computation behind
- * the body attribute layout.css consumes (see src/client/menu-flip.ts for
- * the contract) plus the attribute lifecycle of the hook itself.
- */
-// @vitest-environment jsdom
-import { createElement, useState } from 'react'
-import { readFileSync } from 'node:fs'
-import { act } from 'react-dom/test-utils'
-import { describe, expect, it } from 'vitest'
-import { renderRoot, setupReactAct } from './test-utils.ts'
-import { SUBMENU_FLIP_ATTR, submenuFlipTokens, useSubmenuFlip } from '../src/client/menu-flip.ts'
-
-setupReactAct()
-
-describe('layout.css contract', () => {
-  it('consumes the exact attribute name menu-flip.ts publishes', () => {
-    // The two halves of the flip mechanism can drift silently: renaming the
-    // attribute here would leave layout.css matching nothing (submenus revert
-    // to overflowing) with every test still green. Tie them together. Specs
-    // run from the repo root (chunk-artifact.spec.ts reads lib/ the same way).
-    const css = readFileSync('src/client/layout.css', 'utf8')
-    expect(css).toContain(`body[${SUBMENU_FLIP_ATTR}~="down"] div[role="menu"] div[role="menu"]`)
-    expect(css).toContain(`body[${SUBMENU_FLIP_ATTR}~="left"] div[role="menu"] div[role="menu"]`)
-    expect(css).toContain(`body[${SUBMENU_FLIP_ATTR}~="left"] div[role="menu"] div[role="menu"]::before`)
-  })
-
-  it('keeps the submenu visual tether rules (parent highlight + tight gap)', () => {
-    // Part 1 keeps the parent row lit while its submenu is open (the Menu
-    // marks it aria-expanded); part 2 tightens the card gap to 4px with the
-    // hover corridor narrowed to match. Losing either sends the submenu back
-    // to reading as an unrelated floating card.
-    const css = readFileSync('src/client/layout.css', 'utf8')
-    expect(css).toContain(`body[${SUBMENU_FLIP_ATTR}] div[role="menu"] button[aria-expanded="true"]`)
-    expect(css).toContain('left: calc(100% + 4px)')
-    expect(css).toContain('right: calc(100% + 4px)')
-    expect(css).toContain('width: 4px')
-  })
-})
-
-describe('submenuFlipTokens', () => {
-  // Default geometry (1024x768): the panel is docked right, so the
-  // interesting split is the right-hand 400px strip and the vertical half.
-  it('flips down for a cursor in the upper half, keeps primitive defaults below', () => {
-    expect(submenuFlipTokens(500, 20, 1024, 768)).toBe('down')
-    expect(submenuFlipTokens(500, 700, 1024, 768)).toBe('')
-  })
-
-  it('flips left when the right-hand room cannot fit card + submenu', () => {
-    // 700 + 400 > 1024 → left; the cursor is low, so no down token.
-    expect(submenuFlipTokens(700, 700, 1024, 768)).toBe('left')
-    // Both tokens compose for a top-right opening.
-    expect(submenuFlipTokens(700, 20, 1024, 768)).toBe('down left')
-  })
-
-  it('uses the exact boundary inclusively (midpoint and width-minus-room still flip)', () => {
-    expect(submenuFlipTokens(500, 384, 1024, 768)).toBe('')
-    expect(submenuFlipTokens(500, 383, 1024, 768)).toBe('down')
-    expect(submenuFlipTokens(624, 700, 1024, 768)).toBe('')
-    expect(submenuFlipTokens(625, 700, 1024, 768)).toBe('left')
-  })
-
-  it('flips left throughout a narrow viewport', () => {
-    // A 600px window: any cursor past x=200 flips; the left strip cannot
-    // fit a right-growing submenu beside the 218px card either way.
-    expect(submenuFlipTokens(300, 100, 600, 800)).toBe('down left')
-    expect(submenuFlipTokens(500, 700, 600, 800)).toBe('left')
-  })
-})
-
-describe('useSubmenuFlip', () => {
-  const ATTR = 'data-dsh-sidebar-submenu'
-
-  /** Mount a probe whose menu state the spec drives via the returned setter. */
-  function mountFlipProbe(initial: { x: number; y: number } | null): { setMenu: (next: { x: number; y: number } | null) => void, unmount: () => void } {
-    let applyMenu: (next: { x: number; y: number } | null) => void = () => {}
-    function Probe(): React.ReactElement {
-      const [menu, setMenu] = useState<{ x: number; y: number } | null>(initial)
-      applyMenu = setMenu
-      useSubmenuFlip(menu)
-      return <div />
-    }
-    const rendered = renderRoot(createElement(Probe))
-    return {
-      setMenu: (next) => { act(() => { applyMenu(next) }) },
-      unmount: rendered.unmount,
-    }
-  }
-
-  it('publishes tokens while the menu is open and clears on close', () => {
-    const probe = mountFlipProbe({ x: 700, y: 20 })
-    try {
-      expect(document.body.getAttribute(ATTR)).toBe('down left')
-      probe.setMenu(null)
-      expect(document.body.hasAttribute(ATTR)).toBe(false)
-    } finally {
-      probe.unmount()
-    }
-  })
-
-  it('tracks the position across consecutive openings', () => {
-    const probe = mountFlipProbe({ x: 100, y: 20 })
-    try {
-      expect(document.body.getAttribute(ATTR)).toBe('down')
-      // Still open, now lower-left: the attribute stays (menu lifetime) but
-      // carries no token, so the primitive's own geometry applies.
-      probe.setMenu({ x: 100, y: 700 })
-      expect(document.body.getAttribute(ATTR)).toBe('')
-      probe.setMenu({ x: 700, y: 700 })
-      expect(document.body.getAttribute(ATTR)).toBe('left')
-    } finally {
-      probe.unmount()
-    }
-  })
-
-  it('clears the attribute when the owner unmounts with the menu still open', () => {
-    const probe = mountFlipProbe({ x: 100, y: 20 })
-    expect(document.body.getAttribute(ATTR)).toBe('down')
-    probe.unmount()
-    expect(document.body.hasAttribute(ATTR)).toBe(false)
-  })
-})
diff --git a/tests/open-external-client.spec.ts b/tests/open-external-client.spec.ts
deleted file mode 100644
index 714233f..0000000
--- a/tests/open-external-client.spec.ts
+++ /dev/null
@@ -1,98 +0,0 @@
-/**
- * Client/host routing for the file tree's external-open action. Remote
- * VSCode-family SSH URLs must launch on the browser machine, while local
- * editor URLs and reveal actions keep using the DSH host opener.
- */
-import { afterEach, describe, expect, it, vi } from 'vitest'
-import { api } from '../src/client/api.ts'
-
-afterEach(() => {
-  vi.unstubAllGlobals()
-})
-
-function hostOk(): ReturnType<typeof vi.fn> {
-  return vi.fn(async () => ({
-    ok: true,
-    status: 200,
-    json: async () => ({ ok: true, value: { started: true } }),
-  }))
-}
-
-describe('api.openExternal', () => {
-  it('launches an SSH remote-editor URL on the client without calling the host', async () => {
-    const assign = vi.fn()
-    const fetchMock = hostOk()
-    vi.stubGlobal('window', { location: { assign } })
-    vi.stubGlobal('fetch', fetchMock)
-    const url = 'vscode://vscode-remote/ssh-remote+dev/home/u/f.ts'
-
-    await expect(api.openExternal({ action: 'url', url })).resolves.toEqual({ started: true })
-    expect(assign).toHaveBeenCalledOnce()
-    expect(assign).toHaveBeenCalledWith(url)
-    expect(fetchMock).not.toHaveBeenCalled()
-  })
-
-  it('launches Cursor/custom VSCode-family SSH URLs on the client too', async () => {
-    const assign = vi.fn()
-    const fetchMock = hostOk()
-    vi.stubGlobal('window', { location: { assign } })
-    vi.stubGlobal('fetch', fetchMock)
-
-    await api.openExternal({
-      action: 'url',
-      url: 'cursor://vscode-remote/ssh-remote+dev/home/u/f.ts',
-    })
-    await api.openExternal({
-      action: 'url',
-      url: 'myfork://vscode-remote/ssh-remote+dev/home/u/f.ts',
-    })
-
-    expect(assign).toHaveBeenCalledTimes(2)
-    expect(fetchMock).not.toHaveBeenCalled()
-  })
-
-  it('keeps local editor URLs on the host opener', async () => {
-    const assign = vi.fn()
-    const fetchMock = hostOk()
-    vi.stubGlobal('window', { location: { assign } })
-    vi.stubGlobal('fetch', fetchMock)
-
-    await expect(api.openExternal({
-      action: 'url',
-      url: 'vscode://file//tmp/a.ts',
-    })).resolves.toEqual({ started: true })
-
-    expect(assign).not.toHaveBeenCalled()
-    expect(fetchMock).toHaveBeenCalledOnce()
-    expect(fetchMock.mock.calls[0]?.[0]).toBe('/sidebar/api/open.external')
-  })
-
-  it('keeps reveal actions and http(s) lookalikes on the host opener', async () => {
-    const assign = vi.fn()
-    const fetchMock = hostOk()
-    vi.stubGlobal('window', { location: { assign } })
-    vi.stubGlobal('fetch', fetchMock)
-
-    await api.openExternal({ action: 'reveal', path: '/tmp/a.ts' })
-    await api.openExternal({
-      action: 'url',
-      url: 'https://vscode-remote/ssh-remote+dev/home/u/f.ts',
-    })
-
-    expect(assign).not.toHaveBeenCalled()
-    expect(fetchMock).toHaveBeenCalledTimes(2)
-  })
-
-  it('returns a rejected promise when client navigation throws', async () => {
-    const error = new Error('navigation failed')
-    const fetchMock = hostOk()
-    vi.stubGlobal('window', { location: { assign: vi.fn(() => { throw error }) } })
-    vi.stubGlobal('fetch', fetchMock)
-
-    await expect(api.openExternal({
-      action: 'url',
-      url: 'vscode://vscode-remote/ssh-remote+dev/home/u/f.ts',
-    })).rejects.toBe(error)
-    expect(fetchMock).not.toHaveBeenCalled()
-  })
-})
diff --git a/tests/open-external.spec.ts b/tests/open-external.spec.ts
deleted file mode 100644
index d83477c..0000000
--- a/tests/open-external.spec.ts
+++ /dev/null
@@ -1,73 +0,0 @@
-/**
- * Host external-open helpers: per-platform opener commands (pure, injected
- * platform) and the URL validation that guards the spawn route. The actual
- * spawns are not exercised — the route runs in the DSH host process and the
- * OS outcome is not testable here.
- */
-import { describe, expect, it } from 'vitest'
-import { launchExternal, revealCommand, urlCommand, validateExternalUrl } from '../src/open-external.ts'
-import { SidebarError } from '../src/wire.ts'
-
-describe('revealCommand', () => {
-  it('darwin: `open -R <path>` selects the file in Finder', () => {
-    expect(revealCommand('/a/b.txt', 'darwin')).toEqual({ command: 'open', args: ['-R', '/a/b.txt'] })
-  })
-
-  it('win32: passes /select,<path> as one shell-free Explorer argument', () => {
-    expect(revealCommand('C:\\work\\two words\\a.txt', 'win32')).toEqual({
-      command: 'explorer.exe',
-      args: ['/select,C:\\work\\two words\\a.txt'],
-    })
-  })
-
-  it('linux: `xdg-open` opens the containing directory (no common select protocol)', () => {
-    expect(revealCommand('/a/b.txt', 'linux')).toEqual({ command: 'xdg-open', args: ['/a'] })
-    expect(revealCommand('/', 'linux')).toEqual({ command: 'xdg-open', args: ['/'] })
-  })
-})
-
-describe('urlCommand', () => {
-  it('darwin: `open <url>` launches the registered protocol handler', () => {
-    expect(urlCommand('vscode://file/x', 'darwin')).toEqual({ command: 'open', args: ['vscode://file/x'] })
-  })
-
-  it('win32: rundll32 url.dll,FileProtocolHandler <url>', () => {
-    expect(urlCommand('cursor://file/x', 'win32')).toEqual({
-      command: 'rundll32.exe',
-      args: ['url.dll,FileProtocolHandler', 'cursor://file/x'],
-    })
-  })
-
-  it('linux: `xdg-open <url>` launches the registered protocol handler', () => {
-    expect(urlCommand('zed://file/x', 'linux')).toEqual({ command: 'xdg-open', args: ['zed://file/x'] })
-  })
-})
-
-describe('validateExternalUrl', () => {
-  it('accepts custom-scheme URLs (incl. the SSH-remote form)', () => {
-    expect(validateExternalUrl('vscode://vscode-remote/ssh-remote+dev/home/u/f.ts'))
-      .toBe('vscode://vscode-remote/ssh-remote+dev/home/u/f.ts')
-    expect(validateExternalUrl('myapp://file/{path}')).toBe('myapp://file/{path}')
-  })
-
-  it('rejects http/https (only custom schemes make sense here)', () => {
-    expect(() => validateExternalUrl('https://example.com')).toThrow(SidebarError)
-    expect(() => validateExternalUrl('http://example.com')).toThrow(SidebarError)
-  })
-
-  it('rejects non-URL / non-`scheme://` strings', () => {
-    expect(() => validateExternalUrl('/home/u/f.ts')).toThrow(SidebarError)
-    expect(() => validateExternalUrl('a:file/x')).toThrow(SidebarError)
-    expect(() => validateExternalUrl('')).toThrow(SidebarError)
-  })
-})
-
-describe('launchExternal validation (pre-spawn)', () => {
-  it('rejects relative reveal paths before anything is spawned', () => {
-    expect(() => launchExternal('reveal', 'relative/path')).toThrow(SidebarError)
-  })
-
-  it('rejects invalid URLs before anything is spawned', () => {
-    expect(() => launchExternal('url', 'https://example.com')).toThrow(SidebarError)
-  })
-})
diff --git a/tests/open-in-app.spec.ts b/tests/open-in-app.spec.ts
new file mode 100644
index 0000000..f15dc6e
--- /dev/null
+++ b/tests/open-in-app.spec.ts
@@ -0,0 +1,171 @@
+/**
+ * The client adapter over DSH's open-in-app capability: which host facility
+ * each gesture uses, the availability gate, and the degradation path when the
+ * deployment has no desktop or no Remote namespace.
+ *
+ * The host's own behaviour is NOT re-tested here — only the adapter's
+ * routing (Remote vs catalog route), its caching, and its fail-closed
+ * answers.
+ */
+// @vitest-environment jsdom
+import { afterEach, describe, expect, it, vi } from 'vitest'
+import { createOpenInApp, type OpenInAppEntry } from '../src/client/open-in-app.ts'
+
+interface RemoteCalls {
+  canOpen: number
+  applications: { path: string }[]
+  open: { path: string; action?: 'reveal'; application?: string }[]
+}
+
+/** A fake `ctx.remote.session` recording every call. */
+function fakeCtx(options: {
+  canOpen?: boolean
+  apps?: readonly { id: string; name: string; default: boolean; icon: string | null }[]
+  openResult?: boolean
+  revealResult?: boolean
+  noRemote?: boolean
+} = {}): { ctx: { get(name: string): unknown }; calls: RemoteCalls } {
+  const calls: RemoteCalls = { canOpen: 0, applications: [], open: [] }
+  const session = {
+    canOpenWorkspacePath: async () => {
+      calls.canOpen += 1
+      return { ok: true, value: options.canOpen ?? true }
+    },
+    workspacePathApplications: async (request: { path: string }) => {
+      calls.applications.push(request)
+      if (options.apps === undefined) return { ok: false }
+      return { ok: true, value: options.apps }
+    },
+    openWorkspacePath: async (request: { path: string; action?: 'reveal'; application?: string }) => {
+      calls.open.push(request)
+      if (request.action === 'reveal') return { ok: options.revealResult ?? true }
+      return { ok: options.openResult ?? true }
+    },
+  }
+  return { ctx: { get: (name) => (name === 'remote' ? { session } : undefined) }, calls }
+}
+
+/** Install a fetch stub answering the host's catalog/launch routes. */
+function stubFetch(options: { apps?: readonly string[]; appsStatus?: number; openStatus?: number } = {}) {
+  const calls: { url: string; body?: unknown }[] = []
+  vi.stubGlobal('fetch', async (url: string, init?: RequestInit) => {
+    calls.push({ url: String(url), body: init?.body === undefined ? undefined : JSON.parse(String(init.body)) })
+    if (String(url).includes('/open-in-app/apps')) {
+      const status = options.appsStatus ?? 200
+      return new Response(JSON.stringify({ apps: options.apps ?? [] }), { status })
+    }
+    return new Response('{}', { status: options.openStatus ?? 200 })
+  })
+  return calls
+}
+
+afterEach(() => {
+  vi.unstubAllGlobals()
+})
+
+/** The adapter built over a ctx that cannot reach the Remote at all. */
+function withoutRemote() {
+  return createOpenInApp({ get: () => undefined })
+}
+
+describe('createOpenInApp', () => {
+  it('reports unavailable and degrades every gesture when the Remote is absent', async () => {
+    const adapter = withoutRemote()
+    expect(adapter.available()).toBeNull()
+    expect(await adapter.probe()).toBe(false)
+    expect(adapter.available()).toBe(false)
+    expect(await adapter.fileApps('/tmp/a.ts')).toBeNull()
+    expect(await adapter.open('/tmp/a.ts')).toBe(false)
+    expect(await adapter.reveal('/tmp/a.ts')).toBe(false)
+  })
+
+  it('probes availability once and shares the answer', async () => {
+    const { ctx, calls } = fakeCtx({ canOpen: true })
+    const adapter = createOpenInApp(ctx)
+    expect(await adapter.probe()).toBe(true)
+    expect(await adapter.probe()).toBe(true)
+    expect(adapter.available()).toBe(true)
+    expect(calls.canOpen).toBe(1)
+  })
+
+  it('maps the OS handlers of one file, default included', async () => {
+    const { ctx, calls } = fakeCtx({
+      apps: [{ id: '/Applications/VSCode.app', name: 'Visual Studio Code', default: true, icon: 'data:image/png;base64,AA' }],
+    })
+    const adapter = createOpenInApp(ctx)
+    const apps = await adapter.fileApps('/tmp/a.ts')
+    expect(apps).toEqual([{ id: '/Applications/VSCode.app', name: 'Visual Studio Code', icon: 'data:image/png;base64,AA', isDefault: true }])
+    expect(calls.applications).toEqual([{ path: '/tmp/a.ts' }])
+  })
+
+  it('answers null for a failed handler query, never an empty list', async () => {
+    const { ctx } = fakeCtx({ apps: undefined })
+    expect(await createOpenInApp(ctx).fileApps('/tmp/a.ts')).toBeNull()
+  })
+
+  it('opens a path through the Remote, default or explicit application', async () => {
+    const { ctx, calls } = fakeCtx()
+    const adapter = createOpenInApp(ctx)
+    expect(await adapter.open('/tmp/a.ts')).toBe(true)
+    expect(await adapter.open('/tmp/a.ts', '/Applications/VSCode.app')).toBe(true)
+    expect(calls.open).toEqual([
+      { path: '/tmp/a.ts' },
+      { path: '/tmp/a.ts', application: '/Applications/VSCode.app' },
+    ])
+  })
+
+  it('falls back to the host catalog route when a catalog id is not a file handler', async () => {
+    const fetchCalls = stubFetch()
+    // The Remote refuses the catalog id (it is not registered for this path).
+    const { ctx, calls } = fakeCtx({ openResult: false })
+    const adapter = createOpenInApp(ctx)
+    expect(await adapter.open('/tmp/ws', 'vscode')).toBe(true)
+    expect(calls.open).toEqual([{ path: '/tmp/ws', application: 'vscode' }])
+    expect(fetchCalls).toEqual([{ url: '/open-in-app/open', body: { app: 'vscode', path: '/tmp/ws' } }])
+  })
+
+  it('reports a launch failure instead of pretending success', async () => {
+    stubFetch({ openStatus: 400 })
+    const { ctx } = fakeCtx({ openResult: false })
+    expect(await createOpenInApp(ctx).open('/tmp/ws', 'vscode')).toBe(false)
+  })
+
+  it('reveals through the Remote action', async () => {
+    const { ctx, calls } = fakeCtx()
+    expect(await createOpenInApp(ctx).reveal('/tmp/a.ts')).toBe(true)
+    expect(calls.open).toEqual([{ path: '/tmp/a.ts', action: 'reveal' }])
+  })
+
+  it('lists the directory catalog from the host route, with icon URLs', async () => {
+    const fetchCalls = stubFetch({ apps: ['vscode', 'finder'] })
+    const { ctx } = fakeCtx()
+    const apps: readonly OpenInAppEntry[] = await createOpenInApp(ctx).directoryApps()
+    expect(apps.map(app => app.id)).toEqual(['vscode', 'finder'])
+    expect(apps[0]?.icon).toBe('/open-in-app/icon/vscode')
+    // Without the host locale namespace the label falls back to the id itself.
+    expect(apps[0]?.name).toBe('Vscode')
+    expect(fetchCalls[0]?.url).toBe('/open-in-app/apps')
+  })
+
+  it('answers an empty catalog when the host route fails or the desktop is gone', async () => {
+    stubFetch({ appsStatus: 500 })
+    const { ctx } = fakeCtx()
+    expect(await createOpenInApp(ctx).directoryApps()).toEqual([])
+    const offline = fakeCtx({ canOpen: false })
+    expect(await createOpenInApp(offline.ctx).directoryApps()).toEqual([])
+  })
+})
+
+describe('createOpenInApp (host inject guard)', () => {
+  it('treats a ctx that THROWS on service access as unavailable instead of crashing the caller', async () => {
+    // Cordis raises `cannot get property "remote.session" without inject`
+    // when the bundle forgets the inject entry; a render path must survive it.
+    const adapter = createOpenInApp({
+      get: () => { throw new Error('cannot get property "remote.session" without inject') },
+    })
+    expect(await adapter.probe()).toBe(false)
+    expect(await adapter.fileApps('/tmp/a.ts')).toBeNull()
+    expect(await adapter.open('/tmp/a.ts')).toBe(false)
+    expect(await adapter.reveal('/tmp/a.ts')).toBe(false)
+  })
+})
diff --git a/tests/open-with-settings.spec.tsx b/tests/open-with-settings.spec.tsx
deleted file mode 100644
index 7faf7c1..0000000
--- a/tests/open-with-settings.spec.tsx
+++ /dev/null
@@ -1,112 +0,0 @@
-/**
- * The editor's "open with" settings panel: the SSH host row and the custom
- * editor list (name + URL template + VSCode-family flag, add/remove). Every
- * edit commits the whole `openWith` blob through the popup's
- * updatePluginSetting; removing an editor also prunes its pinned id.
- */
-// @vitest-environment jsdom
-import { beforeAll, afterEach, describe, expect, it, vi } from 'vitest'
-import { createElement } from 'react'
-import { createRoot, type Root } from 'react-dom/client'
-import { act } from 'react-dom/test-utils'
-import { OpenWithSettings } from '../src/client/open-with-settings.tsx'
-
-import { setupReactAct } from './test-utils.ts'
-setupReactAct()
-
-beforeAll(() => {
-  Object.defineProperty(window.navigator, 'language', { value: 'en-US', configurable: true })
-})
-
-interface Harness {
-  container: HTMLDivElement
-  update: ReturnType<typeof vi.fn>
-  unmount: () => void
-}
-
-function mountSettings(rawOpenWith: unknown): Harness {
-  const container = document.createElement('div')
-  document.body.append(container)
-  const root: Root = createRoot(container)
-  const update = vi.fn()
-  act(() => {
-    root.render(createElement(OpenWithSettings, {
-      pluginSettings: { openWith: rawOpenWith },
-      updatePluginSetting: update,
-    }))
-  })
-  return {
-    container,
-    update,
-    unmount: () => { act(() => { root.unmount() }) },
-  }
-}
-
-const baseConfig = {
-  sshHost: 'dev',
-  customEditors: [
-    { id: 'a', name: 'Windsurf', urlTemplate: 'windsurf://file/{path}', isVscodeFamily: false },
-  ],
-  pinned: ['vscode', 'custom:a'],
-}
-
-describe('OpenWithSettings', () => {
-  let harness: Harness
-  afterEach(() => {
-    harness.unmount()
-    document.body.innerHTML = ''
-  })
-
-  it('seeds the SSH host input from the persisted blob and commits edits', () => {
-    harness = mountSettings(baseConfig)
-    const input = harness.container.querySelector<HTMLInputElement>('input:not([type])')
-    expect(input?.value).toBe('dev')
-    // The native value setter (React's value tracker must see the change).
-    const setter = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value')!.set!
-    act(() => {
-      setter.call(input, 'prod')
-      input!.dispatchEvent(new Event('input', { bubbles: true }))
-    })
-    expect(harness.update.mock.calls[0]?.[0]).toBe('openWith')
-    expect(harness.update.mock.calls[0]?.[1]).toMatchObject({ sshHost: 'prod' })
-  })
-
-  it('adds a custom editor row and commits the extended list', () => {
-    harness = mountSettings(baseConfig)
-    const add = [...harness.container.querySelectorAll<HTMLButtonElement>('button')]
-      .find(button => button.textContent?.trim() === 'Add')
-    expect(add).toBeDefined()
-    act(() => { add!.click() })
-    const blob = harness.update.mock.calls[0]?.[1] as { customEditors: unknown[]; pinned: string[] }
-    expect(blob.customEditors).toHaveLength(2)
-    expect(blob.pinned).toEqual(['vscode', 'custom:a'])
-  })
-
-  it('removes an editor and prunes its pinned id', () => {
-    harness = mountSettings(baseConfig)
-    const remove = harness.container.querySelector<HTMLButtonElement>('button[aria-label="Remove"]')
-    expect(remove).toBeDefined()
-    act(() => { remove!.click() })
-    const blob = harness.update.mock.calls[0]?.[1] as { customEditors: unknown[]; pinned: string[] }
-    expect(blob.customEditors).toHaveLength(0)
-    expect(blob.pinned).toEqual(['vscode'])
-  })
-
-  it('shows the validity hint when a row is incomplete', () => {
-    harness = mountSettings({
-      sshHost: '',
-      customEditors: [{ id: 'x', name: 'Bad', urlTemplate: 'x://file/x', isVscodeFamily: true }],
-      pinned: [],
-    })
-    expect(harness.container.textContent).toContain('are not shown in the menu')
-  })
-
-  it('edits the VSCode-family flag of one row', () => {
-    harness = mountSettings(baseConfig)
-    const checkbox = harness.container.querySelector<HTMLInputElement>('input[type="checkbox"]')
-    expect(checkbox?.checked).toBe(false)
-    act(() => { checkbox!.click() })
-    const blob = harness.update.mock.calls[0]?.[1] as { customEditors: { isVscodeFamily: boolean }[] }
-    expect(blob.customEditors[0]?.isVscodeFamily).toBe(true)
-  })
-})
diff --git a/tests/open-with.spec.ts b/tests/open-with.spec.ts
deleted file mode 100644
index beb3d76..0000000
--- a/tests/open-with.spec.ts
+++ /dev/null
@@ -1,150 +0,0 @@
-/**
- * The file tree "open with" pure logic: config parsing (tolerant), target
- * resolution (built-ins + custom, SSH filtering), URL building (local file
- * URLs and VSCode-family SSH-remote URLs) and the custom-editor validators.
- */
-import { describe, expect, it } from 'vitest'
-import {
-  isValidCustomEditor,
-  newCustomEditorId,
-  normalizeUrlPath,
-  openWithSshActive,
-  openWithUrl,
-  parseOpenWithConfig,
-  resolveOpenWithTargets,
-  type CustomEditor,
-  type OpenWithTarget,
-} from '../src/client/open-with.ts'
-
-describe('parseOpenWithConfig', () => {
-  it('returns the defaults for null / non-object / array values', () => {
-    expect(parseOpenWithConfig(null)).toEqual({ sshHost: '', customEditors: [], pinned: [] })
-    expect(parseOpenWithConfig('junk')).toEqual({ sshHost: '', customEditors: [], pinned: [] })
-    expect(parseOpenWithConfig([])).toEqual({ sshHost: '', customEditors: [], pinned: [] })
-  })
-
-  it('keeps structurally valid custom editors (incl. in-progress rows) and drops junk', () => {
-    const config = parseOpenWithConfig({
-      sshHost: 'dev',
-      customEditors: [
-        { id: 'a', name: 'Windsurf', urlTemplate: 'windsurf://file/{path}', isVscodeFamily: false },
-        { id: 'b', name: '', urlTemplate: 'b://file/{path}', isVscodeFamily: true },
-        { id: 'c', name: 'Trae', urlTemplate: 'trae://file/{path}', isVscodeFamily: true },
-        'junk',
-        null,
-        42,
-      ],
-      pinned: ['vscode', 'custom:a', 42, '', 'custom:c'],
-    })
-    expect(config.sshHost).toBe('dev')
-    expect(config.customEditors.map(editor => editor.id)).toEqual(['a', 'b', 'c'])
-    expect(config.pinned).toEqual(['vscode', 'custom:a', 'custom:c'])
-  })
-})
-
-describe('resolveOpenWithTargets', () => {
-  const localCustom: CustomEditor = { id: 'e1', name: 'Windsurf', urlTemplate: 'windsurf://file/{path}', isVscodeFamily: false }
-  const familyCustom: CustomEditor = { id: 'e2', name: 'Zed-like fork', urlTemplate: 'x-zed://file/{path}', isVscodeFamily: true }
-
-  it('lists built-ins first, then custom editors (local mode)', () => {
-    const targets = resolveOpenWithTargets(parseOpenWithConfig({ customEditors: [localCustom] }))
-    expect(targets.map(target => target.id)).toEqual(['explorer', 'vscode', 'cursor', 'zed', 'custom:e1'])
-    expect(targets[0]?.kind).toBe('reveal')
-    expect(targets[1]?.urlTemplate).toBe('vscode://file/{path}')
-  })
-
-  it('excludes incomplete custom-editor rows from the menu (they stay in the blob)', () => {
-    const targets = resolveOpenWithTargets(parseOpenWithConfig({
-      customEditors: [
-        { id: 'e1', name: 'Windsurf', urlTemplate: 'windsurf://file/{path}', isVscodeFamily: false },
-        { id: 'e2', name: '', urlTemplate: 'incomplete://file/{path}', isVscodeFamily: true },
-      ],
-    }))
-    expect(targets.map(target => target.id)).toEqual(['explorer', 'vscode', 'cursor', 'zed', 'custom:e1'])
-  })
-
-  it('drops local-only targets in SSH mode (file manager, Zed, non-VSCode custom)', () => {
-    const config = parseOpenWithConfig({ sshHost: 'dev', customEditors: [localCustom, familyCustom] })
-    const targets = resolveOpenWithTargets(config)
-    expect(targets.map(target => target.id)).toEqual(['vscode', 'cursor', 'custom:e2'])
-  })
-
-  it('prunes unknown pinned ids only when resolving (the parse keeps them)', () => {
-    const config = parseOpenWithConfig({ pinned: ['ghost'] })
-    expect(config.pinned).toEqual(['ghost'])
-    expect(resolveOpenWithTargets(config).map(target => target.id)).toContain('vscode')
-  })
-})
-
-describe('openWithUrl', () => {
-  const targets = resolveOpenWithTargets(parseOpenWithConfig({}))
-  const byId = (id: string): OpenWithTarget => {
-    const target = targets.find(item => item.id === id)
-    if (target === undefined) throw new Error(`no target ${id}`)
-    return target
-  }
-
-  it('builds local file URLs with the raw path (backslashes normalized)', () => {
-    expect(openWithUrl(byId('vscode'), '/home/u/f.ts', parseOpenWithConfig({}))).toBe('vscode://file//home/u/f.ts')
-    expect(openWithUrl(byId('vscode'), 'C:\\Users\\u\\f.ts', parseOpenWithConfig({}))).toBe('vscode://file/C:/Users/u/f.ts')
-    expect(openWithUrl(byId('zed'), '/x/y', parseOpenWithConfig({}))).toBe('zed://file//x/y')
-  })
-
-  it('builds SSH-remote URLs for VSCode-family targets in SSH mode', () => {
-    const config = parseOpenWithConfig({ sshHost: 'dev' })
-    expect(openWithUrl(byId('vscode'), '/home/u/f.ts', config))
-      .toBe('vscode://vscode-remote/ssh-remote+dev/home/u/f.ts')
-    expect(openWithUrl(byId('cursor'), '/home/u/f.ts', config))
-      .toBe('cursor://vscode-remote/ssh-remote+dev/home/u/f.ts')
-  })
-
-  it('keeps the local URL form for non-VSCode-family targets even in SSH mode', () => {
-    // (Such targets are hidden from the SSH menu; the URL builder stays honest.)
-    expect(openWithUrl(byId('zed'), '/x', parseOpenWithConfig({ sshHost: 'dev' }))).toBe('zed://file//x')
-  })
-
-  it('returns undefined for reveal targets and malformed templates', () => {
-    expect(openWithUrl(byId('explorer'), '/x', parseOpenWithConfig({}))).toBeUndefined()
-    const noScheme: OpenWithTarget = { id: 'x', name: '', kind: 'url', urlTemplate: 'not-a-url {path}', isVscodeFamily: false, localOnly: false }
-    expect(openWithUrl(noScheme, '/x', parseOpenWithConfig({}))).toBeUndefined()
-    const noSlash: OpenWithTarget = { id: 'y', name: '', kind: 'url', urlTemplate: 'a:file/{path}', isVscodeFamily: false, localOnly: false }
-    expect(openWithUrl(noSlash, '/x', parseOpenWithConfig({}))).toBeUndefined()
-  })
-
-  it('uses the custom template scheme for SSH URLs of VSCode-family custom editors', () => {
-    const config = parseOpenWithConfig({
-      sshHost: 'dev',
-      customEditors: [
-        { id: 'e', name: 'Fork', urlTemplate: 'myfork://file/{path}', isVscodeFamily: true },
-      ],
-    })
-    const targets = resolveOpenWithTargets(config)
-    expect(openWithUrl(targets[targets.length - 1]!, '/r/f.ts', config))
-      .toBe('myfork://vscode-remote/ssh-remote+dev/r/f.ts')
-  })
-})
-
-describe('helpers', () => {
-  it('normalizeUrlPath converts backslashes to slashes', () => {
-    expect(normalizeUrlPath('a\\b\\c')).toBe('a/b/c')
-  })
-
-  it('openWithSshActive trims the host', () => {
-    expect(openWithSshActive(parseOpenWithConfig({ sshHost: '  ' }))).toBe(false)
-    expect(openWithSshActive(parseOpenWithConfig({ sshHost: ' dev ' }))).toBe(true)
-  })
-
-  it('isValidCustomEditor requires a name, a {path} placeholder and a scheme:// prefix', () => {
-    expect(isValidCustomEditor({ name: 'A', urlTemplate: 'a://file/{path}' })).toBe(true)
-    expect(isValidCustomEditor({ name: '', urlTemplate: 'a://file/{path}' })).toBe(false)
-    expect(isValidCustomEditor({ name: 'A', urlTemplate: 'a://file/x' })).toBe(false)
-    expect(isValidCustomEditor({ name: 'A', urlTemplate: 'a:file/{path}' })).toBe(false)
-  })
-
-  it('newCustomEditorId yields unique non-empty ids', () => {
-    const first = newCustomEditorId()
-    const second = newCustomEditorId()
-    expect(first).not.toBe(second)
-    expect(first.length).toBeGreaterThan(0)
-  })
-})
diff --git a/tests/ui-kit.spec.tsx b/tests/ui-kit.spec.tsx
new file mode 100644
index 0000000..b4e24be
--- /dev/null
+++ b/tests/ui-kit.spec.tsx
@@ -0,0 +1,250 @@
+/**
+ * The global UI kit and the shared git-status store.
+ *
+ * The porcelain mapping and the store's contract are the two things every
+ * page now depends on (the file tree colors rows from the same snapshot the
+ * changes page lists), so both are pinned here: one fetch per key, the
+ * visible-only poll, the queued refresh, and the lazy path index.
+ */
+// @vitest-environment jsdom
+import { afterEach, beforeAll, describe, expect, it, vi } from 'vitest'
+import { createElement, type ReactNode } from 'react'
+import { createRoot, type Root } from 'react-dom/client'
+import { act } from 'react-dom/test-utils'
+import { setupReactAct } from './test-utils.ts'
+import { Chip, ConfirmDialog, IconButton, Notice, SectionHeader, StatusBadge } from '../src/client/ui/kit.tsx'
+import { invalidateGitStatus, statusOfXY, useGitStatus, type GitStatusView } from '../src/client/ui/git-status.ts'
+import type { GitStatusResult } from '../src/client/api.ts'
+
+setupReactAct()
+
+beforeAll(() => {
+  Object.defineProperty(window.navigator, 'language', { value: 'en-US', configurable: true })
+})
+
+const { gitStatus } = vi.hoisted(() => ({ gitStatus: vi.fn() }))
+vi.mock('../src/client/api.ts', () => ({ api: { gitStatus } }))
+
+afterEach(() => {
+  gitStatus.mockReset()
+})
+
+/** Mount one element and hand back its container plus an unmount. */
+async function mount(node: ReactNode): Promise<{ container: HTMLDivElement; unmount: () => Promise<void> }> {
+  const container = document.createElement('div')
+  document.body.append(container)
+  const root: Root = createRoot(container)
+  await act(async () => { root.render(node) })
+  return {
+    container,
+    unmount: async () => { await act(async () => { root.unmount() }); container.remove() },
+  }
+}
+
+describe('statusOfXY', () => {
+  it('maps the worktree/index letter pairs to the shared tone vocabulary', () => {
+    expect(statusOfXY(' M')).toMatchObject({ letter: 'M', tone: 'modified', staged: false, unstaged: true })
+    expect(statusOfXY('M ')).toMatchObject({ letter: 'M', tone: 'modified', staged: true, unstaged: false })
+    expect(statusOfXY('MM')).toMatchObject({ tone: 'modified', staged: true, unstaged: true })
+    expect(statusOfXY('A ')).toMatchObject({ letter: 'A', tone: 'added' })
+    expect(statusOfXY(' D')).toMatchObject({ letter: 'D', tone: 'deleted' })
+    expect(statusOfXY('R ')).toMatchObject({ letter: 'R', tone: 'renamed' })
+    expect(statusOfXY('C ')).toMatchObject({ letter: 'C', tone: 'copied' })
+    expect(statusOfXY('UU')).toMatchObject({ letter: 'U', tone: 'conflict', staged: true, unstaged: true })
+  })
+
+  it('reads untracked as its own tone and ignores clean/ignored rows', () => {
+    expect(statusOfXY('??')).toEqual({ letter: 'U', tone: 'untracked', staged: false, unstaged: true })
+    expect(statusOfXY('  ')).toBeUndefined()
+    expect(statusOfXY('!!')).toBeUndefined()
+  })
+})
+
+/** A snapshot with one changed file under `<root>/src` and one at the root. */
+function snapshot(overrides: Partial<GitStatusResult> = {}): GitStatusResult {
+  return {
+    isRepo: true,
+    branch: 'main',
+    root: '/ws',
+    entries: [
+      { path: 'src/a.ts', xy: ' M' },
+      { path: 'top.md', xy: '??' },
+    ],
+    ...overrides,
+  }
+}
+
+/** A probe component exposing the hook's view to the test body. */
+function Probe(props: { scope: { sessionId: string; cwd?: string }; visible?: boolean; onView(view: GitStatusView): void }): ReactNode {
+  const view = useGitStatus(props.scope, { visible: props.visible ?? true })
+  props.onView(view)
+  return createElement('span', null, String(view.snapshot?.entries.length ?? -1))
+}
+
+describe('useGitStatus', () => {
+  it('fetches once per key and indexes paths and their ancestor directories', async () => {
+    gitStatus.mockResolvedValue(snapshot())
+    let view: GitStatusView | undefined
+    const { unmount } = await mount(createElement(Probe, { scope: { sessionId: 's1', cwd: '/ws' }, onView: (next) => { view = next } }))
+    expect(gitStatus).toHaveBeenCalledTimes(1)
+    expect(view?.snapshot?.isRepo).toBe(true)
+    expect(view?.statusOf('/ws/src/a.ts')?.tone).toBe('modified')
+    expect(view?.statusOf('/ws/top.md')?.tone).toBe('untracked')
+    // Case- and separator-insensitive lookup, so a Windows host's mixed
+    // separators still color the row.
+    expect(view?.statusOf('\\ws\\SRC\\a.ts')?.letter).toBe('M')
+    expect(view?.statusOf('/ws/src/other.ts')).toBeUndefined()
+    expect(view?.dirHasChanges('/ws/src')).toBe(true)
+    expect(view?.dirHasChanges('/ws')).toBe(true)
+    expect(view?.dirHasChanges('/ws/docs')).toBe(false)
+    await unmount()
+  })
+
+  it('stays unfetched while invisible and polls once visible again', async () => {
+    gitStatus.mockResolvedValue(snapshot())
+    const { unmount } = await mount(createElement(Probe, { scope: { sessionId: 's2' }, visible: false, onView: () => {} }))
+    expect(gitStatus).not.toHaveBeenCalled()
+    await unmount()
+  })
+
+  it('drops the snapshot when the last consumer leaves, so a remount re-reads', async () => {
+    gitStatus.mockResolvedValue(snapshot())
+    const first = await mount(createElement(Probe, { scope: { sessionId: 's3' }, onView: () => {} }))
+    expect(gitStatus).toHaveBeenCalledTimes(1)
+    await first.unmount()
+    // A kept snapshot would let the store serve the old answer with no fetch.
+    const second = await mount(createElement(Probe, { scope: { sessionId: 's3' }, onView: () => {} }))
+    expect(gitStatus).toHaveBeenCalledTimes(2)
+    await second.unmount()
+  })
+
+  it('coalesces a refresh that lands mid-flight instead of dropping it', async () => {
+    let resolveFirst: ((value: GitStatusResult) => void) | undefined
+    gitStatus
+      .mockImplementationOnce(() => new Promise<GitStatusResult>((resolve) => { resolveFirst = resolve }))
+      .mockResolvedValue(snapshot({ entries: [{ path: 'src/b.ts', xy: ' M' }] }))
+    let view: GitStatusView | undefined
+    const { unmount } = await mount(createElement(Probe, { scope: { sessionId: 's4' }, onView: (next) => { view = next } }))
+    await act(async () => {
+      view?.refresh()
+      view?.refresh()
+    })
+    expect(gitStatus).toHaveBeenCalledTimes(1)
+    await act(async () => {
+      resolveFirst?.(snapshot())
+      await Promise.resolve()
+      await Promise.resolve()
+    })
+    expect(gitStatus).toHaveBeenCalledTimes(2)
+    await unmount()
+  })
+
+  it('surfaces a failed read as an error without inventing a status', async () => {
+    gitStatus.mockRejectedValue(new Error('no git'))
+    let view: GitStatusView | undefined
+    const { unmount } = await mount(createElement(Probe, { scope: { sessionId: 's5' }, onView: (next) => { view = next } }))
+    expect(view?.error).toBe(true)
+    expect(view?.snapshot).toBeNull()
+    expect(view?.statusOf('/ws/a.ts')).toBeUndefined()
+    await unmount()
+  })
+
+  it('serves two consumers of the same key from ONE fetch (the tree and the changes lens)', async () => {
+    gitStatus.mockResolvedValue(snapshot())
+    let first: GitStatusView | undefined
+    let second: GitStatusView | undefined
+    const { unmount } = await mount(createElement('div', null,
+      createElement(Probe, { scope: { sessionId: 's-shared', cwd: '/ws' }, onView: (view) => { first = view } }),
+      createElement(Probe, { scope: { sessionId: 's-shared', cwd: '/ws' }, onView: (view) => { second = view } }),
+    ))
+    expect(gitStatus).toHaveBeenCalledTimes(1)
+    expect(first?.statusOf('/ws/src/a.ts')?.letter).toBe('M')
+    expect(second?.statusOf('/ws/src/a.ts')?.letter).toBe('M')
+    await unmount()
+  })
+
+  it('invalidateGitStatus re-reads every live key of one session', async () => {
+    gitStatus.mockResolvedValue(snapshot())
+    const { unmount } = await mount(createElement(Probe, { scope: { sessionId: 's6' }, onView: () => {} }))
+    expect(gitStatus).toHaveBeenCalledTimes(1)
+    await act(async () => {
+      invalidateGitStatus('s6')
+      await Promise.resolve()
+    })
+    expect(gitStatus).toHaveBeenCalledTimes(2)
+    await unmount()
+  })
+})
+
+describe('ui kit atoms', () => {
+  it('IconButton carries its accessible name, pressed state and disabled lock', async () => {
+    const onClick = vi.fn()
+    const { container, unmount } = await mount(createElement(IconButton, { icon: createElement('i'), label: 'Refresh', active: true, onClick }))
+    const button = container.querySelector('button')!
+    expect(button.getAttribute('aria-label')).toBe('Refresh')
+    expect(button.getAttribute('title')).toBe('Refresh')
+    expect(button.getAttribute('aria-pressed')).toBe('true')
+    await act(async () => { button.click() })
+    expect(onClick).toHaveBeenCalledTimes(1)
+    await unmount()
+  })
+
+  it('Chip shows its count and reflects selection', async () => {
+    const onClick = vi.fn()
+    const { container, unmount } = await mount(createElement(Chip, { active: true, count: 3, onClick, children: 'Write' }))
+    const chip = container.querySelector('button')!
+    expect(chip.textContent).toBe('Write3')
+    expect(chip.getAttribute('data-active')).toBe('true')
+    await unmount()
+  })
+
+  it('SectionHeader renders label, count and its one action slot', async () => {
+    const { container, unmount } = await mount(
+      createElement(SectionHeader, {
+        label: 'Staged',
+        count: 2,
+        action: createElement('button', null, 'Go'),
+        children: createElement('span', null, 'x'),
+      }),
+    )
+    expect(container.textContent).toContain('Staged')
+    expect(container.textContent).toContain('2')
+    expect(container.textContent).toContain('x')
+    expect(container.querySelector('button')?.textContent).toBe('Go')
+    await unmount()
+  })
+
+  it('Notice renders one line per kind and announces errors', async () => {
+    const { container, unmount } = await mount(createElement(Notice, { kind: 'error', children: 'boom' }))
+    const node = container.querySelector('[data-kind="error"]')!
+    expect(node.getAttribute('role')).toBe('alert')
+    expect(node.textContent).toBe('boom')
+    await unmount()
+  })
+
+  it('StatusBadge exposes the tone as data for the sheet', async () => {
+    const { container, unmount } = await mount(createElement(StatusBadge, { tone: 'untracked', title: 'Untracked', children: 'U' }))
+    const badge = container.querySelector('[data-tone="untracked"]')!
+    expect(badge.getAttribute('title')).toBe('Untracked')
+    await unmount()
+  })
+
+  it('ConfirmDialog routes both actions', async () => {
+    const onConfirm = vi.fn()
+    const onClose = vi.fn()
+    const { unmount } = await mount(createElement(ConfirmDialog, {
+      open: true, title: 'Delete?', description: 'gone forever', confirmLabel: 'Delete', cancelLabel: 'Cancel',
+      danger: true, onConfirm, onClose,
+    }))
+    const buttons = [...document.querySelectorAll('button')]
+    const confirm = buttons.find(button => button.textContent === 'Delete')
+    const cancel = buttons.find(button => button.textContent === 'Cancel')
+    expect(confirm).toBeDefined()
+    expect(cancel).toBeDefined()
+    await act(async () => { confirm?.click() })
+    await act(async () => { cancel?.click() })
+    expect(onConfirm).toHaveBeenCalledTimes(1)
+    expect(onClose).toHaveBeenCalledTimes(1)
+    await unmount()
+  })
+})