Preface¶
In the DSH chat interface, a lengthy conversation often comprises multiple rounds of user/assistant interactions. While the scroll bar allows returning to approximate positions, precisely locating a specific user query within dozens of rounds still requires frequent scrolling up and down. Some users resort to browser search or relying on memory of approximate sections, which is inefficient in long-context, multi-branch conversations.
vlln/dsh-navbar provides a node navigation bar along the right edge of the conversation area: each user message corresponds to a node, offering hover previews and click-to-jump functionality, while highlighting the current node based on the reading position. Below, we introduce its positioning, capabilities, and installation method.
What Is It¶
dsh-navbar is a DSH client-side plugin maintained by vllm, currently at npm version 0.4.0. It renders an evenly spaced vertical string of nodes along the right edge of the conversation area (one node per user message), displays a preview card on hover, and smoothly scrolls to the corresponding message on click. The active node is highlighted as a brand-blue capsule that follows the current reading position. The plugin implements the dsh-external/issues#144 specification and takes the form of an official bundle plugin (dsh.bundle + dshClient channel, browser-only, Node half has an empty apply, 0 patches). GitHub repository: https://github.com/vllm/dsh-navbar; Community directory page: https://www.skillhub.cn/plugins/vlln/dsh-navbar.
Core Features¶
Node Navigation Bar¶
A vertical node bar is displayed along the right edge of the conversation area, with each node corresponding to a user message. It automatically hides if there are fewer than 2 user messages; it does not appear on non-chat pages. By default, it is invisible until hovered over, becoming visible when the mouse enters.
Follows Reading Position¶
The node corresponding to the current reading position is highlighted with a 22px brand-blue capsule and moves automatically with scrolling.
Hover Preview and Continuous Hit¶
Hovering over a node displays a message preview card (truncated to 6 lines, styled to align with the official HoverCard). The entire navigation bar (including node gaps) responds to hover: the preview switches to the nearest node, the corresponding capsule temporarily elongates to gray, indicating the clickable area with no dead zones.
Scroll Wheel Switching and Click Navigation¶
When the cursor is on the navigation bar, the scroll wheel switches between adjacent user messages (and prevents scrolling in the conversation area). The entire navigation bar is clickable (including gaps, jumping to the nearest node), and the capsule hit area is enlarged, eliminating the need to precisely align with small dots. Clicking results in smooth scrolling, with the target marked by a brand-blue highlight ring.
Sliding Window¶
When nodes exceed 11, only those within the window are displayed to prevent overflow.
Loading Earlier History¶
If the current session still has unloaded earlier messages, an ↑ button is fixed at the top of the navigation bar. Clicking it fetches history via the official “Load earlier” control; the navigation bar grows new nodes at the top; once fully loaded, the button hides automatically and is disabled during loading. Hovering displays a tooltip card in the same style as the node preview; the loading tooltip shows “Loading…”. Clicking forwards to the official control, preserving the reading position.
Message Pinning¶
The assistant operation bar (between copy and Good response) provides a 📌 button. Once pinned, the corresponding turn displays as a golden elongated oval node in the navigation bar (always visible); the preview card bears a 📌 badge, and clicking jumps directly to the pinned reply. The pin state is saved in the browser’s localStorage per session, remaining effective after refresh; clicking again unpins.
Implementation Constraints¶
Does not rely on data-channel: driven solely by official anchor attributes (data-time-hover-root, user row since 0806), no polling, no routing, no tools calls. Animation is disabled under prefers-reduced-motion.
Installation and Enabling¶
It is recommended to install from the git source in one line (build artifacts are committed; git source does not trigger builds):
dsh plugin --profile web add "github:vllm/dsh-navbar#main"
Alternatively, use the npm source:
dsh plugin --profile web add @vlln/dsh-navbar@0.4.0
If the source code is already local, first git clone, then execute:
cd dsh-navbar && dsh plugin --profile web add .
After installation, a restart of the web is required for it to take effect; it can be enabled or disabled in the Plugins panel on the settings page.
Runtime requirements (from package.json): Node >=22.19.0, DSH >=0.1.0-rc.5.
Typical Usage¶
The plugin works out of the box, requiring no additional commands or tools. On the chat page (Chat view), the node navigation bar is visible along the right edge: hover to preview, click to jump.
Pinning a Reply: Move the mouse to the operation bar of an assistant message and click 📌. The corresponding turn in the navigation bar turns into a golden oval node; click 📌 again to unpin.
Loading Earlier History: If there is still unloaded content at the top of the session, click the ↑ at the top of the navigation bar. After loading, new nodes appear at the top; once all history is loaded, the button disappears.
Applicable Scenarios and Notes¶
Suitable for developers and users who frequently browse long conversations on the DSH web and need quick location by user turns. The plugin runs only on the browser client and does not alter server-side logic.
Before installation, it is advisable to review the GitHub source code and the MIT license. The plugin runs with the permissions of the current DSH process; before installing third-party plugins, users should review the code and license terms themselves. The SkillHub directory is a community site and has no official affiliation with DeepSeek / High-Flyer.
Conclusion¶
dsh-navbar transforms user messages in long conversations into a navigable, previewable node string along the right edge, supporting pinning replies and loading earlier history, reducing the need for repetitive scrolling in long contexts.
- Directory page: https://www.skillhub.cn/plugins/vlln/dsh-navbar
- GitHub: https://github.com/vllm/dsh-navbar