@geminilight/mindos 0.6.38 → 0.6.40

package/_standalone/components/home/InboxSection.tsx

@@ -0,0 +1,268 @@
+'use client';
+
+import { useState, useEffect, useCallback, useMemo, useRef } from 'react';
+import Link from 'next/link';
+import {
+  Inbox,
+  Sparkles,
+  FileText,
+  Table,
+  AlertCircle,
+  Loader2,
+  ChevronRight,
+  Upload,
+} from 'lucide-react';
+import { useLocale } from '@/lib/stores/locale-store';
+import { encodePath } from '@/lib/utils';
+import { quickDropToInbox } from '@/lib/inbox-upload';
+
+interface InboxFile {
+  name: string;
+  path: string;
+  size: number;
+  modifiedAt: string;
+  isAging: boolean;
+}
+
+interface InboxSectionProps {
+  isOrganizing?: boolean;
+}
+
+const VISIBLE_LIMIT = 5;
+
+export function InboxSection({ isOrganizing: externalOrganizing = false }: InboxSectionProps) {
+  const { t } = useLocale();
+  const [files, setFiles] = useState<InboxFile[]>([]);
+  const [loading, setLoading] = useState(true);
+  const [showAll, setShowAll] = useState(false);
+  const [organizing, setOrganizing] = useState(false);
+  const fileInputRef = useRef<HTMLInputElement>(null);
+  const isOrganizing = externalOrganizing || organizing;
+
+  const handleOrganize = useCallback(() => {
+    if (files.length === 0 || isOrganizing) return;
+    setOrganizing(true);
+    window.dispatchEvent(
+      new CustomEvent('mindos:inbox-organize', { detail: { files } }),
+    );
+  }, [files, isOrganizing]);
+
+  const handleUpload = useCallback((selected: FileList | null) => {
+    if (!selected || selected.length === 0) return;
+    quickDropToInbox(Array.from(selected), t);
+    if (fileInputRef.current) fileInputRef.current.value = '';
+  }, [t]);
+
+  const fetchInbox = useCallback(async () => {
+    try {
+      const res = await fetch('/api/inbox');
+      if (!res.ok) return;
+      const data = await res.json();
+      if (Array.isArray(data.files)) {
+        setFiles(data.files);
+      }
+    } catch (err) {
+      console.warn('[InboxSection] Failed to fetch inbox:', err);
+    } finally {
+      setLoading(false);
+    }
+  }, []);
+
+  const refreshTimerRef = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);
+  const debouncedRefresh = useCallback(() => {
+    clearTimeout(refreshTimerRef.current);
+    refreshTimerRef.current = setTimeout(fetchInbox, 80);
+  }, [fetchInbox]);
+
+  useEffect(() => {
+    fetchInbox();
+
+    const onOrganizeDone = () => { setOrganizing(false); debouncedRefresh(); };
+
+    window.addEventListener('mindos:files-changed', debouncedRefresh);
+    window.addEventListener('mindos:inbox-updated', debouncedRefresh);
+    window.addEventListener('mindos:organize-done', onOrganizeDone);
+    return () => {
+      clearTimeout(refreshTimerRef.current);
+      window.removeEventListener('mindos:files-changed', debouncedRefresh);
+      window.removeEventListener('mindos:inbox-updated', debouncedRefresh);
+      window.removeEventListener('mindos:organize-done', onOrganizeDone);
+    };
+  }, [fetchInbox, debouncedRefresh]);
+
+  const visibleFiles = useMemo(
+    () => (showAll ? files : files.slice(0, VISIBLE_LIMIT)),
+    [files, showAll],
+  );
+  const hiddenCount = files.length - VISIBLE_LIMIT;
+
+  if (loading) return (
+    <section className="mb-10 animate-pulse">
+      <div className="h-4 w-24 bg-muted rounded mb-3" />
+      <div className="space-y-2">
+        <div className="h-10 bg-muted/50 rounded-lg" />
+        <div className="h-10 bg-muted/50 rounded-lg" />
+      </div>
+    </section>
+  );
+
+  return (
+    <section className="mb-10">
+      {/* Header */}
+      <div className="flex items-center gap-2 mb-4">
+        <span className="text-[var(--amber)]">
+          <Inbox size={13} />
+        </span>
+        <h2 className="text-sm font-semibold font-display text-foreground">
+          {t.inbox.title}
+        </h2>
+        {files.length > 0 && (
+          <span className="inline-flex items-center justify-center min-w-[18px] h-[18px] px-1 text-2xs font-semibold rounded-full bg-[var(--amber)]/15 text-[var(--amber)] tabular-nums font-display">
+            {t.inbox.count(files.length)}
+          </span>
+        )}
+        {files.length > 0 && (
+          <div className="ml-auto flex items-center gap-3">
+            <button
+              type="button"
+              onClick={() => fileInputRef.current?.click()}
+              className="flex items-center gap-1.5 text-xs font-medium text-muted-foreground transition-colors hover:text-foreground cursor-pointer font-display"
+              title={t.inbox.uploadButton}
+            >
+              <Upload size={12} />
+            </button>
+            <button
+              onClick={handleOrganize}
+              disabled={isOrganizing}
+              className="flex items-center gap-1.5 text-xs font-medium text-[var(--amber)] transition-colors hover:opacity-80 cursor-pointer font-display disabled:opacity-50 disabled:cursor-not-allowed"
+              title={isOrganizing ? t.inbox.organizing : undefined}
+            >
+              {isOrganizing ? (
+                <Loader2 size={12} className="animate-spin" />
+              ) : (
+                <Sparkles size={12} />
+              )}
+              <span>{isOrganizing ? t.inbox.organizing : t.inbox.organizeButton}</span>
+            </button>
+          </div>
+        )}
+      </div>
+
+      {/* Hidden file input for upload button */}
+      <input
+        ref={fileInputRef}
+        type="file"
+        multiple
+        accept=".md,.txt,.csv,.json,.pdf"
+        className="hidden"
+        onChange={(e) => handleUpload(e.target.files)}
+      />
+
+      {/* Content — drag-drop is handled by SidebarLayout's global overlay */}
+      {files.length === 0 ? (
+        <div className="rounded-xl border-2 border-dashed border-border px-4 py-8 text-center">
+          <Inbox size={24} className="mx-auto mb-2 text-muted-foreground/30" />
+          <p className="text-sm text-muted-foreground/70 font-display">
+            {t.inbox.emptyTitle}
+          </p>
+          <p className="text-xs text-muted-foreground/40 mt-1">
+            {t.inbox.emptyDesc}
+          </p>
+          <button
+            type="button"
+            onClick={() => fileInputRef.current?.click()}
+            className="mt-3 inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium rounded-lg transition-colors bg-muted text-muted-foreground hover:text-foreground hover:bg-muted/80"
+          >
+            <Upload size={12} />
+            {t.inbox.uploadButton}
+          </button>
+        </div>
+      ) : (
+        <>
+          <div className="flex flex-col gap-0.5">
+            {visibleFiles.map((file) => (
+              <InboxFileRow key={file.path} file={file} />
+            ))}
+          </div>
+          {hiddenCount > 0 && (
+            <button
+              onClick={() => setShowAll(v => !v)}
+              className="flex items-center gap-1 mt-2 text-xs text-muted-foreground hover:text-foreground transition-colors cursor-pointer font-display"
+            >
+              <ChevronRight
+                size={12}
+                className={`transition-transform duration-150 ${showAll ? 'rotate-90' : ''}`}
+              />
+              {showAll ? t.home.showLess : t.inbox.more(hiddenCount)}
+            </button>
+          )}
+        </>
+      )}
+    </section>
+  );
+}
+
+function InboxFileRow({ file }: { file: InboxFile }) {
+  const { t } = useLocale();
+  const isCSV = file.name.endsWith('.csv');
+  const age = formatRelativeTime(file.modifiedAt, t.home.relativeTime);
+
+  return (
+    <Link
+      href={`/view/${encodePath(file.path)}`}
+      className="flex items-center gap-3 px-3 py-2 rounded-lg transition-all duration-100 hover:translate-x-0.5 hover:bg-muted group"
+    >
+      {/* Dot indicator */}
+      <span
+        className={`w-1.5 h-1.5 rounded-full shrink-0 ${
+          file.isAging ? 'bg-[var(--amber)]/60' : 'bg-[var(--amber)]'
+        }`}
+      />
+      {/* Icon */}
+      {isCSV ? (
+        <Table size={12} className="shrink-0 text-success" />
+      ) : (
+        <FileText size={12} className="shrink-0 text-muted-foreground" />
+      )}
+      {/* Name */}
+      <span
+        className="text-sm truncate flex-1 text-foreground"
+        title={file.name}
+        suppressHydrationWarning
+      >
+        {file.name}
+      </span>
+      {/* Time */}
+      <span className="text-2xs text-muted-foreground/50 tabular-nums shrink-0 font-display">
+        {age}
+      </span>
+      {/* Aging warning */}
+      {file.isAging && (
+        <span title="7+ days">
+          <AlertCircle
+            size={11}
+            className="shrink-0 text-[var(--amber)]/60"
+          />
+        </span>
+      )}
+    </Link>
+  );
+}
+
+interface RelativeTimeStrings {
+  justNow: string;
+  minutesAgo: (n: number) => string;
+  hoursAgo: (n: number) => string;
+  daysAgo: (n: number) => string;
+}
+
+function formatRelativeTime(isoString: string, rt: RelativeTimeStrings): string {
+  const diff = Date.now() - new Date(isoString).getTime();
+  const minutes = Math.floor(diff / 60000);
+  if (minutes < 1) return rt.justNow;
+  if (minutes < 60) return rt.minutesAgo(minutes);
+  const hours = Math.floor(minutes / 60);
+  if (hours < 24) return rt.hoursAgo(hours);
+  const days = Math.floor(hours / 24);
+  return rt.daysAgo(days);
+}

