In long DSH Web conversations, quickly locating user messages often requires manual scrolling. dsh-conversation-nav-dots adds a column of navigation markers along the right edge of the conversation interface. Each marker represents a user message and lets you jump to it with a click.

This is a client-side plugin maintained by yuioi666 under the MIT license. It has no additional runtime dependencies, and its core purpose is to provide a navigation entry point on the right side.

Core Features

  • Minimal UI: In the default state, it only shows thin horizontal markers, so it does not interfere with reading.
  • Hover Preview: Hovering over the right-side area expands a full message preview panel.
  • Instant Jump: Click any marker or preview text to jump directly to the corresponding message (no animation).
  • Active Tracking: The marker corresponding to the currently visible message is highlighted in blue.
  • Automatic Refresh: Switching conversations automatically refreshes the navigation dots.
  • Scrollable: When there are too many messages, the navigation list can scroll (maximum height is about 20% of the viewport).
  • Lightweight: Pure DOM implementation with zero runtime overhead.

Installation and Enablement

Install it using the official command:

dsh plugin --profile web add dsh-conversation-nav-dots

After installation, restart DSH Web for the plugin to take effect:

dsh web

Usage

  1. Open any conversation.
  2. Look at the right edge of the screen; a column of thin horizontal markers will appear.
  3. Hover over a marker to expand the message preview panel.
  4. Click any marker or preview text to jump the page to the corresponding message position.
  5. The marker corresponding to the message you are currently viewing appears in blue.

Customization and Limitations

  • Dark Theme: The plugin natively supports the dark theme. Colors are exposed via CSS variables and can be freely customized.
  • Desktop-First: The plugin is designed for desktop; the experience may be poor on mobile with narrow viewports.
  • Best Use Case: It works best in long conversations with more than 10 turns; it is not necessary for scenarios with only a few messages.
  • Performance: It uses IntersectionObserver and requestAnimationFrame to track scrolling, with extremely low performance overhead.

Developer Reference

If you need to listen for navigation jump events through code, you can run the following command in the browser console:

document.querySelector('.dsh-nd-row')?.click()