nastechai-desktop 18.1.0

package/src/app/profiles/rename-profile-dialog.tsx

@@ -0,0 +1,125 @@
+import { useEffect, useState } from 'react'
+
+import { ActionStatus } from '@/components/ui/action-status'
+import { Button } from '@/components/ui/button'
+import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog'
+import { Input } from '@/components/ui/input'
+import { renameProfile } from '@/nastech'
+import { useI18n } from '@/i18n'
+import { AlertTriangle } from '@/lib/icons'
+import { cn } from '@/lib/utils'
+
+import { isValidProfileName } from './create-profile-dialog'
+
+// Self-contained rename (owns the renameProfile call) so every caller just
+// reacts via onRenamed. Unchanged name is a no-op close.
+export function RenameProfileDialog({
+  currentName,
+  onClose,
+  onRenamed,
+  open
+}: {
+  currentName: string
+  onClose: () => void
+  onRenamed?: (name: string) => Promise<void> | void
+  open: boolean
+}) {
+  const { t } = useI18n()
+  const p = t.profiles
+  const [name, setName] = useState(currentName)
+  const [status, setStatus] = useState<'done' | 'idle' | 'saving'>('idle')
+  const [error, setError] = useState<null | string>(null)
+
+  useEffect(() => {
+    if (!open) {
+      return
+    }
+
+    setName(currentName)
+    setError(null)
+    setStatus('idle')
+  }, [currentName, open])
+
+  const trimmed = name.trim()
+  const unchanged = trimmed === currentName
+  const invalid = trimmed !== '' && !unchanged && !isValidProfileName(trimmed)
+  const busy = status === 'saving' || status === 'done'
+
+  async function handleSubmit(event: React.FormEvent) {
+    event.preventDefault()
+
+    if (unchanged) {
+      onClose()
+
+      return
+    }
+
+    if (!trimmed || invalid) {
+      setError(invalid ? p.invalidName(p.nameHint) : p.nameRequired)
+
+      return
+    }
+
+    setStatus('saving')
+    setError(null)
+
+    try {
+      await renameProfile(currentName, trimmed)
+      await onRenamed?.(trimmed)
+      setStatus('done')
+      window.setTimeout(onClose, 800)
+    } catch (err) {
+      setStatus('idle')
+      setError(err instanceof Error ? err.message : p.failedRename)
+    }
+  }
+
+  return (
+    <Dialog onOpenChange={value => !value && !busy && onClose()} open={open}>
+      <DialogContent className="max-w-md">
+        <DialogHeader>
+          <DialogTitle>{p.renameTitle}</DialogTitle>
+          <DialogDescription>
+            {p.renameDescPrefix}
+            <span className="font-mono">~/.local/bin</span>
+            {p.renameDescSuffix}
+          </DialogDescription>
+        </DialogHeader>
+
+        <form className="grid gap-3" onSubmit={handleSubmit}>
+          <div className="grid gap-1.5">
+            <label className="text-xs font-medium" htmlFor="rename-profile-name">
+              {p.newNameLabel}
+            </label>
+            <Input
+              aria-invalid={invalid}
+              autoFocus
+              id="rename-profile-name"
+              onChange={event => setName(event.target.value)}
+              value={name}
+            />
+            <p className={cn('text-[0.66rem] leading-4', invalid ? 'text-destructive' : 'text-muted-foreground')}>
+              {p.nameHint}
+            </p>
+          </div>
+
+          {error && (
+            <div className="flex items-start gap-2 rounded-md border border-destructive/30 bg-destructive/10 px-3 py-2 text-xs text-destructive">
+              <AlertTriangle className="mt-0.5 size-3.5 shrink-0" />
+              <span>{error}</span>
+            </div>
+          )}
+
+          <DialogFooter>
+            <Button disabled={busy} onClick={onClose} type="button" variant="ghost">
+              {t.common.cancel}
+            </Button>
+            <Button disabled={busy || invalid || unchanged} type="submit">
+              <ActionStatus busy={p.renaming} done={p.renamed} idle={p.rename} state={status} />
+            </Button>
+          </DialogFooter>
+        </form>
+      </DialogContent>
+    </Dialog>
+  )
+}

