Skip to main content

How to use dsh-ui-web

Recreates AionUi right panel for DSH Web GUI: includes Explorer file tree with Git changes, multi-format preview, and per-project panel width persistence.

This article is auto-derived from indexed fields (wiki / faq / compatibility_json), not freshly AI-generated.

This article is derived from the plugin's already-indexed fields (wiki / faq / compatibility_json / readme), not freshly generated by AI. Source field is noted at the end of each section.

Quick start

dsh-aionui-panel

— source: plugin_wiki.wiki_content

Install & verify

dsh plugin --profile web add @captain1275/dsh-client-ui-aionui-panel

Run the command above in your DSH Web Profile. Then enable the plugin in the plugin list.

— source: plugins.install

Key points

  • 毛玻璃输入框:高斯模糊(backdrop-filter 30px)+ 半透明玻璃底 + 细边框 + 内高光
  • 自定义背景:URL / 本地图片 / 动图(GIF/WebP)/ 视频(mp4/webm) / 透明度 / 模糊调节,
  • 仿Claude Code推理等级滑块:点击模型菜单的「推理等级」弹出 Effort 滑块面板——无极拖动、松手吸附、
  • 用户消息气泡毛玻璃:与输入框统一的玻璃质感
  • 图片资源(社区同人资源,codex-pet-DeepSeek-girl)

— source: plugin_wiki.readme_en (fallback readme_raw)

FAQ

What can be seen after installing this plugin?

In the project session opened with dsh web, two additional panels appear on the right side of the chat area: Explorer (file tree + Git changes tab) and Preview (multi-tab file preview). Files in the file tree can be dragged into the chat input box and released to insert the relative path at the draft cursor position, eliminating the need to manually type paths (src/client/index.ts:84-118, src/index.ts:34).

What formats does file preview support?

markdown / html / code / diff / csv / pdf / word / excel / ppt / image / text / url, a total of 10+ formats; supports source code/preview switching, split-pane editing (ratio persistence), saving (mtime conflict detection), downloading, refreshing, dirty marks, middle-click to close, right-click batch close (dirty confirmation), tab overflow gradient indicator (README.md:31-42, src/client/fileType.ts:1-60).

Must use DSH Web GUI (profile=web) to see this plugin?

Yes. cordis.patch.yml inserts the plugin line into the web profile list, and the package.json#dsh.client.platform field is also web; in CLI mode (headless profile), the browser half will not load (cordis.patch.yml:11-13, package.json:20-32).

Is the data source real file system or mock?

Real. The host process provides directory listing, file reading (text 80k character limit, image 8 MB data URL), writing (mtime conflict detection), file name search (skipping .git and node_modules), git status (porcelain v1 -z) / stage / unstage / discard via the /aionui-panel/* HTTP route; recursive fs.watch + 2-second git polling form the SSE change stream (src/host/fs-service.ts:1-49, src/host/routes.ts:107-138, src/index.ts:22-49).

What happens if the workspace path is not in the registered workspace?

Directly reject. All requests' project root pass through the workspace gate: after realpath normalization, it must fall within one of the workspaces returned by the host workspace registry or its subdirectories; out-of-bounds returns a stable error code path-outside-root, and the /aionui-panel/* route layer also enforces JSON content-type validation to block form CSRF without CORS preflight (src/host/gate.ts:1-74, src/host/routes.ts:183-205).

Can I use it without git binary installed?

File tree and preview are fully usable. The host half performs a git availability probe; if unavailable, it logs and dispatches a gitUnavailable event, and the SCM tab enters a friendly "git not installed" state without retrying spawn every 2 seconds (src/host/routes.ts:101-122, src/client/index.ts:113-118).

Will panel width and collapse state be saved?

Saved to localStorage isolated by project, key names follow AionUi naming: 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 upper limit 12 scopes; illegal values fall back to default after range validation (src/client/persist.ts:1-80, README.md:39-54).

Will agents know about this panel?

Yes. The host half announces this plugin's capabilities, limitations, and collaboration methods to all agents via the systemPrompt section (order=210); when the user mentions "right panel / preview panel / file tree / changes panel", the model knows it refers to this plugin (src/index.ts:34, src/index.ts:44-49).

How to troubleshoot when uninstalling / bugs occur?

Any DOM/runtime wiring failures on the browser side only console.error without throwing, ensuring the web shell is not dragged down by the plugin; open Developer Tools Console and filter dsh-aionui-panel to see failure reasons (src/client/index.ts:151-153).

— source: plugin_wiki.faq_json

Compatibility

  • DSH: 0.1.0-rc.6+
  • Node: 未声明(仓库根与本包 package.json 均未声明 engines)

— source: plugin_wiki.compatibility_json

Pitfalls

Review the upstream repo before installing. This guide is auto-derived from indexed fields and may lag the latest release. If anything contradicts the official docs, treat the upstream source as authoritative.

— source: general rule

How to use dsh-ui-web