@geminilight/mindos 0.6.39 → 0.6.40

package/app/components/Panel.tsx

@@ -2,14 +2,15 @@
 
 import { useMemo, useState, useRef, useEffect, useCallback } from 'react';
 import { useRouter } from 'next/navigation';
-import { ChevronsDownUp, ChevronsUpDown, Plus, Import, FileText, Layers } from 'lucide-react';
+import { ChevronsDownUp, ChevronsUpDown, Plus, Import, FileText, Layers, MoreHorizontal, Eye, EyeOff, Trash2 } from 'lucide-react';
 import type { PanelId } from './ActivityBar';
 import type { FileNode } from '@/lib/types';
-import FileTree from './FileTree';
+import FileTree, { setShowHiddenFiles, useShowHiddenFiles } from './FileTree';
 import SyncStatusBar from './SyncStatusBar';
 import PanelHeader from './panels/PanelHeader';
 import { useResizeDrag } from '@/hooks/useResizeDrag';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
+import { listTrashAction } from '@/lib/actions';
 
 const noop = () => {};
 
@@ -108,6 +109,42 @@ export default function Panel({
     };
   }, [newPopover]);
 
+  // "More" dropdown popover
+  const [morePopover, setMorePopover] = useState(false);
+  const moreBtnRef = useRef<HTMLButtonElement>(null);
+  const morePopoverRef = useRef<HTMLDivElement>(null);
+  const showHidden = useShowHiddenFiles();
+  const [trashCount, setTrashCount] = useState(0);
+
+  useEffect(() => {
+    if (!morePopover) return;
+    const handler = (e: MouseEvent) => {
+      if (
+        moreBtnRef.current && !moreBtnRef.current.contains(e.target as Node) &&
+        morePopoverRef.current && !morePopoverRef.current.contains(e.target as Node)
+      ) {
+        setMorePopover(false);
+      }
+    };
+    const keyHandler = (e: KeyboardEvent) => { if (e.key === 'Escape') setMorePopover(false); };
+    document.addEventListener('mousedown', handler);
+    document.addEventListener('keydown', keyHandler);
+    return () => {
+      document.removeEventListener('mousedown', handler);
+      document.removeEventListener('keydown', keyHandler);
+    };
+  }, [morePopover]);
+
+  // Fetch trash count on mount and when files change
+  useEffect(() => {
+    const fetchCount = () => {
+      listTrashAction().then(items => setTrashCount(items.length)).catch(() => {});
+    };
+    fetchCount();
+    window.addEventListener('mindos:files-changed', fetchCount);
+    return () => window.removeEventListener('mindos:files-changed', fetchCount);
+  }, []);
+
   // Double-click hint: show only until user has used it once.
   // Initialize false to match SSR; hydrate from localStorage in useEffect.
   const [dblHintSeen, setDblHintSeen] = useState(false);