package/src/app/right-sidebar/files/dnd-manager.ts

@@ -0,0 +1,27 @@
+import { createDragDropManager, type DragDropManager } from 'dnd-core'
+import { HTML5Backend } from 'react-dnd-html5-backend'
+
+let manager: DragDropManager | null = null
+
+/**
+ * A single, app-lifetime react-dnd manager for the file tree.
+ *
+ * react-arborist mounts its own react-dnd `DndProvider` with `HTML5Backend`
+ * inside every `<Tree>`. react-dnd v14 stores that provider's manager on a
+ * global, ref-counted singleton context and nulls it when the count hits 0.
+ * On a keyed remount (cwd / collapse changes force a fresh `<Tree>`), the
+ * singleton can be torn down and recreated while the previous `HTML5Backend`
+ * still owns the `window.__isReactDndHtml5Backend` setup flag — so the new
+ * backend's `setup()` throws "Cannot have two HTML5 backends at the same
+ * time." and trips the file-tree error boundary (it never recovers, because
+ * "Try again" just remounts into the same race).
+ *
+ * Passing arborist a stable `dndManager` makes it skip the global-singleton
+ * path entirely and reuse one backend for the lifetime of the app, so the
+ * window flag is never double-claimed.
+ */
+export function getFileTreeDndManager(): DragDropManager {
+  manager ??= createDragDropManager(HTML5Backend)
+
+  return manager
+}

package/src/app/right-sidebar/files/ipc.test.ts

@@ -0,0 +1,100 @@
+/// <reference types="node" />
+
+import { Buffer } from 'node:buffer'
+
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+
+import type { NasTechReadDirEntry, NasTechReadDirResult } from '@/global'
+
+import { clearProjectDirCache, readProjectDir } from './ipc'
+
+const readDir = vi.fn<(path: string) => Promise<NasTechReadDirResult>>()
+const readFileDataUrl = vi.fn<(path: string) => Promise<string>>()
+const gitRoot = vi.fn<(path: string) => Promise<string | null>>()
+
+function ok(entries: NasTechReadDirEntry[]): NasTechReadDirResult {
+  return { entries }
+}
+
+function dataUrl(text: string) {
+  return `data:text/plain;base64,${Buffer.from(text, 'utf8').toString('base64')}`
+}
+
+function installBridge() {
+  ;(
+    window as unknown as {
+      nastechDesktop: {
+        gitRoot: typeof gitRoot
+        readDir: typeof readDir
+        readFileDataUrl: typeof readFileDataUrl
+      }
+    }
+  ).nastechDesktop = { gitRoot, readDir, readFileDataUrl }
+}
+
+describe('readProjectDir', () => {
+  beforeEach(() => {
+    clearProjectDirCache()
+    readDir.mockReset()
+    readFileDataUrl.mockReset()
+    gitRoot.mockReset()
+    installBridge()
+  })
+
+  afterEach(() => {
+    clearProjectDirCache()
+    delete (window as unknown as { nastechDesktop?: unknown }).nastechDesktop
+  })
+
+  it('returns no-bridge when the desktop bridge is unavailable', async () => {
+    delete (window as unknown as { nastechDesktop?: unknown }).nastechDesktop
+
+    await expect(readProjectDir('/repo')).resolves.toEqual({ entries: [], error: 'no-bridge' })
+  })
+
+  it('filters gitignored entries when readDir returns Windows-style paths', async () => {
+    gitRoot.mockResolvedValue('C:\\repo')
+    readDir.mockImplementation(async path => {
+      if (path === 'C:\\repo\\src') {
+        return ok([
+          { name: 'debug.log', path: 'C:\\repo\\src\\debug.log', isDirectory: false },
+          { name: '临时.txt', path: 'C:\\repo\\src\\临时.txt', isDirectory: false },
+          { name: 'keep.ts', path: 'C:\\repo\\src\\keep.ts', isDirectory: false }
+        ])
+      }
+
+      if (path === 'C:/repo') {
+        return ok([{ name: '.gitignore', path: 'C:/repo/.gitignore', isDirectory: false }])
+      }
+
+      if (path === 'C:/repo/src') {
+        return ok([])
+      }
+
+      return ok([])
+    })
+    readFileDataUrl.mockResolvedValue(dataUrl('# Unicode 路径规则\nsrc/*.log\nsrc/临时.txt\n'))
+
+    const result = await readProjectDir('C:\\repo\\src', 'C:\\repo')
+
+    expect(result.entries.map(entry => entry.name)).toEqual(['keep.ts'])
+    expect(gitRoot).toHaveBeenCalledWith('C:/repo')
+    expect(readFileDataUrl).toHaveBeenCalledWith('C:/repo/.gitignore')
+  })
+
+  it('does not fetch .gitignore contents when listings do not contain .gitignore', async () => {
+    gitRoot.mockResolvedValue('/repo')
+    readDir.mockImplementation(async path => {
+      if (path === '/repo/src') {
+        return ok([{ name: 'debug.log', path: '/repo/src/debug.log', isDirectory: false }])
+      }
+
+      return ok([])
+    })
+
+    const result = await readProjectDir('/repo/src', '/repo')
+
+    expect(result.entries.map(entry => entry.name)).toEqual(['debug.log'])
+    expect(readFileDataUrl).not.toHaveBeenCalled()
+  })
+})

