@geminilight/mindos 0.6.39 → 0.6.41

package/app/components/MarkdownView.tsx

@@ -17,6 +17,8 @@ interface MarkdownViewProps {
   highlightLines?: number[];
   /** Callback to dismiss the highlight banner */
   onDismissHighlight?: () => void;
+  /** Placeholder shown when content is empty (read mode) */
+  emptyPlaceholder?: string;
 }
 
 function CopyButton({ code }: { code: string }) {
@@ -49,11 +51,18 @@ function CopyButton({ code }: { code: string }) {
   );
 }
 
-// Heading components with suppressHydrationWarning to prevent
-// rehype-slug + emoji hydration mismatches between server and client
+// react-markdown passes an AST `node` prop to custom components;
+// strip it (and any other non-DOM keys) before forwarding to the real element.
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function stripNonDom(props: Record<string, any>): Record<string, any> {
+  const { node, inline, ordered, depth, isHeader, ...domProps } = props;
+  return domProps;
+}
+
 function makeHeading(Tag: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6') {
-  const HeadingComponent = ({ children, ...props }: React.HTMLAttributes<HTMLHeadingElement>) => (
-    <Tag {...props} suppressHydrationWarning>{children}</Tag>
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const HeadingComponent = ({ children, ...props }: any) => (
+    <Tag {...stripNonDom(props)} suppressHydrationWarning>{children}</Tag>
   );
   HeadingComponent.displayName = Tag;
   return HeadingComponent;
@@ -66,11 +75,12 @@ const components: Components = {
   h4: makeHeading('h4'),
   h5: makeHeading('h5'),
   h6: makeHeading('h6'),
-  code({ children, ...props }) {
-    return <code {...props} suppressHydrationWarning>{children}</code>;
+  code({ children, node, ...rest }) {
+    void node;
+    return <code {...stripNonDom(rest)} suppressHydrationWarning>{children}</code>;
   },
-  pre({ children, ...props }) {
-    // Extract code string from children
+  pre({ children, node, ...rest }) {
+    void node;
     let codeString = '';
     if (children && typeof children === 'object' && 'props' in children) {
       const codeEl = children as React.ReactElement<{ children?: React.ReactNode }>;
@@ -78,31 +88,38 @@ const components: Components = {
     }
     return (
       <div className="relative group">
-        <pre {...props} suppressHydrationWarning>{children}</pre>
+        <pre {...stripNonDom(rest)} suppressHydrationWarning>{children}</pre>
         <CopyButton code={codeString} />
       </div>
     );
   },
-  li({ children, ...props }) {
-    return <li {...props} suppressHydrationWarning>{children}</li>;
+  li({ children, node, ...rest }) {
+    void node;
+    return <li {...stripNonDom(rest)} suppressHydrationWarning>{children}</li>;
   },
-  a({ href, children, ...props }) {
+  p({ children, node, ...rest }) {
+    void node;
+    return <p {...stripNonDom(rest)} suppressHydrationWarning>{children}</p>;
+  },
+  a({ href, children, node, ...rest }) {
+    void node;
     const isExternal = href?.startsWith('http');
     return (
       <a
         href={href}
         target={isExternal ? '_blank' : undefined}
         rel={isExternal ? 'noopener noreferrer' : undefined}
-        {...props}
+        {...stripNonDom(rest)}
       >
         {children}
       </a>
     );
   },
-  img({ src, alt, ...props }) {
+  img({ src, alt, node, ...rest }) {
+    void node;
     if (!src) return null;
     // eslint-disable-next-line @next/next/no-img-element
-    return <img src={src} alt={alt ?? ''} {...props} />;
+    return <img src={src} alt={alt ?? ''} {...stripNonDom(rest)} />;
   },
 };
 
@@ -115,9 +132,17 @@ function extractText(node: React.ReactNode): string {
   return '';
 }
 
-export default function MarkdownView({ content, highlightLines, onDismissHighlight }: MarkdownViewProps) {
+export default function MarkdownView({ content, highlightLines, onDismissHighlight, emptyPlaceholder }: MarkdownViewProps) {
   const hasHighlights = highlightLines && highlightLines.length > 0;
 
+  if (!content.trim() && emptyPlaceholder) {
+    return (
+      <div className="py-12 text-center text-sm text-muted-foreground/50">
+        {emptyPlaceholder}
+      </div>
+    );
+  }
+
   return (
     <div>
       {/* Change indicator banner */}

package/app/components/OnboardingView.tsx

@@ -3,7 +3,7 @@
 import { useState } from 'react';
 import { useRouter } from 'next/navigation';
 import { Sparkles, Globe, BookOpen, FileText, Loader2, GitBranch, AlertCircle } from 'lucide-react';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 
 type Template = 'en' | 'zh' | 'empty';
 

package/app/components/OrganizeToast.tsx

@@ -7,7 +7,7 @@ import {
   ChevronDown, FilePlus, FileEdit, ExternalLink,
   Maximize2, Minimize2, FileIcon,
 } from 'lucide-react';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 import type { useAiOrganize } from '@/hooks/useAiOrganize';
 import type { OrganizeStageHint } from '@/hooks/useAiOrganize';
 import { encodePath } from '@/lib/utils';

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,17 @@
 '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 ENTER_SNAP_THRESHOLD = 80;
+const EXIT_SNAP_THRESHOLD = 16;
+const MIN_CONTENT_WIDTH = 360;
 
 import type { AcpAgentSelection } from '@/hooks/useAskModal';
 
@@ -35,26 +38,91 @@ export default function RightAskPanel({
   width, onWidthChange, onWidthCommit, askMode, onModeSwitch,
   maximized = false, onMaximize, sidebarOffset = 0,
 }: RightAskPanelProps) {
-  const handleMouseDown = useResizeDrag({
-    width,
+  const snapFiredRef = useRef(false);
+  const justExitedMaxRef = 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);
+
+    // Exit maximized: user drags right even a little (16px) → exit immediately
+    if (maximized && clamped < maxAvailable - EXIT_SNAP_THRESHOLD && onMaximize) {
+      justExitedMaxRef.current = true;
+      onMaximize();
+      const maxPanelForContent = typeof window !== 'undefined'
+        ? window.innerWidth - sidebarOffset - MIN_CONTENT_WIDTH
+        : clamped;
+      onWidthChange(Math.min(clamped, maxPanelForContent));
+      return;
+    }
+
+    // Snap to fullscreen: panel near max edge OR content squeezed below minimum.
+    // Suppress content-based snap while justExitedMaxRef is true (user recently
+    // exited fullscreen and panel is still wide); only re-enable once the panel
+    // has been shrunk enough that content is comfortable (reset in handleMouseDown).
+    const contentRemaining = typeof window !== 'undefined'
+      ? window.innerWidth - sidebarOffset - clamped
+      : Infinity;
+    const shouldSnap = clamped >= maxAvailable - ENTER_SNAP_THRESHOLD
+      || (!justExitedMaxRef.current && contentRemaining < MIN_CONTENT_WIDTH);
+    if (!maximized && shouldSnap && onMaximize) {
+      snapFiredRef.current = true;
+      onMaximize();
+      return;
+    }
+    if (!maximized) {
+      onWidthChange(clamped);
+    }
+  }, [maxAvailable, sidebarOffset, 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;
+    // Only re-enable content-based snap once the panel has been shrunk enough
+    // that content is comfortably above minimum. This prevents the bounce:
+    // exit fullscreen → new drag → immediately re-snap because panel still wide.
+    if (justExitedMaxRef.current) {
+      const currentContent = typeof window !== 'undefined'
+        ? window.innerWidth - sidebarOffset - width
+        : Infinity;
+      if (currentContent >= MIN_CONTENT_WIDTH) {
+        justExitedMaxRef.current = false;
+      }
+    }
+    rawMouseDown(e);
+  }, [rawMouseDown, sidebarOffset, width]);
+
+  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 +155,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[];
@@ -102,13 +102,13 @@ export default function Sidebar({ fileTree, collapsed = false, onCollapse, onExp
         </button>
         {/* Desktop action buttons — trimmed to 4 */}
         <div className="hidden md:flex items-center gap-1">
-          <button onClick={() => setSearchOpen(true)} className="p-1 rounded hover:bg-muted text-muted-foreground hover:text-foreground transition-colors" title={t.sidebar.searchTitle} aria-label={t.sidebar.searchTitle}>
+          <button onClick={() => setSearchOpen(true)} className="p-1 rounded hover:bg-muted text-muted-foreground hover:text-foreground transition-colors" title={t.sidebar.searchTitle} aria-hidden="true" tabIndex={-1}>
             <Search size={15} />
           </button>
-          <button onClick={() => setSettingsOpen(true)} className="p-1 rounded hover:bg-muted text-muted-foreground hover:text-foreground transition-colors" title={t.sidebar.settingsTitle} aria-label={t.sidebar.settingsTitle}>
+          <button onClick={() => setSettingsOpen(true)} className="p-1 rounded hover:bg-muted text-muted-foreground hover:text-foreground transition-colors" title={t.sidebar.settingsTitle} aria-hidden="true" tabIndex={-1}>
             <Settings size={15} />
           </button>
-          <button onClick={onCollapse} className="p-1 rounded hover:bg-muted text-muted-foreground hover:text-foreground transition-colors" title={t.sidebar.collapseTitle} aria-label={t.sidebar.collapseTitle}>
+          <button onClick={onCollapse} className="p-1 rounded hover:bg-muted text-muted-foreground hover:text-foreground transition-colors" title={t.sidebar.collapseTitle} aria-hidden="true" tabIndex={-1}>
             <PanelLeftClose size={15} />
           </button>
         </div>

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>