Skip to content

feat(workspace): enhance previews, terminal, and tab splitting - #2273

Merged
openai0229 merged 14 commits into
OtterMind:mainfrom
auenger:feat/workspace-file-preview-terminal
Aug 3, 2026
Merged

feat(workspace): enhance previews, terminal, and tab splitting#2273
openai0229 merged 14 commits into
OtterMind:mainfrom
auenger:feat/workspace-file-preview-terminal

Conversation

@auenger

@auenger auenger commented Jul 27, 2026

Copy link
Copy Markdown
Contributor

背景

工作台的“文件”区域原先主要面向 SQL/文本编辑,缺少 Markdown 富预览、图片/PDF 预览和从当前目录直接启动终端的能力。本 PR 在 Community JCEF 桌面端补齐完整文件预览与集成终端链路,不引入 Electron API,也不改变 Community 离线、本地和 loopback 运行约束。

功能清单

1. 文件树与文件打开

  • 文件树展示目录下的普通文件,不再因为扩展名不在编辑白名单中而直接隐藏。
  • 不支持预览的文件仍可在文件树中显示和执行上下文操作;打开时给出明确提示。
  • 保留符号链接不展示和单目录最多 1000 项的既有安全/性能限制。
  • 扩展文本文件识别和文件预览元数据。
  • JCEF 文件读取通过 canonical path 校验,文件必须位于当前已打开目录根路径内,并带有文件类型与大小限制,避免越界读取。

2. Markdown 编辑与 Review

  • Markdown 文件支持三种显示模式:
    • 仅源文件
    • 仅 Review
    • 左侧源文件、右侧 Review
  • 三个模式按钮悬浮在内容区右上角,不再占用独立 Header 高度。
  • 按钮默认 30% 透明度,鼠标 hover/focus 时恢复完整显示,并通过 Tooltip 说明操作。
  • 切换模式后按钮持续可见。
  • 支持 GFM、表格、代码块等常用 Markdown 语法。
  • 支持 Mermaid 11.16.0 图表渲染,并隔离 Mermaid 语法错误,错误内容不会导致整个应用白屏。
  • 支持 KaTeX/remark-math 数学公式。
  • 增强特殊字段、表格、代码等 Review 样式。
  • 修复左右分栏时右侧错误显示源文件的问题。
  • 左右分栏模式下,源文件与 Review 滚动联动。
  • 对 Markdown 渲染增加错误边界与降级提示,避免单个文件的渲染异常击穿整个应用。
  • 修复 Monaco 编辑器引用兼容问题:通过编辑器组件公开的 getInstance() 获取实例,并在绑定滚动事件前检查 API,避免 onDidScrollChange is not a function 导致白屏。
  • 源文件模式继续支持编辑和保存。

3. 图片与 PDF 预览

  • 支持常见图片格式和不同尺寸图片的预览。
  • 图片预览右上角提供悬浮缩放控制,支持放大、缩小和重置/适配。
  • 支持 PDF 内嵌预览。
  • 图片/PDF 二进制内容通过 JCEF 安全读取后转换为预览数据,不直接使用任意本地文件路径。
  • 工作区持久化时排除大型预览 payload,避免 localStorage 膨胀。

