@geminilight/mindos 0.5.63 → 0.5.65

package/app/components/HomeContent.tsx

@@ -5,8 +5,7 @@ import { FileText, Table, Clock, Sparkles, ArrowRight, FilePlus, Search, Chevron
 import { useState, useEffect, useMemo } from 'react';
 import { useLocale } from '@/lib/LocaleContext';
 import { encodePath, relativeTime, extractEmoji, stripEmoji } from '@/lib/utils';
-import { getAllRenderers } from '@/lib/renderers/registry';
-import '@/lib/renderers/index'; // registers all renderers
+import { getAllRenderers, getPluginRenderers } from '@/lib/renderers/registry';
 import OnboardingView from './OnboardingView';
 import GuideCard from './GuideCard';
 import CreateSpaceModal from './CreateSpaceModal';
@@ -116,23 +115,20 @@ export default function HomeContent({ recent, existingFiles, spaces, dirPaths }:
   }, [suggestions.length]);
 
   const existingSet = new Set(existingFiles ?? []);
+  const spaceList = spaces ?? [];
+  const { groups, rootFiles } = useMemo(() => groupBySpace(recent, spaceList), [recent, spaceList]);
 
-  // Empty knowledge base → show onboarding
   if (recent.length === 0) {
     return <OnboardingView />;
   }
 
   const formatTime = (mtime: number) => relativeTime(mtime, t.home.relativeTime);
 
-  // Only show renderers that are available (have entryPath + file exists) as quick-access chips
-  const availablePlugins = getAllRenderers().filter(r => r.entryPath && existingSet.has(r.entryPath));
+  const availablePlugins = getPluginRenderers().filter(r => r.entryPath && existingSet.has(r.entryPath));
+  const builtinFeatures = getAllRenderers().filter((r) => r.appBuiltinFeature && r.id !== 'csv');
 
   const lastFile = recent[0];
 
