@linxin666/dsh-ssh 0.2.0 → 0.2.1

package/lib/index.js

@@ -1,5 +1,5 @@
 import { installSettingsSection, settingsNamespace } from "@deepseek-ai/dsh-settings";
-import { createReadStream, createWriteStream, existsSync, lstatSync, mkdirSync, readFileSync, readdirSync, renameSync, statSync, writeFileSync } from "node:fs";
+import { closeSync, createReadStream, createWriteStream, existsSync, lstatSync, mkdirSync, openSync, readFileSync, readdirSync, renameSync, statSync, writeFileSync } from "node:fs";
 import { Client } from "ssh2";
 import { homedir, tmpdir } from "node:os";
 import { basename, dirname, join, relative, resolve } from "node:path";
@@ -1414,26 +1414,26 @@ async function connectChain(engine, entry) {
 	const hops = [];
 	let sock;
 	const chain = entry.proxyJump;
-	for (let index = 0; index < chain.length; index += 1) {
-		const hopAlias = chain[index];
-		const hop = engine.store.find(hopAlias);
-		if (hop === void 0) {
-			for (const client of hops) client.end();
-			throw new Error("proxyJump alias '" + hopAlias + "' not found — create it first");
-		}
-		const hopClient = await connectClient(buildConnectConfig(hop, sock, engine.opts));
-		hops.push(hopClient);
-		const next = index + 1 < chain.length ? engine.store.find(chain[index + 1]) : void 0;
-		const nextHost = next !== void 0 ? next.host : entry.host;
-		const nextPort = next !== void 0 ? next.port : entry.port;
-		sock = await new Promise((resolve, reject) => {
-			hopClient.forwardOut("127.0.0.1", 0, nextHost, nextPort, (error, stream) => {
-				if (error !== void 0) {
-					for (const client of hops) client.end();
-					reject(error);
-				} else resolve(stream);
+	try {
+		for (let index = 0; index < chain.length; index += 1) {
+			const hopAlias = chain[index];
+			const hop = engine.store.find(hopAlias);
+			if (hop === void 0) throw new Error("proxyJump alias '" + hopAlias + "' not found — create it first");
+			const hopClient = await connectClient(buildConnectConfig(hop, sock, engine.opts));
+			hops.push(hopClient);
+			const next = index + 1 < chain.length ? engine.store.find(chain[index + 1]) : void 0;
+			const nextHost = next !== void 0 ? next.host : entry.host;
+			const nextPort = next !== void 0 ? next.port : entry.port;
+			sock = await new Promise((resolve, reject) => {
+				hopClient.forwardOut("127.0.0.1", 0, nextHost, nextPort, (error, stream) => {
+					if (error !== void 0) reject(error);
+					else resolve(stream);
+				});
 			});
-		});
+		}
+	} catch (error) {
+		for (const client of hops) client.end();
+		throw error;
 	}
 	let target;
 	try {
@@ -2283,7 +2283,10 @@ function makeRoutes(deps) {
 	const { store, engine } = deps;
 	const staging = deps.stagingDir ?? join(tmpdir(), "dsh-ssh-uploads");
 	const maxUploadBytes = deps.maxUploadBytes ?? MAX_UPLOAD_BYTES;
-	mkdirSync(staging, { recursive: true });
+	mkdirSync(staging, {
+		recursive: true,
+		mode: 448
+	});
 	/** Guard helper: fence + method check. */
 	const guard = (req, res, method) => {
 		if (!isLoopbackRequest(req)) {
@@ -2543,7 +2546,7 @@ function makeRoutes(deps) {
 						} catch {}
 					};
 					const tmp = join(staging, `upload-${randomBytes(6).toString("hex")}`);
-					const sink = createWriteStream(tmp);
+					const sink = createWriteStream(tmp, { mode: 384 });
 					let settled = false;
 					const fail = (error) => {
 						if (settled) return;
@@ -2649,6 +2652,7 @@ function makeRoutes(deps) {
 					}
 					const tmp = join(staging, `download-${randomBytes(6).toString("hex")}`);
 					try {
+						closeSync(openSync(tmp, "w", 384));
 						const outcome = await engine.download(alias, remotePath, tmp);
 						res.writeHead(200, {
 							"content-type": "application/octet-stream",

package/lib/types/client/sidebar-entry-core.d.ts

@@ -0,0 +1,60 @@
+/**
+ * Shared sidebar entry injection core.
+ *
+ * dsh's sidebar shell exposes no slot an external plugin can register into,
+ * so the entry row is injected between the shell's New Session button and the
+ * workspace browser. The injection self-heals: a MutationObserver watches the
+ * sidebar root and re-inserts the row whenever a React re-render displaces it
+ * (re-insertion happens in the same frame, before paint, so no flicker).
+ *
+ * The row is plain DOM (no React tree) so it can never disturb the shell's
+ * reconciliation; the view it toggles is a separate root owned by the caller.
+ *
+ * Packages receive this file as a generated copy via scripts/sync-shared.mjs;
+ * edit the shared source and re-run the sync instead of editing a copy.
+ */
+/** Per-package configuration for one sidebar entry row. */
+export interface SidebarEntryOptions {
+    /** Full attribute name identifying the injected row (idempotency key), e.g. 'data-dsh-ssh-entry'. */
+    rowAttribute: string;
+    /** CSS selector matching the injected row, e.g. '[data-dsh-ssh-entry]'. */
+    rowSelector: string;
+    /**
+     * L2 semantic-attribute plugin id (issue #506, enum table:
+     * skins/skin-center/contracts/semantic-attrs-v1.md). When set, the row also
+     * outputs data-dsh-plugin="<id>" and data-dsh-part="sidebar-entry"; unset
+     * leaves the row without semantic attributes.
+     */
+    plugin?: string;
+    /** Inline icon markup (matches the shell's 16px nav-icon look). */
+    icon: string;
+    /** CSS module class names for the row and its two spans (entry / entryIcon / entryLabel). */
+    css: Record<string, string>;
+    /** Localized row label (aria-label + visible text). */
+    label(): string;
+    /** Optional localized tooltip (title attribute). */
+    tooltip?(): string;
+    /** Click action (open/toggle the owning panel). */
+    onToggle(): void;
+    /** Family-block position: 'before' inserts ahead of sibling plugin rows, 'after' behind them. */
+    position: 'before' | 'after';
+    /**
+     * Selectors of the sibling plugin entry rows this package orders against
+     * (its own row included — the placement guard excludes a row that is
+     * already inside the root). Each package passes the same list it used
+     * before the consolidation so the rendered order stays stable.
+     */
+    familySelectors: readonly string[];
+    /** Optional active-state bridge; highlights the row while the panel is open. */
+    active?: {
+        subscribe(listener: () => void): () => void;
+        isOpen(): boolean;
+    };
+}
+/**
+ * Mount the sidebar entry, waiting for the shell to render and self-healing
+ * on later React re-renders.
+ * @param options - the row's attribute/icon/copy/action/ordering configuration.
+ * @returns disposer removing the entry and its observers.
+ */
+export declare function mountSidebarEntry(options: SidebarEntryOptions): () => void;

package/lib/types/client/sidebar-entry.d.ts

@@ -1,16 +1,12 @@
 /**
- * Sidebar entry injection.
+ * Sidebar entry injection — package-specific wiring over the shared core.
  *
- * dsh's sidebar shell exposes no slot an external plugin can register into,
- * so — following the task-board precedent of DOM-level extension — the entry
- * row is injected between the shell's New Session button and the workspace
- * browser. The injection self-heals: a MutationObserver watches the sidebar
- * root and re-inserts the row whenever a React re-render displaces it
- * (re-insertion happens in the same frame, before paint, so no flicker).
- *
- * The row is plain DOM (no React tree) so it can never disturb the shell's
- * reconciliation; the panel view it toggles is a separate React root mounted
- * in the center column (see mount.tsx).
+ * The DOM injection / self-healing / idempotency logic lives exactly once in
+ * shared/client/sidebar-entry-core.ts (synced copy); this wrapper supplies the
+ * ssh icon, copy, CSS module, and the panel toggle. The row is plain DOM (no
+ * React tree) so it can never disturb the shell's reconciliation; the panel
+ * view it toggles is a separate React root mounted in the center column
+ * (see mount.tsx).
  */
 import type { PanelController } from './panel/controller.ts';
 /** Stable data attribute identifying the injected entry row. */

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@linxin666/dsh-ssh",
   "description": "Remote SSH operations for the dsh web GUI: host config store (~/.dsh/dsh-ssh.json, import from ~/.ssh/config), a persistent ssh2 connection pool with jump-host support, exec / PTY web terminal / SFTP transfer / local port-forward tunnels / cluster execution, plus agent tools (ssh_list, ssh_exec, ssh_upload, ssh_download, ssh_tunnel, ssh_cluster). Hot-pluggable — mounted via ~/.dsh/cordis.patch.yml + a profile node_modules symlink, no dsh source changes.",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "type": "module",
   "engines": {
     "node": "^22.19.0 || >=24.0.0"

package/src/client/mount.tsx

@@ -57,6 +57,7 @@ export function mountPanel(controller: PanelController, api: SshApi): () => void
     if (column === undefined) return
     container = document.createElement('div')
     container.dataset.dshSshView = ''
+    container.dataset.dshPlugin = 'ssh'
     container.className = css.view
     column.appendChild(container)
     root = createRoot(container)

package/src/client/panel/SshPanel.tsx

@@ -66,7 +66,7 @@ export function SshPanel({ controller, api }: SshPanelProps) {
         </button>
         <h2 className={css.panelTitle}>{tt('panel.title')}</h2>
       </div>
-      <div className={css.tabBar} role="tablist">
+      <div className={css.tabBar} role="tablist" data-dsh-part="tab-bar">
         {TABS.map(tab => (
           <button key={tab.id} type="button" role="tab" aria-selected={activeTab === tab.id} data-active={activeTab === tab.id ? '' : undefined} className={css.tab} onClick={() => { setActiveTab(tab.id) }}>
             {tab.label()}

package/src/client/panel/TerminalTab.tsx

@@ -173,7 +173,7 @@ export function TerminalTab({ api, presetAlias, requestId }: TerminalTabProps) {
       )}
       {status.kind === 'error' && <div className={css.banner} data-kind="error">{tt('terminal.error', { error: status.detail })}</div>}
       <div className={css.termWrap}>
-        <div ref={containerRef} className={css.termContainer} />
+        <div ref={containerRef} className={css.termContainer} data-dsh-part="terminal" />
         {status.kind === 'idle' && (
           <div className={css.termPlaceholder}>{hosts.length === 0 ? tt('hosts.empty') : tt('terminal.placeholder')}</div>
         )}

package/src/client/sidebar-entry-core.ts

@@ -0,0 +1,208 @@
+// Generated by scripts/sync-shared.mjs from shared/client/sidebar-entry-core.ts. Do not edit this copy; edit the shared source and run "node scripts/sync-shared.mjs".
+/**
+ * Shared sidebar entry injection core.
+ *
+ * dsh's sidebar shell exposes no slot an external plugin can register into,
+ * so the entry row is injected between the shell's New Session button and the
+ * workspace browser. The injection self-heals: a MutationObserver watches the
+ * sidebar root and re-inserts the row whenever a React re-render displaces it
+ * (re-insertion happens in the same frame, before paint, so no flicker).
+ *
+ * The row is plain DOM (no React tree) so it can never disturb the shell's
+ * reconciliation; the view it toggles is a separate root owned by the caller.
+ *
+ * Packages receive this file as a generated copy via scripts/sync-shared.mjs;
+ * edit the shared source and re-run the sync instead of editing a copy.
+ */
+
+/** Per-package configuration for one sidebar entry row. */
+export interface SidebarEntryOptions {
+  /** Full attribute name identifying the injected row (idempotency key), e.g. 'data-dsh-ssh-entry'. */
+  rowAttribute: string
+  /** CSS selector matching the injected row, e.g. '[data-dsh-ssh-entry]'. */
+  rowSelector: string
+  /**
+   * L2 semantic-attribute plugin id (issue #506, enum table:
+   * skins/skin-center/contracts/semantic-attrs-v1.md). When set, the row also
+   * outputs data-dsh-plugin="<id>" and data-dsh-part="sidebar-entry"; unset
+   * leaves the row without semantic attributes.
+   */
+  plugin?: string
+  /** Inline icon markup (matches the shell's 16px nav-icon look). */
+  icon: string
+  /** CSS module class names for the row and its two spans (entry / entryIcon / entryLabel). */
+  css: Record<string, string>
+  /** Localized row label (aria-label + visible text). */
+  label(): string
+  /** Optional localized tooltip (title attribute). */
+  tooltip?(): string
+  /** Click action (open/toggle the owning panel). */
+  onToggle(): void
+  /** Family-block position: 'before' inserts ahead of sibling plugin rows, 'after' behind them. */
+  position: 'before' | 'after'
+  /**
+   * Selectors of the sibling plugin entry rows this package orders against
+   * (its own row included — the placement guard excludes a row that is
+   * already inside the root). Each package passes the same list it used
+   * before the consolidation so the rendered order stays stable.
+   */
+  familySelectors: readonly string[]
+  /** Optional active-state bridge; highlights the row while the panel is open. */
+  active?: {
+    subscribe(listener: () => void): () => void
+    isOpen(): boolean
+  }
+}
+
+/** Find the sidebar shell root element, or undefined while not yet mounted. */
+function sidebarRoot(): HTMLElement | undefined {
+  const column = document.querySelector<HTMLElement>('[data-pane="sidebar"], [class*="sidebarCol"]')
+  if (column === null) return undefined
+  // Current shells wrap the sidebar UI: column > wrapper > root(logoRow owner).
+  // Prefer the element that owns the logo row — the real sidebar UI root —
+  // and fall back to the column's first child for legacy shells.
+  const logoOwner = column.querySelector<HTMLElement>('[class*="logoRow"]')?.parentElement
+  return logoOwner ?? (column.firstElementChild as HTMLElement | undefined)
+}
+
+/** The New Session button: nested in the logo row on current shells, a direct child on legacy shells. */
+function newSessionButton(root: HTMLElement): HTMLButtonElement | undefined {
+  const nested = root.querySelector<HTMLButtonElement>('button[class*="newSession"]')
+  if (nested !== null) return nested
+  for (const child of root.children) {
+    if (child.tagName === 'BUTTON') return child as HTMLButtonElement
+  }
+  return undefined
+}
+
+/** Build the entry row (a detached button; insert once the shell is up). */
+function createEntry(options: SidebarEntryOptions): HTMLButtonElement {
+  const entry = document.createElement('button')
+  entry.type = 'button'
+  entry.setAttribute(options.rowAttribute, '')
+  if (options.plugin !== undefined) {
+    entry.setAttribute('data-dsh-plugin', options.plugin)
+    entry.setAttribute('data-dsh-part', 'sidebar-entry')
+  }
+  entry.className = options.css['entry'] ?? ''
+  entry.setAttribute('aria-label', options.label())
+  if (options.tooltip !== undefined) entry.setAttribute('title', options.tooltip())
+  entry.innerHTML = '<span class="' + (options.css['entryIcon'] ?? '') + '">' + options.icon
+    + '</span><span class="' + (options.css['entryLabel'] ?? '') + '">' + options.label() + '</span>'
+  entry.addEventListener('click', options.onToggle)
+  return entry
+}
+
+/** Re-insert the entry after the New Session row (before the browser region). */
+function placeEntry(root: HTMLElement, entry: HTMLButtonElement, options: SidebarEntryOptions): boolean {
+  const button = newSessionButton(root)
+  if (button === undefined) return false
+  if (entry.parentElement !== root) {
+    // Position relative to the family block (entries injected by sibling
+    // plugins), never relative to transient logoRow geometry: every family
+    // plugin that self-heals during a re-render then lands in the same
+    // relative order, so the entries cannot swap positions regardless of
+    // observer callback order or of shell wrapper changes. There is no
+    // append-to-end fallback: appending at the end would randomly reorder
+    // the block after a shell re-render.
+    const row = button.closest('[class*="logoRow"]')
+    const base = (row !== null && row.parentElement === root) ? row : button
+    const family = Array.from(root.children).filter(
+      (el): el is HTMLElement => el instanceof HTMLElement && el.matches(options.familySelectors.join(', ')),
+    )
+    const anchor = options.position === 'before'
+      ? (family.length > 0 ? family[0] : base.nextElementSibling)
+      : (family.length > 0 ? family[family.length - 1]!.nextElementSibling : base.nextElementSibling)
+    root.insertBefore(entry, anchor)
+  }
+  return true
+}
+
+/**
+ * Mount the sidebar entry, waiting for the shell to render and self-healing
+ * on later React re-renders.
+ * @param options - the row's attribute/icon/copy/action/ordering configuration.
+ * @returns disposer removing the entry and its observers.
+ */
+export function mountSidebarEntry(options: SidebarEntryOptions): () => void {
+  // DOM-level idempotency: whatever path mounted an entry row before this
+  // call (a duplicated apply, an HMR re-injection, a stale module still
+  // alive), never mount a second one. The existing row keeps working; a full
+  // page reload is the ultimate reset.
+  if (typeof document !== 'undefined' && document.querySelector(options.rowSelector) !== null) {
+    return () => {}
+  }
+  const entry = createEntry(options)
+  let root: HTMLElement | undefined
+  let placed = false
+
+  const tryPlace = (): void => {
+    if (root !== undefined && !root.isConnected) {
+      // The shell rebuilt the sidebar pane (whole-tree teardown); the root
+      // observer is gone with the old tree, so detach it and re-query from
+      // scratch. The new pane is later noticed by the body-level watcher.
+      rootObserver.disconnect()
+      root = undefined
+      placed = false
+    }
+    if (placed) {
+      // Cheap short-circuit: entry still lives in a mountable subtree.
+      if (document.body.contains(entry)) return
+      // Entry was torn down together with the old tree; reset and re-place.
+      rootObserver.disconnect()
+      root = undefined
+      placed = false
+    }
+    root ??= sidebarRoot()
+    if (root === undefined) return
+    placed = placeEntry(root, entry, options)
+    if (placed) {
+      rootObserver.observe(root, { childList: true, subtree: true })
+    }
+  }
+
+  // Body-level watcher retained as the "whole rebuild" fallback: when the shell
+  // tears down the whole sidebar pane, the root observer is gone with it and
+  // only this body observation can notice the new pane mounting. It is no
+  // longer disconnected after placement; the placed-and-still-mounted case
+  // short-circuits through the cheap document.body.contains(entry) check, so
+  // unrelated app mutations (e.g. chat streaming) cost one contains check
+  // instead of churning the full re-query.
+  const waitObserver = new MutationObserver(() => { tryPlace() })
+  waitObserver.observe(document.body, { childList: true, subtree: true })
+
+  // Self-heal: if a React re-render displaces the row, re-insert it in the
+  // same frame (microtask before paint -> no visible flicker).
+  const rootObserver = new MutationObserver(() => {
+    if (root === undefined || !root.isConnected) {
+      placed = false
+      tryPlace()
+      return
+    }
+    if (!root.contains(entry)) {
+      placed = placeEntry(root, entry, options)
+    }
+  })
+
+  // Reflect the panel's open state on the row (active highlight). Note: assigning
+  // undefined to dataset.active materializes data-active="undefined" and keeps the
+  // row permanently highlighted — delete the attribute instead.
+  const unsubscribeActive = options.active === undefined ? undefined : (() => {
+    const syncActive = (): void => {
+      if (options.active!.isOpen()) entry.dataset.active = 'true'
+      else delete entry.dataset.active
+    }
+    const unsubscribe = options.active.subscribe(syncActive)
+    syncActive()
+    return unsubscribe
+  })()
+
+  tryPlace()
+
+  return () => {
+    waitObserver.disconnect()
+    rootObserver.disconnect()
+    unsubscribeActive?.()
+    entry.remove()
+  }
+}

package/src/client/sidebar-entry.ts

@@ -1,20 +1,17 @@
 /**
- * Sidebar entry injection.
+ * Sidebar entry injection — package-specific wiring over the shared core.
  *
- * dsh's sidebar shell exposes no slot an external plugin can register into,
- * so — following the task-board precedent of DOM-level extension — the entry
- * row is injected between the shell's New Session button and the workspace
- * browser. The injection self-heals: a MutationObserver watches the sidebar
- * root and re-inserts the row whenever a React re-render displaces it
- * (re-insertion happens in the same frame, before paint, so no flicker).
- *
- * The row is plain DOM (no React tree) so it can never disturb the shell's
- * reconciliation; the panel view it toggles is a separate React root mounted
- * in the center column (see mount.tsx).
+ * The DOM injection / self-healing / idempotency logic lives exactly once in
+ * shared/client/sidebar-entry-core.ts (synced copy); this wrapper supplies the
+ * ssh icon, copy, CSS module, and the panel toggle. The row is plain DOM (no
+ * React tree) so it can never disturb the shell's reconciliation; the panel
+ * view it toggles is a separate React root mounted in the center column
+ * (see mount.tsx).
  */
 import type { PanelController } from './panel/controller.ts'
 import { tt } from './panel/helpers.ts'
 import css from './panel/panel.module.css'
+import { mountSidebarEntry as mountSharedSidebarEntry } from './sidebar-entry-core.ts'
 
 /** Stable data attribute identifying the injected entry row. */
 export const ENTRY_SELECTOR = '[data-dsh-ssh-entry]'
@@ -22,64 +19,6 @@ export const ENTRY_SELECTOR = '[data-dsh-ssh-entry]'
 /** Inline icon (matches the shell's 16px nav-icon look): a terminal prompt glyph. */
 const ICON = '<svg viewBox="0 0 16 16" width="14" height="14" fill="none" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="2" y="2.5" width="12" height="11" rx="1.5"/><path d="M4.5 5.5l2.5 2.5-2.5 2.5"/><path d="M8.5 10.5h3"/></svg>'
 
-/** Find the sidebar shell root element, or undefined while not yet mounted. */
-function sidebarRoot(): HTMLElement | undefined {
-  const column = document.querySelector<HTMLElement>('[data-pane="sidebar"], [class*="sidebarCol"]')
-  if (column === null) return undefined
-  // Current shells wrap the sidebar UI: column > wrapper > root(logoRow owner).
-  // Prefer the element that owns the logo row — the real sidebar UI root —
-  // and fall back to the column's first child for legacy shells.
-  const logoOwner = column.querySelector<HTMLElement>('[class*="logoRow"]')?.parentElement
-  return logoOwner ?? (column.firstElementChild as HTMLElement | undefined)
-}
-
-/** The New Session button: nested in the logo row on current shells, a direct child on legacy shells. */
-function newSessionButton(root: HTMLElement): HTMLButtonElement | undefined {
-  const nested = root.querySelector<HTMLButtonElement>('button[class*="newSession"]')
-  if (nested !== null) return nested
-  for (const child of root.children) {
-    if (child.tagName === 'BUTTON') return child as HTMLButtonElement
-  }
-  return undefined
-}
-
-/** Build the entry row (a detached button; insert once the shell is up). */
-function createEntry(controller: PanelController): HTMLButtonElement {
-  const entry = document.createElement('button')
-  entry.type = 'button'
-  entry.dataset.dshSshEntry = ''
-  entry.className = css.entry
-  entry.setAttribute('aria-label', tt('entry.label'))
-  entry.setAttribute('title', tt('entry.tooltip'))
-  entry.innerHTML = '<span class="' + css.entryIcon + '">' + ICON + '</span><span class="' + css.entryLabel + '">' + tt('entry.label') + '</span>'
-  entry.addEventListener('click', () => { controller.toggle() })
-  return entry
-}
-
-/** Re-insert the entry after the New Session row (before the browser region). */
-function placeEntry(root: HTMLElement, entry: HTMLButtonElement): boolean {
-  const button = newSessionButton(root)
-  if (button === undefined) return false
-  if (entry.parentElement !== root) {
-    // Position relative to the family block (entries injected by sibling
-    // plugins), never relative to transient logoRow geometry: every family
-    // plugin that self-heals during a re-render then lands in the same
-    // relative order, so the entries cannot swap positions regardless of
-    // observer callback order or of shell wrapper changes. There is no
-    // append-to-end fallback: appending at the end would randomly reorder
-    // the block after a shell re-render.
-    const row = button.closest('[class*="logoRow"]')
-    const base = (row !== null && row.parentElement === root) ? row : button
-    const family = Array.from(root.children).filter(
-      (el): el is HTMLElement => el instanceof HTMLElement && el.matches('[data-dsh-taskboard-entry], [data-dsh-ssh-entry]'),
-    )
-    // ssh sits after the whole family block.
-    const anchor = family.length > 0 ? family[family.length - 1].nextElementSibling : base.nextElementSibling
-    root.insertBefore(entry, anchor)
-  }
-  return true
-}
-
 /**
  * Mount the sidebar entry, waiting for the shell to render and self-healing
  * on later React re-renders.
@@ -87,74 +26,20 @@ function placeEntry(root: HTMLElement, entry: HTMLButtonElement): boolean {
  * @returns disposer removing the entry and its observers.
  */
 export function mountSidebarEntry(controller: PanelController): () => void {
-  const entry = createEntry(controller)
-  let root: HTMLElement | undefined
-  let placed = false
-
-  const tryPlace = (): void => {
-    if (root !== undefined && !root.isConnected) {
-      // The shell rebuilt the sidebar pane (whole-tree teardown); the root
-      // observer is gone with the old tree, so detach it and re-query from
-      // scratch. The new pane is later noticed by the body-level watcher.
-      rootObserver.disconnect()
-      root = undefined
-      placed = false
-    }
-    if (placed) {
-      // Cheap short-circuit: entry still lives in a mountable subtree.
-      if (document.body.contains(entry)) return
-      // Entry was torn down together with the old tree; reset and re-place.
-      rootObserver.disconnect()
-      root = undefined
-      placed = false
-    }
-    root ??= sidebarRoot()
-    if (root === undefined) return
-    placed = placeEntry(root, entry)
-    if (placed) {
-      rootObserver.observe(root, { childList: true, subtree: true })
-    }
-  }
-
-  // Body-level watcher retained as the "whole rebuild" fallback: when the shell
-  // tears down the whole sidebar pane, the root observer is gone with it and
-  // only this body observation can notice the new pane mounting. It is no
-  // longer disconnected after placement; the placed-and-still-mounted case
-  // short-circuits through the cheap document.body.contains(entry) check, so
-  // unrelated app mutations (e.g. chat streaming) cost one contains check
-  // instead of churning the full re-query.
-  const waitObserver = new MutationObserver(() => { tryPlace() })
-  waitObserver.observe(document.body, { childList: true, subtree: true })
-
-  // Self-heal: if a React re-render displaces the row, re-insert it in the
-  // same frame (microtask before paint -> no visible flicker).
-  const rootObserver = new MutationObserver(() => {
-    if (root === undefined || !root.isConnected) {
-      placed = false
-      tryPlace()
-      return
-    }
-    if (!root.contains(entry)) {
-      placed = placeEntry(root, entry)
-    }
+  return mountSharedSidebarEntry({
+    rowAttribute: 'data-dsh-ssh-entry',
+    rowSelector: ENTRY_SELECTOR,
+    plugin: 'ssh',
+    icon: ICON,
+    css,
+    label: () => tt('entry.label'),
+    tooltip: () => tt('entry.tooltip'),
+    onToggle: () => { controller.toggle() },
+    position: 'after',
+    familySelectors: ['[data-dsh-taskboard-entry]', '[data-dsh-ssh-entry]'],
+    active: {
+      subscribe: (listener) => controller.subscribe(listener),
+      isOpen: () => controller.getSnapshot().panelOpen,
+    },
   })
-
-  // Reflect the panel's open state on the row (active highlight). Note: assigning
-  // undefined to dataset.active materializes data-active="undefined" and keeps the
-  // row permanently highlighted — delete the attribute instead.
-  const syncActive = () => {
-    if (controller.getSnapshot().panelOpen) entry.dataset.active = 'true'
-    else delete entry.dataset.active
-  }
-  const unsubscribe = controller.subscribe(syncActive)
-  syncActive()
-
-  tryPlace()
-
-  return () => {
-    waitObserver.disconnect()
-    rootObserver.disconnect()
-    unsubscribe()
-    entry.remove()
-  }
 }