DeepSeek Harness plugin

dsh-ui-web

DSH web GUI right-panel system: a pixel-faithful re-implementation of AionUi's Explorer + Preview columns (file tree, filename search, git changes, multi-tab preview of 10+ formats) driven by real

Jump to install

Source facts

Repository
CAPTAIN1275/dsh-ui-web
Latest update
Aug 16, 2026
Category
Docs & Rendering
GitHub stars
35
Format
plugin
Package path
packages/dsh-aionui-panel
Catalog evidence
Upstream dsh.bundle evidence
Evidence path
packages/dsh-aionui-panel/package.json#dsh.bundle
Checked against
0.1.0-rc.8
Upstream check date
2026-08-20

This evidence comes from the upstream catalog. This site has not installed, run, or security-reviewed the plugin.

Install

Start with a prompt that asks an agent to review the GitHub repository and source. Switch to the command if you want to install it yourself.

Copy this prompt into DSH, Codex, or another agent and ask it to review the GitHub repository and source first.

Do not install or run any commands yet. Read this plugin's GitHub repository, README, and relevant source code. Then answer the questions below clearly and directly so I can decide whether it fits my needs:

1. What is this plugin, and what problem does it solve?
2. Who is it for, and what are its typical use cases?
3. How is it used after installation? Include one minimal example.
4. What known limitations or privacy, security, compatibility, or maintenance risks does it have?
5. Give a clear recommendation: recommend, conditionally recommend, or do not recommend, with reasons.

Distinguish statements documented by the repository, inferences from source code, and unknowns. If evidence is insufficient, say so explicitly. Do not guess or simply repeat the README.

GitHub: https://github.com/CAPTAIN1275/dsh-ui-web/tree/HEAD/packages/dsh-aionui-panel
Plugin: dsh-ui-web
Author: CAPTAIN1275

Check the source files

Read the README and other files from this plugin directory before installing.

File explorer3 files
README.mdSource · read only

dsh-aionui-panel — DSH Web GUI 右侧面板系统

> AionUi 右侧面板的像素级复刻(Apache-2.0 授权参考实现,非抄录):Explorer > 项目面板(文件树 / 文件名搜索 / Git 变更)+ Preview 预览面板(10+ 格式多 tab > 预览)+ 统一拖拽布局系统,按项目隔离的偏好持久化。

安装

推荐直接安装全家桶聚合包 @captain1275/dsh-web-ui-all(一个包装齐全部功能插件与皮肤),或单独安装本插件:

# 推荐:直接从 npm 安装
dsh plugin --profile web add @captain1275/dsh-client-ui-aionui-panel

# 或从仓库安装(开发调试)
git clone https://github.com/zhu1090093659/dsh-web-ui.git
cd dsh-web-ui
pnpm install && pnpm -r build
dsh plugin --profile web add link:$(pwd)/packages/dsh-aionui-panel

安装后重启 dsh web,打开项目会话即可看到聊天区右侧的「预览」与「文件/变更」两块面板。

使用

项目会话(当前会话有工作目录)打开后,聊天区右侧出现两块面板:

  • Explorer(最右栏,默认 260px,范围 220~500px)文件 / 变更 双 tab;

文件树整行点击展开/收起文件夹,点击文件在预览面板打开,顶部按文件名搜索 (150ms 防抖,点击结果 = 定位到树中,不打断思路);变更 tab 读取真实 git 状态,支持 stage / unstage / discard(untracked 走删除,tracked 走 restore,批量放弃有确认)。

  • 拖拽文件到输入框:文件树中的文件行可拖拽(目录行除外),拖到聊天

输入框区域松手即把相对路径(如 deploy/base/deployment.yaml)插入当前 会话草稿的光标处,agent 收到消息后会自行读取该文件,无需手动输入路径; 拖拽过程中输入框上方显示高亮提示条。

  • Preview(右二栏,默认 480px,范围 340~1200px):多 tab 预览,支持

markdown / html / code / diff / csv / pdf / word / excel / ppt / 图片 / 文本 / url;源码/预览切换、分屏编辑(比例持久化)、保存(mtime 冲突检测)、下载、 刷新(4 态:不渲染死按钮)、dirty 点、中键关闭、右键菜单批量关闭 (dirty 确认)、tab 溢出渐变指示器。

交互细节:

  • 拖拽左缘把手调宽(rAF 每帧合并,body user-select:none);双击把手复位默认宽度。
  • 两级宽度钳位(Explorer 先、Preview 后)数学保证聊天区 >= 360px;超限值回写持久化。
  • 折叠 = 宽度缩 0 且组件保持挂载(树展开态 / 预览 tab 不丢),无过渡动画;

折叠后右侧出现浮动展开按钮。

  • 明暗双主题跟随 GUI(body[data-ds-dark-theme]),prefers-reduced-motion 全局禁用动画。
  • 偏好按项目隔离持久化(localStorage keys 与 AionUi 一致):

chat-workspace-width-px / chat-preview-width-px / preview-panel-split-ratio / project-panel-collapse:<root> / explorer-ui:<root> / scm-ui:<root> / preview-ui:<root>(LRU 上限 12 scope)。读取一律范围校验,非法值回退默认。

数据源

真实文件系统与真实 git 仓库,无任何 mock:

  • host 半区(src/index.ts + src/host/)经 /aionui-panel/* HTTP 路由提供

目录列举、文件读取(文本 80k 字符上限 / 图片 data URL)、写入(mtime 冲突 检测)、文件名搜索(跳过 .git / node_modules)、git status(porcelain v1 -z) / stage / unstage / discard,以及 SSE 变更流(fs 监听 + git 轮询)。

  • 所有操作经过工作区门卫:路径必须落在已注册 workspace 内(realpath 规范化 +

前缀校验),浏览器只能读写项目根下的相对路径。

  • browser 半区(src/client/)以当前会话 cwd 作为项目根,切换会话即切换项目。

结构

  • src/index.ts — host 半区入口(cordis 插件:路由注册 + systemPrompt 公告)。
  • src/host/ — fs/git 数据服务与路由层(workspace gate)。
  • src/core/types.ts — 前后半区共享的线上类型。
  • src/client/ — browser 半区:框架无关状态核心(store.ts)、拖拽引擎

drag.ts + hooks/useResizableSplit.ts)、DOM 布局控制器(layout.ts, 向 shell 的三栏 grid 追加面板轨道)、React 组件(explorer / scm / preview)。

  • tests/ — clamp 公式、porcelain 解析、持久化校验、markdown/csv 渲染、

store 行为等纯逻辑测试(vitest,37 个)。

构建

export NPM_TOKEN='<token>'   # 若仍使用私有 scope 认证
pnpm install
pnpm -r build

署名

本项目是 AionUi(iOfficeAI/AionUi,Apache-2.0)右侧面板系统的复刻实现: 尺寸、颜色、动效、交互参数来自对 v2.1.53 的实测调研(研究报告与截图见 aionui-research 仓库),实现为全新代码,未大段抄录源码。上游版权归 AionUi 项目所有,本项目仅按 Apache-2.0 约定保留署名。