-  // Group recent files by Space
-  const spaceList = spaces ?? [];
-  const { groups, rootFiles } = useMemo(() => groupBySpace(recent, spaceList), [recent, spaceList]);
-
   return (
     <div className="content-width px-4 md:px-6 py-8 md:py-12">
       <GuideCard
@@ -159,7 +155,7 @@ export default function HomeContent({ recent, existingFiles, spaces, dirPaths }:
             onClick={triggerAsk}
             title="⌘/"
             data-walkthrough="ask-button"
-            className="flex-1 flex items-center gap-3 px-4 py-3 rounded-xl border border-border bg-card transition-all duration-150 hover:border-amber-500/50 hover:bg-amber-500/8"
+            className="flex-1 flex items-center gap-3 px-4 py-3 rounded-xl border border-border bg-card transition-all duration-150 hover:border-[var(--amber)]/50 hover:bg-[var(--amber)]/8"
           >
             <Sparkles size={15} className="shrink-0 text-[var(--amber)]" />
             <span className="text-sm flex-1 text-left text-foreground">
@@ -236,7 +232,7 @@ export default function HomeContent({ recent, existingFiles, spaces, dirPaths }:
                     className={`flex items-start gap-3 px-3.5 py-3 rounded-xl border transition-all duration-150 hover:translate-x-0.5 ${
                       isEmpty
                         ? 'border-dashed border-border/50 opacity-50 hover:opacity-70'
-                        : 'border-border hover:border-amber-500/30 hover:bg-muted/40'
+                        : 'border-border hover:border-[var(--amber)]/30 hover:bg-muted/40'
                     }`}
                   >
                     {emoji ? (
@@ -275,7 +271,41 @@ export default function HomeContent({ recent, existingFiles, spaces, dirPaths }:
         <CreateSpaceModal t={t} dirPaths={dirPaths ?? []} />
       </section>
 
-      {/* ── Section 2: Extensions ── */}
+      {/* ── Section 2: Built-in capabilities ── */}
+      {builtinFeatures.length > 0 && (
+        <section className="mb-8">
+          <SectionTitle icon={<Puzzle size={13} />} count={builtinFeatures.length}>
+            {t.home.builtinFeatures}
+          </SectionTitle>
+          <div className="flex flex-wrap gap-2">
+            {builtinFeatures.map((r) => {
+              const active = !!r.entryPath && existingSet.has(r.entryPath);
+              if (active && r.entryPath) {
+                return (
+                  <Link key={r.id} href={`/view/${encodePath(r.entryPath)}`}>
+                    <span className="inline-flex items-center gap-2 px-3 py-2 rounded-lg border border-border text-xs transition-all duration-150 hover:border-[var(--amber)]/30 hover:bg-muted/60">
+                      <span className="text-sm leading-none" suppressHydrationWarning>{r.icon}</span>
+                      <span className="font-medium text-foreground">{r.name}</span>
+                    </span>
+                  </Link>
+                );
+              }
+              return (
+                <span
+                  key={r.id}
+                  className="inline-flex items-center gap-2 px-3 py-2 rounded-lg border border-dashed border-border text-xs text-muted-foreground opacity-70"
+                  title={r.entryPath ? t.home.createToActivate.replace('{file}', r.entryPath) : t.home.builtinInactive}
+                >
+                  <span className="text-sm leading-none" suppressHydrationWarning>{r.icon}</span>
+                  <span className="font-medium">{r.name}</span>
+                </span>
+              );
+            })}
+          </div>
+        </section>
+      )}
+
+      {/* ── Section 3: Extensions ── */}
       {availablePlugins.length > 0 && (
         <section className="mb-8">
           <SectionTitle
@@ -300,7 +330,7 @@ export default function HomeContent({ recent, existingFiles, spaces, dirPaths }:
               <Link
                 key={r.id}
                 href={`/view/${encodePath(r.entryPath!)}`}
-                className="inline-flex items-center gap-2 px-3 py-2 rounded-lg border border-border text-xs transition-all duration-150 hover:border-amber-500/30 hover:bg-muted/60"
+                className="inline-flex items-center gap-2 px-3 py-2 rounded-lg border border-border text-xs transition-all duration-150 hover:border-[var(--amber)]/30 hover:bg-muted/60"
               >
                 <span className="text-sm leading-none" suppressHydrationWarning>{r.icon}</span>
                 <span className="font-medium text-foreground">{r.name}</span>
@@ -310,7 +340,7 @@ export default function HomeContent({ recent, existingFiles, spaces, dirPaths }:
         </section>
       )}
 
-      {/* ── Section 3: Recently Edited ── */}
+      {/* ── Section 4: Recently Edited ── */}
       {recent.length > 0 && (
         <section className="mb-12">
           <SectionTitle icon={<Clock size={13} />} count={recent.length}>{t.home.recentlyEdited}</SectionTitle>

package/app/components/MarkdownView.tsx

@@ -31,8 +31,8 @@ function CopyButton({ code }: { code: string }) {
       className="
         absolute top-2.5 right-2.5
         p-1.5 rounded-md
-        bg-zinc-700 hover:bg-zinc-600
-        text-zinc-400 hover:text-zinc-200
+        bg-muted hover:bg-accent
+        text-muted-foreground hover:text-foreground
         transition-colors duration-100
         opacity-0 group-hover:opacity-100
       "

package/app/components/OnboardingView.tsx

@@ -100,7 +100,7 @@ export default function OnboardingView() {
               key={tpl.id}
               disabled={isDisabled}
               onClick={() => handleSelect(tpl.id)}
-              className="group relative flex flex-col items-start gap-3 p-5 rounded-xl border border-border bg-card text-left transition-all duration-150 hover:border-amber-500/50 hover:bg-amber-500/5 disabled:opacity-60 disabled:cursor-not-allowed"
+              className="group relative flex flex-col items-start gap-3 p-5 rounded-xl border border-border bg-card text-left transition-all duration-150 hover:border-[var(--amber)]/50 hover:bg-[var(--amber)]/5 disabled:opacity-60 disabled:cursor-not-allowed"
             >
               {/* Icon + title */}
               <div className="flex items-center gap-2.5 w-full">

package/app/components/Panel.tsx

@@ -149,7 +149,7 @@ export default function Panel({
           className="absolute top-0 -right-[3px] w-[6px] h-full cursor-col-resize z-40 group hidden md:block"
           onMouseDown={handleMouseDown}
         >
-          <div className="absolute right-[2px] top-0 w-[2px] h-full opacity-0 group-hover:opacity-100 bg-amber-500/60 transition-opacity" />
+          <div className="absolute right-[2px] top-0 w-[2px] h-full opacity-0 group-hover:opacity-100 bg-[var(--amber)]/60 transition-opacity" />
         </div>
       )}
     </aside>

package/app/components/RightAgentDetailPanel.tsx

@@ -70,6 +70,7 @@ export default function RightAgentDetailPanel({
     connected: p.connected,
     installing: p.installing,
     install: p.install,
+    installFailed: p.installFailed,
     copyConfig: p.copyConfig,
     copied: p.copied,
     transportLocal: p.transportLocal,
@@ -95,7 +96,7 @@ export default function RightAgentDetailPanel({
       aria-hidden={!open || !resolved}
     >
       {resolved && (
-        <div className="flex flex-col flex-1 min-h-0 overflow-hidden">
+        <div className="flex flex-col flex-1 min-h-0 overflow-y-auto">
           <AgentsPanelAgentDetail
             agent={resolved.agent}
             agentStatus={resolved.status}

package/app/components/RightAskPanel.tsx

@@ -81,7 +81,7 @@ export default function RightAskPanel({
         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-amber-500/60 transition-opacity" />
+        <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

@@ -1,6 +1,6 @@
 'use client';
 
-import { useState, useEffect, useCallback, useRef } from 'react';
+import { useState, useEffect, useCallback, useRef, useLayoutEffect } from 'react';
 import { useRouter } from 'next/navigation';
 import { Search, X, FileText, Table } from 'lucide-react';
 import { SearchResult } from '@/lib/types';
@@ -32,6 +32,7 @@ export default function SearchModal({ open, onClose }: SearchModalProps) {
   const [loading, setLoading] = useState(false);
   const [selectedIndex, setSelectedIndex] = useState(0);
   const inputRef = useRef<HTMLInputElement>(null);
+  const resultsRef = useRef<HTMLDivElement>(null);
   const router = useRouter();
   const debounceTimer = useRef<ReturnType<typeof setTimeout> | null>(null);
   const { t } = useLocale();
@@ -99,6 +100,13 @@ export default function SearchModal({ open, onClose }: SearchModalProps) {
     return () => window.removeEventListener('keydown', handler);
   }, [open, onClose, results, selectedIndex, navigate]);
 
+  useLayoutEffect(() => {
+    const container = resultsRef.current;
+    if (!container) return;
+    const selected = container.children[selectedIndex] as HTMLElement | undefined;
+    selected?.scrollIntoView({ block: 'nearest' });
+  }, [selectedIndex]);
+
   if (!open) return null;
 
   return (
@@ -134,7 +142,7 @@ export default function SearchModal({ open, onClose }: SearchModalProps) {
         </div>
 
         {/* Results */}
-        <div className="max-h-[50vh] md:max-h-80 overflow-y-auto flex-1">
+        <div ref={resultsRef} className="max-h-[50vh] md:max-h-80 overflow-y-auto flex-1">
           {results.length === 0 && query && !loading && (
             <div className="px-4 py-8 text-center text-sm text-muted-foreground">{t.search.noResults}</div>
           )}

package/app/components/SidebarLayout.tsx

@@ -31,6 +31,7 @@ import { FileNode } from '@/lib/types';
 import { useLocale } from '@/lib/LocaleContext';
 import { WalkthroughProvider } from './walkthrough';
 import McpProvider from '@/hooks/useMcpData';
+import '@/lib/renderers/index'; // client-side renderer registration source of truth
 import { useLeftPanel } from '@/hooks/useLeftPanel';
 import { useAskPanel } from '@/hooks/useAskPanel';
 import type { Tab } from './settings/types';
@@ -136,18 +137,43 @@ export default function SidebarLayout({ fileTree, children }: SidebarLayoutProps
 
   const agentDockOpen = agentDetailKey !== null && lp.activePanel === 'agents';
 
-  // Refresh file tree periodically
+  // Refresh file tree when server-side tree version changes.
+  // Polls a lightweight version counter every 3s — only calls router.refresh()
+  // (which rebuilds the full tree) when the version actually changes.
   useEffect(() => {
+    let lastVersion = -1;
+    let stopped = false;
+
+    const checkVersion = async () => {
+      if (stopped || document.visibilityState === 'hidden') return;
+      try {
+        const res = await fetch('/api/tree-version');
+        if (!res.ok) return;
+        const { v } = (await res.json()) as { v: number };
+        if (lastVersion === -1) {
+          lastVersion = v;
+          return;
+        }
+        if (v !== lastVersion) {
+          lastVersion = v;
+          router.refresh();
+          window.dispatchEvent(new Event('mindos:files-changed'));
+        }
+      } catch (err) { console.debug('[tree-version] poll failed', err); }
+    };
+
     const onVisible = () => {
-      if (document.visibilityState === 'visible') router.refresh();
+      if (document.visibilityState === 'visible') void checkVersion();
     };
+
+    void checkVersion();
+    const interval = setInterval(() => void checkVersion(), 3_000);
     document.addEventListener('visibilitychange', onVisible);
-    const interval = setInterval(() => {
-      if (document.visibilityState === 'visible') router.refresh();
-    }, 30_000);
+
     return () => {
-      document.removeEventListener('visibilitychange', onVisible);
+      stopped = true;
       clearInterval(interval);
+      document.removeEventListener('visibilitychange', onVisible);
     };
   }, [router]);
 
@@ -223,8 +249,7 @@ export default function SidebarLayout({ fileTree, children }: SidebarLayoutProps
       {/* Skip link */}
       <a
         href="#main-content"
-        className="sr-only focus:not-sr-only focus:fixed focus:top-2 focus:left-2 focus:z-[60] focus:px-4 focus:py-2 focus:rounded-lg focus:text-sm focus:font-medium focus:font-display"
-        style={{ background: 'var(--amber)', color: 'var(--amber-foreground)' }}
+        className="sr-only focus:not-sr-only focus:fixed focus:top-2 focus:left-2 focus:z-[60] focus:px-4 focus:py-2 focus:rounded-lg focus:text-sm focus:font-medium focus:font-display bg-[var(--amber)] text-[var(--amber-foreground)]"
       >
         Skip to main content
       </a>
@@ -234,7 +259,9 @@ export default function SidebarLayout({ fileTree, children }: SidebarLayoutProps
         activePanel={railActivePanel}
         onPanelChange={lp.setActivePanel}
         onAgentsClick={() => {
-          lp.setActivePanel((current) => (current === 'agents' ? null : 'agents'));
+          const wasActive = lp.activePanel === 'agents';
+          lp.setActivePanel(wasActive ? null : 'agents');
+          if (!wasActive) router.push('/agents');
           setAgentDetailKey(null);
         }}
         syncStatus={syncStatus}
@@ -272,7 +299,6 @@ export default function SidebarLayout({ fileTree, children }: SidebarLayoutProps
             maximized={lp.panelMaximized}
             onMaximize={lp.handlePanelMaximize}
             selectedAgentKey={agentDockOpen ? agentDetailKey : null}
-            onOpenAgentDetail={setAgentDetailKey}
           />
         </div>
         <div className={`flex flex-col h-full ${lp.activePanel === 'discover' ? '' : 'hidden'}`}>

package/app/components/ThemeToggle.tsx

@@ -27,7 +27,7 @@ export default function ThemeToggle() {
   return (
     <button
       onClick={toggle}
-      className="p-1.5 rounded-lg hover:bg-zinc-800 text-zinc-500 hover:text-zinc-300 transition-colors"
+      className="p-1.5 rounded-lg hover:bg-muted text-muted-foreground hover:text-foreground transition-colors"
       title={dark ? 'Switch to light mode' : 'Switch to dark mode'}
     >
       {dark ? <Sun size={15} /> : <Moon size={15} />}