package/_standalone/components/panels/AgentsPanel.tsx

@@ -3,9 +3,9 @@
 import { useState } from 'react';
 import { usePathname } from 'next/navigation';
 import { Globe, Loader2, RefreshCw, Settings } from 'lucide-react';
-import { useMcpData } from '@/hooks/useMcpData';
+import { useMcpData } from '@/lib/stores/mcp-store';
 import { useA2aRegistry } from '@/hooks/useA2aRegistry';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 import PanelHeader from './PanelHeader';
 import { AgentsPanelHubNav } from './AgentsPanelHubNav';
 import { AgentsPanelAgentGroups } from './AgentsPanelAgentGroups';
@@ -72,6 +72,7 @@ export default function AgentsPanel({
     navSkills: p.navSkills,
     navNetwork: p.navNetwork,
     navSessions: p.navSessions,
+    navActivity: p.navActivity,
   };
 
   const hub = (

package/_standalone/components/panels/AgentsPanelHubNav.tsx

@@ -10,6 +10,7 @@ type HubCopy = {
   navSkills: string;
   navNetwork: string;
   navSessions: string;
+  navActivity?: string;
 };
 
 export function AgentsPanelHubNav({
@@ -51,12 +52,7 @@ export function AgentsPanelHubNav({
         href="/agents?tab=a2a"
         active={inAgentsRoute && tab === 'a2a'}
       />
-      <PanelNavRow
-        icon={<History size={14} className={inAgentsRoute && tab === 'sessions' ? 'text-[var(--amber)]' : 'text-muted-foreground'} />}
-        title={copy.navSessions}
-        href="/agents?tab=sessions"
-        active={inAgentsRoute && tab === 'sessions'}
-      />
+      {/* Sessions tab hidden */}
     </div>
   );
 }

package/_standalone/components/panels/DiscoverPanel.tsx

@@ -5,7 +5,7 @@ import { useRouter } from 'next/navigation';
 import { Lightbulb, Blocks, Zap, LayoutTemplate, User, Download, RefreshCw, Repeat, Rocket, Search, Handshake, ShieldCheck, ChevronDown } from 'lucide-react';
 import PanelHeader from './PanelHeader';
 import { PanelNavRow, ComingSoonBadge } from './PanelNavRow';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 import { useCases } from '@/components/explore/use-cases.generated';
 import { openAskModal } from '@/hooks/useAskModal';
 import { getPluginRenderers, isRendererEnabled, setRendererEnabled, loadDisabledState } from '@/lib/renderers/registry';

package/_standalone/components/panels/EchoPanel.tsx

@@ -6,7 +6,7 @@ import { UserRound, Bookmark, Sun, History, Brain } from 'lucide-react';
 import PanelHeader from './PanelHeader';
 import { PanelNavRow } from './PanelNavRow';
 import EchoSidebarStats from './EchoSidebarStats';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 import { ECHO_SEGMENT_HREF, ECHO_SEGMENT_ORDER, type EchoSegment } from '@/lib/echo-segments';
 
 interface EchoPanelProps {

package/_standalone/components/panels/EchoSidebarStats.tsx

@@ -4,7 +4,7 @@ import { useState, useEffect } from 'react';
 import { TrendingUp, MessageSquare, AlertCircle } from 'lucide-react';
 import type { ContentChangeEvent } from '@/lib/fs';
 import { apiFetch } from '@/lib/api';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 
 interface EchoStats {
   fileCount: number;

package/_standalone/components/panels/ImportHistoryPanel.tsx

@@ -5,7 +5,7 @@ import { useRouter } from 'next/navigation';
 import {
   ChevronDown, FilePlus, FileEdit, ExternalLink, Trash2, FileInput,
 } from 'lucide-react';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 import { encodePath } from '@/lib/utils';
 import PanelHeader from './PanelHeader';
 import {

package/_standalone/components/panels/PanelHeader.tsx

@@ -16,7 +16,7 @@ export default function PanelHeader({
   onMaximize?: () => void;
 }) {
   return (
-    <div className="flex items-center justify-between px-4 py-3 border-b border-border shrink-0">
+    <div className="flex items-center justify-between px-4 py-3 h-[46px] border-b border-border shrink-0">
       <span className="text-xs font-medium text-muted-foreground uppercase tracking-wider font-display">{title}</span>
       <div className="flex items-center gap-1">
         {children}

package/_standalone/components/panels/PluginsPanel.tsx

@@ -5,7 +5,7 @@ import { useRouter } from 'next/navigation';
 import { getPluginRenderers, isRendererEnabled, setRendererEnabled, loadDisabledState } from '@/lib/renderers/registry';
 import { Toggle } from '../settings/Primitives';
 import PanelHeader from './PanelHeader';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 
 interface PluginsPanelProps {
   active: boolean;

package/_standalone/components/panels/SearchPanel.tsx

@@ -6,7 +6,7 @@ import { Search, X, FileText, Table } from 'lucide-react';
 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 PanelHeader from './PanelHeader';
 import { Virtuoso } from 'react-virtuoso';
 
@@ -109,6 +109,7 @@ export default function SearchPanel({ active, onNavigate, maximized, onMaximize
           onChange={handleChange}
           onKeyDown={handleKeyDown}
           placeholder={t.search.placeholder}
+          aria-label={t.search.placeholder}
           className="flex-1 bg-transparent text-foreground placeholder:text-muted-foreground text-sm outline-none"
         />
         {loading && (
@@ -122,7 +123,7 @@ export default function SearchPanel({ active, onNavigate, maximized, onMaximize
       </div>
 
       {/* Results */}
-      <div className="flex-1 overflow-y-auto min-h-0">
+      <div className="flex-1 overflow-y-auto min-h-0" role="listbox" aria-label="Search results">
         {results.length === 0 && query && !loading && (
           <div className="px-4 py-8 text-center text-sm text-muted-foreground">{t.search.noResults}</div>
         )}
@@ -141,6 +142,8 @@ export default function SearchPanel({ active, onNavigate, maximized, onMaximize
               const dirPath = parts.slice(0, -1).join('/');
               return (
                 <button
+                  role="option"
+                  aria-selected={i === selectedIndex}
                   onClick={() => navigate(result)}
                   onMouseEnter={() => setSelectedIndex(i)}
                   className={`

package/_standalone/components/panels/SyncPopover.tsx

@@ -3,7 +3,7 @@
 import { useEffect, useRef } from 'react';
 import { RefreshCw, CheckCircle2, XCircle, X } from 'lucide-react';
 import { DOT_COLORS, getStatusLevel, getSyncLabel, useSyncAction } from '../SyncStatusBar';
-import type { SyncStatus } from '../settings/SyncTab';
+import type { SyncStatus } from '../settings/types';
 import { PrimaryButton } from '../settings/Primitives';
 
 interface SyncPopoverProps {

package/_standalone/components/panels/WorkflowsPanel.tsx

@@ -4,7 +4,7 @@ import { useState, useEffect, useCallback } from 'react';
 import Link from 'next/link';
 import { Plus, Zap, AlertTriangle, Loader2 } from 'lucide-react';
 import PanelHeader from './PanelHeader';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 import { encodePath, relativeTime } from '@/lib/utils';
 
 interface WorkflowItem {

package/_standalone/components/renderers/agent-inspector/AgentInspectorRenderer.tsx

@@ -20,6 +20,7 @@ interface AgentOp {
   params: Record<string, unknown>;
   result: 'ok' | 'error';
   message?: string;
+  agentName?: string;
 }
 
 interface AgentAuditState {
@@ -179,6 +180,17 @@ function OpCard({ op }: { op: AgentOp }) {
         )}
 
         <div style={{ marginLeft: 'auto', display: 'flex', alignItems: 'center', gap: 8, flexShrink: 0 }}>
+          {/* agent name badge */}
+          {op.agentName && (
+            <span className="font-display" style={{
+              fontSize: '0.62rem', fontWeight: 500,
+              padding: '1px 6px', borderRadius: 999,
+              background: 'var(--muted)', color: 'var(--muted-foreground)',
+              whiteSpace: 'nowrap', maxWidth: 120, overflow: 'hidden', textOverflow: 'ellipsis',
+            }} title={op.agentName}>
+              {op.agentName.length > 30 ? op.agentName.slice(0, 30) + '...' : op.agentName}
+            </span>
+          )}
           {/* result */}
           {op.result === 'ok'
             ? <CheckCircle2 size={13} style={{ color: 'var(--success)' }} />
@@ -219,6 +231,12 @@ function OpCard({ op }: { op: AgentOp }) {
               {op.message}
             </div>
           )}
+          {/* agent info */}
+          {op.agentName && (
+            <div className="font-display" style={{ marginTop: 6, fontSize: '0.68rem', color: 'var(--muted-foreground)' }}>
+              Agent: <span style={{ color: 'var(--foreground)', fontWeight: 500 }}>{op.agentName}</span>
+            </div>
+          )}
           {/* absolute timestamp */}
           <div className="font-display" style={{ marginTop: 6, fontSize: '0.65rem', color: 'var(--muted-foreground)', opacity: 0.5 }}>
             {formatTs(op.ts)}

package/_standalone/components/renderers/agent-inspector/manifest.ts

@@ -0,0 +1,16 @@
+import type { RendererDefinition } from '@/lib/renderers/registry';
+
+export const manifest: RendererDefinition = {
+  id: 'agent-inspector',
+  name: 'Agent Inspector',
+  description: 'Visualizes agent tool-call logs as a filterable timeline. Auto-activates on .mindos/agent-audit-log.json and supports legacy .agent-log.json.',
+  author: 'MindOS',
+  icon: '🔍',
+  tags: ['agent', 'inspector', 'log', 'mcp', 'tools'],
+  builtin: true,
+  core: true,
+  appBuiltinFeature: true,
+  entryPath: '.mindos/agent-audit-log.json',
+  match: ({ filePath }) => /(^|\/)\.mindos\/agent-audit-log\.json$/i.test(filePath) || /\.agent-log\.json$/i.test(filePath),
+  load: () => import('./AgentInspectorRenderer').then(m => ({ default: m.AgentInspectorRenderer })),
+};