4. 集成终端

  • 可从当前文件目录直接在工作区 Tab 中打开终端,初始工作目录与所选目录一致。
  • JCEF 后端基于 pty4j 创建真实 PTY,支持创建、附加、输入、输出、Resize、状态查询、进程退出通知和终止。
  • 终端输出与退出事件通过现有 window.javaQuery JCEF bridge 推送到前端。
  • 支持跨平台 Shell:
    • macOS/Linux:系统默认 Shell,并支持 Bash、Zsh 等已安装 Shell。
    • Windows:优先检测 PowerShell 7、Windows PowerShell、CMD,并支持已安装的 Bash。
  • 新增终端能力检测接口,仅向设置页展示当前机器实际可用的 Shell。
  • 设置中心新增“终端设置”页,仅在 JCEF 桌面环境显示:
    • 选择新终端默认 Shell。
    • 选择终端颜色主题。
  • 提供 5 套完整 ANSI 调色板:
    • Chat2DB Dark
    • One Dark
    • Dracula
    • Solarized Dark
    • Solarized Light
  • 主题不仅修改背景色,同时应用前景色、光标色和 ANSI 16 色;修改设置后,已打开终端无需重建 session 即可实时更新。
  • 终端标题区的 Shell、工作目录样式同步使用当前主题。
  • 为子进程设置 TERM=xterm-256colorCOLORTERM=truecolorTERM_PROGRAM=Chat2DB
  • 集成终端明确启用彩色输出:仅在终端子进程环境中移除继承的 NO_COLOR,设置 FORCE_COLOR=1CLICOLOR_FORCE=1 和兼容颜色变量,解决 Node 同时检测到 NO_COLOR/FORCE_COLOR 的警告,同时保留命令颜色。
  • 为 Bash/Zsh 提供彩色 Prompt,为 PowerShell 配置 PSReadLine token colors,为 CMD 配置 Prompt 颜色;不会修改系统级环境变量。
  • 终端 Tab 增加终端图标。
  • 移除终端内部独立“结束”按钮,关闭 Tab 时统一处理 session/进程生命周期。
  • 关闭有活动子进程的终端前显示确认提示。
  • 状态查询和 Kill bridge 调用增加 2 秒超时/降级,避免关闭 Tab 被异常 bridge 卡住。
  • 对历史上可能共享同一 session 的终端 Tab 做引用保护:还有其他 Tab 引用时不误杀 session。
  • 复制终端 Tab 时创建全新 PTY/session,保留原终端的工作目录和 Shell,但输入、输出和进程完全独立。
  • 向右/向下拆分终端时同样创建独立 session。
  • 终端 Tab 支持重命名:
    • 右键菜单“重命名”
    • 双击标题行内编辑
    • 重命名只改变当前 Tab 展示名,不影响 Shell/session。
  • 终端 Tab 和运行时 session 不写入工作区持久化,重启后不会恢复失效的本地进程引用。

5. 国际化

  • 新增文件预览、Markdown 模式、图片缩放、终端关闭/重命名和终端设置相关文案。
  • 覆盖 zh-CNen-USja-JPko-KRes-ES
  • 更新并校验 i18n source hashes。

