Preface

When running a round of agent conversations in DeepSeek Harness (DSH), tool calls, user inputs, and assistant outputs are stacked in the conversation area in chronological order. As the number of steps increases, it becomes difficult to see at a glance “which step called what and what the dependencies are before and after”. The community already has trajectory-like solutions; dsh-plan-graph is an out-of-tree plugin package maintained by HR2AY, which renders a snapshot of the current session into a pannable and zoomable flowchart in the browser and adds a Plan Graph tab to the conversation view ring.

Below, we will introduce its positioning, core capabilities, and installation methods. Facts are based on the GitHub repository README; the SkillHub directory page is available at skillhub.cn/plugins/HR2AY/DSH-Plan-Graph.

What is this

dsh-plan-graph (npm package name dsh-plan-graph, current version 0.3.0) is a DSH plugin bundle: it reads tool calls and messages from session snapshots and generates an interactive flowchart on the client side. It is maintained by HR2AY, licensed under MIT, and categorized as “Model Reasoning” on SkillHub.

It does not replace the DSH core but registers with conversation.view / details through standard client plugin services (slots, locale, layout), adding a graph view alongside the conversation interface.

Core Features

Flowchart View

The Plan Graph tab provides a pannable/zoomable canvas, node cards colored by status, a node details panel, and several toolbar toggles:

  • Hide tool calls: Hides tool call nodes (effective in the graph; if the deployed ui-conversation consumes the chatNodeVisibility service, the conversation area will also filter accordingly).
  • Group by turn: Groups nodes by turn.
  • Follow latest: Follows the latest node.
  • Merge into conversation: Merges the graph sidebar into the actual right-side conversation sidebar.

Node types cover tool calls, assistant outputs, user inputs, steering, context, etc.; newer versions display “input” for user/steering nodes and “completed” for context nodes.

Favorites

The toolbar button opens a bottom-center panel displaying a favorites list with color-coded type blocks, summaries, and timestamps. Favorites are persisted to localStorage by session, with the key dsh.plan-graph.fav.<sessionId>; they are deduplicated by node ID, with a limit of 100 items.

How to add: Right-click a node menu or drag a node to the toolbar favorites button. Clicking an item centers and flashes it in the graph; if the node has left the current window, it falls back to the corresponding conversation line by seq/callId. Deletion is done via the node right-click menu.

Node Right-Click Menu

Right-clicking a node allows: adding/removing favorites, locating in the conversation area (for tool call nodes), copying node information, and viewing details. The menu closes on outside clicks, pressing Escape, or canvas interactions.

Locate in Conversation

Maps any node to the corresponding line in the conversation area:

  • Tool calls: By callId
  • Assistant outputs: By data.finalNode.seq
  • User inputs / steering / context: By data.seq

Then waits for the data-chat-flow-key anchor to appear, scrolls and flashes; after a 10-second timeout, it silently falls back to locating within the graph. If the deployment provides an upstream optional chatLocate service, that service is used first.

Graph highlighting is automatically cleared via CSS animationend (the dynamic client half-side does not expose browser timer globals, so setTimeout is not available).

Installation and Enablement

The plugin runs with the current dsh process permissions; when installing from GitHub source, the prepare script will execute a build locally. Before installation, check the source code and MIT license, and pin the commit SHA.

Local Directory or Registry

In the directory containing the package, run:

dsh plugin --profile demo add ./plan-graph-bundle
dsh --profile demo

Installing from GitHub

Source installation, not pre-built artifacts; prepare will build client.js during installation:

dsh plugin --profile demo add github:<you>/plan-graph-bundle#<sha>

pnpm defaults to refusing to run prepare; you need to write the package key printed by pnpm into the profile’s pnpm-workspace.yaml:

allowBuilds:
  dsh-plan-graph: true

Then re-execute add. allowBuilds means allowing this package to execute code locally during installation; please pin #<sha> and only install from trusted sources.

Installing from Tarball

No build permissions required: execute pnpm pack in the package directory, then:

dsh plugin --profile demo add ./dsh-plan-graph-0.3.0.tgz

Installing from npm

After the package is published:

dsh plugin --profile demo add dsh-plan-graph

Verification

You can check if the layer is loaded without starting the full process:

dsh --profile demo --dump-config

The output should include the # == dsh-plan-graph layer.

Typical Usage

  1. Add the plugin to the profile using the commands above and start dsh --profile demo.
  2. Open or create a session; the default remains the Chat view. Click Plan Graph on the view ring to enter the flowchart.
  3. Drag the canvas to browse the call chain; use the toolbar to toggle “Hide tool calls”, “Group by turn”, and “Follow latest”.
  4. Right-click nodes to favorite, copy information, or “Locate in conversation”; when needed, merge the graph sidebar into the right-side conversation bar using Merge into conversation.
  5. If you want the session to open the flowchart by default, the deployment must provide a conversationDefaultView service ({ id: 'plan-graph' }); the plugin itself does not force a change to the default view.

When developers modify browser-side logic, edit client.body.js and run npm run prepare (or node scripts/build-client.mjs) to regenerate client.js; do not directly modify the generated files.

Use Cases and Notes

Who is it for

  • Developers who need to visualize tool call chains and message dependencies in DSH sessions.
  • Teams already using the DSH plugin system and looking to extend the conversation view out-of-tree.

Dependencies and Limitations

  • The browser half-side depends on conversation.view / details and several client injections (@deepseek-ai/dsh-client-locale, dsh-client-runtime, dsh-client-ui-conversation, dsh-client-ui-layout) provided by the DSH web surface.
  • “Hide tool calls” only affects the graph on unpatched stock ui-conversation and does not change the conversation area; it only works bidirectionally in deployments that consume chatNodeVisibility.
  • “Locate in conversation” relies on the data-chat-flow-key anchor convention of the conversation view layer; if upstream renames it, the function will silently fall back to locating within the graph without throwing an error.
  • The chatNodeVisibility service provides subscribe(fn); if missing, switching from Plan Graph back to Chat may cause the conversation page to go blank (newer versions have fixed this issue).

SkillHub is an independent community directory with no official affiliation with DeepSeek / High-Flyer; please review the HR2AY/DSH-Plan-Graph source code yourself before installing the plugin.

Conclusion

dsh-plan-graph draws tool calls and messages in the conversation as an interactive flowchart, supporting favorites, right-click menus, and bidirectional location in the conversation area, making it suitable for debugging complex agent traces in DSH. Directory page: skillhub.cn/plugins/HR2AY/DSH-Plan-Graph; source code and full documentation: github.com/HR2AY/DSH-Plan-Graph.