dsh-show-picture ๐Ÿ–ผ๏ธ

August 19, 2026 ยท View on GitHub

A DeepSeek Harness (DSH) Cordis plugin that lets the agent display images directly inside the conversation. ไธ€ไธช่ฎฉ Agent ็›ดๆŽฅๅœจๅฏน่ฏไธญๅฑ•็คบๅ›พ็‰‡็š„ DSH๏ผˆDeepSeek Harness๏ผ‰Cordis ๆ’ไปถใ€‚

License: MIT DSH

โœจ What it does / ๅŠŸ่ƒฝ

Give the agent one new model tool, show_picture, and render its result as an image card right in the chat:

show_picture({ path: "/workspace/chart.png" })  โ†’  ๐Ÿ–ผ๏ธ chart.png appears in the conversation
show_picture({ url: "https://example.com/photo.webp", alt: "a photo" })  โ†’  ๐Ÿ–ผ๏ธ photo appears
  • Local files โ€” read through the Host fs service, delivered to the browser as a base64 data URL (no separate file server needed).
  • Remote URLs โ€” passed straight through to an <img> tag.
  • No downloads, no "see the file at โ€ฆ" โ€” the user sees the picture inside the chat flow.

๐Ÿงฉ How it works / ๅทฅไฝœๅŽŸ็†

HalfRole
Host (plugin/host.js)Registers the show_picture tool via harness.defineTool + harness.registerTool, and a package-private RPC show-picture.read that resolves the file (fs.resolve), checks it is a regular file (fs.stat), reads up to 10 MiB (fs.readBytes), maps the extension to a MIME type, and base64-encodes the bytes (plain-JS encoder โ€” the sandbox btoa is UTF-8 only).
Client (plugin/client.js)Registers the tool.call.toolview card keyed show_picture. The card parses the tool-call arguments and renders <img src="data:โ€ฆ"> (path) or <img src="url"> (url), plus an optional caption from alt.
โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€ Host (Node) โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”      โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€ Client (browser) โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”
โ”‚ show_picture tool (global, every session) โ”‚      โ”‚ tool.call.toolview [show_picture]   โ”‚
โ”‚   fs.resolve / stat                       โ”‚      โ”‚  โ”œโ”€ path โ†’ <img src="/dsh-show-      โ”‚
โ”‚   result: {ok, kind, path, size, mime}    โ”‚      โ”‚  โ”‚         picture/<encoded path>">  โ”‚
โ”‚                                           โ”‚      โ”‚  โ””โ”€ url  โ†’ <img src={url}>            โ”‚
โ”‚ webServer route /dsh-show-picture/* โ—„โ”€โ”€โ”€โ”€โ”€โ”ผโ”€โ”€โ”€โ”€โ”€โ”€โ”ผโ”€โ”€ browser fetches the route          โ”‚
โ”‚   fs.readBytes โ†’ bytes + content-type     โ”‚      โ”‚                                        โ”‚
โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜      โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜

๐Ÿ“ฆ Install / ๅฎ‰่ฃ…

Install into the web profile as a bundle so every session (including non-creation mode) gets the tool automatically, even after restarting DSH:

cd "$DSH_HOME/profiles/web"          # DSH_HOME defaults to ~/.dsh
pnpm add file:/path/to/dsh-show-picture
# then add "dsh-show-picture" to the "dsh.profile.bundles" array in package.json
dsh --profile web                    # restart the app

That is exactly how dsh-at-file / dsh-better-status are installed in this deployment. The Host half (lib/index.js) registers the global show_picture tool and a /dsh-show-picture/<encoded-path> HTTP route; the Client half (lib/client.js) is served to the browser as a web module and renders the card.

B. Dynamic Cordis plugin (session-local)

The plugin can also be created in a single session with cordis_define (kind new):

then activate with cordis_run (mode run). First activation of the Client half asks for user approval in the UI. Dynamic plugins are process-local: they do not survive a DSH restart and belong to the session that created them.

Full step-by-step (including upgrades and rollback) is in docs/INSTALL.md.

๐Ÿ›  Usage / ็”จๆณ•

The agent calls the tool whenever the user asks to see an image:

ArgumentTypeRequiredMeaning
pathstringone ofLocal image file (absolute or workspace-relative). Extensions: png, jpg/jpeg, gif, webp, svg, bmp, ico, avif, tif/tiff. Max 10 MiB.
urlstringone ofhttp(s) URL of the image.
altstringnoShort caption shown under the image.

Result (canonical JSON): { ok: true, kind: 'path'|'url', path|url, size?, mime?, alt } or { ok: false, error }.

A ready-to-use agent skill is included at skill/dsh-show-picture/SKILL.md โ€” drop it into a DSH agent preset's skills/ directory (or follow its instructions manually).

โš ๏ธ Limitations / ้™ๅˆถ

  • Local files > 10 MiB fail with FS_TOO_LARGE (compress/resize first, or serve via URL).
  • Extension-based MIME detection only; unsupported types are rejected, not sniffed.
  • url images must be loadable by the browser (CSP, availability, auth).
  • The card renders only while the Client half is active and the call goes through the model's tool loop.

๐Ÿ“ Repository layout / ็›ฎๅฝ•็ป“ๆž„

dsh-show-picture/
โ”œโ”€โ”€ lib/
โ”‚   โ”œโ”€โ”€ index.js         # Host half (global tool + image HTTP route) โ€” static install
โ”‚   โ””โ”€โ”€ client.js        # Client half (tool card) โ€” served as a web module
โ”œโ”€โ”€ plugin/
โ”‚   โ”œโ”€โ”€ host.js          # Host half (tool + RPC) โ€” paste as code.host (dynamic)
โ”‚   โ””โ”€โ”€ client.js        # Client half (tool card) โ€” paste as code.client (dynamic)
โ”œโ”€โ”€ skill/
โ”‚   โ””โ”€โ”€ dsh-show-picture/
โ”‚       โ””โ”€โ”€ SKILL.md     # Agent skill: install, usage, limitations
โ”œโ”€โ”€ docs/
โ”‚   โ””โ”€โ”€ INSTALL.md       # Step-by-step install / update / rollback
โ”œโ”€โ”€ cordis.patch.yml     # Bundle patch: inserts the dsh-show-picture row
โ”œโ”€โ”€ dsh.plugin.json      # Plugin metadata (entry + client platform)
โ”œโ”€โ”€ package.json
โ””โ”€โ”€ LICENSE

๐Ÿ“„ License / ่ฎธๅฏ่ฏ

MIT ยฉ 2026 dsh-show-picture contributors