← Back to home@ddtcorex

dsh-maestro-mobile

Portrait & mobile adaptation for the DeepSeek Harness Web UI — overlay drawer, full-width conversation, sheet dialogs, safe-area handling. Below 1024px it adapts; at ≥1024px it is a no-op.

Stars
1
Language
TypeScript
Created
Aug 24, 2026
Updated
Sep 18, 2026

Introduction

dsh-maestro-mobile

Mobile adaptation for the DeepSeek Harness (DSH) Web UI. On touch-primary devices below 1024px it turns the sidebar into an overlay drawer, sheets the dialogs, and tunes the composer for phones; any mouse-driven window, at every width, is a complete no-op — a narrow desktop window or a scaled display never gets the mobile shell.

What you get

CapabilityHow it works
Sidebar → drawerOn touch-primary devices below 1024px the sidebar becomes a left overlay drawer (~80vw, transform:none when open); desktop is untouched at every width
Dialogs → sheetsSettings, explorer, and preview become mobile-friendly bottom sheets with env(safe-area-inset-*) handling and notch avoidance
Status-bar & safe areasStatus-bar / notch padding, light/dark theme-color, and touch-action: manipulation + gesturestart guard against double-tap zoom
Composer stays cleanPermission capsule, model name, and switch menus use fixed-size pinning so they never squeeze or overlap on narrow screens
Tablet friendly768–1023px centered, width-constrained sheets; phone and tablet geometries are verified separately
Easy diagnosticsAppend ?dsh-maestro-mobile-debug=1 (legacy ?mobile-nav-debug=1, still honoured) for a floating bar with viewport / frame / floating-panel / JS-error state

Requirements

  • Node.js ≥ 22, pnpm ≥ 11
  • A running DeepSeek Harness web profile (pnpm dsh web)
  • Chromium 105+ for the :has() selectors

Install

# from the registry
dsh plugin --profile web add @ddtcorex/dsh-maestro-mobile

# local development (live link: edit + rebuild just works)
dsh plugin --profile web add link:/path/to/dsh-maestro-mobile

lib/ is gitignored build output: pnpm build produces it locally, and pnpm-workspace.yaml carries the allowBuilds.esbuild entry a fresh install needs. Restart dsh web after installing or after any pnpm build.

Manual cordis.yml row

If you are not using dsh plugin, add this row to your cordis.yml:

- id: dsh-maestro-mobile
  name: '@ddtcorex/dsh-maestro-mobile'

Development

pnpm install        # install (pnpm@11.7.0, lockfile v9)
pnpm verify         # type-check host + client (tsc --noEmit)
pnpm test:core      # node --test tests/reconciler-core.test.ts
pnpm build          # tsc host + client && node scripts/build-client.mjs -> lib/

pnpm build is the required gate after any source change; lib/ is gitignored build output, so a change is incomplete until the build refreshes it locally.

Optional CDP regression probe (requires a live DSH Web on :3080, PIN cookie; to probe the raw server instead, set DSH_PROBE_URL=http://127.0.0.1:3082/?token=<launch-token> as in docs/upstream/upgrade-runbook.md §2):

DSH_PROBE_SESSION_ID=<id> pnpm smoke:cdp

Architecture

  • Host / client split is load-bearing: src/index.ts owns transparent response compression plus the session-delete route (POST /api/mobile-nav.session.delete); all browser behavior lives in src/client/.
  • src/client/index.tsx injects ['slots','layout','locale','sessionLogDownload','sessions','workspaces'], registers locale dictionaries, injects one <style data-plugin> tag, and registers three slots (MobileNavToggle in the session header, MobileDrawerFooter in the sidebar foot, ShellOverlay backdrop + FAB).
  • Shared full-tree reconciler: reconciler-core.ts (zero-import engine) + phone-chrome.ts (a single MutationObserver driving installMobileEffect).
  • Styles are concatenated tokens → base → layout → sheet → explorer-sheet → composer → settings-sheet → misc into one tag; mobile rules target (max-width: 1023px) and (pointer: coarse).

License

MIT