@geminilight/mindos 0.5.57 → 0.5.59

package/app/components/FileTree.tsx

@@ -4,16 +4,21 @@ import { useState, useCallback, useRef, useTransition, useEffect } from 'react';
 import { useRouter, usePathname } from 'next/navigation';
 import { FileNode } from '@/lib/types';
 import { encodePath } from '@/lib/utils';
-import { ChevronDown, FileText, Table, Folder, FolderOpen, Plus, Loader2, Trash2, Pencil } from 'lucide-react';
-import { createFileAction, deleteFileAction, renameFileAction } from '@/lib/actions';
+import {
+  ChevronDown, FileText, Table, Folder, FolderOpen, Plus, Loader2,
+  Trash2, Pencil, Layers, ScrollText,
+} from 'lucide-react';
+import { createFileAction, deleteFileAction, renameFileAction, renameSpaceAction, deleteSpaceAction, convertToSpaceAction, deleteFolderAction } from '@/lib/actions';
 import { useLocale } from '@/lib/LocaleContext';
 
+const SYSTEM_FILES = new Set(['INSTRUCTION.md', 'README.md']);
+
 interface FileTreeProps {
   nodes: FileNode[];
   depth?: number;
   onNavigate?: () => void;
-  /** When set, directories with depth <= this value open, others close. null = no override (manual control). */
   maxOpenDepth?: number | null;
+  parentIsSpace?: boolean;
 }
 
 function getIcon(node: FileNode) {
@@ -29,12 +34,143 @@ function getCurrentFilePath(pathname: string): string {
   return encoded.split('/').map(decodeURIComponent).join('/');
 }
 
+function countContentFiles(node: FileNode): number {
+  if (node.type === 'file') return SYSTEM_FILES.has(node.name) ? 0 : 1;
+  return (node.children ?? []).reduce((sum, c) => sum + countContentFiles(c), 0);
+}
+
+function filterVisibleNodes(nodes: FileNode[], parentIsSpace: boolean): FileNode[] {
+  return nodes.filter(node => {
+    if (node.type !== 'file') return true;
+    if (parentIsSpace && SYSTEM_FILES.has(node.name)) return false;
+    if (!parentIsSpace && node.name === 'README.md') return false;
+    return true;
+  });
+}
+
+// ─── Context Menu Shell ───────────────────────────────────────────────────────
+
+function ContextMenuShell({ x, y, onClose, menuHeight, children }: {
+  x: number;
+  y: number;
+  onClose: () => void;
+  menuHeight?: number;
+  children: React.ReactNode;
+}) {
+  const menuRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    const handler = (e: MouseEvent) => {
+      if (menuRef.current && !menuRef.current.contains(e.target as Node)) onClose();
+    };
+    const keyHandler = (e: KeyboardEvent) => { if (e.key === 'Escape') onClose(); };
+    document.addEventListener('mousedown', handler);
+    document.addEventListener('keydown', keyHandler);
+    return () => {
+      document.removeEventListener('mousedown', handler);
+      document.removeEventListener('keydown', keyHandler);
+    };
+  }, [onClose]);
+
+  const adjustedY = Math.min(y, window.innerHeight - (menuHeight ?? 160));
+  const adjustedX = Math.min(x, window.innerWidth - 200);
+
+  return (
+    <div
+      ref={menuRef}
+      className="fixed z-50 min-w-[180px] bg-card border border-border rounded-lg shadow-lg py-1"
+      style={{ top: adjustedY, left: adjustedX }}
+    >
+      {children}
+    </div>
+  );
+}
+
+const MENU_ITEM = "w-full flex items-center gap-2 px-3 py-2 text-sm text-foreground hover:bg-muted transition-colors text-left";
+const MENU_DANGER = "w-full flex items-center gap-2 px-3 py-2 text-sm text-error hover:bg-error/10 transition-colors text-left";
+const MENU_DIVIDER = "my-1 border-t border-border/50";
+
+// ─── SpaceContextMenu ─────────────────────────────────────────────────────────
+
+function SpaceContextMenu({ x, y, node, onClose, onRename }: {
+  x: number; y: number; node: FileNode; onClose: () => void; onRename: () => void;
+}) {
+  const router = useRouter();
+  const { t } = useLocale();
+  const [isPending, startTransition] = useTransition();
+
+  return (
+    <ContextMenuShell x={x} y={y} onClose={onClose}>
+      <button className={MENU_ITEM} onClick={() => { router.push(`/view/${encodePath(`${node.path}/INSTRUCTION.md`)}`); onClose(); }}>
+        <ScrollText size={14} className="shrink-0" /> {t.fileTree.editRules}
+      </button>
+      <button className={MENU_ITEM} onClick={() => { onRename(); onClose(); }}>
+        <Pencil size={14} className="shrink-0" /> {t.fileTree.renameSpace}
+      </button>
+      <div className={MENU_DIVIDER} />
+      <button className={MENU_DANGER} disabled={isPending} onClick={() => {
+        if (!confirm(t.fileTree.confirmDeleteSpace(node.name))) return;
+        startTransition(async () => {
+          const result = await deleteSpaceAction(node.path);
+          if (result.success) { router.push('/'); router.refresh(); }
+          onClose();
+        });
+      }}>
+        <Trash2 size={14} className="shrink-0" />
+        {isPending ? <Loader2 size={14} className="animate-spin" /> : t.fileTree.deleteSpace}
+      </button>
+    </ContextMenuShell>
+  );
+}
+
+// ─── FolderContextMenu ────────────────────────────────────────────────────────
+
+function FolderContextMenu({ x, y, node, onClose, onRename }: {
+  x: number; y: number; node: FileNode; onClose: () => void; onRename: () => void;
+}) {
+  const router = useRouter();
+  const { t } = useLocale();
+  const [isPending, startTransition] = useTransition();
+
+  return (
+    <ContextMenuShell x={x} y={y} onClose={onClose} menuHeight={140}>
+      <button className={MENU_ITEM} disabled={isPending} onClick={() => {
+        startTransition(async () => {
+          const result = await convertToSpaceAction(node.path);
+          if (result.success) router.refresh();
+          onClose();
+        });
+      }}>
+        <Layers size={14} className="shrink-0" style={{ color: 'var(--amber)' }} /> {t.fileTree.convertToSpace}
+      </button>
+      <button className={MENU_ITEM} onClick={() => { onRename(); onClose(); }}>
+        <Pencil size={14} className="shrink-0" /> {t.fileTree.rename}
+      </button>
+      <div className={MENU_DIVIDER} />
+      <button className={MENU_DANGER} disabled={isPending} onClick={() => {
+        if (!confirm(t.fileTree.confirmDeleteFolder(node.name))) return;
+        startTransition(async () => {
+          const result = await deleteFolderAction(node.path);
+          if (result.success) { router.push('/'); router.refresh(); }
+          onClose();
+        });
+      }}>
+        <Trash2 size={14} className="shrink-0" />
+        {isPending ? <Loader2 size={14} className="animate-spin" /> : t.fileTree.deleteFolder}
+      </button>
+    </ContextMenuShell>
+  );
+}
+
+// ─── NewFileInline ────────────────────────────────────────────────────────────
+
 function NewFileInline({ dirPath, depth, onDone }: { dirPath: string; depth: number; onDone: () => void }) {
   const [value, setValue] = useState('');
   const [isPending, startTransition] = useTransition();
   const [error, setError] = useState('');
   const router = useRouter();
   const { t } = useLocale();
+  const containerRef = useRef<HTMLDivElement>(null);
 
   const handleSubmit = useCallback(() => {
     const name = value.trim();
@@ -51,8 +187,18 @@ function NewFileInline({ dirPath, depth, onDone }: { dirPath: string; depth: num
     });
   }, [value, dirPath, onDone, router, t]);
 
+  useEffect(() => {
+    const handler = (e: MouseEvent) => {
+      if (containerRef.current && !containerRef.current.contains(e.target as Node)) {
+        onDone();
+      }
+    };
+    const timer = setTimeout(() => document.addEventListener('mousedown', handler), 0);
+    return () => { clearTimeout(timer); document.removeEventListener('mousedown', handler); };
+  }, [onDone]);
+
   return (
-    <div className="px-2 pb-1" style={{ paddingLeft: `${depth * 12 + 20}px` }}>
+    <div ref={containerRef} className="px-2 pb-1" style={{ paddingLeft: `${depth * 12 + 20}px` }}>
       <div className="flex items-center gap-1">
         <input
           autoFocus
@@ -87,12 +233,15 @@ function NewFileInline({ dirPath, depth, onDone }: { dirPath: string; depth: num
   );
 }
 
+// ─── DirectoryNode ────────────────────────────────────────────────────────────
+
 function DirectoryNode({ node, depth, currentPath, onNavigate, maxOpenDepth }: {
   node: FileNode; depth: number; currentPath: string; onNavigate?: () => void;
   maxOpenDepth?: number | null;
 }) {
   const router = useRouter();
   const isActive = currentPath.startsWith(node.path + '/') || currentPath === node.path;
+  const isSpace = !!node.isSpace;
   const [open, setOpen] = useState(depth === 0 ? true : isActive);
   const [showNewFile, setShowNewFile] = useState(false);
   const [renaming, setRenaming] = useState(false);
@@ -100,18 +249,17 @@ function DirectoryNode({ node, depth, currentPath, onNavigate, maxOpenDepth }: {
   const [isPending, startTransition] = useTransition();
   const renameRef = useRef<HTMLInputElement>(null);
   const clickTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
+  const [contextMenu, setContextMenu] = useState<{ x: number; y: number } | null>(null);
   const { t } = useLocale();
 
   const toggle = useCallback(() => setOpen(v => !v), []);
 
-  // React to maxOpenDepth changes from parent
   const prevMaxOpenDepth = useRef<number | null | undefined>(undefined);
   useEffect(() => {
     if (maxOpenDepth === null || maxOpenDepth === undefined) {
       prevMaxOpenDepth.current = maxOpenDepth;
       return;
     }
-    // Only react when value actually changes
     if (prevMaxOpenDepth.current !== maxOpenDepth) {
       setOpen(depth <= maxOpenDepth);
       prevMaxOpenDepth.current = maxOpenDepth;
@@ -140,7 +288,8 @@ function DirectoryNode({ node, depth, currentPath, onNavigate, maxOpenDepth }: {
     const newName = renameValue.trim();
     if (!newName || newName === node.name) { setRenaming(false); return; }
     startTransition(async () => {
-      const result = await renameFileAction(node.path, newName);
+      const action = isSpace ? renameSpaceAction : renameFileAction;
+      const result = await action(node.path, newName);
       if (result.success && result.newPath) {
         setRenaming(false);
         router.push(`/view/${encodePath(result.newPath)}`);
@@ -149,7 +298,7 @@ function DirectoryNode({ node, depth, currentPath, onNavigate, maxOpenDepth }: {
         setRenaming(false);
       }
     });
-  }, [renameValue, node.name, node.path, router]);
+  }, [renameValue, node.name, node.path, router, isSpace]);
 
   const handleSingleClick = useCallback(() => {
     if (renaming) return;
@@ -162,8 +311,17 @@ function DirectoryNode({ node, depth, currentPath, onNavigate, maxOpenDepth }: {
   }, [renaming, router, node.path, onNavigate]);
 
   const handleDoubleClick = useCallback((e: React.MouseEvent) => {
+    if (isSpace) return;
     startRename(e);
-  }, [startRename]);
+  }, [startRename, isSpace]);
+
+  const handleContextMenu = useCallback((e: React.MouseEvent) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setContextMenu({ x: e.clientX, y: e.clientY });
+  }, []);
+
+  const contentCount = isSpace ? countContentFiles(node) : 0;
 
   if (renaming) {
     return (
@@ -185,9 +343,14 @@ function DirectoryNode({ node, depth, currentPath, onNavigate, maxOpenDepth }: {
     );
   }
 
+  const showBorder = isSpace && depth === 0;
+
   return (
     <div>
-      <div className="relative group/dir flex items-center">
+      <div
+        className="relative group/dir flex items-center"
+        onContextMenu={handleContextMenu}
+      >
         <button
           onClick={toggle}
           className="shrink-0 p-1 rounded hover:bg-muted text-zinc-500 transition-colors"
@@ -209,11 +372,16 @@ function DirectoryNode({ node, depth, currentPath, onNavigate, maxOpenDepth }: {
             ${isActive ? 'text-foreground' : 'text-muted-foreground hover:text-foreground'}
           `}
         >
-          {open
-            ? <FolderOpen size={14} className="text-yellow-400 shrink-0" />
-            : <Folder size={14} className="text-yellow-400 shrink-0" />
+          {isSpace
+            ? <Layers size={14} className="shrink-0" style={{ color: 'var(--amber)' }} />
+            : open
+              ? <FolderOpen size={14} className="text-yellow-400 shrink-0" />
+              : <Folder size={14} className="text-yellow-400 shrink-0" />
           }
           <span className="truncate leading-5" suppressHydrationWarning>{node.name}</span>
+          {isSpace && !open && (
+            <span className="ml-auto text-xs text-muted-foreground shrink-0 tabular-nums pr-1">{contentCount}</span>
+          )}
         </button>
         <div className="absolute right-1 top-1/2 -translate-y-1/2 hidden group-hover/dir:flex items-center gap-0.5 z-10">
           <button
@@ -229,36 +397,81 @@ function DirectoryNode({ node, depth, currentPath, onNavigate, maxOpenDepth }: {
           >
             <Plus size={13} />
           </button>
-          <button
-            type="button"
-            onClick={startRename}
-            className="p-0.5 rounded text-muted-foreground hover:text-foreground hover:bg-muted transition-colors"
-            title={t.fileTree.rename}
-          >
-            <Pencil size={12} />
-          </button>
+          {isSpace ? (
+            <button
+              type="button"
+              onClick={(e) => {
+                e.preventDefault();
+                e.stopPropagation();
+                router.push(`/view/${encodePath(`${node.path}/INSTRUCTION.md`)}`);
+                onNavigate?.();
+              }}
+              className="p-0.5 rounded text-muted-foreground hover:text-foreground hover:bg-muted transition-colors"
+              title={t.fileTree.editRules}
+            >
+              <ScrollText size={12} />
+            </button>
+          ) : (
+            <button
+              type="button"
+              onClick={startRename}
+              className="p-0.5 rounded text-muted-foreground hover:text-foreground hover:bg-muted transition-colors"
+              title={t.fileTree.rename}
+            >
+              <Pencil size={12} />
+            </button>
+          )}
         </div>
       </div>
 
       <div
-        className="overflow-hidden transition-all duration-200"
-        style={{ maxHeight: open ? '9999px' : '0px' }}
+        className={`overflow-hidden transition-all duration-200 ${showBorder ? 'border-l-2 ml-[18px]' : ''}`}
+        style={{
+          maxHeight: open ? '9999px' : '0px',
+          ...(showBorder ? { borderColor: 'color-mix(in srgb, var(--amber) 30%, transparent)' } : {}),
+        }}
       >
         {node.children && (
-          <FileTree nodes={node.children} depth={depth + 1} onNavigate={onNavigate} maxOpenDepth={maxOpenDepth} />
+          <FileTree
+            nodes={node.children}
+            depth={showBorder ? 1 : depth + 1}
+            onNavigate={onNavigate}
+            maxOpenDepth={maxOpenDepth}
+            parentIsSpace={isSpace}
+          />
         )}
         {showNewFile && (
           <NewFileInline
             dirPath={node.path}
-            depth={depth}
+            depth={showBorder ? 0 : depth}
             onDone={() => setShowNewFile(false)}
           />
         )}
       </div>
+
+      {contextMenu && (isSpace ? (
+        <SpaceContextMenu
+          x={contextMenu.x}
+          y={contextMenu.y}
+          node={node}
+          onClose={() => setContextMenu(null)}
+          onRename={() => startRename()}
+        />
+      ) : (
+        <FolderContextMenu
+          x={contextMenu.x}
+          y={contextMenu.y}
+          node={node}
+          onClose={() => setContextMenu(null)}
+          onRename={() => startRename()}
+        />
+      ))}
     </div>
   );
 }
 
+// ─── FileNodeItem ─────────────────────────────────────────────────────────────
+
 function FileNodeItem({ node, depth, currentPath, onNavigate }: {
   node: FileNode; depth: number; currentPath: string; onNavigate?: () => void;
 }) {
@@ -359,10 +572,15 @@ function FileNodeItem({ node, depth, currentPath, onNavigate }: {
   );
 }
 
-export default function FileTree({ nodes, depth = 0, onNavigate, maxOpenDepth }: FileTreeProps) {
+// ─── FileTree (root) ──────────────────────────────────────────────────────────
+
+export default function FileTree({ nodes, depth = 0, onNavigate, maxOpenDepth, parentIsSpace }: FileTreeProps) {
   const pathname = usePathname();
   const currentPath = getCurrentFilePath(pathname);
 
+  const isInsideDir = depth > 0;
+  const visibleNodes = isInsideDir ? filterVisibleNodes(nodes, !!parentIsSpace) : nodes;
+
   useEffect(() => {
     if (!currentPath || depth !== 0) return;
     const timer = setTimeout(() => {
@@ -374,7 +592,7 @@ export default function FileTree({ nodes, depth = 0, onNavigate, maxOpenDepth }:
 
   return (
     <div className="flex flex-col gap-0.5">
-      {nodes.map((node) =>
+      {visibleNodes.map((node) =>
         node.type === 'directory' ? (
           <DirectoryNode key={node.path} node={node} depth={depth} currentPath={currentPath} onNavigate={onNavigate} maxOpenDepth={maxOpenDepth} />
         ) : (

package/app/components/Sidebar.tsx

@@ -90,6 +90,7 @@ export default function Sidebar({ fileTree, collapsed = false, onCollapse, onExp
 
   const sidebarContent = (
     <div className="flex flex-col h-full">
+      <div className="shrink-0 electron-mac-titlebar-pad" />
       <div className="flex items-center justify-between px-4 py-4 border-b border-border shrink-0">
         <Link href="/" className="flex items-center gap-2 hover:opacity-80 transition-opacity">
           <Logo id="desktop" />

package/app/components/SidebarLayout.tsx

@@ -376,7 +376,7 @@ export default function SidebarLayout({ fileTree, children }: SidebarLayoutProps
           #main-content {
             padding-left: ${lp.panelOpen && lp.panelMaximized ? '100vw' : `${lp.panelOpen ? lp.railWidth + lp.effectivePanelWidth : lp.railWidth}px`} !important;
             padding-right: calc(var(--right-panel-width) + var(--right-agent-detail-width)) !important;
-            padding-top: 0 !important;
+            padding-top: 0;
           }
         }
       `}</style>

package/app/components/ask/AskContent.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { useEffect, useRef, useState, useCallback } from 'react';
+import { useEffect, useLayoutEffect, useRef, useState, useCallback } from 'react';
 import { Sparkles, Send, AtSign, Paperclip, StopCircle, RotateCcw, History, X, Maximize2, Minimize2, PanelRight, AppWindow } from 'lucide-react';
 import { useLocale } from '@/lib/LocaleContext';
 import type { Message } from '@/lib/types';
@@ -21,6 +21,27 @@ const PANEL_COMPOSER_MIN = 84;
 const PANEL_COMPOSER_MAX_ABS = 440;
 const PANEL_COMPOSER_MAX_VIEW = 0.48;
 const PANEL_COMPOSER_KEY_STEP = 24;
+/** 输入框随内容增高，超过此行数后在框内滚动（与常见 IM 一致） */
+const PANEL_TEXTAREA_MAX_VISIBLE_LINES = 8;
+
+function syncPanelTextareaToContent(el: HTMLTextAreaElement, maxVisibleLines: number, availableHeight?: number): void {
+  const style = getComputedStyle(el);
+  const parsedLh = parseFloat(style.lineHeight);
+  const parsedFs = parseFloat(style.fontSize);
+  const fontSize = Number.isFinite(parsedFs) ? parsedFs : 14;
+  const lineHeight = Number.isFinite(parsedLh) ? parsedLh : fontSize * 1.375;
+  const pad =
+    (Number.isFinite(parseFloat(style.paddingTop)) ? parseFloat(style.paddingTop) : 0) +
+    (Number.isFinite(parseFloat(style.paddingBottom)) ? parseFloat(style.paddingBottom) : 0);
+  let maxH = lineHeight * maxVisibleLines + pad;
+  if (availableHeight && Number.isFinite(availableHeight) && availableHeight > 0) {
+    maxH = Math.min(maxH, availableHeight);
+  }
+  if (!Number.isFinite(maxH) || maxH <= 0) return;
+  el.style.height = '0px';
+  const next = Math.min(el.scrollHeight, maxH);
+  el.style.height = `${Number.isFinite(next) ? next : maxH}px`;
+}
 
 function panelComposerMaxForViewport(): number {
   if (typeof window === 'undefined') return PANEL_COMPOSER_MAX_ABS;
@@ -67,10 +88,18 @@ export default function AskContent({ visible, currentFile, initialMessage, onFir
   const firstMessageFired = useRef(false);
   const { t } = useLocale();
 
-  const [panelComposerHeight, setPanelComposerHeight] = useState(readStoredPanelComposerHeight);
+  const [panelComposerHeight, setPanelComposerHeight] = useState(PANEL_COMPOSER_DEFAULT);
   const panelComposerHRef = useRef(panelComposerHeight);
   panelComposerHRef.current = panelComposerHeight;
 
+  useEffect(() => {
+    const stored = readStoredPanelComposerHeight();
+    if (stored !== PANEL_COMPOSER_DEFAULT) {
+      setPanelComposerHeight(stored);
+      panelComposerHRef.current = stored;
+    }
+  }, []);
+
   const getPanelComposerHeight = useCallback(() => panelComposerHRef.current, []);
   const persistPanelComposerHeight = useCallback((h: number) => {
     try {
@@ -89,7 +118,11 @@ export default function AskContent({ visible, currentFile, initialMessage, onFir
     persist: persistPanelComposerHeight,
   });
 
-  const [panelComposerViewportMax, setPanelComposerViewportMax] = useState(panelComposerMaxForViewport);
+  const [panelComposerViewportMax, setPanelComposerViewportMax] = useState(PANEL_COMPOSER_MAX_ABS);
+
+  useEffect(() => {
+    setPanelComposerViewportMax(panelComposerMaxForViewport());
+  }, []);
 
   const applyPanelComposerClampAndPersist = useCallback(() => {
     const maxH = panelComposerMaxForViewport();
@@ -195,11 +228,28 @@ export default function AskContent({ visible, currentFile, initialMessage, onFir
     return () => window.removeEventListener('resize', applyPanelComposerClampAndPersist);
   }, [isPanel, applyPanelComposerClampAndPersist]);
 
+  const formRef = useRef<HTMLFormElement>(null);
+
+  useLayoutEffect(() => {
+    if (!isPanel || !visible) return;
+    const el = inputRef.current;
+    if (!el || !(el instanceof HTMLTextAreaElement)) return;
+    const form = formRef.current;
+    const availableH = form ? form.clientHeight - 40 : undefined;
+    syncPanelTextareaToContent(el, PANEL_TEXTAREA_MAX_VISIBLE_LINES, availableH);
+  }, [input, isPanel, isLoading, visible, panelComposerHeight]);
+
+  const mentionTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
   const handleInputChange = useCallback((val: string) => {
     setInput(val);
-    mention.updateMentionFromInput(val);
+    if (mentionTimerRef.current) clearTimeout(mentionTimerRef.current);
+    mentionTimerRef.current = setTimeout(() => mention.updateMentionFromInput(val), 80);
   }, [mention]);
 
+  useEffect(() => {
+    return () => { if (mentionTimerRef.current) clearTimeout(mentionTimerRef.current); };
+  }, []);
+
   const selectMention = useCallback((filePath: string) => {
     const atIdx = input.lastIndexOf('@');
     setInput(input.slice(0, atIdx));
@@ -498,6 +548,7 @@ export default function AskContent({ visible, currentFile, initialMessage, onFir
           )}
 
           <form
+            ref={formRef}
             onSubmit={handleSubmit}
             className={cn(
               'flex',
@@ -551,7 +602,7 @@ export default function AskContent({ visible, currentFile, initialMessage, onFir
               placeholder={t.ask.placeholder}
               disabled={isLoading}
               rows={1}
-              className="min-h-0 min-w-0 flex-1 resize-none overflow-y-auto bg-transparent py-2 text-sm leading-snug text-foreground placeholder:text-muted-foreground outline-none transition-[height] duration-75 disabled:opacity-50"
+              className="min-w-0 flex-1 resize-none overflow-y-auto bg-transparent py-2 text-sm leading-snug text-foreground placeholder:text-muted-foreground outline-none disabled:opacity-50"
             />
           ) : (
             <input
@@ -598,15 +649,6 @@ export default function AskContent({ visible, currentFile, initialMessage, onFir
             <kbd className="font-mono ml-0.5">↵</kbd> {t.ask.newlineHint}
           </span>
         ) : null}
-        {isPanel ? (
-          <span
-            className="hidden sm:inline"
-            suppressHydrationWarning
-            title={`${t.ask.panelComposerResize} · ${t.ask.panelComposerResetHint} · ${t.ask.panelComposerKeyboard}`}
-          >
-            <kbd className="font-mono">↕</kbd> {t.ask.panelComposerFooter}
-          </span>
-        ) : null}
         <span suppressHydrationWarning>
           <kbd className="font-mono">@</kbd> {t.ask.attachFile}
         </span>

package/app/instrumentation.ts

@@ -11,7 +11,8 @@ export async function register() {
         // createRequire() calls. The only way to load a runtime-computed path
         // is to hide the require call inside a Function constructor, which is
         // opaque to bundler static analysis.
-        const syncModule = resolve(process.cwd(), '..', 'bin', 'lib', 'sync.js');
+        const projRoot = process.env.MINDOS_PROJECT_ROOT || resolve(process.cwd(), '..');
+        const syncModule = resolve(projRoot, 'bin', 'lib', 'sync.js');
         // eslint-disable-next-line @typescript-eslint/no-implied-eval
         const dynamicRequire = new Function('id', 'return require(id)') as (id: string) => any;
         const { startSyncDaemon } = dynamicRequire(syncModule);

package/app/lib/actions.ts

@@ -1,6 +1,7 @@
 'use server';
 
-import { createFile, deleteFile, renameFile } from '@/lib/fs';
+import { createFile, deleteFile, deleteDirectory, convertToSpace, renameFile, renameSpace, getMindRoot, invalidateCache } from '@/lib/fs';
+import { createSpaceFilesystem } from '@/lib/core/create-space';
 import { revalidatePath } from 'next/cache';
 
 export async function createFileAction(dirPath: string, fileName: string): Promise<{ success: boolean; filePath?: string; error?: string }> {
@@ -39,6 +40,55 @@ export async function renameFileAction(oldPath: string, newName: string): Promis
   }
 }
 
+export async function convertToSpaceAction(
+  dirPath: string,
+): Promise<{ success: boolean; error?: string }> {
+  try {
+    convertToSpace(dirPath);
+    revalidatePath('/', 'layout');
+    return { success: true };
+  } catch (err) {
+    return { success: false, error: err instanceof Error ? err.message : 'Failed to convert to space' };
+  }
+}
+
+export async function deleteFolderAction(
+  dirPath: string,
+): Promise<{ success: boolean; error?: string }> {
+  try {
+    deleteDirectory(dirPath);
+    revalidatePath('/', 'layout');
+    return { success: true };
+  } catch (err) {
+    return { success: false, error: err instanceof Error ? err.message : 'Failed to delete folder' };
+  }
+}
+
+export async function renameSpaceAction(
+  spacePath: string,
+  newName: string,
+): Promise<{ success: boolean; newPath?: string; error?: string }> {
+  try {
+    const newPath = renameSpace(spacePath, newName);
+    revalidatePath('/', 'layout');
+    return { success: true, newPath };
+  } catch (err) {
+    return { success: false, error: err instanceof Error ? err.message : 'Failed to rename space' };
+  }
+}
+
+export async function deleteSpaceAction(
+  spacePath: string,
+): Promise<{ success: boolean; error?: string }> {
+  try {
+    deleteDirectory(spacePath);
+    revalidatePath('/', 'layout');
+    return { success: true };
+  } catch (err) {
+    return { success: false, error: err instanceof Error ? err.message : 'Failed to delete space' };
+  }
+}
+
 /**
  * Create a new Mind Space (top-level directory) with README.md + auto-scaffolded INSTRUCTION.md.
  * The description is written into README.md so it appears on the homepage Space card
@@ -50,34 +100,12 @@ export async function createSpaceAction(
   parentPath: string = ''
 ): Promise<{ success: boolean; path?: string; error?: string }> {
   try {
-    const trimmed = name.trim();
-    if (!trimmed) return { success: false, error: 'Space name is required' };
-    if (trimmed.includes('/') || trimmed.includes('\\')) {
-      return { success: false, error: 'Space name must not contain path separators' };
-    }
-
-    // Sanitize parentPath — reject traversal attempts
-    const cleanParent = parentPath.replace(/\/+$/, '').trim();
-    if (cleanParent.includes('..') || cleanParent.startsWith('/') || cleanParent.includes('\\')) {
-      return { success: false, error: 'Invalid parent path' };
-    }
-
-    // Build full path: parentPath + name
-    const prefix = cleanParent ? cleanParent + '/' : '';
-    const fullPath = `${prefix}${trimmed}`;
-
-    // Strip emoji for clean title in README content
-    const cleanName = trimmed.replace(/^[\p{Emoji_Presentation}\p{Extended_Pictographic}\s]+/u, '') || trimmed;
-    const desc = description.trim() || '(Describe the purpose and usage of this space.)';
-    const readmeContent = `# ${cleanName}\n\n${desc}\n\n## 📁 Structure\n\n\`\`\`bash\n${fullPath}/\n├── INSTRUCTION.md\n├── README.md\n└── (your files here)\n\`\`\`\n\n## 💡 Usage\n\n(Add usage guidelines for this space.)\n`;
-
-    // createFile triggers scaffoldIfNewSpace → auto-generates INSTRUCTION.md
-    createFile(`${fullPath}/README.md`, readmeContent);
+    const { path: fullPath } = createSpaceFilesystem(getMindRoot(), name, description, parentPath);
+    invalidateCache();
     revalidatePath('/', 'layout');
     return { success: true, path: fullPath };
   } catch (err) {
     const msg = err instanceof Error ? err.message : 'Failed to create space';
-    // Make "already exists" error more user-friendly
     if (msg.includes('already exists')) {
       return { success: false, error: 'A space with this name already exists' };
     }