@@ -153,7 +190,7 @@ export default function Panel({
               <button
                 ref={newBtnRef}
                 type="button"
-                onClick={() => setNewPopover(v => !v)}
+                onClick={() => { setMorePopover(false); setNewPopover(v => !v); }}
                 className="p-1 rounded hover:bg-muted text-muted-foreground hover:text-foreground transition-colors focus-visible:ring-1 focus-visible:ring-ring"
                 aria-label={t.sidebar.new}
                 title={t.sidebar.new}
@@ -222,6 +259,47 @@ export default function Panel({
             >
               <ChevronsUpDown size={13} />
             </button>
+            {/* Separator */}
+            <div className="w-px h-3.5 bg-border mx-0.5" />
+            {/* More */}
+            <div className="relative">
+              <button
+                ref={moreBtnRef}
+                type="button"
+                onClick={() => { setNewPopover(false); setMorePopover(v => !v); }}
+                className="p-1 rounded hover:bg-muted text-muted-foreground hover:text-foreground transition-colors focus-visible:ring-1 focus-visible:ring-ring"
+                aria-label={t.sidebar.more}
+                title={t.sidebar.more}
+              >
+                <MoreHorizontal size={13} />
+              </button>
+              {morePopover && (
+                <div
+                  ref={morePopoverRef}
+                  className="absolute top-full right-0 mt-1 min-w-[172px] bg-card border border-border rounded-lg shadow-lg py-1 z-50"
+                >
+                  <button
+                    className="w-full flex items-center gap-2 px-3 py-1.5 text-sm text-foreground hover:bg-muted transition-colors text-left"
+                    onClick={() => { setShowHiddenFiles(!showHidden); }}
+                  >
+                    {showHidden ? <EyeOff size={14} className="shrink-0" /> : <Eye size={14} className="shrink-0" />}
+                    <span className="flex-1">{t.sidebar.showHiddenFiles}</span>
+                    {showHidden && <span className="text-[var(--amber)] text-xs">✓</span>}
+                  </button>
+                  <div className="my-1 border-t border-border/50" />
+                  <button
+                    className="w-full flex items-center gap-2 px-3 py-1.5 text-sm text-foreground hover:bg-muted transition-colors text-left"
+                    onClick={() => { setMorePopover(false); router.push('/trash'); }}
+                  >
+                    <Trash2 size={14} className="shrink-0" />
+                    <span className="flex-1">{t.trash.title}</span>
+                    {trashCount > 0 && (
+                      <span className="text-xs text-muted-foreground tabular-nums">{trashCount}</span>
+                    )}
+                  </button>
+                </div>
+              )}
+            </div>
           </div>
         </PanelHeader>
         <div className="flex-1 overflow-y-auto min-h-0 px-2 py-2">

package/app/components/QuickSuggestion.tsx

@@ -3,7 +3,7 @@
 import { useState, useEffect } from 'react';
 import Link from 'next/link';
 import { Lightbulb, X } from 'lucide-react';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 
 const DISMISS_KEY = 'mindos:suggestion-dismissed';
 const STALE_DAYS = 30;

package/app/components/RightAgentDetailPanel.tsx

@@ -1,8 +1,8 @@
 'use client';
 
 import { useMemo, useEffect } from 'react';
-import { useMcpData } from '@/hooks/useMcpData';
-import { useLocale } from '@/lib/LocaleContext';
+import { useMcpData } from '@/lib/stores/mcp-store';
+import { useLocale } from '@/lib/stores/locale-store';
 import { useResizeDrag } from '@/hooks/useResizeDrag';
 import AgentsPanelAgentDetail from '@/components/panels/AgentsPanelAgentDetail';
 import { resolveAgentDetailStatus } from '@/components/panels/agents-panel-resolve-status';

package/app/components/RightAskPanel.tsx

@@ -1,14 +1,15 @@
 'use client';
 
+import { useCallback, useRef } from 'react';
 import { AlertCircle } from 'lucide-react';
 import AskContent from '@/components/ask/AskContent';
 import ErrorBoundary from '@/components/ErrorBoundary';
 import { useResizeDrag } from '@/hooks/useResizeDrag';
 
-const DEFAULT_WIDTH = 380;
-const MIN_WIDTH = 300;
-const MAX_WIDTH_ABS = 700;
-const MAX_WIDTH_RATIO = 0.45;
+const DEFAULT_WIDTH = 420;
+const MIN_WIDTH = 400;
+const MAX_WIDTH_ABS = 4000;
+const FOCUS_SNAP_THRESHOLD = 80;
 
 import type { AcpAgentSelection } from '@/hooks/useAskModal';
 
@@ -35,26 +36,63 @@ export default function RightAskPanel({
   width, onWidthChange, onWidthCommit, askMode, onModeSwitch,
   maximized = false, onMaximize, sidebarOffset = 0,
 }: RightAskPanelProps) {
-  const handleMouseDown = useResizeDrag({
-    width,
+  const snapFiredRef = useRef(false);
+
+  const maxAvailable = typeof window !== 'undefined'
+    ? window.innerWidth - sidebarOffset
+    : 1200;
+
+  const handleResize = useCallback((w: number) => {
+    if (snapFiredRef.current) return;
+    const clamped = Math.min(w, maxAvailable);
+    if (maximized && clamped < maxAvailable - FOCUS_SNAP_THRESHOLD && onMaximize) {
+      onMaximize();
+      onWidthChange(clamped);
+      return;
+    }
+    if (!maximized && clamped >= maxAvailable - FOCUS_SNAP_THRESHOLD && onMaximize) {
+      snapFiredRef.current = true;
+      onMaximize();
+      return;
+    }
+    if (!maximized) {
+      onWidthChange(clamped);
+    }
+  }, [maxAvailable, onMaximize, maximized, onWidthChange]);
+
+  const handleResizeEnd = useCallback((w: number) => {
+    if (snapFiredRef.current) return;
+    onWidthCommit(w);
+  }, [onWidthCommit]);
+
+  const rawMouseDown = useResizeDrag({
+    width: maximized ? maxAvailable : width,
     minWidth: MIN_WIDTH,
-    maxWidth: MAX_WIDTH_ABS,
-    maxWidthRatio: MAX_WIDTH_RATIO,
+    maxWidth: maxAvailable,
+    maxWidthRatio: 1,
     direction: 'left',
-    onResize: onWidthChange,
-    onResizeEnd: onWidthCommit,
+    onResize: handleResize,
+    onResizeEnd: handleResizeEnd,
   });
 
+  const handleMouseDown = useCallback((e: React.MouseEvent) => {
+    snapFiredRef.current = false;
+    rawMouseDown(e);
+  }, [rawMouseDown]);
+
+  const effectiveWidth = maximized
+    ? `calc(100vw - ${sidebarOffset}px)`
+    : `${width}px`;
+
   return (
     <aside
       className={`
         hidden md:flex fixed top-0 right-0 h-screen z-40
         flex-col bg-card border-l border-border
-        transition-all duration-200 ease-out
+        transition-[width,transform] duration-200 ease-out
         ${open ? 'translate-x-0' : 'translate-x-full pointer-events-none'}
-        ${maximized ? 'border-l-0' : ''}
       `}
-      style={maximized ? { left: `${sidebarOffset}px` } : { width: `${width}px` }}
+      style={{ width: effectiveWidth, minWidth: `${MIN_WIDTH}px` }}
       role="complementary"
       aria-label="MindOS Agent panel"
     >
@@ -87,15 +125,13 @@ export default function RightAskPanel({
         </div>
       </ErrorBoundary>
 
-      {/* Drag resize handle — LEFT edge (hidden when maximized) */}
-      {!maximized && (
-        <div
-          className="absolute top-0 -left-[3px] w-[6px] h-full cursor-col-resize z-40 group hidden md:block"
-          onMouseDown={handleMouseDown}
-        >
-          <div className="absolute left-[2px] top-0 w-[2px] h-full opacity-0 group-hover:opacity-100 bg-[var(--amber)]/60 transition-opacity" />
-        </div>
-      )}
+      {/* Drag resize handle — LEFT edge, always visible for bidirectional snap */}
+      <div
+        className="absolute top-0 -left-[3px] w-[6px] h-full cursor-col-resize z-40 group hidden md:block"
+        onMouseDown={handleMouseDown}
+      >
+        <div className="absolute left-[2px] top-0 w-[2px] h-full opacity-0 group-hover:opacity-100 bg-[var(--amber)]/60 transition-opacity" />
+      </div>
     </aside>
   );
 }

package/app/components/SearchModal.tsx

@@ -6,7 +6,7 @@ import { Search, X, FileText, Table, Settings, RotateCcw, Moon, Sun, Bot, Compas
 import { SearchResult } from '@/lib/types';
 import { encodePath } from '@/lib/utils';
 import { apiFetch } from '@/lib/api';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 import { toast } from '@/lib/toast';
 
 interface SearchModalProps {

package/app/components/Sidebar.tsx

@@ -11,7 +11,7 @@ import SettingsModal from './SettingsModal';
 import SyncStatusBar, { SyncDot, MobileSyncDot, useSyncStatus } from './SyncStatusBar';
 import { FileNode } from '@/lib/types';
 import type { Tab } from './settings/types';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 
 interface SidebarProps {
   fileTree: FileNode[];

package/app/components/SidebarLayout.tsx

@@ -33,16 +33,18 @@ import OrganizeToast from './OrganizeToast';
 import CreateSpaceModal from './CreateSpaceModal';
 import { MobileSyncDot, useSyncStatus } from './SyncStatusBar';
 import { FileNode } from '@/lib/types';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 import dynamic from 'next/dynamic';
 
 const ImportModal = dynamic(() => import('./ImportModal'), { ssr: false });
-import { WalkthroughProvider } from './walkthrough';
-import McpProvider from '@/hooks/useMcpData';
+import McpStoreInit from '@/lib/stores/McpStoreInit';
+import WalkthroughInit from '@/lib/stores/WalkthroughInit';
 import '@/lib/renderers/index'; // client-side renderer registration source of truth
 import { useLeftPanel } from '@/hooks/useLeftPanel';
 import { useAskPanel } from '@/hooks/useAskPanel';
 import { useAiOrganize } from '@/hooks/useAiOrganize';
+import { toast } from '@/lib/toast';
+import { quickDropToInbox } from '@/lib/inbox-upload';
 import type { Tab } from './settings/types';
 
 function collectDirPaths(nodes: FileNode[], prefix = ''): string[] {
@@ -181,6 +183,44 @@ export default function SidebarLayout({ fileTree, children }: SidebarLayoutProps
     return () => window.removeEventListener('mindos:open-import', handler);
   }, [handleOpenImport]);
 
+  // ── Inbox: batch AI organize from InboxSection ──
+  useEffect(() => {
+    const handler = (e: Event) => {
+      const files = (e as CustomEvent).detail?.files as Array<{ name: string; path: string }> | undefined;
+      if (!files || files.length === 0 || aiOrganize.phase === 'organizing') return;
+
+      const prompt = t.inbox.organizePrompt(files.map(f => f.name));
+
+      (async () => {
+        const attachments: Array<{ name: string; content: string }> = [];
+        for (const f of files) {
+          try {
+            const res = await fetch(`/api/file?path=${encodeURIComponent(f.path)}`);
+            if (res.ok) {
+              const data = await res.json();
+              attachments.push({ name: f.name, content: data.content ?? '' });
+            }
+          } catch { /* skip unreadable files */ }
+        }
+        if (attachments.length > 0) {
+          aiOrganize.start(attachments, prompt);
+        } else {
+          toast.error(t.inbox.organizeFailed, 4000);
+          window.dispatchEvent(new Event('mindos:organize-done'));
+        }
+      })();
+    };
+    window.addEventListener('mindos:inbox-organize', handler);
+    return () => window.removeEventListener('mindos:inbox-organize', handler);
+  }, [aiOrganize, t]);
+
+  // Notify InboxSection when organize finishes
+  useEffect(() => {
+    if (aiOrganize.phase === 'done' || aiOrganize.phase === 'error') {
+      window.dispatchEvent(new Event('mindos:organize-done'));
+    }
+  }, [aiOrganize.phase]);
+
   // Listen for cross-component "open panel" events (e.g. GuideCard → Agents)
   useEffect(() => {
     const handler = (e: Event) => {
@@ -335,9 +375,9 @@ export default function SidebarLayout({ fileTree, children }: SidebarLayoutProps
   }, [lp]);
 
   return (
-    <WalkthroughProvider>
-    <McpProvider>
     <>
+      <McpStoreInit />
+      <WalkthroughInit />
       {/* Skip link */}
       <a
         href="#main-content"
@@ -524,14 +564,12 @@ export default function SidebarLayout({ fileTree, children }: SidebarLayoutProps
           e.preventDefault();
           dragCounterRef.current = 0;
           setDragOverlay(false);
-          if (e.dataTransfer.files.length > 0) {
-            setImportInitialFiles(Array.from(e.dataTransfer.files));
-            setImportDefaultSpace(undefined);
-            setImportModalOpen(true);
+          if (e.dataTransfer.files.length > 0 && !importModalOpen) {
+            quickDropToInbox(Array.from(e.dataTransfer.files), t);
           }
         }}
       >
-        <div className="min-h-screen bg-background">
+        <div className="min-h-screen bg-background" style={{ overflowX: 'clip' }}>
           <ChangesBanner />
           {children}
         </div>
@@ -539,13 +577,13 @@ export default function SidebarLayout({ fileTree, children }: SidebarLayoutProps
         <SpaceInitToast />
         <CreateSpaceModal t={t} dirPaths={dirPaths} />
 
-        {/* Global drag overlay */}
+        {/* Global drag overlay — Quick Drop to Inbox */}
         {dragOverlay && !importModalOpen && (
           <div className="fixed inset-0 z-50 flex items-center justify-center bg-background/80 backdrop-blur-sm transition-opacity duration-200">
             <div className="border-2 border-dashed border-[var(--amber)]/50 rounded-xl p-12 flex flex-col items-center gap-3">
               <FolderInput size={48} className="text-[var(--amber)]/60" />
-              <p className="text-sm text-foreground font-medium">{t.fileImport.dropOverlay}</p>
-              <p className="text-xs text-muted-foreground">{t.fileImport.dropOverlayFormats}</p>
+              <p className="text-sm text-foreground font-medium">{t.inbox.dropOverlay}</p>
+              <p className="text-xs text-muted-foreground">{t.inbox.dropOverlayFormats}</p>
             </div>
           </div>
         )}
@@ -577,13 +615,11 @@ 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-right: calc(var(--right-panel-width) + var(--right-agent-detail-width) + var(--toc-extra-right, 0px)) !important;
             padding-top: 0;
           }
         }
       `}</style>
     </>
-    </McpProvider>
-    </WalkthroughProvider>
   );
 }

package/app/components/SpaceInitToast.tsx

@@ -3,7 +3,7 @@
 import { useState, useEffect, useCallback, useTransition } from 'react';
 import { Sparkles, Check, Undo2, X } from 'lucide-react';
 import { useRouter } from 'next/navigation';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 import { encodePath } from '@/lib/utils';
 import { revertSpaceInitAction } from '@/lib/actions';
 

package/app/components/SyncStatusBar.tsx

@@ -3,8 +3,8 @@
 import { useState, useEffect, useCallback, useRef } from 'react';
 import { RefreshCw, CheckCircle2, XCircle } from 'lucide-react';
 import { apiFetch } from '@/lib/api';
-import { useLocale } from '@/lib/LocaleContext';
-import type { SyncStatus } from './settings/SyncTab';
+import { useLocale } from '@/lib/stores/locale-store';
+import type { SyncStatus } from './settings/types';
 import { timeAgo } from './settings/SyncTab';
 
 export type StatusLevel = 'synced' | 'unpushed' | 'conflicts' | 'error' | 'off' | 'syncing';

package/app/components/SystemPulse.tsx

@@ -3,8 +3,8 @@
 import { useState, useEffect, useMemo } from 'react';
 import Link from 'next/link';
 import { Bot, ChevronDown, ArrowRight } from 'lucide-react';
-import { useMcpDataOptional } from '@/hooks/useMcpData';
-import { useLocale } from '@/lib/LocaleContext';
+import { useMcpDataOptional } from '@/lib/stores/mcp-store';
+import { useLocale } from '@/lib/stores/locale-store';
 import type { AgentInfo } from '@/components/settings/types';
 
 /* ── Constants ── */
@@ -66,7 +66,12 @@ export default function SystemPulse() {
     localStorage.setItem(COLLAPSE_KEY, next ? '1' : '0');
   };
 
-  if (!mcp || mcp.loading) return null;
+  if (!mcp || mcp.loading) return (
+    <section className="mb-8 animate-pulse">
+      <div className="h-4 w-32 bg-muted rounded mb-3" />
+      <div className="h-16 bg-muted/50 rounded-xl" />
+    </section>
+  );
 
   // ── State 0: No agents detected ──
   if (agents.every(a => !a.present)) {
@@ -173,9 +178,10 @@ export default function SystemPulse() {
         {visibleAgents.map(agent => {
           const age = activityAge(agent.runtimeLastActivityAt);
           return (
-            <div
+            <Link
               key={agent.key}
-              className="flex items-center gap-3 px-3.5 py-3 rounded-xl border border-border hover:border-[var(--amber)]/30 hover:shadow-sm transition-all duration-150"
+              href={`/agents/${encodeURIComponent(agent.key)}`}
+              className="flex items-center gap-3 px-3.5 py-3 rounded-xl border border-border hover:border-[var(--amber)]/30 hover:shadow-sm transition-all duration-150 hover:bg-muted/30 cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
             >
               {/* Avatar */}
               <div className="relative w-8 h-8 rounded-lg bg-[var(--amber)]/8 text-[var(--amber-text)] ring-1 ring-[var(--amber)]/15 flex items-center justify-center text-xs font-semibold font-display shrink-0">
@@ -190,7 +196,7 @@ export default function SystemPulse() {
                   {age ? ` · ${age}` : ''}
                 </span>
               </div>
-            </div>
+            </Link>
           );
         })}
       </div>