package/src/app/right-sidebar/files/ipc.ts

@@ -0,0 +1,161 @@
+import ignore from 'ignore'
+
+import type { NasTechReadDirEntry, NasTechReadDirResult } from '@/global'
+
+export type ProjectTreeEntry = NasTechReadDirEntry
+
+interface GitignoreRule {
+  base: string
+  ig: ReturnType<typeof ignore>
+}
+
+const gitRootCache = new Map<string, Promise<string | null>>()
+const gitignoreCache = new Map<string, Promise<GitignoreRule | null>>()
+
+function decodeDataUrl(dataUrl: string) {
+  const match = dataUrl.match(/^data:[^,]*,(.*)$/)
+  const data = match?.[1] || ''
+  const isBase64 = dataUrl.slice(0, dataUrl.indexOf(',')).includes(';base64')
+
+  if (!isBase64) {
+    return decodeURIComponent(data)
+  }
+
+  const bytes = Uint8Array.from(atob(data), ch => ch.charCodeAt(0))
+
+  return new TextDecoder().decode(bytes)
+}
+
+function clean(path: string) {
+  return path.replace(/\/+$/, '') || '/'
+}
+
+/** Strict POSIX-style relative path; null if `child` is not inside `root`. */
+function relativeTo(root: string, child: string) {
+  const r = clean(root)
+  const c = clean(child)
+
+  if (c === r) {
+    return ''
+  }
+
+  return c.startsWith(`${r}/`) ? c.slice(r.length + 1) : null
+}
+
+/** Repo-root → repo-root/a → repo-root/a/b → … for every dir between root and `dir`. */
+function ancestorDirs(root: string, dir: string) {
+  const r = clean(root)
+  const rel = relativeTo(r, dir)
+
+  if (rel === null || rel === '') {
+    return [r]
+  }
+
+  const dirs = [r]
+  let current = r
+
+  for (const part of rel.split('/').filter(Boolean)) {
+    current = `${current}/${part}`
+    dirs.push(current)
+  }
+
+  return dirs
+}
+
+async function gitRootFor(start: string) {
+  if (!window.NASTECHDesktop?.gitRoot) {
+    return null
+  }
+
+  const key = clean(start)
+  let cached = gitRootCache.get(key)
+
+  if (!cached) {
+    cached = window.NASTECHDesktop.gitRoot(key)
+    gitRootCache.set(key, cached)
+  }
+
+  return cached
+}
+
+/** Read .gitignore at `dir` if it actually exists — never probe missing files. */
+async function readGitignore(dir: string): Promise<GitignoreRule | null> {
+  if (!window.NASTECHDesktop?.readDir || !window.NASTECHDesktop.readFileDataUrl) {
+    return null
+  }
+
+  try {
+    const listing = await window.NASTECHDesktop.readDir(dir)
+
+    if (!listing.entries.some(e => e.name === '.gitignore' && !e.isDirectory)) {
+      return null
+    }
+
+    const text = decodeDataUrl(await window.NASTECHDesktop.readFileDataUrl(`${dir}/.gitignore`))
+
+    return { base: dir, ig: ignore().add(text) }
+  } catch {
+    return null
+  }
+}
+
+async function gitignoreFor(dir: string) {
+  const key = clean(dir)
+  let cached = gitignoreCache.get(key)
+
+  if (!cached) {
+    cached = readGitignore(key)
+    gitignoreCache.set(key, cached)
+  }
+
+  return cached
+}
+
+function ignoredBy(rules: GitignoreRule[], entry: NasTechReadDirEntry) {
+  return rules.some(rule => {
+    const rel = relativeTo(rule.base, entry.path)
+
+    if (rel === null || rel === '') {
+      return false
+    }
+
+    return rule.ig.ignores(entry.isDirectory ? `${rel}/` : rel)
+  })
+}
+
+async function filterIgnored(entries: NasTechReadDirEntry[], rootPath: string, dirPath: string) {
+  const root = await gitRootFor(rootPath)
+
+  if (!root) {
+    return entries
+  }
+
+  const rules = (await Promise.all(ancestorDirs(root, dirPath).map(gitignoreFor))).filter((r): r is GitignoreRule =>
+    Boolean(r)
+  )
+
+  return rules.length > 0 ? entries.filter(entry => !ignoredBy(rules, entry)) : entries
+}
+
+export async function readProjectDir(dirPath: string, rootPath = dirPath): Promise<NasTechReadDirResult> {
+  if (!window.NASTECHDesktop) {
+    return { entries: [], error: 'no-bridge' }
+  }
+
+  const result = await window.NASTECHDesktop.readDir(dirPath)
+
+  return { ...result, entries: await filterIgnored(result.entries, rootPath, dirPath) }
+}
+
+export function clearProjectDirCache(rootPath?: string) {
+  if (!rootPath) {
+    gitRootCache.clear()
+    gitignoreCache.clear()
+
+    return
+  }
+
+  const key = clean(rootPath)
+  gitRootCache.delete(key)
+  gitignoreCache.delete(key)
+}

