dsh-inline-diff

English | 简体中文

See every file your agent edits, right in the chat. No clicking required.

By default the DeepSeek Harness web GUI collapses each file edit into a tiny one-line row. This plugin replaces those rows with an always-open, side-by-side diff: old code on the left, new code on the right, additions in green, deletions in red, a colored edge bar on every changed row, a hover highlight that tracks the row under your cursor, and a +N −N summary for every file.

What it looks like

A typical edit: changed lines paired side by side, with the exact words that changed highlighted. Pairs are matched by similarity, so an insertion placed above an edited line (a comment, a blank line) does not steal the changed line's counterpart — unmatched lines simply render as plain additions or removals:

Words or whole lines

By default a changed line gets double highlighting: the row is tinted green/red, and on top of that the exact words that changed get a stronger highlight. Prefer it calmer? Open Settings → Plugins → Inline diff and pick Lines only. You keep the row tint but lose the word chips. The choice is saved in your DSH settings and survives restarts.

Line numbers

Every row carries a 1-based line number in a muted gutter, on both the old and the new side. The numbers come from the harness itself: when an edit settles, the plugin anchors each served hunk to its true position, and for hunks without an anchor the card reads the file through a fenced workspace route and locates the changed block verbatim. A hunk that cannot be located (a block appearing more than once, a drifted file, no host half) falls back to window-relative numbering from the hunk's first row, so a number always renders — but it may not be the file's true line. Prefer it cleaner? Pick Off under Settings → Plugins → Inline diff → Line numbers and the gutter disappears entirely. Like the other choices, this is saved and survives restarts.

Indentation

Edits often arrive indented with their surrounding code, which pushes the actual change toward the middle of the card. By default the diff strips the leading whitespace every non-empty line shares, so changes sit closer to the gutter; a small ⇤ N badge on the file header shows how many characters were removed. Prefer seeing the code as written? Pick Keep under Settings → Plugins → Inline diff and the original indentation stays. Like the highlighting choice, this is saved and survives restarts.

Syntax highlighting

Code rows are colored by a bundled highlight.js (the same language set the Solution Explorer sidebar uses), so edits read like an editor: keywords in your accent color, strings green, comments muted, and so on. The tokens read the same --shiki-token-* variables your GUI's code blocks render with, and the language is detected from the file's extension; unknown extensions stay plain. Prefer plain text? Pick Off under Settings → Plugins → Inline diff → Syntax highlighting. Like the other choices, this is saved and survives restarts.

dsh-stylevault compatible: its Colors panel overrides exactly those --shiki-token-* variables, so restyling your theme there restyles the diff cards too.

Themes

Every color on the card, from surfaces and text to borders and the green/red diff tints, is derived from your GUI's theme tokens (Settings → Appearance). The card follows light mode, dark mode, and any custom accent colors instead of a fixed palette. The syntax token colors ride the same system (the GUI's shiki code palette); before any theme variables exist they simply render as the card's plain text color.

The same compact edit under a custom theme — dsh-stylevault overrides exactly those token variables, so a restyle there restyles every diff card:

Language

The settings card comes with English and Simplified Chinese text. It follows the GUI language picked under Settings → General → Language; when nothing is stored it follows your browser. A missing translation falls back to English.

Install

With the dsh CLI (easiest):

dsh plugin --profile web add github:JanEickholt/dsh-inline-diff

From GitHub (manual, same result):

1. Add the plugin to your profile's package.json:

   "dsh-inline-diff": "github:JanEickholt/dsh-inline-diff"
   

   then run pnpm install in the profile directory.

2. Add it to your profile's cordis.patch.yml:

   - insert:
       - id: inline-diff
         name: 'dsh-inline-diff'
   

3. Refresh the GUI page. Done. Every edit and file write now renders as an inline diff.

Manual: copy this repository into <profile>/node_modules/dsh-inline-diff/ and add the same patch row.

Contributing

Contributions of any kind are welcome: code, bug reports, docs, design ideas, screenshots, or just telling us what confused you. Open an issue or a pull request; nothing is too small.

Layout

The client ships as a single self-contained file because DSH loads it as one module. Its source of truth is src/, split per concern (line-diff.js, render.js, style.js, i18n.js, …). pnpm build (or pnpm test, which builds first) concatenates those blocks into lib/client.js. Edit files under src/, never lib/client.js directly. The two-tab indentation on code lines mirrors the module-loader wrapper the generated file is wrapped in; blank-line placement between blocks is added by the build.

About this project

This plugin was written by an AI coding agent (with a human steering it).

License

MIT