Preface

In DSH’s web client, a long conversation is often composed of interleaved model outputs and user messages. To look back at “what I asked at that time,” one must scroll up continuously, which becomes increasingly time-consuming as the number of messages grows. Codex’s conversation interface provides a directory navigation on the left side; clicking jumps directly to the corresponding message. This approach is worth emulating.

dsh-user-message-jump brings this capability to the DSH web client: a vertical strip is displayed at the left edge of the conversation area, where each short line represents a user message. Hovering provides a preview, and clicking jumps to the message. Below, we introduce its features, installation method, and notes.

What is this

dsh-user-message-jump is a DSH web client plugin maintained by jiangnan-awa, current version 0.1.0, licensed under MIT (stated in both README and package.json).

It solves a specific problem: quickly locating user messages in long conversations. The plugin does not modify conversation content; it simply adds a navigation vertical strip to the client interface.

Core Features

According to the README description, the plugin behaves as follows:

  • Vertical Strip and Horizontal Lines: A vertical strip about 14px wide appears at the left edge of the conversation area. Each short horizontal line represents a user message, including both ordinary user messages and steering messages inserted during runtime, arranged chronologically from top to bottom.
  • Hover Preview: The horizontal line smoothly expands (12px → 36px) and changes to the brand color, with a bubble popping up on the right displaying a message text preview (up to 3 lines) and the send time.
  • Click to Jump: The conversation scrolls to the corresponding message, leaving a 12px gap at the top; the message row is highlighted with a brand-colored outline for about 1.2 seconds, and the corresponding horizontal line remains highlighted.
  • Hit Area and Penetration: The area between horizontal lines is a seamless hit area (8px high each); moving the mouse between adjacent lines will not cause “empty selection”; clicking on the empty space of the vertical strip penetrates through and does not obstruct conversation content.
  • Auto Hide: The vertical strip is automatically hidden when there are no user messages.
  • Keyboard Operation: After focusing with Tab, press Enter or Space to jump.
  • Theme Following: Styles use only DSH theme tokens (e.g., --dsw-alias-bg-overlay, --dsw-alias-brand-primary) and follow the light/dark theme.

Installation and Enablement

First, build. The repository has committed lib/client.js, which can be used directly; if you need to modify the source code, build again after making changes:

npm run build

Next, install the plugin into the profile’s bundle stack using the official DSH installation command. This package declares dsh.bundle (i.e., the package-level patch layer in cordis.patch.yml), so it can be installed directly:

dsh plugin --profile <name> add dsh-user-message-jump

This command is equivalent to manually mounting the following in the profile’s cordis.patch.yml:

- insert:
    - id: user-message-jump
      name: dsh-user-message-jump

Note: If the profile already contains the manual mounting lines above, delete them before switching to the bundle channel to avoid double mounting.

After the above steps, restart DSH. The web client will scan and embed this package into the startup manifest (path format like /plugins/<name>/client.js?rev=<hash>) via dsh.client, taking effect after refreshing the page.

Environment Requirements

  • DSH version must support the web client module system (dsh.client / window.__ModuleLoader__);
  • The runtime environment must include react (seed module, peerDependencies is ^18.2.0) and the conversation UI package that declares the conversation.session.header.actions slot (included with DSH);
  • Node >= 18.

Source Code and Secondary Development

The repository structure is as follows:

├── package.json        # dsh.bundle declaration + dsh.client declaration + exports["./client"]
├── cordis.patch.yml    # dsh.bundle.patch package-level patch layer (single line insert)
├── src/
   ├── client.js       # Plugin source code (pure JS, createPlugin(React) factory)
   └── style.css       # Vertical strip styles (uses only DSH theme tokens)
├── scripts/
   └── build.mjs       # Bundles into window.__ModuleLoader__.load format
├── lib/
   └── client.js       # Build artifact (committed, required for scanning)
└── README.md

After modifying the source code, run npm run build to regenerate lib/client.js. The output includes a content hash rev, and the page will automatically pick up the new package.

Additionally, the same functionality can be loaded temporarily without installation as a dynamic Cordis plugin. The code structure is slightly different: CSS uses styles.insert, timers use ctx.timer (inject: ['timer']), and there is no need for __ModuleLoader__ wrapping. See DSH’s Cordis plugin development documentation for details.

Use Cases and Notes

Suitable for two types of people: users who frequently run long conversations in the DSH web client and need to trace back their own messages; and developers who want to implement similar navigation capabilities on the DSH client. They can treat it as a reference implementation—from dsh.bundle declaration to client module bundling, to the use of theme tokens, the repository contains the corresponding files.

Please note before installation: The plugin runs with the permissions of the current DSH process. Before installing into a profile, check the source code and license. The license for this plugin is MIT, and the source code is available on GitHub. Also, confirm that there are no duplicate manual mounting lines in the profile and that the runtime environment meets the version requirements listed above.

Summary

dsh-user-message-jump accomplishes a small but specific task: turning user messages into a clickable directory vertical strip, saving time spent scrolling back and forth in long conversations. Its bundling and mounting method also aligns with DSH’s “everything is a plugin” philosophy. If you want to write your own client plugin, you can refer directly to this repository.