dsh-remote 0.8.41 → 0.8.44

package/lib/client.js

@@ -49,6 +49,15 @@ window.__ModuleLoader__.load({
         'settings.addMachine': '添加机器',
         'settings.editMachine': '编辑机器',
         'settings.badgeSshConfig': 'ssh cfg',
+        // Issue #51 — transport backend (GSSAPI/Kerberos via system OpenSSH).
+        'settings.badgeOpenssh': 'openssh',
+        'settings.backend': '连接后端',
+        'settings.backendNative': 'native（内置 ssh2：密码 / 私钥 / agent / 动态码）',
+        'settings.backendOpenssh': 'openssh（调用本机 ssh 命令）',
+        'settings.backendOpensshHint': '调用本机 ssh，因此完全遵循 ~/.ssh/config：支持 GSSAPI/Kerberos（kinit 后免密登录）、ProxyCommand、PKCS11Provider、Match 等 OpenSSH 专有特性；主机密钥由 ssh 用你自己的 known_hosts 校验。代价是每条命令都要新建一次连接（比 native 慢），文件浏览（SFTP）仍保持长连接。',
+        'settings.backendOpensshAliasOk': '已勾选「使用 ssh_config 别名」：主机名原样交给 ssh，端口/用户/私钥/跳板机一律由 ~/.ssh/config 的 Host 块决定，对应的输入框在 openssh 后端下填了也不生效（这就是「配置唯一来源」，issue #50）。密码/Passphrase 仍会通过 askpass 交给 ssh，仅当 Host 块里没有可用认证时才用得上。',
+        'settings.sshBinary': 'ssh 路径',
+        'settings.sshBinaryPlaceholder': '留空 = 用 PATH 里的 ssh',
         'settings.sshImport': '从 ~/.ssh/config 导入',
         'settings.sshCollapse': '收起',
         'settings.sshNoEntries': '~/.ssh/config 里没有可导入的 Host 条目',
@@ -134,6 +143,14 @@ window.__ModuleLoader__.load({
         'settings.deployUseCommand': '将使用的 dsh',
         'settings.deploySteps': '安装步骤',
         'settings.deployDone': '部署完成，已记录该机器使用的 dsh',
+        'settings.deployFailed': '部署失败',
+        'settings.deployResumed': '已有部署任务在运行，已恢复显示其进度',
+        'settings.deployTaskTitle': '部署任务',
+        'settings.deployTaskRunning': '进行中',
+        'settings.deployTaskDone': '已完成',
+        'settings.deployTaskFailed': '失败',
+        'settings.deployTaskCancelled': '已取消',
+        'settings.deployCancel': '取消',
         'settings.deployInvestigateStarted': '已创建排查会话，请在会话里跟进。',
         'settings.badgePwd': '密码',
         'settings.badgeKeychain': '钥匙串',
@@ -249,6 +266,9 @@ window.__ModuleLoader__.load({
         'explorer.noRemoteWs': '未设置远程工作区',
         'explorer.sessionLocal': '当前会话未使用远程工作区',
         'explorer.localSession': '当前会话是本地工作区，未使用远程文件。\n\n如需访问远程，可在设置页将某台机器「设为当前」，再用上方「…」选择远程工作区。',
+        // issue #49：会话列表里标识「这是远程会话，连的是哪台机」
+        'session.remoteBadge': '远程会话：{target}',
+        'session.remoteHover': '远程主机：{target}',
         'explorer.loading': '加载中…',
         'explorer.dirMissing': '目录不存在或已被删除',
         'explorer.notConnected': '未连接远程主机（重启后需在设置中将机器「设为当前」，或刷新右侧列）',
@@ -307,6 +327,15 @@ window.__ModuleLoader__.load({
         'settings.addMachine': 'Add machine',
         'settings.editMachine': 'Edit machine',
         'settings.badgeSshConfig': 'ssh cfg',
+        // Issue #51 — transport backend (GSSAPI/Kerberos via system OpenSSH).
+        'settings.badgeOpenssh': 'openssh',
+        'settings.backend': 'Backend',
+        'settings.backendNative': 'native (built-in ssh2: password / key / agent / OTP)',
+        'settings.backendOpenssh': 'openssh (drive the local ssh command)',
+        'settings.backendOpensshHint': 'Delegates the transport to the local `ssh`, so the whole of ~/.ssh/config applies: GSSAPI/Kerberos (log in once with kinit and no secret is needed), ProxyCommand, PKCS11Provider, Match blocks… Host keys are checked by ssh against your own known_hosts. The cost is a fresh connection per command (slower than native); file browsing over SFTP still reuses one session.',
+        'settings.backendOpensshAliasOk': '"Use a ~/.ssh/config alias" is on: the name is handed to ssh verbatim, and Port/User/IdentityFile/ProxyJump come from that Host block — the matching fields below have no effect (this is the "one source of truth" case, issue #50). A password/passphrase is still offered to ssh through askpass, and is only used if the Host block has no usable authentication.',
+        'settings.sshBinary': 'ssh path',
+        'settings.sshBinaryPlaceholder': 'Empty = the ssh on PATH',
         'settings.sshImport': 'Import from ~/.ssh/config',
         'settings.sshCollapse': 'Collapse',
         'settings.sshNoEntries': 'No importable Host entries in ~/.ssh/config',
@@ -392,6 +421,14 @@ window.__ModuleLoader__.load({
         'settings.deployUseCommand': 'dsh that will be used',
         'settings.deploySteps': 'Install steps',
         'settings.deployDone': 'Deployed; this machine now records the dsh it uses',
+        'settings.deployFailed': 'Deploy failed',
+        'settings.deployResumed': 'A deploy is already running — re-attached to its progress',
+        'settings.deployTaskTitle': 'Deploy task',
+        'settings.deployTaskRunning': 'running',
+        'settings.deployTaskDone': 'done',
+        'settings.deployTaskFailed': 'failed',
+        'settings.deployTaskCancelled': 'cancelled',
+        'settings.deployCancel': 'Cancel',
         'settings.deployInvestigateStarted': 'A session was created — follow up there.',
         'settings.badgePwd': 'password',
         'settings.badgeKeychain': 'keychain',
@@ -507,6 +544,9 @@ window.__ModuleLoader__.load({
         'explorer.noRemoteWs': 'No remote workspace set',
         'explorer.sessionLocal': 'This session does not use a remote workspace',
         'explorer.localSession': 'This session is a local workspace and does not use remote files.\n\nTo access remote, set a machine as "current" in Settings, then pick a remote workspace with the "…" button above.',
+        // issue #49: tell a remote Session apart in the Session list, and name its host.
+        'session.remoteBadge': 'Remote session: {target}',
+        'session.remoteHover': 'Remote host: {target}',
         'explorer.loading': 'Loading…',
         'explorer.dirMissing': 'Directory does not exist or was deleted',
         'explorer.notConnected': 'Not connected to the remote host (after a restart, set a machine as "current" in Settings, or refresh the right column)',
@@ -747,8 +787,40 @@ window.__ModuleLoader__.load({
         document.head.appendChild(el)
       } catch { /* vm tests / no DOM */ }
     }
+    /**
+     * Issue #52 — a backdrop may close its dialog only when the PRESS began on
+     * the backdrop itself.
+     *
+     * `click` is dispatched on the nearest common ancestor of the mousedown and
+     * mouseup targets. A gesture that pressed an element INSIDE the panel and
+     * released on the backdrop — because the panel re-laid-out mid-gesture (the
+     * remote autocomplete list used to sit in document flow, so expanding it
+     * pushed a centred panel's edges out from under the pointer) — is therefore
+     * reported as a click ON THE BACKDROP, and a bare `onClick` closed the whole
+     * dialog. Selecting a suggestion kicked the user out of the picker.
+     *
+     * Guarding on the press origin keeps "click outside to dismiss" while a
+     * drag that merely ENDS outside can no longer dismiss anything. The panel's
+     * own `stopPropagation` stays as a second line of defence.
+     *
+     * @returns {{onMouseDown: Function, onClick: (e: object) => boolean}} props to
+     *   spread on the backdrop; `onClick` reports whether the press started there.
+     */
+    function useBackdropGuard() {
+      const pressedOnBackdrop = React.useRef(false)
+      return {
+        onMouseDown: (e) => { pressedOnBackdrop.current = e.target === e.currentTarget },
+        onClick: (e) => {
+          const startedOnBackdrop = pressedOnBackdrop.current
+          pressedOnBackdrop.current = false
+          return startedOnBackdrop && e.target === e.currentTarget
+        },
+      }
+    }
+
     function PromptDialog(props) {
       const { title, initial, placeholder, onSubmit, onCancel } = props
+      const backdrop = useBackdropGuard()
       const [val, setVal] = React.useState(initial || '')
       React.useEffect(() => {
         try {
@@ -763,7 +835,10 @@ window.__ModuleLoader__.load({
       }, [val, onSubmit, onCancel])
       return React.createElement('div', {
         style: { position: 'fixed', inset: 0, zIndex: 1000000, background: 'rgba(0,0,0,0.45)', display: 'flex', alignItems: 'center', justifyContent: 'center', padding: 16 },
-        onClick: onCancel,
+        onMouseDown: backdrop.onMouseDown,
+        // Issue #52: only a press that STARTED here may dismiss (a gesture that
+        // began inside the panel and ended on the backdrop must not).
+        onClick: (e) => { if (backdrop.onClick(e)) onCancel() },
       },
         React.createElement('div', {
           className: 'dsh-rw-modal-panel',
@@ -860,6 +935,10 @@ window.__ModuleLoader__.load({
       const [deployBusy, setDeployBusy] = React.useState('')
       const [deployErr, setDeployErr] = React.useState('')
       const [deployOpen, setDeployOpen] = React.useState(false)
+      // The HOST-SIDE deploy task (resumable across window close/reopen). This
+      // is the object the poll keeps fresh; it survives because the work runs
+      // on the host, not in this tab.
+      const [deployTask, setDeployTask] = React.useState(null)
       // session's machine", which the host resolves from the session binding.
       React.useEffect(() => { ensureChromeCss() }, [])
 
@@ -870,6 +949,9 @@ window.__ModuleLoader__.load({
           host: form.host, port: Number(form.port) || 22, username: form.username || 'root',
           password: form.password, privateKeyPath: form.privateKeyPath, passphrase: form.passphrase,
           useSshConfig: !!form.useSshConfig,
+          // Issue #51: the probe must exercise the SAME backend the machine will
+          // use — a host reachable only via GSSAPI fails the native probe.
+          backend: form.backend || 'native',
           proxy: form.proxyHost ? { host: form.proxyHost, port: Number(form.proxyPort) || 22, username: form.proxyUser || '', password: form.proxyPassword || '', privateKeyPath: form.proxyKey || '' } : undefined,
         })
           .then((r) => {
@@ -953,10 +1035,31 @@ window.__ModuleLoader__.load({
       // ── 远程 DSH 界面（issue #46）─────────────────────────────────────────
       // The remote never opens an inbound port; we SSH out and carry the remote
       // loopback web UI back to a local port. One tunnel per machine.
+      //
+      // This SAME poll carries the deploy-task state, so a REOPENED window picks
+      // up an in-flight install on the first tick (15s worst case — plus the
+      // install button itself resumes). When a deploy is running the interval
+      // tightens so step progress looks live.
       const refreshWebAttaches = () => api('GET', '/dsh-remote/web-attach')
-        .then((r) => setWebAttaches(r.attaches || []))
+        .then((r) => {
+          setWebAttaches(r.attaches || [])
+          const t = (r.deploys || []).find((d) => d.machineId === webAttachMachine) || r.deploy || null
+          if (t && (t.status === 'running' || t.status === 'queued')) {
+            setDeployTask(t)
+            setDeployBusy('install')
+          } else if (t) {
+            setDeployTask(t)
+          }
+          return t
+        })
         .catch(() => {})
-      React.useEffect(() => { refreshWebAttaches(); const t = setInterval(refreshWebAttaches, 15000); return () => clearInterval(t) }, [])
+      React.useEffect(() => {
+        refreshWebAttaches()
+        const t = setInterval(() => {
+          refreshWebAttaches()
+        }, 15000)
+        return () => clearInterval(t)
+      }, [])
       const webAttachAction = (action, machineId, extra) => {
         setWebAttachBusy(machineId + ':' + action); setWebAttachErr('')
         return api('POST', '/dsh-remote/web-attach', { action, machineId, ...(extra || {}) })
@@ -968,23 +1071,60 @@ window.__ModuleLoader__.load({
       // ── 远程部署：体检 / 部署并验证 / 让 AI 排查 ───────────────────────────
       // The probe is read-only, so it is safe to run before the user agrees to
       // anything; the install requires an explicit second click (confirm: true).
+      //
+      // Install is a HOST-SIDE BACKGROUND TASK: the call returns immediately
+      // with a task handle, and progress arrives by polling. Closing the window
+      // loses nothing — reopening picks the task back up from the periodic
+      // web-attach poll (which carries the deploy state), and clicking 部署并验证
+      // again while one runs RESUMES it rather than starting a second npm.
+      const deployPoll = () => api('GET', '/dsh-remote/web-attach')
+        .then((r) => {
+          if (!r) return null
+          // Refresh the attach list like before…
+          setWebAttaches(r.attaches || [])
+          // …and adopt any deploy task for the selected machine.
+          const t = r.deploy || (r.deploys || []).find((d) => d.machineId === webAttachMachine) || null
+          if (t) {
+            setDeployTask(t)
+            if (t.status === 'running' || t.status === 'queued') {
+              setDeployBusy('install')
+            } else if (deployBusy === 'install') {
+              // The task settled since the last poll.
+              setDeployBusy('')
+              if (t.status === 'done') setDeployMsg(tr('settings.deployDone'))
+              if (t.status === 'failed') setDeployErr(t.error || tr('settings.deployFailed'))
+            }
+          }
+          return t
+        })
+        .catch(() => null)
+
       const deployAction = (action, machineId, extra) => {
-        setDeployBusy(action); setDeployErr('')
+        setDeployBusy(action); setDeployErr(''); setDeployMsg('')
         return api('POST', '/dsh-remote/web-attach', { action, machineId, ...(extra || {}) })
           .then((r) => {
             if (action === 'probe') setDeploy({ kind: 'probe', ...r, at: Date.now() })
-            if (action === 'install') setDeploy({ kind: 'install', ...r, at: Date.now() })
+            if (action === 'install') {
+              // The task is running on the host NOW. Adopt it immediately so the
+              // steps appear without waiting for the first poll tick.
+              if (r && r.task) setDeployTask(r.task)
+              if (r && r.resumed) setDeployMsg(tr('settings.deployResumed'))
+            }
             if (action === 'investigate') setDeploy({ kind: 'investigate', ...r, at: Date.now() })
             return r
           })
           .catch((e) => {
             const msg = String((e && e.message) || e)
             setDeployErr(msg)
-            // Keep the failing step list so the operator sees WHERE it stopped.
             setDeploy({ kind: action, ok: false, error: msg, at: Date.now() })
             return null
           })
-          .then((r) => { setDeployBusy(''); refreshWebAttaches(); return r })
+          .then((r) => {
+            if (action !== 'install') setDeployBusy('')
+            // install keeps busy='install' until the task settles (poll clears it).
+            refreshWebAttaches()
+            return r
+          })
       }
 
       const setF = (k) => (ev) => setForm({ ...form, [k]: ev.target.value })
@@ -997,15 +1137,17 @@ window.__ModuleLoader__.load({
           encryptPassword: !!(m.credentialBackend && m.credentialBackend !== 'plain'),
           proxyHost: (m.proxy && m.proxy.host) || '', proxyPort: String((m.proxy && m.proxy.port) || 22),
           proxyUser: (m.proxy && m.proxy.username) || '', proxyPassword: '', proxyKey: (m.proxy && m.proxy.privateKeyPath) || '',
+          // Issue #51: the transport backend is per machine.
+          backend: m.backend === 'openssh' ? 'openssh' : 'native', sshBinary: m.sshBinary || '',
           id: m.id,
           useSshConfig: !!m.useSshConfig,
         })
-        // 编辑时若该机器用了高级配置(私钥/agent/跳板/钥匙串等),自动展开折叠区
-        if (m.privateKeyPath || m.useAgent || m.keyboardInteractive || m.workspace || (m.proxy && m.proxy.host) || (m.credentialBackend && m.credentialBackend !== 'plain')) {
+        // 编辑时若该机器用了高级配置(私钥/agent/跳板/钥匙串/系统 OpenSSH 后端),自动展开折叠区
+        if (m.privateKeyPath || m.useAgent || m.keyboardInteractive || m.workspace || (m.proxy && m.proxy.host) || m.backend === 'openssh' || (m.credentialBackend && m.credentialBackend !== 'plain')) {
           setAdvOpen(true)
         }
       }
-      const clearForm = () => setForm({ name: '', host: '', port: '22', username: 'root', password: '', privateKeyPath: '', passphrase: '', workspace: '', hostKeyMode: '', useAgent: false, keyboardInteractive: false, encryptPassword: false, proxyHost: '', proxyPort: '22', proxyUser: '', proxyPassword: '', proxyKey: '', id: '', useSshConfig: false })
+      const clearForm = () => setForm({ name: '', host: '', port: '22', username: 'root', password: '', privateKeyPath: '', passphrase: '', workspace: '', hostKeyMode: '', useAgent: false, keyboardInteractive: false, encryptPassword: false, proxyHost: '', proxyPort: '22', proxyUser: '', proxyPassword: '', proxyKey: '', backend: 'native', sshBinary: '', id: '', useSshConfig: false })
       const save = (action) => {
         setBusy(true); setErr(''); setMsg('')
         if (action === 'delete') {
@@ -1017,6 +1159,8 @@ window.__ModuleLoader__.load({
           username: form.username, password: form.password, privateKeyPath: form.privateKeyPath, passphrase: form.passphrase,
           workspace: form.workspace, hostKeyMode: form.hostKeyMode, useAgent: form.useAgent, keyboardInteractive: form.keyboardInteractive,
           encryptPassword: form.encryptPassword, useSshConfig: !!form.useSshConfig,
+          // Issue #51: the transport backend (and, for `openssh`, the executable).
+          backend: form.backend || 'native', sshBinary: form.sshBinary || '',
           proxy: form.proxyHost ? { host: form.proxyHost, port: Number(form.proxyPort) || 22, username: form.proxyUser || '', password: form.proxyPassword || '', privateKeyPath: form.proxyKey || '' } : undefined,
         }).then((r) => {
           refresh(); clearForm()
@@ -1107,6 +1251,10 @@ window.__ModuleLoader__.load({
                       m.useSshConfig ? (m.host + (m.sshConfigResolved && m.sshConfigResolved.matched ? '  ' + tr('settings.sshResolvedTo', { user: m.sshConfigResolved.username || '?', host: m.sshConfigResolved.host, port: m.sshConfigResolved.port }) : ''))
                         : (m.username + '@' + m.host + ':' + m.port)),
                     m.useSshConfig ? pill('', tr('settings.badgeSshConfig')) : null,
+                    // Issue #51: a machine on the system-OpenSSH backend behaves
+                    // differently enough (auth from ~/.ssh/config, GSSAPI) that
+                    // the row must say so.
+                    m.backend === 'openssh' ? pill('', tr('settings.badgeOpenssh')) : null,
                     m.id === currentId ? pill('is-ok', tr('settings.current')) : null,
                     m.passwordSet ? pill('', tr('settings.badgePwd')) : null,
                     (m.credentialBackend && m.credentialBackend !== 'plain') ? pill('', tr('settings.badgeKeychain')) : null,
@@ -1168,6 +1316,23 @@ window.__ModuleLoader__.load({
             style: { ...buttonS, width: '100%', marginBottom: advOpen ? 10 : 0, color: advOpen ? T.primary : 'inherit', fontWeight: advOpen ? 600 : 400, borderStyle: 'dashed' },
           }, advOpen ? tr('settings.advCollapse') : tr('settings.advExpand')),
           advOpen ? React.createElement('div', { key: 'adv', style: { paddingTop: 2 } },
+            // Issue #51 — transport backend. Placed FIRST in the advanced block
+            // because it changes what the fields below even mean: with the
+            // system-OpenSSH backend, host/user/port/key all come from
+            // ~/.ssh/config and only the machine name (an alias) matters.
+            row(tr('settings.backend'), React.createElement('select', { value: form.backend || 'native', onChange: setF('backend'), style: { ...inputS, maxWidth: 260 } },
+              React.createElement('option', { value: 'native' }, tr('settings.backendNative')),
+              React.createElement('option', { value: 'openssh' }, tr('settings.backendOpenssh'))), 'be'),
+            (form.backend === 'openssh')
+              ? React.createElement('div', { style: { fontSize: 11, opacity: 0.85, marginBottom: 8, marginLeft: LABEL_W + 8, lineHeight: 1.55 } },
+                  React.createElement('div', null, tr('settings.backendOpensshHint')),
+                  form.useSshConfig
+                    ? React.createElement('div', { style: { color: T.ok, marginTop: 2 } }, tr('settings.backendOpensshAliasOk'))
+                    : null)
+              : null,
+            (form.backend === 'openssh')
+              ? row(tr('settings.sshBinary'), React.createElement('input', { value: form.sshBinary || '', onChange: setF('sshBinary'), placeholder: tr('settings.sshBinaryPlaceholder'), style: inputS }), 'sb')
+              : null,
             row(tr('settings.privateKey'), React.createElement('input', { value: form.privateKeyPath, onChange: setF('privateKeyPath'), placeholder: 'Empty = password or agent', style: inputS }), 'k'),
             row(tr('settings.passphrase'), React.createElement('input', { type: 'password', value: form.passphrase, onChange: setF('passphrase'), placeholder: 'Encrypted private key passphrase', style: inputS }), 'pp'),
             row(tr('settings.workspace'), React.createElement('input', { value: form.workspace, onChange: setF('workspace'), placeholder: 'Optional: default remote dir for this machine', style: inputS }), 'ws'),
@@ -1273,6 +1438,46 @@ window.__ModuleLoader__.load({
                 disabled: !!deployBusy || !webAttachMachine,
                 onClick: () => deployAction('probe', webAttachMachine) },
                 deployBusy === 'probe' ? tr('settings.deployProbing') : tr('settings.deployProbe'))),
+            // ── live deploy task (resumable; survives window close) ─────────
+            deployTask
+              ? React.createElement('div', { style: { marginTop: 6, fontSize: 12, lineHeight: 1.6, border: '1px solid ' + T.border, borderRadius: 8, padding: 8 } },
+                  React.createElement('div', { style: { fontWeight: 600, marginBottom: 4 } },
+                    tr('settings.deployTaskTitle')
+                    + ' — ' + (deployTask.status === 'running' || deployTask.status === 'queued'
+                      ? tr('settings.deployTaskRunning')
+                      : deployTask.status === 'done' ? tr('settings.deployTaskDone')
+                        : deployTask.status === 'cancelled' ? tr('settings.deployTaskCancelled')
+                          : tr('settings.deployTaskFailed'))),
+                  // The in-flight step: the one thing a re-attached user most
+                  // wants to see ("现在装到哪了").
+                  deployTask.current && (deployTask.status === 'running')
+                    ? React.createElement('div', { style: { fontSize: 12, color: T.warn, marginBottom: 4 } }, '▶ ' + deployTask.current)
+                    : null,
+                  (deployTask.steps || []).length
+                    ? React.createElement('div', null,
+                        React.createElement('div', { style: { fontWeight: 600, marginBottom: 2, fontSize: 11, opacity: 0.8 } }, tr('settings.deploySteps')),
+                        deployTask.steps.map((s) => React.createElement('div', { key: s.id, style: { fontSize: 11, fontFamily: 'monospace', display: 'flex', gap: 6 } },
+                          React.createElement('span', { style: { color: s.ok ? T.ok : T.danger } }, s.ok ? '✓' : '✗'),
+                          React.createElement('span', null, s.title),
+                          !s.ok && s.output ? React.createElement('span', { style: { opacity: 0.75, whiteSpace: 'pre-wrap', wordBreak: 'break-all' } }, ' — ' + String(s.output).slice(0, 300)) : null)))
+                    : null,
+                  deployTask.status === 'running' || deployTask.status === 'queued'
+                    ? React.createElement('div', { style: { display: 'flex', gap: 8, alignItems: 'center', marginTop: 6 } },
+                        React.createElement('span', { style: { fontSize: 11, opacity: 0.7 } },
+                          (deployTask.progress && deployTask.progress.doneSteps || 0) + '/' + (deployTask.progress && deployTask.progress.totalSteps || '?')),
+                        React.createElement('button', { type: 'button', className: 'dsh-rw-btn', style: { ...buttonS, padding: '2px 10px' },
+                          onClick: () => deployAction('install-cancel', webAttachMachine) }, tr('settings.deployCancel')))
+                    : null,
+                  // A finished task: continue the journey — connect & open.
+                  deployTask.status === 'done'
+                    ? React.createElement('div', { style: { marginTop: 6, color: T.ok, fontSize: 12 } },
+                        tr('settings.deployDone')
+                        + (deployTask.result && deployTask.result.command ? ' · ' + deployTask.result.command : ''))
+                    : null,
+                  deployTask.status === 'failed'
+                    ? React.createElement('div', { style: { marginTop: 6, color: T.danger, fontSize: 12, wordBreak: 'break-all' } }, deployTask.error || tr('settings.deployFailed'))
+                    : null)
+              : null,
             // Verdict from the last probe/install, rendered as findings with the
             // severity the backend assigned — the UI never re-classifies them.
             deploy ? React.createElement('div', { style: { fontSize: 12, lineHeight: 1.6 } },
@@ -1317,9 +1522,13 @@ window.__ModuleLoader__.load({
             // reason to run. The host action re-probes internally anyway, so it is
             // safe to offer directly; clicking it is the explicit consent.
             React.createElement('button', { type: 'button', className: 'dsh-rw-btn dsh-rw-primary', style: { ...primaryBtnS, marginTop: 6 },
-              disabled: !!deployBusy || !webAttachMachine,
+              disabled: !webAttachMachine,
               onClick: () => { if (window.confirm(tr('settings.deployConfirm'))) deployAction('install', webAttachMachine, { confirm: true }) } },
-              deployBusy === 'install' ? tr('settings.deployInstalling') : tr('settings.deployInstall')),
+              // While a task runs, the button is the RESUME affordance (disabled
+              // — the poll renders live state; a second click must not restart).
+              (deployTask && (deployTask.status === 'running' || deployTask.status === 'queued'))
+                ? tr('settings.deployInstalling')
+                : deployBusy === 'install' ? tr('settings.deployInstalling') : tr('settings.deployInstall')),
             // The AI escape hatch: offered after a failure, and ONLY on click —
             // it costs a model call, so it is never automatic.
             (deployErr || (deploy && deploy.ok === false))
@@ -1486,6 +1695,13 @@ window.__ModuleLoader__.load({
       const [mkdirPrompt, setMkdirPrompt] = React.useState(false)
       const suggestTimer = React.useRef(null)
       const suggestRef = React.useRef(null)
+      // Issue #52 defect 1: the modal backdrop must dismiss only when the press
+      // STARTED on it (a suggestion click whose mouseup landed on the backdrop
+      // used to close the whole picker). The local-browse popup below is its own
+      // full-screen overlay, so it gets its own guard ref — sharing one ref
+      // would make a press on either backdrop arm the other.
+      const backdrop = useBackdropGuard()
+      const localBackdrop = useBackdropGuard()
       // Autocomplete performance (slow per-keystroke remote scans):
       //  - postedCurrentRef/currentPromiseRef: POST /current once per machine
       //    switch; concurrent callers share ONE in-flight promise and a failed
@@ -1915,7 +2131,8 @@ window.__ModuleLoader__.load({
         const parent = crumbs.length >= 2 ? crumbs[crumbs.length - 2].path : null
         return React.createElement('div', {
           style: { position: 'fixed', inset: 0, zIndex: 9999, background: 'rgba(0,0,0,0.5)', display: 'flex', alignItems: 'center', justifyContent: 'center', padding: 12 },
-          onClick: () => setLocalPop(null),
+          onMouseDown: localBackdrop.onMouseDown,
+          onClick: (e) => { if (localBackdrop.onClick(e)) setLocalPop(null) },
         },
           React.createElement('div', { style: { background: v('--dsw-alias-bg-overlay', '#1e1e1e'), border: '1px solid ' + T.borderStrong, borderRadius: 10, boxShadow: '0 10px 40px rgba(0,0,0,0.5)', width: 'min(560px, 94vw)', minWidth: 320, display: 'flex', flexDirection: 'column', maxHeight: 'min(460px, 84vh)', overflow: 'hidden' }, onClick: (e) => e.stopPropagation() },
             React.createElement('div', { style: { display: 'flex', gap: 6, alignItems: 'center', padding: '8px 12px', borderBottom: '1px solid ' + T.border } },
@@ -2026,7 +2243,15 @@ window.__ModuleLoader__.load({
         onClick: () => switchTab(t),
         style: { ...buttonS, fontWeight: tab === t ? 700 : 400, padding: '5px 14px' },
       }, lbl)
-      return React.createElement('div', { style: { position: 'fixed', inset: 0, zIndex: 9999, background: 'rgba(0,0,0,0.5)', display: 'flex', alignItems: 'center', justifyContent: 'center', padding: 16 }, onClick: () => { if (!busy && !mkdirPrompt) onCancel() } },
+      return React.createElement('div', {
+        style: { position: 'fixed', inset: 0, zIndex: 9999, background: 'rgba(0,0,0,0.5)', display: 'flex', alignItems: 'center', justifyContent: 'center', padding: 16 },
+        onMouseDown: backdrop.onMouseDown,
+        // Issue #52 defect 1: this was a bare onClick, so picking an autocomplete
+        // suggestion (mousedown inside the panel, panel re-laid-out, mouseup on
+        // the backdrop) closed the whole dialog. Only a press that began on the
+        // backdrop dismisses now.
+        onClick: (e) => { if (backdrop.onClick(e) && !busy && !mkdirPrompt) onCancel() },
+      },
         React.createElement('div', { className: 'dsh-rw-modal-panel', style: { background: v('--dsw-alias-bg-layer-1', '#18181b'), color: T.label, border: '1px solid ' + T.borderStrong, borderRadius: 12, boxShadow: '0 12px 48px rgba(0,0,0,0.5)', width: 'min(600px, 94vw)', maxHeight: 'min(680px, 92vh)', display: 'flex', flexDirection: 'column', padding: 16, boxSizing: 'border-box' }, onClick: (e) => e.stopPropagation() },
         React.createElement('div', { style: { display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: 10 } },
           React.createElement('div', { style: { fontSize: 15, fontWeight: 650 } }, tr('picker.title')),
@@ -2047,7 +2272,7 @@ window.__ModuleLoader__.load({
               err ? React.createElement('div', { style: { color: T.danger, fontSize: 12 } }, err) : null,
               localPop ? renderLocalPopup() : null,
             )
-          : React.createElement('div', { style: { display: 'flex', flexDirection: 'column', gap: 8, minHeight: 0, overflowY: 'auto' } },
+          : React.createElement('div', { style: { display: 'flex', flexDirection: 'column', gap: 8, minHeight: 0, overflowY: suggestOpen ? 'visible' : 'auto' } },
               React.createElement('div', { style: { display: 'flex', gap: 6, alignItems: 'center' } },
                 React.createElement('label', { style: { fontSize: 12, opacity: 0.8, whiteSpace: 'nowrap' } }, tr('picker.remoteMachine')),
                 React.createElement('div', { ref: ddRef, style: { position: 'relative', display: 'inline-block' } },
@@ -2087,14 +2312,29 @@ window.__ModuleLoader__.load({
                   React.createElement('button', { type: 'button', className: 'dsh-rw-btn', style: { ...buttonS, whiteSpace: 'nowrap' }, onClick: pickHome, disabled: !machineId }, tr('picker.home')),
                 ),
                 (suggestOpen && suggest.length)
-                  ? React.createElement('div', { style: { marginTop: 6, background: v('--dsw-alias-bg-overlay', '#1e1e1e'), color: T.label, border: '1px solid ' + T.borderStrong, borderRadius: 8, maxHeight: 200, overflowY: 'auto', boxShadow: '0 6px 24px rgba(0,0,0,0.25)' } },
-                      suggest.map((s, i) => React.createElement('div', { key: s + i, className: 'dsh-rw-list-item', onMouseDown: () => selectSuggestion(s), style: { padding: '6px 10px', cursor: 'pointer', fontSize: 12, fontFamily: 'monospace', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' } }, s)),
+                  // Issue #52 defect 2: this used to be an in-flow block, so
+                  // expanding it pushed the 「设为远程工作区」 button down and the
+                  // user could never hit a button that was moving. It is now an
+                  // absolutely-positioned overlay hanging off `suggestRef`
+                  // (position: relative), which also keeps the modal's height —
+                  // and therefore its centred edges — stable while open (that
+                  // stability is what makes the press-origin guard above exact).
+                  // `paddingBottom` lets the last entries scroll clear of the
+                  // button row, which is lifted over the dropdown by zIndex.
+                  ? React.createElement('div', { style: { position: 'absolute', top: '100%', left: 0, right: 0, zIndex: 60, marginTop: 6, paddingBottom: 36, background: v('--dsw-alias-bg-overlay', '#1e1e1e'), color: T.label, border: '1px solid ' + T.borderStrong, borderRadius: 8, maxHeight: 200, overflowY: 'auto', boxShadow: '0 6px 24px rgba(0,0,0,0.25)' } },
+                      // Issue #52 defect 1, local belt-and-braces: swallow the
+                      // gesture so no ancestor (least of all the backdrop) can
+                      // observe a click that began on a suggestion.
+                      suggest.map((s, i) => React.createElement('div', { key: s + i, className: 'dsh-rw-list-item', onMouseDown: (e) => { e.preventDefault(); e.stopPropagation(); selectSuggestion(s) }, style: { padding: '6px 10px', cursor: 'pointer', fontSize: 12, fontFamily: 'monospace', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' } }, s)),
                     )
                   : null,
               ),
               popOpen ? renderDirPopup() : null,
               err ? React.createElement('div', { style: { color: T.danger, fontSize: 12 } }, err) : null,
-              React.createElement('div', { style: { display: 'flex', gap: 8, justifyContent: 'flex-end', alignItems: 'center' } },
+              // The action row rides ABOVE the dropdown (zIndex 70) on its own
+              // opaque layer, so the list slides out from behind it instead of
+              // covering 「设为远程工作区」.
+              React.createElement('div', { style: { display: 'flex', gap: 8, justifyContent: 'flex-end', alignItems: 'center', position: 'relative', zIndex: 70, background: v('--dsw-alias-bg-layer-1', '#18181b') } },
                 React.createElement('span', { style: { fontSize: 11, opacity: 0.75, fontFamily: 'monospace', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap', flex: 1 } }, path ? tr('picker.selected', { path }) : ''),
                 React.createElement('button', { type: 'button', className: 'dsh-rw-btn dsh-rw-primary', style: primaryBtnS, onClick: () => commitPath(path), disabled: busy || !machineId || !path.trim() }, busy ? tr('picker.mirroring') : tr('picker.setRemoteWs')),
               ),
@@ -2153,6 +2393,199 @@ window.__ModuleLoader__.load({
         .catch(() => '')
     }
 
+    // ── which sessions are remote (issue #49) ────────────────────────────────
+    //
+    // The sidebar must say, at a glance, whether a Session row is a LOCAL
+    // session or one working on a remote host — and which host. The truth is
+    // already on the client: every Session summary carries its own cwd, and a
+    // cwd that lives inside a `$DSH_HOME/remote-workspaces/<host-user-port>/…`
+    // mirror IS a remote session bound to that mirror's recorded origin (the
+    // same invariant lib/binding.js uses host-side; see issue #13).
+    //
+    // So one GET /dsh-remote/bindings (the whole mirror registry, with each
+    // mirror's recorded host/port/user/path) answers every row, instead of one
+    // request per row. The active machine is deliberately NOT consulted: a saved
+    // machine that happens to be "current" must never label a local session.
+    //
+    // Failure is not fatal and not retried in a loop: no registry means no
+    // badge, which is exactly what a user with zero mirrors sees.
+
+    const MIRRORS = { list: [], loaded: false, error: '' }
+    const mirrorWatchers = new Set()
+    let mirrorLoad = null
+    let mirrorTimer = null
+
+    const notifyMirrors = () => {
+      for (const fn of mirrorWatchers) { try { fn() } catch { /* one watcher must not stop the rest */ } }
+    }
+    /** Load the mirror registry once (concurrent callers share the request). */
+    function ensureMirrors() {
+      if (MIRRORS.loaded) return Promise.resolve(MIRRORS)
+      if (mirrorLoad) return mirrorLoad
+      mirrorLoad = api('GET', '/dsh-remote/bindings')
+        .then((r) => {
+          MIRRORS.list = (r && Array.isArray(r.mirrors)) ? r.mirrors : []
+          MIRRORS.error = ''
+        })
+        .catch((e) => { MIRRORS.error = String((e && e.message) || e) })
+        .then(() => {
+          MIRRORS.loaded = true
+          mirrorLoad = null
+          notifyMirrors()
+          return MIRRORS
+        })
+      return mirrorLoad
+    }
+    /** Force a refresh (mirrors appear when a workspace is picked). */
+    function refreshMirrors() {
+      MIRRORS.loaded = false
+      return ensureMirrors()
+    }
+    /**
+     * The mirror containing a local path, or null.
+     *
+     * Separator-aware on purpose: `/a/mirror-2` must NOT be treated as living
+     * inside `/a/mirror` (the same trap lib/binding.js documents). The deepest
+     * match wins, so a future nested layout stays stable. Windows paths compare
+     * case-insensitively because the platform does.
+     */
+    function mirrorForCwd(cwd, mirrors) {
+      const raw = String(cwd || '')
+      if (!raw) return null
+      const list = Array.isArray(mirrors) ? mirrors : []
+      const isWin = raw.includes('\\')
+      const sep = isWin ? '\\' : '/'
+      const fold = (s) => (isWin ? s.toLowerCase() : s)
+      const base = fold(raw.replace(/[\\/]+$/, ''))
+      let best = null
+      for (const m of list) {
+        const dirRaw = String((m && m.dir) || '').replace(/[\\/]+$/, '')
+        if (!dirRaw) continue
+        const dir = fold(dirRaw)
+        if (base !== dir && !base.startsWith(dir + sep) && !base.startsWith(dir + '/')) continue
+        if (!best || dir.length > fold(String(best.dir).replace(/[\\/]+$/, '')).length) best = m
+      }
+      return best
+    }
+    /** `user@host:port` for a mirror record (port omitted when it is 22). */
+    function mirrorTarget(m) {
+      if (!m) return ''
+      const user = m.username ? m.username + '@' : ''
+      const port = Number(m.port) && Number(m.port) !== 22 ? ':' + m.port : ''
+      return user + String(m.host || '') + port
+    }
+    /** Host as the reader asked for it: the address, plus the saved machine name. */
+    function mirrorLabel(m) {
+      if (!m) return ''
+      const target = mirrorTarget(m)
+      return m.name && m.name !== m.host ? target + ' · ' + m.name : target
+    }
+    /**
+     * The remote binding of one Session row, read from that row's own cwd.
+     *
+     * A row with no cwd (a blank New Session) is not remote — a blank session
+     * has no workspace yet, and must never inherit the badge from a neighbor.
+     *
+     * Hook shape is CONSTANT: when the framework does not hand the entry a
+     * `useSessions` (older sidebar), a stable no-op hook is selected instead of
+     * skipping the call, so the hook count cannot change across renders (a
+     * conditional hook is a crash, not a degraded badge).
+     */
+    const NO_SELECT = () => undefined
+    function useSessionMirror(sessionId, useSessions) {
+      // `mirrorVersion` is only a re-render trigger: the registry arrives
+      // asynchronously, and every mounted mark must repaint when it does.
+      const [, bumpMirrorVersion] = React.useState(0)
+      const select = typeof useSessions === 'function' ? useSessions : NO_SELECT
+      const cwd = select((s) => (sessionId && s && s.byId && s.byId[sessionId] ? s.byId[sessionId].cwd : undefined))
+      React.useEffect(() => {
+        const fn = () => bumpMirrorVersion((n) => n + 1)
+        mirrorWatchers.add(fn)
+        ensureMirrors()
+        // Mirrors change when a remote workspace is picked in THIS tab; a slow
+        // poll covers a pick made in another tab without a per-render request.
+        if (!mirrorTimer && typeof setInterval === 'function') {
+          mirrorTimer = setInterval(refreshMirrors, 60000)
+        }
+        return () => {
+          mirrorWatchers.delete(fn)
+          if (!mirrorWatchers.size && mirrorTimer) { clearInterval(mirrorTimer); mirrorTimer = null }
+        }
+      }, [])
+      return mirrorForCwd(cwd, MIRRORS.list)
+    }
+
+    // Leading seat of a Session row: the 16px cell before the title. A green dot
+    // means "this session works on a remote host"; a local session renders
+    // nothing at all, so the cell stays blank exactly as before. The owner only
+    // mounts this seat while the row is idle (a running/pending row keeps its
+    // own status dot there) — the hover card below therefore carries the host
+    // for every row, running or not.
+    function RemoteSessionMark(props) {
+      const m = useSessionMirror(props.sessionId, props.useSessions)
+      if (!m) return null
+      const target = mirrorTarget(m)
+      return React.createElement('span', {
+        'data-dsh-remote-mark': '',
+        role: 'img',
+        'aria-label': tr('session.remoteBadge', { target }),
+        title: tr('session.remoteBadge', { target }) + (m.remotePath ? '\n' + m.remotePath : ''),
+        style: { width: 16, height: 20, display: 'inline-flex', alignItems: 'center', justifyContent: 'center', flexShrink: 0 },
+      }, React.createElement('span', {
+        'aria-hidden': 'true',
+        style: {
+          width: 8, height: 8, borderRadius: '50%',
+          background: 'var(--dsw-alias-state-success-primary, #4caf7d)',
+          boxShadow: '0 0 0 2px color-mix(in srgb, var(--dsw-alias-state-success-primary, #4caf7d) 22%, transparent)',
+        },
+      }))
+    }
+
+    // Hover-card section of a Session row, between its relative time and its
+    // trailing status line: names the remote host (and the remote path it
+    // works on) for a remote row. A local row renders nothing.
+    function RemoteSessionHover(props) {
+      const m = useSessionMirror(props.sessionId, props.useSessions)
+      if (!m) return null
+      return React.createElement('div', { 'data-dsh-remote-hover': '', style: { display: 'flex', flexDirection: 'column', gap: 2, fontSize: 12, lineHeight: '16px' } },
+        React.createElement('div', { style: { display: 'flex', alignItems: 'center', gap: 6 } },
+          React.createElement('span', {
+            'aria-hidden': 'true',
+            style: { width: 7, height: 7, borderRadius: '50%', flexShrink: 0, background: 'var(--dsw-alias-state-success-primary, #4caf7d)' },
+          }),
+          React.createElement('span', { style: { color: '#cfd3d6', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' } }, mirrorLabel(m)),
+        ),
+        m.remotePath
+          ? React.createElement('div', { style: { color: '#adb2b8', wordBreak: 'break-all', paddingLeft: 13 } }, m.remotePath)
+          : null,
+      )
+    }
+
+    // Conversation header chip for the CURRENT session: the one place the host
+    // can stay visible without hovering anything (the row's 16px cell is too
+    // narrow for an address). Renders nothing for a local session.
+    //
+    // This seat is session-scoped, so the owner hands the entry its `sessionId`
+    // (exactly like the shipped "open in app" utility) and the chip needs
+    // nothing from the sidebar.
+    function RemoteSessionChip(props) {
+      const m = useSessionMirror(props.sessionId, props.useSessions)
+      if (!m) return null
+      const target = mirrorTarget(m)
+      return React.createElement('span', {
+        'data-dsh-remote-chip': '',
+        className: 'dsh-rw-pill is-ok',
+        title: tr('session.remoteHover', { target }) + (m.remotePath ? '\n' + m.remotePath : ''),
+        style: { maxWidth: 220, overflow: 'hidden', textOverflow: 'ellipsis', display: 'inline-flex', alignItems: 'center', gap: 5 },
+      },
+        React.createElement('span', {
+          'aria-hidden': 'true',
+          style: { width: 7, height: 7, borderRadius: '50%', flexShrink: 0, background: 'var(--dsw-alias-state-success-primary, #4caf7d)' },
+        }),
+        React.createElement('span', { style: { overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' } }, target),
+      )
+    }
+
     function readRemoteFile(path, maxBytes, sessionId) {
       return api('POST', '/dsh-remote/read', withSessionBody({ path, maxBytes }, sessionId)).catch((e) => {
         throw new Error(tr('file.readFail', { msg: ((e && e.message) || e) }))
@@ -2961,6 +3394,19 @@ window.__ModuleLoader__.load({
         inner.effect(() => registerSidebarIntegration(inner), 'dsh-remote.betterSidebar')
       })
       ctx.inject(['sidebarRightTabs'], registerNativeSidebar)
+      // Issue #49: mark the remote Sessions in the sidebar's own Session list.
+      // These three seats belong to the SHIPPED ui-workspace browser, so they
+      // are injected (not assumed): a composition with a replacement sidebar
+      // simply never declares them, and the mark is absent rather than broken.
+      slots.inject('sidebar.session.row.leading', () =>
+        slots.register({ name: 'sidebar.session.row.leading', id: 'dsh-remote-remote-mark', order: 5 }, RemoteSessionMark),
+      )
+      slots.inject('sidebar.session.row.hover', () =>
+        slots.register({ name: 'sidebar.session.row.hover', id: 'dsh-remote-remote-host', order: 5 }, RemoteSessionHover),
+      )
+      slots.inject('conversation.session.header.utilities', () =>
+        slots.register({ name: 'conversation.session.header.utilities', id: 'dsh-remote-remote-chip', order: 15 }, RemoteSessionChip),
+      )
     }
 
     exports.name = name