@neuralis/brain-core 0.3.1 → 0.4.0

package/app/filesystem/ui/FolderPicker.tsx

@@ -0,0 +1,251 @@
+'use client';
+
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { CheckCircle2, ChevronUp, Folder, FolderOpen, Loader2, Send } from 'lucide-react';
+import type { PackageApi } from '@neuralis/package-system/client';
+import { browseDirectories, type BrowseFoldersResult } from '../api';
+import { useFilesystemHost } from '../FilesystemHost';
+
+/** A folder the picker offers without a request — the discoverable mount roots on this server. */
+export type FolderSuggestion = { name: string; path: string };
+
+type Props = {
+  agentId: string;
+  projectId: string | null;
+  client: PackageApi;
+  /** The paired device the folder lives on (`dev_…`), or `null` for this server. */
+  device: string | null;
+  /** This server runs in a container: the browsable zone is `/mounts` (an empty path opens it). */
+  isDocker: boolean;
+  /** The folder the picker opens at (the typed path); empty = the plane's start. */
+  startPath: string;
+  /** This server only: discoverable folders shown first, picked with no listing. */
+  suggestions: readonly FolderSuggestion[];
+  /** The access the form asks for — an "ask on that device" requests the write list when set. */
+  wantWrite: boolean;
+  onSelect(path: string): void;
+  onClose(): void;
+};
+
+/** The parent of a server or device path, in that path's own separators (`C:\x` → `C:\`). */
+function parentOf(path: string): string {
+  const up = path.replace(/[/\\][^/\\]+[/\\]?$/, '');
+  if (/^[A-Za-z]:$/.test(up)) return `${up}\\`;
+  return up || '/';
+}
+
+/** What a device's fixed state code tells a person — never a path. */
+function deviceStateLine(state: string): string {
+  switch (state) {
+    case 'ceiling_denied': return 'This folder is not allowed on that device yet.';
+    case 'device_offline': return 'The device is offline. Type the folder — it attaches now and serves when the device is back.';
+    case 'broker_outdated': return 'That device runs an older Neuralis CLI. Update it there (neuralis device install) to browse; a typed folder still attaches.';
+    case 'devices_disabled': return 'Paired devices are switched off on this server.';
+    case 'not_found': return 'That folder does not exist on the device.';
+    case 'not_a_directory': return 'That path is not a folder.';
+    case 'os_denied': return 'The device cannot read that folder.';
+    default: return 'The device did not answer. Type the folder, or try again.';
+  }
+}
+
+/** The line a device folder outside its allowed ones reads — the picker's state and the Create guard say it the same way. */
+export const DEVICE_FOLDER_NOT_ALLOWED = deviceStateLine('ceiling_denied');
+
+/**
+ * Ask on the caller's OWN device for a folder it does not allow yet: the ask
+ * button, the answer, the pending count and the grant command to run there.
+ * ONE owner for the picker's `ceiling_denied` state and the Create guard. Key
+ * it by `path` so a new folder starts a new ask. Cost: one ask + one count per
+ * click, nothing on render.
+ */
+export function DeviceFolderAsk({ device, projectId, agentId, path, wantWrite }: {
+  device: string; projectId: string | null; agentId: string; path: string; wantWrite: boolean;
+}) {
+  const host = useFilesystemHost();
+  const [ask, setAsk] = useState<{ busy: boolean; line: string | null; pending: number | null }>({ busy: false, line: null, pending: null });
+  const askOnDevice = async () => {
+    if (!projectId || !host.requestDeviceFolder) return;
+    setAsk((a) => ({ ...a, busy: true }));
+    try {
+      const answer = await host.requestDeviceFolder({ deviceId: device, path, list: wantWrite ? 'write' : 'read', projectId, agentId });
+      const pending = host.countDeviceFolderRequests ? await host.countDeviceFolderRequests({ deviceId: device, projectId, agentId }) : null;
+      setAsk({
+        busy: false,
+        pending,
+        line: answer.recorded
+          ? 'Asked. On that device: tray → Allow a folder…, or run the command below.'
+          : answer.reason === 'inside_ceiling'
+            ? 'That folder is already allowed — open it again.'
+            : 'The device did not record the ask. Run the command below on it.',
+      });
+    } catch (err) {
+      setAsk({ busy: false, pending: null, line: err instanceof Error && err.message ? err.message : 'The ask could not be sent.' });
+    }
+  };
+  return (
+    <>
+      {host.requestDeviceFolder && projectId && (
+        <button type="button" disabled={ask.busy} onClick={() => void askOnDevice()}
+          className="inline-flex items-center gap-1 px-2 py-0.5 rounded text-[8px] font-semibold text-cyan-300/80 bg-cyan-500/10 hover:bg-cyan-500/20 border border-cyan-400/20 transition disabled:opacity-40">
+          {ask.busy ? <Loader2 className="h-2.5 w-2.5 animate-spin" /> : <Send className="h-2.5 w-2.5" />}
+          Ask on that device
+        </button>
+      )}
+      {ask.line && <div className="text-[9px] text-white/55">{ask.line}</div>}
+      {ask.pending !== null && <div className="text-[9px] text-white/40">{ask.pending} pending on that device for this project</div>}
+      <code className="block text-[9px] text-white/45 font-mono break-all">neuralis device grant {path}{wantWrite ? ' --write' : ''}</code>
+    </>
+  );
+}
+
+/**
+ * The Add-Source folder picker: one level at a time, folders only, "Select
+ * this folder". On this server it reads `sources/browse` (the gates are the
+ * route's: you browse what you could attach; in Docker the `/mounts` zone and
+ * below) and shows the discoverable suggestions first. On the caller's OWN
+ * device it starts at the typed folder, or else from the folders that device
+ * allows this host, lists through the device's broker, and for a folder
+ * outside them offers to ASK on that device — the grant stays the owner's act on the machine (the tray's
+ * "Allow a folder…", `neuralis device grant`). UX only: the create re-checks
+ * every gate. Cost: one request per opened level, one ask per click; nothing
+ * on open of the form, no timer, no listener.
+ */
+export function FolderPicker({ agentId, projectId, client, device, isDocker, startPath, suggestions, wantWrite, onSelect, onClose }: Props) {
+  const [listing, setListing] = useState<BrowseFoldersResult | null>(null);
+  const [path, setPath] = useState('');
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  // The device's allowed folders: "up" from one of them returns to that list.
+  const rootsRef = useRef<Set<string>>(new Set());
+  // Liveness: a reply that lands after the picker closed (or a newer open) is dropped.
+  const seqRef = useRef(0);
+  // Where the picker first opens — read once per open, never a reason to re-list as the field changes.
+  const startRef = useRef(startPath);
+  startRef.current = startPath;
+
+  const open = useCallback(async (target: string) => {
+    const seq = ++seqRef.current;
+    // Natively an empty path is the suggestions alone: there is no "start" folder to list.
+    if (!device && !isDocker && target === '') {
+      setListing(null);
+      setPath('');
+      setError(null);
+      setLoading(false);
+      return;
+    }
+    setLoading(true);
+    setError(null);
+    try {
+      const result = await browseDirectories({ path: target, agentId, ...(projectId ? { projectId } : {}), ...(device ? { device } : {}) }, client);
+      if (seq !== seqRef.current) return;
+      if (result.roots) rootsRef.current = new Set(result.entries.map((e) => e.path));
+      setListing(result);
+      setPath(target);
+    } catch (err) {
+      if (seq !== seqRef.current) return;
+      // One stable sentence per plane — the server never returns a path or an errno.
+      setError(device && err instanceof Error && err.message ? err.message : 'That path is not available.');
+      setListing(null);
+      setPath(target);
+    } finally {
+      if (seq === seqRef.current) setLoading(false);
+    }
+  }, [agentId, projectId, client, device, isDocker]);
+
+  const hasSuggestions = suggestions.length > 0;
+  useEffect(() => {
+    // A typed folder opens where it is — on a device too, where a folder outside
+    // the allowed ones answers `ceiling_denied` (existence-independent) and offers the ask.
+    void open(startRef.current || (device || hasSuggestions || isDocker ? '' : '/'));
+    return () => { seqRef.current += 1; };
+  }, [open, device, isDocker, hasSuggestions]);
+
+  const state = listing?.state ?? 'ok';
+  const inRoots = Boolean(device && listing?.roots);
+  // On this server the suggestions are the start (in Docker above the zone's own listing).
+  const listed = new Set(listing?.entries.map((e) => e.path) ?? []);
+  const shownSuggestions = !device && path === '' ? suggestions.filter((s) => !listed.has(s.path)) : [];
+  const canSelectHere = Boolean(path) && !inRoots && state === 'ok' && !error;
+  const canGoUp = Boolean(path) && !loading && (device ? true : listing ? listing.atRoot !== true : path !== '/');
+
+  const goUp = () => {
+    if (device && (rootsRef.current.has(path) || listing?.atRoot || parentOf(path) === path)) { void open(''); return; }
+    void open(parentOf(path));
+  };
+
+  return (
+    <div className="rounded-md bg-white/[0.03] border border-white/[0.1] overflow-hidden">
+      <div className="flex items-center gap-1.5 px-2 py-1.5 bg-white/[0.02] border-b border-white/[0.06]">
+        <FolderOpen className="h-3 w-3 text-cyan-400 shrink-0" />
+        <span className="text-[9px] font-mono text-white/60 truncate flex-1">
+          {inRoots ? 'Folders this device allows' : path || 'Suggested'}
+        </span>
+        <button type="button" onClick={onClose} className="text-[9px] text-white/40 hover:text-white/70 px-1">Close</button>
+      </div>
+      {error && <div className="px-2 py-1 text-[9px] text-red-300/80">{error}</div>}
+      {loading ? (
+        <div className="flex items-center justify-center py-3">
+          <Loader2 className="h-3 w-3 animate-spin text-white/30" />
+        </div>
+      ) : (
+        <div className="max-h-[180px] overflow-y-auto">
+          {shownSuggestions.map((s) => (
+            <div key={`s:${s.path}`} className="flex items-center gap-0.5 hover:bg-white/[0.04] transition">
+              <button type="button" onClick={() => void open(s.path)} className="flex items-center gap-1.5 px-2 py-1 flex-1 text-left min-w-0">
+                <Folder className="h-3 w-3 text-emerald-300/70 shrink-0" />
+                <span className="text-[10px] text-white/75 truncate">{s.name}</span>
+                <span className="text-[8px] text-white/30 font-mono truncate">{s.path}</span>
+              </button>
+              <button type="button" onClick={() => onSelect(s.path)} className="px-2 py-1 text-[8px] font-medium text-cyan-300/70 hover:text-cyan-200 shrink-0">Select</button>
+            </div>
+          ))}
+          {canGoUp && (
+            <button type="button" onClick={goUp} className="w-full flex items-center gap-1.5 px-2 py-1 text-left hover:bg-white/[0.04] transition">
+              <ChevronUp className="h-3 w-3 text-white/30" />
+              <span className="text-[10px] text-white/50">..</span>
+            </button>
+          )}
+          {device && state !== 'ok' && (
+            <div className="px-2 py-1.5 space-y-1">
+              <div className="text-[9px] text-amber-300/80">{deviceStateLine(state)}</div>
+              {state === 'ceiling_denied' && path && (
+                <DeviceFolderAsk key={path} device={device} projectId={projectId} agentId={agentId} path={path} wantWrite={wantWrite} />
+              )}
+            </div>
+          )}
+          {state === 'ok' && !error && listing && listing.entries.length === 0 && (
+            <div className="px-2 py-2 text-[9px] text-white/30 italic">
+              {inRoots ? 'This device allows no folder to this server yet — type one and ask, or run neuralis device grant <dir> there.' : 'No subfolders'}
+            </div>
+          )}
+          {state === 'ok' && listing?.entries.map((entry) => (
+            <div key={entry.path} className="flex items-center gap-0.5 hover:bg-white/[0.04] transition">
+              <button type="button" onClick={() => void open(entry.path)} className="flex items-center gap-1.5 px-2 py-1 flex-1 text-left min-w-0">
+                <Folder className="h-3 w-3 text-cyan-400/70 shrink-0" />
+                <span className="text-[10px] text-white/75 truncate">{entry.name}</span>
+                {entry.access && <span className="text-[8px] text-white/30 shrink-0">{entry.access === 'write' ? 'read · write' : 'read'}</span>}
+              </button>
+              <button type="button" onClick={() => onSelect(entry.path)} className="px-2 py-1 text-[8px] font-medium text-cyan-300/70 hover:text-cyan-200 shrink-0">Select</button>
+            </div>
+          ))}
+          {state === 'ok' && (listing?.symlinks ?? 0) > 0 && (
+            <div className="px-2 py-1 text-[8px] text-white/30 italic">
+              {listing!.symlinks} linked {listing!.symlinks === 1 ? 'folder is' : 'folders are'} not shown — links are not followed; type the path to attach one.
+            </div>
+          )}
+          {state === 'ok' && listing?.truncated && (
+            <div className="px-2 py-1 text-[8px] text-white/30 italic">Only the first entries are listed — type the path for one further down.</div>
+          )}
+          {canSelectHere && (
+            <button type="button" onClick={() => onSelect(path)}
+              className="w-full flex items-center gap-1.5 px-2 py-1.5 text-left bg-cyan-500/5 hover:bg-cyan-500/10 border-t border-white/[0.06] transition">
+              <CheckCircle2 className="h-3 w-3 text-cyan-400 shrink-0" />
+              <span className="text-[10px] font-medium text-cyan-300/80">Select this folder</span>
+              <span className="text-[9px] text-white/30 font-mono truncate ml-auto">{path}</span>
+            </button>
+          )}
+        </div>
+      )}
+    </div>
+  );
+}

