dsh-plugin-workbench 0.0.9 → 0.0.10

package/lib/index.js

@@ -670,13 +670,25 @@ async function copyEntry(ctx, payload, signal) {
 		return fail(mapError(error));
 	}
 }
-/** Spawn one short-lived desktop command; resolves once the process launched. */
-function runDesktop(command, args) {
+/**
+* Spawn one short-lived desktop command; resolves once the process launched.
+*
+* `windowsHide` defaults to true (no console flash for console-subsystem
+* helpers). EXPLORER.EXE IS THE ONE EXCEPTION: spawning it with
+* `windowsHide: true` sets CREATE_NO_WINDOW, and the new shell folder window
+* is then created HIDDEN — the folder opens on screen but stays invisible, so
+* the user sees "nothing happened". (Verified empirically: the CabinetWClass
+* window exists with `visible=False`; dropping the flag makes it visible.)
+* explorer.exe is a GUI-subsystem app, so `windowsHide: false` never flashes
+* a console — pass false on every Windows explorer.exe spawn.
+* @param args - argv (never a shell string).
+*/
+function runDesktop(command, args, windowsHide = true) {
 	return new Promise((resolve, reject) => {
 		const child = spawn(command, args, {
 			detached: true,
 			stdio: "ignore",
-			windowsHide: true
+			windowsHide
 		});
 		child.once("error", reject);
 		child.once("spawn", () => {
@@ -705,7 +717,7 @@ async function revealNative(osPath, isDir, signal) {
 	signal.throwIfAborted();
 	const platform = process.platform;
 	if (platform === "win32") {
-		await runDesktop("explorer.exe", isDir ? [osPath] : ["/select,", osPath]);
+		await runDesktop("explorer.exe", isDir ? [osPath] : ["/select,", osPath], false);
 		return;
 	}
 	if (platform === "darwin") {
@@ -717,7 +729,7 @@ async function revealNative(osPath, isDir, signal) {
 		if (env.WSL_DISTRO_NAME !== void 0 || env.WSL_INTEROP !== void 0) {
 			const windowsPath = (await execCapture("wslpath", ["-w", osPath])).replace(/[\r\n]+$/, "");
 			if (windowsPath === "") throw new Error("wslpath returned no Windows path");
-			await runDesktop("explorer.exe", isDir ? [windowsPath] : ["/select,", windowsPath]);
+			await runDesktop("explorer.exe", isDir ? [windowsPath] : ["/select,", windowsPath], false);
 			return;
 		}
 		await runDesktop("xdg-open", [isDir ? osPath : dirname(osPath)]);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "dsh-plugin-workbench",
   "description": "VS Code-style workspace file explorer + editable preview for the dsh web GUI",
-  "version": "0.0.9",
+  "version": "0.0.10",
   "type": "module",
   "packageManager": "pnpm@11.21.0",
   "engines": {

package/src/client/FileExplorer.tsx

@@ -10,6 +10,7 @@ import { FileIcon } from './fileIcons'
 import type { FilesKey } from './locales'
 import { cancelCut, clearClipboard, closeFilesUnder, copyToClipboard, expandPreview, openFile, popUndo, pushUndo, retargetFile, setCwd, toggleTheme, useClipboard, useTabsState } from './store'
 import type { ClipboardItem, ClipboardMode, UndoEntry } from './store'
+import { DRAG_TYPE, insertIntoComposer, relPathOf } from './composer'
 
 export interface FsListEntry {
   name: string
@@ -286,9 +287,10 @@ export function FileExplorer({
   const dragPathsRef = useRef<string[] | null>(null)
   const [dropTarget, setDropTarget] = useState<string | null>(null)
 
-  // ---- context menu (rows only: right-clicking blank space shows no menu) ----
+  // ---- context menu (rows, blank tree space, header and clipboard bar —
+  //      the whole column carries a menu; right-clicking a row keeps its own) ----
   interface MenuState {
-    kind: 'file' | 'dir'
+    kind: 'file' | 'dir' | 'blank'
     path: string
     x: number
     y: number
@@ -337,6 +339,24 @@ export function FileExplorer({
     }
   }, [menu])
 
+  // Explorer semantics: clicking (or right-clicking) ANYWHERE outside the
+  // tree — the chat, the header, other columns — clears the selection. Clicks
+  // on the tree rows and inside the open menu keep it (the menu's batch
+  // actions operate on the selection).
+  useEffect(() => {
+    const onDocMouseDown = (e: MouseEvent) => {
+      const target = e.target
+      if (!(target instanceof Node)) return
+      const tree = treeAreaRef.current
+      if (tree !== null && tree.contains(target)) return
+      const m = menuRef.current
+      if (m !== null && m.contains(target)) return
+      setSelected({})
+    }
+    document.addEventListener('mousedown', onDocMouseDown)
+    return () => document.removeEventListener('mousedown', onDocMouseDown)
+  }, [])
+
   // Latest tree snapshot for the polling tick (avoids stale closures).
   const treeRef = useRef({ root, children, expanded, rootLoading })
   treeRef.current = { root, children, expanded, rootLoading }
@@ -517,6 +537,16 @@ export function FileExplorer({
     setMenu({ kind: entry.kind === 'dir' ? 'dir' : 'file', path: entry.path, x: e.clientX, y: e.clientY })
   }, [])
 
+  /** Right-click anywhere else in the column (header, clipboard bar, blank tree space): folder menu for the cwd. */
+  const onColumnContextMenu = useCallback((e: ReactMouseEvent) => {
+    e.preventDefault()
+    // Right-clicking the open menu itself keeps it (no browser menu either).
+    const el = menuRef.current
+    if (el !== null && e.target instanceof Node && el.contains(e.target)) return
+    if (cwd === undefined) return
+    setMenu({ kind: 'blank', path: cwd, x: e.clientX, y: e.clientY })
+  }, [cwd])
+
   const runAction = useCallback((action: () => void) => {
     setMenu(undefined)
     action()
@@ -809,11 +839,17 @@ export function FileExplorer({
     const paths = selected[entry.path] !== undefined ? Object.keys(selected) : [entry.path]
     dragPathsRef.current = paths
     try {
-      e.dataTransfer.setData('text/plain', entry.path)
+      // text/plain: natural browser fallback (a native textarea drop inserts
+      // the paths); the custom type carries the machine-readable list for the
+      // workbench's own chat-drop integration (composer.ts).
+      e.dataTransfer.setData('text/plain', paths.join('\n'))
+      e.dataTransfer.setData(DRAG_TYPE, JSON.stringify(paths))
     } catch {
       // dataTransfer may be unavailable — the ref still carries the paths
     }
-    e.dataTransfer.effectAllowed = 'move'
+    // copyMove: dropping on a folder row moves (tree), dropping on the chat
+    // copies the path text in.
+    e.dataTransfer.effectAllowed = 'copyMove'
   }, [selected])
 
   const onRowDragEnd = useCallback(() => {
@@ -897,6 +933,30 @@ export function FileExplorer({
     void openPath(entry.path)
   }, [openPath])
 
+  /** Explorer-style "Select All": every visible (non-trash) entry at any depth. */
+  const selectAllEntries = useCallback(() => {
+    const all: Record<string, FsListEntry['kind']> = {}
+    const collect = (entries: FsListEntry[]) => {
+      for (const entry of entries) {
+        if (entry.name === TRASH_NAME) continue
+        all[entry.path] = entry.kind
+        if (entry.kind === 'dir' && expanded.has(entry.path) && children[entry.path] !== undefined) {
+          collect(children[entry.path] as FsListEntry[])
+        }
+      }
+    }
+    const rootEntries = root !== undefined ? children[root] : undefined
+    if (rootEntries !== undefined) collect(rootEntries)
+    setSelected(all)
+  }, [children, expanded, root])
+
+  /** Insert `@<relative-workspace-path>` into the composer (Claude Code-style mention). */
+  const onMention = useCallback((path: string) => {
+    const mention = relPathOf(path, cwd)
+    if (mention.length === 0) return
+    insertIntoComposer(`@${mention} `)
+  }, [cwd])
+
   // Explorer-style keyboard: Ctrl/Cmd+C/X copy-cut, Ctrl/Cmd+V paste,
   // Ctrl/Cmd+A select-all, Escape clears the selection (and cancels a cut).
   const onTreeKeyDown = useCallback((e: ReactKeyboardEvent) => {
@@ -935,19 +995,7 @@ export function FileExplorer({
     }
     if (mod && key === 'a') {
       e.preventDefault()
-      const all: Record<string, FsListEntry['kind']> = {}
-      const collect = (entries: FsListEntry[]) => {
-        for (const entry of entries) {
-          if (entry.name === TRASH_NAME) continue
-          all[entry.path] = entry.kind
-          if (entry.kind === 'dir' && expanded.has(entry.path) && children[entry.path] !== undefined) {
-            collect(children[entry.path] as FsListEntry[])
-          }
-        }
-      }
-      const rootEntries = root !== undefined ? children[root] : undefined
-      if (rootEntries !== undefined) collect(rootEntries)
-      setSelected(all)
+      selectAllEntries()
       return
     }
     if (mod && key === 'z' && !e.shiftKey) {
@@ -966,7 +1014,7 @@ export function FileExplorer({
       setSelected({})
       cancelCut()
     }
-  }, [cancelCut, children, clipboard.items.length, deleteSelection, expanded, onPaste, performUndo, root, selectedItems, undoEntries.length])
+  }, [cancelCut, clipboard.items.length, deleteSelection, onPaste, performUndo, selectAllEntries, selectedItems, undoEntries.length])
 
   // ---- placeholder: no session / no cwd ----
   if (cwd === undefined) {
@@ -1043,9 +1091,12 @@ export function FileExplorer({
     const selectionCount = Object.keys(selected).length
     const deleteItem: MenuItem = selectionCount > 1
       ? { label: t('menu.deleteSelected', { count: selectionCount }), danger: true, onClick: () => void deleteSelection() }
-      : { label: t('menu.delete'), danger: true, onClick: () => onDelete(m.path, m.kind) }
+      // 'blank' never renders deleteItem (the blank branch returns earlier);
+      // the fallback only satisfies the union type.
+      : { label: t('menu.delete'), danger: true, onClick: () => onDelete(m.path, m.kind === 'blank' ? 'dir' : m.kind) }
     if (m.kind === 'file') {
       return [
+        { label: t('menu.atFile'), onClick: () => onMention(m.path) },
         { label: t('menu.open'), onClick: () => openFile(m.path) },
         'divider',
         { label: t('menu.copy'), onClick: () => onCopySelection('copy') },
@@ -1077,16 +1128,38 @@ export function FileExplorer({
         deleteItem,
       ]
     }
-    // Empty tree area: right-clicking blank space intentionally shows no
-    // custom menu (only file/folder rows do); this branch is unreachable but
-    // kept for the type. Paste happens via Ctrl+V into the current folder.
+    // Blank space / header / clipboard bar: operations against the current
+    // workspace folder (right-clicking blank space acts on the cwd, VS Code
+    // file-explorer style).
+    if (m.kind === 'blank') {
+      const dirPath = m.path
+      return [
+        { label: t('menu.newFile'), onClick: () => onNewFile(dirPath) },
+        { label: t('menu.newFolder'), onClick: () => onNewFolder(dirPath) },
+        { label: t('menu.paste'), disabled: clipboard.items.length === 0, onClick: () => void onPaste() },
+        'divider',
+        { label: t('menu.selectAll'), onClick: selectAllEntries },
+        { label: t('menu.undo'), disabled: undoEntries.length === 0, onClick: () => void performUndo() },
+        'divider',
+        { label: t('menu.copyPath'), onClick: () => onCopyPath(dirPath) },
+        { label: t('menu.revealInExplorer'), onClick: () => onReveal(dirPath, 'dir') },
+        { label: t('menu.openSystem'), onClick: () => void openPath(dirPath) },
+        { label: t('menu.refresh'), onClick: () => refreshDir(dirPath) },
+      ]
+    }
     return [
       { label: t('menu.paste'), disabled: clipboard.items.length === 0, onClick: () => void onPaste() },
     ]
   }
 
   return (
-    <div className={styles.column} style={{ width: width > 0 ? width : undefined }} data-pane="explorer" data-fe-theme={theme}>
+    <div
+      className={styles.column}
+      style={{ width: width > 0 ? width : undefined }}
+      data-pane="explorer"
+      data-fe-theme={theme}
+      onContextMenu={onColumnContextMenu}
+    >
       <div className={styles.header}>
         <span className={styles.headerTitle} title={root ?? cwd}>{basenameOf(root ?? cwd)}</span>
         <span className={styles.headerActions}>
@@ -1133,8 +1206,10 @@ export function FileExplorer({
         className={styles.treeArea}
         onKeyDown={onTreeKeyDown}
         onClick={(e) => {
-          // Clicking blank space deselects (Explorer behavior).
-          if (e.target === e.currentTarget) setSelected({})
+          // Clicking blank space (or a hint/error line — anything that is not
+          // a tree row) deselects, Explorer behavior.
+          const target = e.target as HTMLElement
+          if (target.closest('[role="treeitem"]') === null) setSelected({})
         }}
         onDragOver={(e) => {
           // Blank tree area also accepts a drop: move into the current folder.
@@ -1158,6 +1233,12 @@ export function FileExplorer({
           ref={menuRef}
           className={styles.contextMenu}
           role="menu"
+          onContextMenu={(e) => {
+            // Right-clicking the open menu keeps it (and never shows the
+            // browser menu).
+            e.preventDefault()
+            e.stopPropagation()
+          }}
           style={menuPos !== undefined ? { left: menuPos.x, top: menuPos.y } : { left: menu.x, top: menu.y, visibility: 'hidden' }}
         >
           {menuItems(menu).map((item, index) =>

package/src/client/composer.ts

@@ -0,0 +1,139 @@
+/**
+ * Composer integration for the workbench file column.
+ *
+ * Two gestures land text in the chat composer without touching the core:
+ *
+ * 1. Drag & drop — dragging one or more tree rows and dropping ANYWHERE
+ *    outside the file column (the chat, the composer, the message list)
+ *    inserts the dragged paths into the composer. Dropping INSIDE the file
+ *    column still performs the tree's own move operation — the tree's drop
+ *    handler runs first and stops propagation, so this document-level
+ *    listener never sees those drops.
+ *
+ * 2. Context-menu "@引用" — inserts `@<relative-workspace-path>` at the
+ *    composer caret.
+ *
+ * The composer is a controlled React textarea, so the value is updated
+ * through the native `value` setter + a bubbling `input` event (the standard
+ * trick that makes React's onChange see the change), and the caret is
+ * restored on the next frame because the React re-render may reset it.
+ */
+import { getTabsState, openFile } from './store'
+
+/** Custom dataTransfer type carrying the dragged workspace paths (JSON array). */
+export const DRAG_TYPE = 'application/x-dsh-workbench-files'
+
+/** One-time install guard (the client bundle re-applies on HMR). */
+let dropsInstalled = false
+
+/** Start the document-level drop listener (idempotent). */
+export function installComposerDrops(): void {
+  if (dropsInstalled || typeof document === 'undefined') return
+  dropsInstalled = true
+  // Bubble phase: the tree's own drop handlers (React, attached at the root
+  // container) run first and stop the event, so drops inside the file column
+  // never reach this listener.
+  document.addEventListener('drop', onDocumentDrop)
+}
+
+function onDocumentDrop(e: DragEvent): void {
+  const dt = e.dataTransfer
+  if (dt === null || !dt.types.includes(DRAG_TYPE)) return
+  const paths = readDraggedPaths(dt)
+  if (paths.length === 0) return
+  if (!insertIntoComposer(paths.join('\n'))) return
+  e.preventDefault()
+  e.stopPropagation()
+}
+
+/** Read the JSON paths from the custom type; falls back to raw text. */
+export function readDraggedPaths(dt: DataTransfer | null): string[] {
+  if (dt === null) return []
+  let raw = ''
+  try {
+    raw = dt.getData(DRAG_TYPE)
+  } catch {
+    return []
+  }
+  try {
+    const parsed: unknown = JSON.parse(raw)
+    if (Array.isArray(parsed) && parsed.every((p) => typeof p === 'string')) return parsed as string[]
+  } catch {
+    // Not JSON — fall through to the raw-text fallback.
+  }
+  return raw.trim().length > 0 ? [raw] : []
+}
+
+/** The visible composer textarea, or null when none is usable. */
+function composerTextarea(): HTMLTextAreaElement | null {
+  if (typeof document === 'undefined') return null
+  const seat = document.querySelector('[data-composer-seat]')
+  if (seat === null) return null
+  const input = seat.querySelector('textarea')
+  if (!(input instanceof HTMLTextAreaElement)) return null
+  // A disabled input has no usable draft; a read-only one is either the hero
+  // workspace picker or a transient submitting state — skip both.
+  if (input.disabled || input.readOnly) return null
+  return input
+}
+
+/**
+ * Insert `text` into the composer. If the composer textarea has focus, the
+ * text goes at the caret; otherwise it is appended to the draft. Returns
+ * false when no usable composer is present.
+ */
+export function insertIntoComposer(text: string): boolean {
+  const textarea = composerTextarea()
+  if (textarea === null) return false
+  const value = textarea.value
+  const atCaret = document.activeElement === textarea
+  const start = atCaret ? textarea.selectionStart : value.length
+  const end = atCaret ? textarea.selectionEnd : value.length
+  const next = value.slice(0, start) + text + value.slice(end)
+  const setter = Object.getOwnPropertyDescriptor(HTMLTextAreaElement.prototype, 'value')?.set
+  if (setter !== undefined) setter.call(textarea, next)
+  else textarea.value = next
+  textarea.dispatchEvent(new Event('input', { bubbles: true }))
+  // The React re-render may reset the selection, so restore on the next frame.
+  const caret = start + text.length
+  requestAnimationFrame(() => {
+    try {
+      textarea.setSelectionRange(caret, caret)
+    } catch {
+      // Selection state unavailable — the text is in the draft either way.
+    }
+  })
+  return true
+}
+
+/** Relative workspace path of `path` under `cwd` ('' when it IS the cwd). */
+export function relPathOf(path: string, cwd: string | undefined): string {
+  if (cwd === undefined || cwd.length === 0) return path
+  const sep = cwd.includes('\\') ? '\\' : '/'
+  const prefix = cwd.endsWith('\\') || cwd.endsWith('/') ? cwd : cwd + sep
+  const lowerPath = path.toLowerCase()
+  if (lowerPath.startsWith(prefix.toLowerCase())) return path.slice(prefix.length)
+  if (lowerPath === cwd.toLowerCase()) return ''
+  return path
+}
+
+/**
+ * Resolve an @-mention path (workspace-relative or absolute) against the
+ * current workspace cwd; returns the absolute OS path, or undefined when the
+ * mention cannot be resolved (no cwd and the path is not absolute).
+ */
+export function resolveMentionPath(mention: string): string | undefined {
+  const absolute = /^[A-Za-z]:[\\/]/.test(mention) || mention.startsWith('/') || mention.startsWith('\\')
+  const { cwd } = getTabsState()
+  if (absolute) return mention
+  if (cwd === undefined) return undefined
+  const sep = cwd.includes('\\') ? '\\' : '/'
+  return cwd.endsWith('\\') || cwd.endsWith('/') ? cwd + mention : cwd + sep + mention
+}
+
+/** Open an @-mention's file in the workbench preview (used by the linkifier). */
+export function openMention(mention: string): void {
+  const abs = resolveMentionPath(mention)
+  if (abs === undefined) return
+  openFile(abs)
+}

package/src/client/index.ts

@@ -11,6 +11,8 @@ import type { Context } from '@deepseek-ai/cordis'
 import { FileExplorer } from './FileExplorer'
 import { FilePreview } from './FilePreview'
 import { NS, zh, en } from './locales'
+import { installComposerDrops } from './composer'
+import { installMentionLinkifier } from './mentions'
 
 const CHANNEL = '/dsh-plugin-files'
 
@@ -20,6 +22,11 @@ export const inject = ['slots', 'sessions', 'workspaces', 'locale', 'connection'
 export function apply(ctx: Context): void {
   ctx.effect(() => ctx.locale.register(NS, { zh, en }), 'files-explorer: dictionaries')
 
+  // Drag-to-chat + @-mention linkifier: DOM-level integrations, one-time
+  // install (module guards make re-applies on HMR idempotent).
+  installComposerDrops()
+  ctx.effect(() => installMentionLinkifier(), 'files-explorer: @mention linkifier')
+
   const listDir = (path: string, signal?: AbortSignal) => unwrap(ctx.connection.rpc.call(CHANNEL, 'list', { path }, signal))
   const readFile = (path: string, signal?: AbortSignal) => unwrap(ctx.connection.rpc.call(CHANNEL, 'read', { path }, signal))
   const writeFile = (path: string, content: string, signal?: AbortSignal) => unwrap(ctx.connection.rpc.call(CHANNEL, 'write', { path, content }, signal))

package/src/client/locales.ts

@@ -18,6 +18,7 @@ export const zh = {
   'tab.expand': '弹出文件详情',
   'tab.diskChanged': '文件已在磁盘上被修改，点击重新加载（会放弃未保存的编辑）',
   'menu.open': '打开预览',
+  'menu.atFile': '@ 在消息中引用',
   'menu.newFile': '新建文件',
   'menu.newFolder': '新建文件夹',
   'menu.rename': '重命名',
@@ -30,6 +31,8 @@ export const zh = {
   'menu.openSystem': '在系统中打开',
   'menu.revealInExplorer': '在资源管理器打开',
   'menu.deleteSelected': '删除选中的 {count} 项',
+  'menu.selectAll': '全选',
+  'menu.undo': '撤销',
   'action.undo': '撤销（Ctrl+Z）',
   'undo.copy': '复制「{name}」',
   'undo.move': '移动「{name}」',
@@ -76,6 +79,7 @@ export const en: Record<FilesKey, string> = {
   'tab.expand': 'Expand file details',
   'tab.diskChanged': 'File changed on disk — click to reload (discards unsaved edits)',
   'menu.open': 'Open preview',
+  'menu.atFile': '@ Mention in message',
   'menu.newFile': 'New File',
   'menu.newFolder': 'New Folder',
   'menu.rename': 'Rename',
@@ -88,6 +92,8 @@ export const en: Record<FilesKey, string> = {
   'menu.openSystem': 'Open in System',
   'menu.revealInExplorer': 'Reveal in Explorer',
   'menu.deleteSelected': 'Delete {count} selected item(s)',
+  'menu.selectAll': 'Select All',
+  'menu.undo': 'Undo',
   'action.undo': 'Undo (Ctrl+Z)',
   'undo.copy': 'Copy "{name}"',
   'undo.move': 'Move "{name}"',