jjxjjjjiik-bot/dsh-chat-timeline

1:1 port of DeepSeek's official web right-side chat navigation rail (ScrollNav) as a DeepSeek Harness (DSH) plugin

Bundle verified MIT JavaScript v0.1.1
Bundle verified

Listed

14

Ui

Bundle verified

Versionv0.1.1
LanguageJavaScript
LicenseMIT
View on GitHub

What it does

1:1 port of DeepSeek's official web right-side chat navigation rail (ScrollNav): hover-expandable rail, reading-position highlight, click-to-jump.

Best for

  • Users navigating long DSH conversations with multiple user messages.
  • Readers who want current-position highlighting, hover previews, and click-to-jump navigation modeled on DeepSeek's web UI.
  • Desktop web layouts where a right-side navigation rail should move aside for an existing workbench.

Not ideal for

  • Mobile use at viewport widths of 767 px or less, where the timeline automatically hides.
  • Short conversations with fewer than two user messages, where the rail provides no value and remains hidden.
  • Users seeking search, editing, summarization, or agent workflow features rather than conversation navigation.

README

dsh-chat-timeline

English 简体中文

License: MIT npm version GitHub stars PRs Welcome

⭐️ 如果这个小插件帮到了你,请给本项目点一个免费的 Star 支持一下! 你的鼓励是持续通宵优化更新的最大动力~

1:1 复刻 DeepSeek 官网右侧「对话导航栏」的 DeepSeek Harness (DSH) 插件——把 chat.deepseek.com 官方网页版的 ScrollNav 界面与交互原样带进你的 DSH Web 聊天界面。

非 DeepSeek 官方出品,与 DeepSeek 无任何关联。

预览

右侧导航栏 悬停展开面板

功能

  • 常驻右侧导航轨——屏幕右侧细长竖轨,每条用户消息对应一个指示线,与官网折叠态一致
  • 全模式主题适配——1:1 像素级复刻 DeepSeek 官网浅色/深色主题,浅色模式下灰线清爽优雅、白底毛玻璃展开面板;深色模式沉浸暗黑
  • 悬停展开——面板显示消息预览,随滚动实时高亮当前阅读位置(品牌蓝)
  • 点击跳转——一键平滑滚动到对应消息,自动加载更早历史
  • 动态避让——智能检测右侧工作台(如 aionui 等工具栏),自动平移贴合聊天区边缘,避免重叠遮挡
  • 自动隐藏——会话少于 2 条用户消息时自动隐藏
  • 移动端适配——视口宽度 ≤ 767px 时自动隐藏,避免在手机上遮挡对话内容;旋转/拉伸窗口后自动恢复
  • 无障碍——ARIA 标签 + 遵循系统「减弱动态效果」设置

工作原理

Host 侧通过会话投影(dshChatTimeline)持久化枚举所有用户消息;客户端 TimelineRail 组件渲染导航轨(挂载于 conversation.input.dock 插槽,portal 到 body),数据源按速度优先:投影 → 已加载节点 → 后台 loadOlder。

安装

方式一:DSH / NPM 一键安装(推荐,最简便)

在终端中执行以下命令(自动从 npm 下载并配置):

dsh plugin --profile web add dsh-chat-timeline

或者:

dsh plugin add dsh-chat-timeline

安装完成后,重启 dsh web 并刷新浏览器即可。


方式二:Windows 本地一键脚本(克隆/下载仓库)
  1. 下载本项目(绿色 Code 按钮 → Download ZIP 解压,或 git clone)
  2. 双击 install.bat —— 脚本自动完成:复制插件 → 注册配置 → pnpm install
  3. 重启 dsh web 并刷新浏览器

脚本可重复运行,不会重复安装。


方式三:手动安装(其他平台或本地开发)
  1. 将插件复制到 $DSH_HOME/profiles/web/plugins/dsh-chat-timeline/($DSH_HOME 通常是 ~/.dsh)
  2. 在 profiles/web/package.json 添加依赖 "dsh-chat-timeline": "file:plugins/dsh-chat-timeline",运行 pnpm install
  3. 在 profiles/web/cordis.patch.yml 添加: ```yaml
    • insert:
      • id: chat-timeline name: dsh-chat-timeline ```
  4. 重启 dsh web 并刷新浏览器

架构参考

  • 布局/CSS:官网 ScrollNav 的 1:1 移植(提取自官方 main.css,以 dsct_ 前缀命名空间化)
  • 插件架构:参考 asukasec/dsh-message-preview(MIT)

License

MIT — 见 LICENSE。”DeepSeek” 商标归其所有者所有,本项目与 DeepSeek 无关联。

Frequently Asked QuestionsFAQ

Use the verified command dsh plugin --profile default add github:jjxjjjjiik-bot/dsh-chat-timeline in a DSH-enabled shell. The command resolves the public package metadata and keeps the plugin attached to the catalog identity shown on this page.