package/app/filesystem/ui/GitControlPanel.tsx

@@ -84,7 +84,7 @@ import {
  * Stage / Unstage / Discard, a commit box (message + optional amend), and a
  * branch-switcher quick-pick (checkout / create / delete). Each write is the
  * HUMAN face of the git engine — the click IS the consent (server gates
- * `drive.write` + uri-policy `write` + audits); a DESTRUCTIVE op (discard,
+ * `files.write` + uri-policy `write` + audits); a DESTRUCTIVE op (discard,
  * branch delete) is behind a CONFIRM dialog AND the server unconditionally
  * auto-snapshots (Q6) — the returned rescue ref powers a best-effort recovery
  * notice. On success the N3 badge SSE refreshes the panel; we ALSO
@@ -592,7 +592,7 @@ export function GitControlPanel({ agentId }: { agentId: string }) {
   );
   // Show the write affordances (Stage/Unstage/Discard/Commit/branch-write) IFF the
   // caller can actually write — `git.canWrite` is computed SERVER-side per-caller as
-  // the SAME two-plane gate the write routes enforce (the `drive.write` FEATURE ∧ the
+  // the SAME two-plane gate the write routes enforce (the `files.write` FEATURE ∧ the
   // caller's RESOLVED uri-policy `write` on the source root). This is authoritative:
   // it must NOT read `SourceInfo.permissions.write` (the source's DEFAULT block), which
   // hid the owner's write UI on a `default write:false` source where the owner gains
@@ -682,6 +682,11 @@ export function GitControlPanel({ agentId }: { agentId: string }) {
   // shape symmetric with `source`).
   useEffect(() => {
     if (!selectedSlug) return;
+    // A folder that only CONTAINS checkouts has no change-set at its root: the
+    // effect above picks its first repo, and that pick loads the status. Asking
+    // the root would answer "unavailable" for a moment on every switch.
+    const git = selectedSource?.git;
+    if (!activeRepoRel && git && !git.isRepo && git.containsRepos) return;
     void loadGitStatus({ agentId, projectId: projectId ?? null, source: selectedSlug, repo: activeRepoRel });
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [agentId, projectId, selectedSlug, activeRepoRel, repoKey]);