Back to home

nicklin99

dsh-ui-sidebar

No description

Stars
0
Language
TypeScript
Created
Aug 16, 2026
Updated
Aug 16, 2026

Introduction

dsh-ui-sidebar

基于 deepseek-harness@deepseek-ai/dsh-client-ui-sidebar 派生的自定义 dsh 客户端侧边栏插件。

本插件仅替换了品牌 Logo,其余逻辑(折叠动画、会话树槽位、设置槽位、本地化、滚动条跟随等)与上游 ui-sidebar 完全一致。品牌标记使用远程图片(https://wfell.top/nicklin-logo.png)。

工作原理

本插件是上游 ui-sidebarfork 替代品,而非叠加在上游之上的补丁:

  • 通过 cordis.patch.yml 禁用上游 ui-sidebardisabled: true),避免与本插件在 sidebar 槽位重复注册、重复声明子槽位导致冲突。
  • 本插件注册 sidebar 槽位(priority: -1)并声明其子槽位 sidebar.workspaces / sidebar.settings / sidebar.footer.action,成为唯一的侧边栏 shell。
  • 会话树、搜索、分组(注册到 sidebar.workspaces)、设置(注册到 sidebar.settings)等子组件仍由宿主环境的其他独立插件提供。

与上游的差异

  • 移除了默认的 BrandWordmark(展开态单词标记)与 FishLogo(折叠态鲸鱼图标)。
  • 新增本地组件 src/client/Logo.tsx
    • Logo —— 展开态:显示远程图片 wordmark(高度 28px)。
    • LogoCollapsed —— 折叠态:显示同一图片(高度 24px、宽度自适应,对齐上游 FishLogo size 接口)。

修改 Logo

编辑 src/client/Logo.tsx 顶部的 LOGO_URL 常量即可替换品牌图:

const LOGO_URL = 'https://wfell.top/nicklin-logo.png'

图片为横长条 wordmark(约 3:1)。折叠态按高度 24px、宽度自适应完整显示;若折叠 rail(56px 图标列)被撑宽或希望折叠态只用缩略/首字母图标,需调整 LogoCollapsed 的样式。

目录结构

src/
  index.ts                 # 主入口,re-export client 入口
  client/
    index.ts               # 注册 sidebar 槽位、子槽位声明与本地化(apply)
    SidebarRoot.tsx        # 侧边栏外壳(仅此处替换了 logo)
    Logo.tsx               # 自定义 Logo 组件(唯一改动点)
    locales.ts             # 本地化字典
    SidebarRoot.module.css # 样式(复制自上游)
    css-modules.d.ts       # *.module.css 的类型声明
cordis.patch.yml           # dsh 补丁:禁用上游 ui-sidebar + 插入本插件
package.json               # dsh.client / dsh.bundle 声明 + 入口
tsdown.config.ts           # 构建配置(含 CSS module 注入)

构建

pnpm install
pnpm bundle      # 输出到 lib/
pnpm watch       # 监听模式
pnpm typecheck   # 类型检查

该插件依赖 deepseek-harness monorepo 内部的 @deepseek-ai/dsh-client-* 包(workspace:^),需放置于该 monorepo 的 packages/client/ 下, 或将依赖指向本地路径后使用。

作为 dsh 插件加载

package.json 中的 dsh.bundle.patch 指向 cordis.patch.ymldsh.client 声明了客户端入口与注入依赖,dsh 加载器会据此自动加载:

# cordis.patch.yml
- id: ui-sidebar
  name: '@deepseek-ai/dsh-client-ui-sidebar'
  disabled: true          # 禁用上游,避免槽位/子槽位/本地化冲突

- insert:
    - id: dsh-ui-sidebar
      name: "dsh-ui-sidebar"

配置文件(cordis.patch.yml)在 dsh 启动时才重新组合 entry list,修改后必须重启 dsh 才能生效。

"dsh": {
  "bundle": { "patch": "./cordis.patch.yml" },
  "client": {
    "inject": [
      "@deepseek-ai/dsh-client-runtime",
      "@deepseek-ai/dsh-client-ui-layout",
      "@deepseek-ai/dsh-client-locale"
    ],
    "platform": "web"
  }
}