dsh-diff-view: A Universal Diff Viewer Plugin for DeepSeek Harness

Introduction¶

In the DeepSeek Harness (DSH) plugin ecosystem, client plugins often need to display textual differences. Handwriting Diff algorithms, handling line alignment, and word-level highlighting are not only costly to develop, but also error-prone. dsh-diff-view provides a general-purpose Diff viewer component that reuses the styling and algorithm logic of native DSH Review, making it directly callable by plugin developers.

What Is This¶

This is a DSH client plugin maintained by joao-paulo-santos. It does not contain an independent access UI; instead, it is injected into the DSH client as a service and provides Diff view rendering capabilities.

Core Features¶

The core capabilities of this plugin focus on computing and displaying textual differences:

Diff component reuse: Provides diffFileComponent, which supports generating a file diff view from two complete texts.
Algorithm support: Performs line-level comparison based on the LCS (Longest Common Subsequence) algorithm.
Word highlighting: Supports word-level difference marking.
View modes: Supports switching between Split (side-by-side) and Unified (unified view) modes.
Line number handling: Provides accurate line numbers and preserves line-number correctness when context is collapsed.
Syntax highlighting: Reuses the platform’s useCodeHighlighter and languageForPath primitives, keeping the Diff view color scheme consistent with native Review.
Styling independence: The plugin includes a ddv-* stylesheet, so users do not need to manually manage CSS for diff lines.

Installation and Enablement¶

Installing this plugin requires having a DSH Checkout repository and an active Profile (for example, web).

Clone the plugin repository:

    mkdir -p ~/dsh-plugins && cd ~/dsh-plugins
    git clone https://github.com/joao-paulo-santos/dsh-diff-view.git

Add the plugin to the DSH Profile:

    # 假设你的 harness checkout 在当前目录
    pnpm dsh plugin --profile web add ~/dsh-plugins/dsh-diff-view

Verify that the configuration has taken effect:

    pnpm dsh --profile web --dump-config

After installation, restart Harness. The plugin will automatically inject the diffView service.

Typical Usage¶

After injecting the diffView service, you can use it in the following ways:

1. Render a File Diff Component¶

Generate a Diff component from two complete texts. The component includes Split/Unified toggle buttons.

// consumer client half, inject: ['diffView', …]

const Diff = ctx.diffView.diffFileComponent({
  path: 'src/a.ts',        // 可选，用于选择语法高亮规则
  before: oldText,         // 修改前的文本
  after: newText,          // 修改后的文本
  initialMode: 'split',    // 默认模式: 'split' (默认) | 'unified'
  showToggle: true,        // 显示 Split/Unified 切换胶囊
  wrap: false,             // true 表示长行换行，false 表示滚动
  wordHighlights: true,    // 启用单词级高亮
})

return React.createElement(Diff, {})

2. Use Hunks Data¶

If you need more fine-grained control, you can use the hunksOf method to retrieve diff hunks.

const hunks = ctx.diffView.hunksOf(oldText, newText)
// 返回格式: [{ oldStart, oldLines, newStart, newLines, lines: [' ctx', '-old', '+new'] }]

3. Use the Low-Level Rendering Engine¶

For custom layouts, you can use the low-level line alignment and word span calculation engine.

// 1. 获取对齐的编辑行
const rows = ctx.diffView.engine.alignedEditRowsOf(beforeLines, afterLines)
// rows: [{ kind: 'same'|'replace'|'delete'|'insert', removedLine?, addedLine? }]

// 2. 获取单词级别的差异标记
const spans = ctx.diffView.engine.wordSpansOfLinePair(beforeLine, afterLine)
// spans: { removedSpans, addedSpans }: arrays of { text, changed }

Use Cases and Cautions¶

No independent UI access: This plugin does not provide a standalone page and must be invoked by host plugins through service injection.
Line-number authenticity: Line numbers are derived from the Diff calculation result before context collapse, so they remain accurate across different view modes.
Syntax highlighting dependency: If path is not provided, or if the platform does not implement the languageForPath primitive, diff lines will be rendered as plain text only.
Style management: CSS for diff lines is managed by the plugin’s ddv-* class names, so hosts do not need to write Diff-specific CSS.
No persistence: This plugin does not handle data persistence and is not tightly coupled to the Approval workflow.

Conclusion¶

dsh-diff-view is a lightweight, dependency-free DSH plugin focused on providing core Diff view capabilities. Whether you are building Approval tools, Scratchpads, or code review plugins, you can directly reuse its components and engine.