Lhy723/dsh-agent-canvas
DSH Web 的代理 / 子代理 / 工作流画布标签页
Project Overview项目介绍
This is a native DSH plugin, built exclusively for the DSH Web platform to add a new customizable conversation view tab. It registers as a conversation.view plugin that sits after the default Conversation and Trajectory tabs in the DSH Web interface. Once installed from npm or local source, you can open the new Agent Canvas tab to get a global, graphical overview of how your current active DSH session splits tasks, schedules subagents, and executes tools. The plugin automatically adapts to whatever light or dark theme you have enabled in your DSH Web user profile.
The canvas uses a force-directed graph layout that automatically repels unconnected nodes and pulls connected nodes closer together for visual readability. You can drag individual nodes to custom reposition them, pan the entire canvas by dragging the background, and zoom in or out with your mouse wheel. Workflows are automatically grouped by their phase, creating a clear hierarchical structure from main agent to workflow to phase to subagent. Different types of nodes use distinct styling: card-based nodes for workflows, phases, and subagents, while the main agent and tools use simpler default round nodes.
To install the plugin to your DSH web profile, you can run npm install dsh-agent-canvas then add it with the DSH CLI command dsh plugin --profile web add ./node_modules/dsh-agent-canvas. If you are installing from local source or a downloaded tarball, you can run the same command with the path to the local directory or packed .tgz file instead. Before you first open the Agent Canvas tab, you need to confirm that all subagent and workflow related tools are enabled in your DSH profile patch, otherwise the canvas will not show any nodes. The plugin is released under the MIT license, and requires npm and a TypeScript toolchain to build from source code.
dsh-agent-canvas 是专为 DSH Web 开发的原生对话视图插件,它可以将 DSH 运行会话中的代理、子代理、工作流、阶段和工具调用关系转换为一张可交互、实时更新的关系画布。安装完成后,它会在 DSH Web 默认的“对话”“轨迹”标签页后新增“Agent 画布”标签页,自动适配 DSH 的浅色和深色主题。
核心功能包括力导向图自动布局、实时数据同步、工作流按阶段分组、卡片式节点分类展示,支持拖动节点、拖动画布、滚轮缩放画布大小,还可以在右上角设置面板实时调节力导向各项参数,参数会自动持久化到 localStorage 中,刷新页面后用户自定义设置不会丢失。
插件需要安装到 DSH web 配置文件中,可以通过 npm 安装、本地源码打包安装或 tarball 安装三种方式完成。使用前需要确保 DSH 配置中已经启用了 subagent 和 workflow 相关工具,否则画布无法正确显示节点和关系信息,构建开发需要依赖 npm 和 TypeScript 工具链。
请帮我安装这个 DSH 插件。安装前先完成【兼容性检查 + 安全性检查】,检查通过再动手。
插件:dsh-agent-canvas(Lhy723/dsh-agent-canvas)
仓库:https://github.com/Lhy723/dsh-agent-canvas
本站详情页:https://www.yhbd.top/plugins/lhy723-dsh-agent-canvas/
本站登记:类型 plugin · 归类 原生 DSH 插件 · 许可证未声明 · ⭐ 3 · 最近提交 2026-08-16 · 主语言 TypeScript
按下面顺序执行,每步先把结论告诉我,再进入下一步:
【1 兼容性检查】
① 我这边:DSH 版本、Node 版本、操作系统、当前 profile(web / desktop)。
② 读它的 README、package.json、插件 manifest,列出它要求的 DSH 版本 / Node 版本 / 操作系统 / 外部依赖 / 需要另外先装的运行时。
③ 逐条比对,结论只写「满足 / 不满足 / 未知」三种;不满足的给出可行替代方案。
④ 检查是否和我已装的插件冲突:命令名重复、skill / tool 重名、端口占用、重复注册的 MCP server。
【2 安全性检查】
① 仓库可信度:和上面「本站登记」是否一致;star / fork 数、创建时间、最近提交,是否归档或长期停更。
② 安装脚本:逐行看 package.json 的 preinstall / install / postinstall,以及 install.sh、setup.ps1 之类脚本。出现 curl|bash、下载后直接执行、混淆代码、访问与插件功能无关的域名,立刻停下来告诉我,不要继续装。
③ 依赖:列出新增依赖,标出无人维护、或与知名包拼写近似的可疑包(typosquatting)。
④ 权限与副作用:它会读写哪些目录、访问哪些域名、需要哪些 DSH 权限(filesystem / network / shell / clipboard 等),以及怎么卸载和回滚。
⑤ 如果它要求 sudo / 管理员权限,或权限明显超出功能所需,先停下来问我。
【3 安装】
上面两步没有「不满足」和「高危项」时才执行;用官方推荐方式安装,不要自行提权。
【4 汇报】
用表格输出:检查项 / 结论 / 依据 / 是否需要我决策。拿不准的一律写「未知」并说明要我怎么确认——不要猜,也不要替我决定。
Send this message to DSH in your current session: it verifies compatibility and security first (answering met / not met / unknown item by item) and only installs once everything checks out — it will stop and ask you if it finds a high-risk item. The box scrolls; the copy is the full prompt. CLI install commands may not be accurate across systems, so DSH is the safer route.把上面这条消息直接发给当前会话里的 DSH:它会先核对兼容性与安全性(逐条给「满足 / 不满足 / 未知」),确认没问题再安装,有高危项会停下来问你。框内可滚动,复制到的是完整提示词;安装命令不一定准确,发给 DSH 更稳。
- No license declared - all rights reserved by default; ask the author before commercial use or redistribution未声明开源许可证 —— 默认「保留所有权利」,商用或再分发前先问作者
- Only 3 stars - very few users, little community feedback星标只有 3,几乎没人在用,遇到问题缺少社区反馈
DSH walks through these 9 checksDSH 会逐条核对这 9 项
Compatibility兼容性
- DSH, Node, OS and profile requirementsDSH 版本 / Node 版本 / 操作系统 / profile 是否满足要求
- External dependencies and runtimes (Electron / Python / Docker, ...)外部依赖与运行时(Electron / Python / Docker 等)是否齐备
- Conflicts with installed plugins: command names, skill / tool names, ports, duplicate MCP registration与已装插件是否冲突:命令名、skill / tool 重名、端口占用、重复 MCP 注册
Security安全性
- Repo matches the facts registered here; archived or abandoned?仓库是否与页面登记一致,是否归档或长期停更
- Safety of preinstall / install / postinstall and install.sh / setup.ps1preinstall / install / postinstall 与 install.sh、setup.ps1 是否安全
- curl|bash, download-then-execute, obfuscation, unrelated domains → stop immediatelycurl|bash、下载即执行、混淆代码、无关域名 → 立刻停止
- Typosquatting or unmaintained packages among the new dependencies新增依赖里有没有 typosquatting 或无人维护的包
- Requested permissions vs. what the feature actually needs申请了哪些权限、是否超出功能所需(filesystem / network / shell / clipboard)
- Any sudo / admin requirement, plus uninstall and rollback是否要求 sudo / 管理员权限,以及卸载与回滚方式
Anything uncertain must be marked unknown with a note on how to confirm it. This site's signal screen is a static snapshot, not a security audit.拿不准的必须标「未知」并说明要我怎么确认。本站的信号筛查是静态快照,不能替代安全审计。
Or use CLI install (for developers)或使用命令行安装(适合开发者)
CLI Install命令行安装
dsh plugin --profile web add github:Lhy723/dsh-agent-canvas
把 Lhy723/dsh-agent-canvas 加入你的 DSH 配置(web profile)即可启用。
READMEREADME
dsh-agent-canvas
把一个 DSH Web 会话里的 Agent、Subagent、Workflow、Phase 和工具调用,变成一张可交互、实时更新的关系画布。
它作为 conversation.view 插件注册在“对话”和“轨迹”之后:打开 Agent 画布 Tab,就能从全局视角观察一次运行如何拆分任务、调度子代理、执行工具,并在浅色 / 深色主题之间自动适配。
宣传图中的二次元角色依据项目提供的视觉参考重新创作,用作仓库的 GitHub Social Preview;界面截图为与当前组件行为一致的示例会话。
功能
- 力导向图布局
- 节点之间自动排斥,有连线的节点互相牵引。
- 支持拖动节点、拖动画布、滚轮缩放。
- 实时数据同步
- 与对话记录同源:
useSession/useSessions读取会话快照和会话列表。 - Subagent / Workflow / 工具调用状态变化时,画布自动更新。
- 与对话记录同源:
- Workflow 按 Phase 分组
- 主 Agent → Workflow → Phase → Subagent,层级清晰。
- 卡片式节点
- Workflow / Phase / Subagent 使用白底圆角卡片。
- 左侧彩色条区分类型,顶部状态点 + 类型徽标 + 名字,下方内容可滚动。
- 工具和主 Agent 使用圆形节点。
- 力导向参数实时调节
- 右上角 ⚙ 设置面板,可实时调整:
- 向心力
- 节点排斥力
- 连线吸引力
- 连线自然距离
- 阻尼
- 参数自动持久化到
localStorage,刷新后保留。
- 右上角 ⚙ 设置面板,可实时调整:
- 跟随 DSH 明暗模式
- 自动监听
data-ds-dark-theme,画布和卡片在浅色/深色模式下自动适配。
- 自动监听
功能速览
| 模块 | 你能看到什么 | 交互 / 行为 |
|---|---|---|
| Agent & Subagent | 根 Agent、直接子代理、运行状态和任务摘要 | 节点可拖动,状态变化会实时更新 |
| Workflow & Phase | Workflow → Phase → Subagent 的层级关系 | Workflow 成员不会重复连回根 Agent,图更清晰 |
| 工具调用 | 运行中的工具,以及最近完成的工具结果 | 活动连线使用虚线,最近最多保留 12 个结果节点 |
| 力导向布局 | 向心力、排斥力、吸引力、自然距离、阻尼 | 右上角 ⚙ 面板实时调整,并持久化到 localStorage |
| 画布操作 | 平移、缩放、视图重置 | 鼠标拖拽背景 / 节点,滚轮缩放或使用右侧按钮 |
| 主题适配 | DSH Web 的浅色和深色模式 | 自动监听 data-ds-dark-theme |
演示截图
浅色模式:从 Agent 看到完整协作树

深色模式:打开力导向参数面板

关系模型
画布使用和会话区相同的数据源,节点关系大致如下:
主 Agent
├── Workflow
│ └── Phase
│ └── Subagent
├── 直接 Subagent
└── Tool / Tool result
Showing the opening section of the README — the full document lives in the repository以上为 README 开头摘要,完整文档在仓库内 · View the full README on GitHub →在 GitHub 查看完整 README →
tt-a1i/archify
loopx-project/loopx
ZSeven-W/openpencil
omdsh-dev/DSH-better-sidebar
NanmiCoder/dsh-agent-teams
LiPu-jpg/Openwrite