主要实现位置

  • 文件/Markdown/图片/PDF 预览:
    • chat2db-community-client/src/pages/main/workspace/components/WorkspaceTabs/FilePreviewTab.tsx
    • chat2db-community-server/chat2db-community-jcef/src/main/java/ai/chat2db/community/jcef/handler/biz/ReadSqlDirectoryPreviewHandler.java
  • 工作区 Tab 和文件树:
    • chat2db-community-client/src/pages/main/workspace/components/WorkspaceTabs/index.tsx
    • chat2db-community-client/src/pages/main/workspace/components/LocalSQLFileTree/index.tsx
    • chat2db-community-server/chat2db-community-jcef/src/main/java/ai/chat2db/community/jcef/handler/biz/SqlDirectoryTreeStore.java
  • 终端 UI、设置和主题:
    • chat2db-community-client/src/pages/main/workspace/components/WorkspaceTabs/TerminalTab.tsx
    • chat2db-community-client/src/blocks/Setting/TerminalSetting/index.tsx
    • chat2db-community-client/src/components/Xterm/index.tsx
    • chat2db-community-client/src/constants/terminal.ts
  • JCEF PTY/session:
    • chat2db-community-server/chat2db-community-jcef/src/main/java/ai/chat2db/community/jcef/terminal/TerminalSessionManager.java
    • chat2db-community-server/chat2db-community-jcef/src/main/java/ai/chat2db/community/jcef/handler/biz/*TerminalHandler.java

验证结果

前端

  • ESLint:通过。
  • Stylelint:通过。
  • i18n 校验:通过。
  • Community Web 构建:通过。
    • COREPACK_ENABLE_PROJECT_SPEC=0 corepack yarn run build:web:community --app_version=0.0.0
    • Umi Webpack 编译成功。
    • 构建前置的 Chat answer update、Tree title highlight、AI model select option 测试通过。
  • 工作区持久化增加自动化用例,验证终端 session 和大型预览 payload 不会持久化。

JCEF/后端

  • TerminalSessionManagerTest:6 个测试通过,0 failure,0 error,0 skipped。
    • 覆盖 session 创建、输入、Resize、Kill。
    • 覆盖活动子进程状态。
    • 覆盖复制终端创建独立 session 且保留 cwd/Shell。
    • 覆盖 Shell 能力列表。
    • 覆盖移除 NO_COLOR、启用颜色和兼容颜色变量。
  • SqlDirectoryTreeStoreTest 已增加文件树/预览路径相关覆盖。
  • Community 后端完整 clean package:通过。
    • 该打包命令使用 -Dmaven.test.skip=true,测试结果以上述显式启用的 focused test 为准。
  • JCEF prepare:通过。
  • macOS JCEF 本地启动并完成初始化。
  • 用户已完成实际功能测试,确认功能正常。
  • git diff --check:通过。

未覆盖与平台说明

  • 本地仅在 macOS JCEF 完成启动和人工功能验证。
  • Windows/Linux Shell 检测和启动逻辑已实现并有单元测试/源码检查,但本次未在对应系统运行原生 JCEF。
  • 未构建、签名或安装 macOS/Windows/Linux 原生安装包;这些仍需目标平台或 CI 验证。
  • 本 PR 不涉及 Docker、发布、Updater CDN 或生产数据。
c482846f-cc8d-43c9-866f-ed79f6df8053 c40f181b-998c-41f3-98e2-0b22031dba7c 518ef513-c80a-40d5-a769-4c35e887a37d 78038bf9-83ad-4ddc-ac68-a20ca294b455 c1f757fb-cfda-4b18-85f3-e5f33f2db425

6. Tab 拖动自动切分

  • 工作台 Tab 无需先进入模式或使用右键菜单,拖动时自动识别目标 Pane 的上、右、下、左边缘。
  • 拖动过程中显示独立浮动 Tab,并使用与真实 Tab Header 相同的 SVG 图标渲染。
  • 悬停边缘时显示半区阴影预览,松手后自动创建对应方向的分栏并移动当前 Tab。
  • 支持未分栏工作台直接拖出首个左右/上下分栏,也支持在已有嵌套分栏中继续递归切分。
  • 保留同一 Pane 内排序、跨 Pane 移动、固定 Tab 顺序和现有右键切分操作。
  • 阻止将 Pane 中唯一的 Tab 拖到自身边缘,避免生成空 Pane。
  • 新增 workspaceTabDrop.test.ts,覆盖 drop ID、四向布局映射、首个分栏、跨 Pane 嵌套切分和无效唯一 Tab 拖动。
  • 聚焦 ESLint、Stylelint、自动化测试、Community 前端完整构建和 git diff --check 均通过。
  • macOS JCEF 已重新构建并启动,用户完成拖动、阴影落点与浮动图标人工测试,确认功能正常。
image

@auenger
auenger force-pushed the feat/workspace-file-preview-terminal branch from 8597078 to ae975e8 Compare July 28, 2026 03:23
@auenger auenger changed the title feat(workspace): enhance file previews and integrated terminal feat(workspace): enhance previews, terminal, and tab splitting Jul 28, 2026
@auenger

auenger commented Jul 30, 2026

Copy link
Copy Markdown
Contributor Author

已补充最新调整(commit 9d3015d3):

  • 在工作台右侧 AI 按钮上方新增快速创建终端入口;桌面端点击后默认在当前用户 Home 目录创建终端,并沿用已保存的 Shell 设置。
  • 移除终端顶部静态显示 cwd / Shell 的 Header,避免切换目录后信息不同步。
  • 终端按钮 Hover 样式与 AI 按钮保持一致;按钮尺寸维持 28×28,终端图标调整为 18px,以改善视觉大小。

验证结果:

  • 前端聚焦测试通过。
  • yarn run lint 通过。
  • Community 前端构建通过。
  • TerminalSessionManagerTest:7 tests,0 failures / errors。
  • JCEF Community 离线模式启动及手动交互验证通过。
image

@openai0229
openai0229 merged commit 8113c04 into OtterMind:main Aug 3, 2026
16 checks passed
@openai0229 openai0229 moved this from In Review to Done in Chat2DB Community Aug 3, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: Done

Development

Successfully merging this pull request may close these issues.

2 participants