package/src/app/right-sidebar/files/remote-picker.tsx

@@ -0,0 +1,177 @@
+import { useEffect, useMemo, useState } from 'react'
+
+import { Button } from '@/components/ui/button'
+import { Codicon } from '@/components/ui/codicon'
+import { Dialog, DialogContent, DialogDescription, DialogTitle } from '@/components/ui/dialog'
+import { useI18n } from '@/i18n'
+import { readDesktopDir, setDesktopFsRemotePicker } from '@/lib/desktop-fs'
+import { cn } from '@/lib/utils'
+
+function clean(path: string) {
+  return path.replace(/\/+$/, '') || '/'
+}
+
+function parentDir(path: string) {
+  const value = clean(path)
+  if (value === '/') {
+    return '/'
+  }
+  const parent = value.slice(0, value.lastIndexOf('/'))
+  return parent || '/'
+}
+
+function pathName(path: string) {
+  return path.split('/').filter(Boolean).pop() || path
+}
+
+interface PendingSelection {
+  defaultPath: string
+  resolve: (paths: string[]) => void
+  title: string
+}
+
+export function RemoteFolderPicker() {
+  const { t } = useI18n()
+  const r = t.rightSidebar
+  const [pending, setPending] = useState<PendingSelection | null>(null)
+  const [currentPath, setCurrentPath] = useState('/')
+  const [entries, setEntries] = useState<Array<{ name: string; path: string }>>([])
+  const [error, setError] = useState<string | null>(null)
+  const [loading, setLoading] = useState(false)
+
+  useEffect(() => {
+    setDesktopFsRemotePicker({
+      selectPaths: options =>
+        new Promise(resolve => {
+          const defaultPath = clean(options?.defaultPath || '/')
+          setCurrentPath(defaultPath)
+          setPending({ defaultPath, resolve, title: options?.title || r.remotePickerTitle })
+        })
+    })
+    return () => setDesktopFsRemotePicker(null)
+  }, [r.remotePickerTitle])
+
+  useEffect(() => {
+    if (!pending) {
+      return
+    }
+
+    let active = true
+    setLoading(true)
+    setError(null)
+
+    void readDesktopDir(currentPath)
+      .then(result => {
+        if (!active) {
+          return
+        }
+        if (result.error) {
+          setError(result.error)
+          setEntries([])
+          return
+        }
+        setEntries(result.entries.filter(entry => entry.isDirectory).map(entry => ({ name: entry.name, path: entry.path })))
+      })
+      .catch(err => {
+        if (active) {
+          setError(err instanceof Error ? err.message : String(err))
+          setEntries([])
+        }
+      })
+      .finally(() => {
+        if (active) {
+          setLoading(false)
+        }
+      })
+
+    return () => {
+      active = false
+    }
+  }, [currentPath, pending])
+
+  const crumbs = useMemo(() => {
+    const parts = clean(currentPath).split('/').filter(Boolean)
+    const out = [{ label: '/', path: '/' }]
+    let acc = ''
+    for (const part of parts) {
+      acc += `/${part}`
+      out.push({ label: part, path: acc })
+    }
+    return out
+  }, [currentPath])
+
+  const close = (paths: string[] = []) => {
+    pending?.resolve(paths)
+    setPending(null)
+    setEntries([])
+    setError(null)
+  }
+
+  return (
+    <Dialog onOpenChange={open => !open && close()} open={Boolean(pending)}>
+      <DialogContent className="max-w-lg gap-0 overflow-hidden p-0">
+        <div className="border-b border-border/70 px-4 py-3">
+          <DialogTitle className="text-sm">{pending?.title || r.remotePickerTitle}</DialogTitle>
+          <DialogDescription className="mt-1 text-xs">{r.remotePickerDescription}</DialogDescription>
+        </div>
+
+        <div className="flex min-h-[22rem] flex-col">
+          <div className="flex flex-wrap items-center gap-1 border-b border-border/50 px-3 py-2 text-xs text-muted-foreground">
+            {crumbs.map((crumb, index) => (
+              <button
+                className={cn('rounded px-1.5 py-0.5 hover:bg-muted hover:text-foreground', index === crumbs.length - 1 && 'text-foreground')}
+                key={crumb.path}
+                onClick={() => setCurrentPath(crumb.path)}
+                type="button"
+              >
+                {crumb.label}
+              </button>
+            ))}
+          </div>
+
+          <div className="min-h-0 flex-1 overflow-y-auto p-2">
+            <FolderRow disabled={currentPath === '/'} name=".." onClick={() => setCurrentPath(parentDir(currentPath))} />
+            {loading ? (
+              <div className="flex items-center gap-2 px-2 py-3 text-xs text-muted-foreground">
+                <Codicon name="loading" size="0.8rem" spinning />
+                {r.loadingFiles}
+              </div>
+            ) : error ? (
+              <div className="px-2 py-3 text-xs text-destructive">{r.unreadableBody(error)}</div>
+            ) : entries.length === 0 ? (
+              <div className="px-2 py-3 text-xs text-muted-foreground">{r.emptyBody}</div>
+            ) : (
+              entries.map(entry => <FolderRow key={entry.path} name={pathName(entry.path)} onClick={() => setCurrentPath(entry.path)} />)
+            )}
+          </div>
+        </div>
+
+        <div className="flex items-center justify-between gap-2 border-t border-border/70 px-4 py-3">
+          <div className="min-w-0 truncate text-xs text-muted-foreground">{currentPath}</div>
+          <div className="flex shrink-0 items-center gap-2">
+            <Button onClick={() => close()} size="sm" variant="ghost">
+              {t.common.cancel}
+            </Button>
+            <Button onClick={() => close([currentPath])} size="sm">
+              {r.remotePickerSelect}
+            </Button>
+          </div>
+        </div>
+      </DialogContent>
+    </Dialog>
+  )
+}
+
+function FolderRow({ disabled = false, name, onClick }: { disabled?: boolean; name: string; onClick: () => void }) {
+  return (
+    <button
+      className="flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-left text-xs text-(--ui-text-secondary) hover:bg-(--ui-row-hover-background) hover:text-foreground disabled:pointer-events-none disabled:opacity-40"
+      disabled={disabled}
+      onClick={onClick}
+      type="button"
+    >
+      <Codicon name="folder" size="0.875rem" />
+      <span className="min-w-0 truncate">{name}</span>
+    </button>
+  )
+}