@geminilight/mindos 0.6.73 → 0.6.74

package/_standalone/components/panels/SearchPanel.tsx

@@ -1,283 +0,0 @@
-'use client';
-
-import { useState, useEffect, useCallback, useRef, useMemo } from 'react';
-import { useRouter } from 'next/navigation';
-import { Search, X, FileText, Table, ChevronRight } from 'lucide-react';
-import { SearchResult } from '@/lib/types';
-import { encodePath } from '@/lib/utils';
-import { apiFetch } from '@/lib/api';
-import { useLocale } from '@/lib/stores/locale-store';
-import PanelHeader from './PanelHeader';
-import { Virtuoso } from 'react-virtuoso';
-
-/** Highlight matched text fragments in a snippet based on the query */
-function highlightSnippet(snippet: string, query: string): React.ReactNode {
-  if (!query.trim()) return snippet;
-  const words = query.trim().split(/\s+/).filter(Boolean);
-  const escaped = words.map(w => w.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'));
-  const pattern = new RegExp(`(${escaped.join('|')})`, 'gi');
-  const parts = snippet.split(pattern);
-  return parts.map((part, i) =>
-    pattern.test(part) ? <mark key={i} className="bg-[var(--amber)]/25 text-foreground rounded-sm px-0.5">{part}</mark> : part
-  );
-}
-
-/** Format file path as breadcrumb for cleaner display */
-function formatPath(fullPath: string): { name: string; breadcrumb: string[] } {
-  const parts = fullPath.split('/').filter(Boolean);
-  const name = parts[parts.length - 1];
-  const breadcrumb = parts.slice(0, -1);
-  return { name, breadcrumb };
-}
-
-interface SearchPanelProps {
-  /** When true the panel is visible — triggers focus & reset */
-  active: boolean;
-  /** Called when user navigates to a result (panel host may want to close) */
-  onNavigate?: () => void;
-  maximized?: boolean;
-  onMaximize?: () => void;
-}
-
-export default function SearchPanel({ active, onNavigate, maximized, onMaximize }: SearchPanelProps) {
-  const [query, setQuery] = useState('');
-  const [results, setResults] = useState<SearchResult[]>([]);
-  const [loading, setLoading] = useState(false);
-  const [selectedIndex, setSelectedIndex] = useState(0);
-  const [draggedIndex, setDraggedIndex] = useState<number | null>(null);
-  const inputRef = useRef<HTMLInputElement>(null);
-  const router = useRouter();
-  const debounceTimer = useRef<ReturnType<typeof setTimeout> | null>(null);
-  const { t } = useLocale();
-
-  // Focus input when panel becomes active
-  useEffect(() => {
-    if (active) {
-      setTimeout(() => inputRef.current?.focus(), 50);
-    }
-  }, [active]);
-
-  // Debounced search
-  const doSearch = useCallback((q: string) => {
-    if (debounceTimer.current) clearTimeout(debounceTimer.current);
-    if (!q.trim()) {
-      setResults([]);
-      setLoading(false);
-      return;
-    }
-    setLoading(true);
-    debounceTimer.current = setTimeout(async () => {
-      try {
-        const data = await apiFetch<SearchResult[]>(`/api/search?q=${encodeURIComponent(q)}`);
-        setResults(Array.isArray(data) ? data : []);
-        setSelectedIndex(0);
-      } catch {
-        setResults([]);
-      } finally {
-        setLoading(false);
-      }
-    }, 300);
-  }, []);
-
-  const handleChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
-    const val = e.target.value;
-    setQuery(val);
-    doSearch(val);
-  }, [doSearch]);
-
-  const navigate = useCallback((result: SearchResult) => {
-    router.push(`/view/${encodePath(result.path)}`);
-    onNavigate?.();
-  }, [router, onNavigate]);
-
-  // Keyboard navigation within the panel
-  const handleKeyDown = useCallback((e: React.KeyboardEvent) => {
-    if (e.key === 'ArrowDown') {
-      e.preventDefault();
-      setSelectedIndex(i => Math.min(i + 1, results.length - 1));
-    } else if (e.key === 'ArrowUp') {
-      e.preventDefault();
-      setSelectedIndex(i => Math.max(i - 1, 0));
-    } else if (e.key === 'Enter') {
-      if (results[selectedIndex]) navigate(results[selectedIndex]);
-    }
-  }, [results, selectedIndex, navigate]);
-
-  // Drag and drop handlers
-  const handleDragStart = useCallback((e: React.DragEvent<HTMLButtonElement>, result: SearchResult) => {
-    e.dataTransfer.effectAllowed = 'copy';
-    // Use the same data format as MindOS knowledge base drag-drop
-    e.dataTransfer.setData('text/mindos-path', result.path);
-    e.dataTransfer.setData('text/mindos-type', 'file');
-    const dragImg = new Image();
-    e.dataTransfer.setDragImage(dragImg, 0, 0);
-  }, []);
-
-  const handleDragEnd = useCallback(() => {
-    setDraggedIndex(null);
-  }, []);
-
-  return (
-    <>
-      {/* Header */}
-      <PanelHeader title="Search" maximized={maximized} onMaximize={onMaximize} />
-
-      {/* Search input */}
-      <div className="flex items-center gap-3 px-4 py-3 border-b border-border shrink-0 overflow-hidden">
-        <Search size={16} className="text-muted-foreground shrink-0 flex-none" />
-        <input
-          ref={inputRef}
-          type="text"
-          value={query}
-          onChange={handleChange}
-          onKeyDown={handleKeyDown}
-          placeholder={t.search.placeholder}
-          aria-label={t.search.placeholder}
-          className="flex-1 min-w-0 bg-transparent text-foreground text-base font-medium placeholder:text-muted-foreground/60 outline-none"
-        />
-        {loading && (
-          <div className="w-4 h-4 border-2 border-muted-foreground/30 border-t-foreground rounded-full animate-spin shrink-0 flex-none" />
-        )}
-        {!loading && query && (
-          <button
-            onClick={() => { setQuery(''); setResults([]); inputRef.current?.focus(); }}
-            className="shrink-0 flex-none p-1 text-muted-foreground hover:text-foreground transition-colors"
-            aria-label={t.search.clear}
-          >
-            <X size={16} />
-          </button>
-        )}
-      </div>
-
-      {/* Results */}
-      <div className="flex-1 overflow-y-auto min-h-0" role="listbox" aria-label="Search results">
-        {/* Empty state with prompt */}
-        {results.length === 0 && !query && !loading && (
-          <div className="flex flex-col items-center justify-center px-4 py-12 text-center">
-            <div className="flex items-center justify-center w-12 h-12 rounded-lg bg-muted mb-4">
-              <Search size={20} className="text-muted-foreground/60" />
-            </div>
-            <h3 className="text-sm font-medium text-foreground mb-1">{t.search.emptyTitle}</h3>
-            <p className="text-xs text-muted-foreground/70">
-              {t.search.emptyHint}
-            </p>
-          </div>
-        )}
-
-        {/* No results state */}
-        {results.length === 0 && query && !loading && (
-          <div className="flex flex-col items-center justify-center px-4 py-12 text-center">
-            <div className="flex items-center justify-center w-12 h-12 rounded-lg bg-muted mb-4">
-              <Search size={20} className="text-muted-foreground/60" />
-            </div>
-            <h3 className="text-sm font-medium text-foreground mb-1">{t.search.noResults}</h3>
-            <p className="text-xs text-muted-foreground/70">
-              {t.search.noResultsHint}
-            </p>
-          </div>
-        )}
-
-        {/* Loading skeleton cards */}
-        {loading && results.length === 0 && (
-          <div className="space-y-2 p-3">
-            {[1, 2, 3].map(i => (
-              <div key={i} className="px-3 py-2.5 space-y-2 animate-pulse">
-                <div className="h-4 bg-muted rounded-md w-3/4" />
-                <div className="h-3 bg-muted rounded-md w-1/2" />
-                <div className="h-3 bg-muted rounded-md w-2/3" />
-              </div>
-            ))}
-          </div>
-        )}
-
-        {/* Results list */}
-        {results.length > 0 && (
-          <Virtuoso
-            totalCount={results.length}
-            overscan={100}
-            itemContent={(i) => {
-              const result = results[i];
-              const ext = result.path.endsWith('.csv') ? '.csv' : '.md';
-              const { name, breadcrumb } = formatPath(result.path);
-              const isSelected = i === selectedIndex;
-              const isDragging = i === draggedIndex;
-
-              return (
-                <button
-                  role="option"
-                  aria-selected={isSelected}
-                  draggable
-                  onDragStart={(e) => handleDragStart(e, result)}
-                  onDragEnd={handleDragEnd}
-                  onDragEnter={() => setDraggedIndex(i)}
-                  onDragLeave={() => setDraggedIndex(null)}
-                  onClick={() => navigate(result)}
-                  onMouseEnter={() => setSelectedIndex(i)}
-                  className={`
-                    w-full px-3 py-2.5 flex items-start gap-3 text-left transition-colors duration-100
-                    border-b border-border/50
-                    ${isSelected ? 'bg-[var(--amber-dim)] border-l-2 border-[var(--amber)]' : 'border-l-2 border-transparent'}
-                    ${isDragging ? 'bg-muted/70' : isSelected ? '' : 'hover:bg-muted/60'}
-                  `}
-                >
-                  {/* File icon */}
-                  <div className="shrink-0 flex-none mt-0.5">
-                    {ext === '.csv'
-                      ? <Table size={14} className="text-success" />
-                      : <FileText size={14} className="text-muted-foreground" />
-                    }
-                  </div>
-
-                  {/* Content */}
-                  <div className="min-w-0 flex-1">
-                    {/* File name - elevated */}
-                    <div className="text-sm font-semibold text-foreground truncate" title={name}>
-                      {name}
-                    </div>
-
-                    {/* Breadcrumb path - muted */}
-                    {breadcrumb.length > 0 && (
-                      <div className="flex items-center gap-1 mt-0.5 text-xs text-muted-foreground/70 truncate">
-                        {breadcrumb.map((part, idx) => (
-                          <span key={idx} className="flex items-center gap-1">
-                            {idx > 0 && <ChevronRight size={10} className="shrink-0 flex-none" />}
-                            <span className="truncate">{part}</span>
-                          </span>
-                        ))}
-                      </div>
-                    )}
-
-                    {/* Content snippet - muted and small */}
-                    {result.snippet && (
-                      <p className="text-xs text-muted-foreground mt-1 line-clamp-2 leading-relaxed" title={result.snippet}>
-                        {highlightSnippet(result.snippet, query)}
-                      </p>
-                    )}
-                  </div>
-
-                  {/* Drag hint */}
-                  {isSelected && !isDragging && (
-                    <div className="shrink-0 flex-none text-[10px] text-muted-foreground/50 font-mono pt-0.5">
-                      ⬆ Drag
-                    </div>
-                  )}
-                </button>
-              );
-            }}
-
-          />
-        )}
-      </div>
-
-      {/* Footer hints */}
-      {results.length > 0 && (
-        <div className="px-3 py-2 border-t border-border/50 flex items-center gap-2 text-xs text-muted-foreground/60 shrink-0">
-          <span><kbd className="font-mono text-[10px] px-1 py-0.5 bg-muted/40 rounded">↑↓</kbd> {t.search.navigate}</span>
-          <span><kbd className="font-mono text-[10px] px-1 py-0.5 bg-muted/40 rounded">↵</kbd> {t.search.open}</span>
-          <span className="text-muted-foreground/40 mx-0.5">•</span>
-          <span><kbd className="font-mono text-[10px] px-1 py-0.5 bg-muted/40 rounded">Drag</kbd> {t.search.dragToChat}</span>
-        </div>
-      )}
-    </>
-  );
-}

package/_standalone/components/panels/SyncPopover.tsx

@@ -1,105 +0,0 @@
-'use client';
-
-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/types';
-import { PrimaryButton } from '../settings/Primitives';
-
-interface SyncPopoverProps {
-  open: boolean;
-  onClose: () => void;
-  anchorRect: DOMRect | null;
-  railWidth: number;
-  onOpenSyncSettings: () => void;
-  syncStatus: SyncStatus | null;
-  onSyncStatusRefresh: () => Promise<void>;
-}
-
-export default function SyncPopover({ open, onClose, anchorRect, railWidth, onOpenSyncSettings, syncStatus, onSyncStatusRefresh }: SyncPopoverProps) {
-  const ref = useRef<HTMLDivElement>(null);
-  const onCloseRef = useRef(onClose);
-  onCloseRef.current = onClose;
-  const { syncing, syncResult, syncNow } = useSyncAction(onSyncStatusRefresh);
-
-  // Close on ESC
-  useEffect(() => {
-    if (!open) return;
-    const handler = (e: KeyboardEvent) => {
-      if (e.key === 'Escape') { e.preventDefault(); e.stopPropagation(); onCloseRef.current(); }
-    };
-    window.addEventListener('keydown', handler);
-    return () => window.removeEventListener('keydown', handler);
-  }, [open]);
-
-  // Close on click outside
-  useEffect(() => {
-    if (!open) return;
-    const handler = (e: MouseEvent) => {
-      if (ref.current && !ref.current.contains(e.target as Node)) onCloseRef.current();
-    };
-    const id = setTimeout(() => window.addEventListener('mousedown', handler), 0);
-    return () => { clearTimeout(id); window.removeEventListener('mousedown', handler); };
-  }, [open]);
-
-  if (!open || !anchorRect) return null;
-
-  const level = getStatusLevel(syncStatus, syncing);
-  const { label: statusText } = getSyncLabel(level, syncStatus);
-
-  // Position: anchor near the button, avoid going off-screen top
-  const popoverTop = Math.max(8, anchorRect.bottom - 180);
-
-  return (
-    <div
-      ref={ref}
-      className="fixed z-40 w-[240px] border rounded-lg bg-card shadow-lg border-border animate-in fade-in slide-in-from-left-2 duration-150"
-      style={{
-        top: popoverTop,
-        left: railWidth,
-      }}
-    >
-      <div className="flex items-center justify-between px-3 py-2 border-b border-border">
-        <span className="text-xs font-medium text-muted-foreground uppercase tracking-wider">Sync</span>
-        <button
-          onClick={onClose}
-          className="p-0.5 rounded hover:bg-muted text-muted-foreground hover:text-foreground transition-colors focus-visible:ring-2 focus-visible:ring-ring"
-          aria-label="Close"
-        >
-          <X size={14} />
-        </button>
-      </div>
-      <div className="p-3 space-y-3">
-        {/* Status */}
-        <div className="flex items-center gap-2">
-          <span className={`w-2.5 h-2.5 rounded-full shrink-0 ${DOT_COLORS[level]} ${
-            level === 'syncing' || level === 'conflicts' || level === 'error' ? 'animate-pulse' : ''
-          }`} />
-          <span className="text-sm text-foreground">{statusText}</span>
-          {syncResult === 'success' && <CheckCircle2 size={14} className="text-success shrink-0" />}
-          {syncResult === 'error' && <XCircle size={14} className="text-error shrink-0" />}
-        </div>
-
-        {/* Actions */}
-        <div className="flex items-center gap-2">
-          {level !== 'off' && (
-            <PrimaryButton
-              onClick={syncNow}
-              disabled={syncing}
-              className="text-xs px-3 py-1.5 flex items-center gap-1.5"
-            >
-              <RefreshCw size={12} className={syncing ? 'animate-spin' : ''} />
-              Sync Now
-            </PrimaryButton>
-          )}
-          <button
-            onClick={() => { onOpenSyncSettings(); onClose(); }}
-            className="text-xs text-muted-foreground hover:text-foreground transition-colors rounded px-1 py-0.5 focus-visible:ring-2 focus-visible:ring-ring"
-          >
-            Settings →
-          </button>
-        </div>
-      </div>
-    </div>
-  );
-}

package/_standalone/components/panels/WorkflowsPanel.tsx

@@ -1,206 +0,0 @@
-'use client';
-
-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/stores/locale-store';
-import { encodePath, relativeTime } from '@/lib/utils';
-
-interface WorkflowItem {
-  path: string;
-  fileName: string;
-  title: string;
-  description?: string;
-  stepCount: number;
-  mtime: number;
-  error?: string;
-}
-
-interface WorkflowsPanelProps {
-  active: boolean;
-  maximized?: boolean;
-  onMaximize?: () => void;
-}
-
-export default function WorkflowsPanel({ active, maximized, onMaximize }: WorkflowsPanelProps) {
-  const { t } = useLocale();
-  const wt = t.panels.workflows as {
-    title: string;
-    empty: string;
-    emptyDesc: string;
-    newWorkflow: string;
-    nSteps: (n: number) => string;
-    parseError: string;
-    name: string;
-    namePlaceholder: string;
-    template: string;
-    templateBlank: string;
-    create: string;
-    cancel: string;
-    creating: string;
-    exists: string;
-  };
-
-  const [workflows, setWorkflows] = useState<WorkflowItem[]>([]);
-  const [loading, setLoading] = useState(true);
-  const [showCreate, setShowCreate] = useState(false);
-  const [newName, setNewName] = useState('');
-  const [creating, setCreating] = useState(false);
-  const [createError, setCreateError] = useState('');
-
-  const fetchWorkflows = useCallback(async () => {
-    try {
-      const res = await fetch('/api/workflows');
-      if (!res.ok) return;
-      const data = await res.json();
-      setWorkflows(data.workflows ?? []);
-    } catch {
-      // silent
-    } finally {
-      setLoading(false);
-    }
-  }, []);
-
-  useEffect(() => {
-    if (active) fetchWorkflows();
-  }, [active, fetchWorkflows]);
-
-  const handleCreate = async () => {
-    const name = newName.trim();
-    if (!name || creating) return;
-    setCreating(true);
-    setCreateError('');
-
-    try {
-      const res = await fetch('/api/workflows', {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ name }),
-      });
-      const data = await res.json();
-      if (!res.ok) {
-        setCreateError(res.status === 409 ? wt.exists : (data.error || 'Error'));
-        return;
-      }
-      // Refresh list and navigate to new file
-      setShowCreate(false);
-      setNewName('');
-      await fetchWorkflows();
-      window.location.href = `/view/${encodePath(data.path)}`;
-    } catch {
-      setCreateError('Network error');
-    } finally {
-      setCreating(false);
-    }
-  };
-
-  return (
-    <div className={`flex flex-col h-full ${active ? '' : 'hidden'}`}>
-      <PanelHeader title={wt.title} maximized={maximized} onMaximize={onMaximize}>
-        <button
-          onClick={() => setShowCreate(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={wt.newWorkflow}
-          title={wt.newWorkflow}
-        >
-          <Plus size={13} />
-        </button>
-      </PanelHeader>
-
-      <div className="flex-1 overflow-y-auto min-h-0">
-        {/* Create form */}
-        {showCreate && (
-          <div className="px-3 py-3 border-b border-border">
-            <label className="block text-xs font-medium text-muted-foreground mb-1.5">{wt.name}</label>
-            <input
-              type="text"
-              value={newName}
-              onChange={e => { setNewName(e.target.value); setCreateError(''); }}
-              onKeyDown={e => e.key === 'Enter' && handleCreate()}
-              placeholder={wt.namePlaceholder}
-              autoFocus
-              className="w-full px-2.5 py-1.5 text-sm rounded-md border border-border bg-background text-foreground placeholder:text-muted-foreground focus:outline-none focus-visible:ring-1 focus-visible:ring-ring"
-            />
-            {createError && (
-              <p className="text-xs text-[var(--error)] mt-1">{createError}</p>
-            )}
-            <div className="flex gap-2 mt-2.5">
-              <button
-                onClick={() => { setShowCreate(false); setNewName(''); setCreateError(''); }}
-                className="flex-1 px-3 py-1.5 text-xs rounded-md border border-border text-muted-foreground hover:bg-muted transition-colors"
-              >
-                {wt.cancel}
-              </button>
-              <button
-                onClick={handleCreate}
-                disabled={!newName.trim() || creating}
-                className="flex-1 px-3 py-1.5 text-xs rounded-md font-medium transition-colors disabled:opacity-50 bg-[var(--amber)] text-[var(--amber-foreground)]"
-              >
-                {creating ? wt.creating : wt.create}
-              </button>
-            </div>
-          </div>
-        )}
-
-        {/* Loading */}
-        {loading && (
-          <div className="flex items-center justify-center py-8 text-muted-foreground">
-            <Loader2 size={16} className="animate-spin" />
-          </div>
-        )}
-
-        {/* Empty state */}
-        {!loading && workflows.length === 0 && !showCreate && (
-          <div className="flex flex-col items-center justify-center py-10 px-4 text-center">
-            <Zap size={24} className="text-muted-foreground/40 mb-3" />
-            <p className="text-sm font-medium text-muted-foreground mb-1">{wt.empty}</p>
-            <p className="text-xs text-muted-foreground/70 mb-4 max-w-[200px]">{wt.emptyDesc}</p>
-            <button
-              onClick={() => setShowCreate(true)}
-              className="inline-flex items-center gap-1.5 px-3 py-1.5 text-xs rounded-md font-medium bg-[var(--amber)] text-[var(--amber-foreground)] transition-colors"
-            >
-              <Plus size={12} />
-              {wt.newWorkflow}
-            </button>
-          </div>
-        )}
-
-        {/* Workflow list */}
-        {!loading && workflows.length > 0 && (
-          <div className="flex flex-col gap-0.5 py-1.5">
-            {workflows.map(w => (
-              <Link
-                key={w.path}
-                href={`/view/${encodePath(w.path)}`}
-                className={`flex items-start gap-2.5 px-3 py-2 mx-1 rounded-lg transition-colors hover:bg-muted ${
-                  w.error ? 'opacity-70' : ''
-                }`}
-              >
-                <Zap size={14} className="shrink-0 mt-0.5 text-[var(--amber)]" />
-                <div className="min-w-0 flex-1">
-                  <span className="text-sm font-medium text-foreground block truncate">{w.title}</span>
-                  <div className="flex items-center gap-2 mt-0.5">
-                    {w.error ? (
-                      <span className="inline-flex items-center gap-1 text-2xs text-[var(--error)]">
-                        <AlertTriangle size={10} />
-                        {wt.parseError}
-                      </span>
-                    ) : (
-                      <span className="text-2xs text-muted-foreground">
-                        {wt.nSteps(w.stepCount)}
-                      </span>
-                    )}
-                    <span className="text-2xs text-muted-foreground/60" suppressHydrationWarning>
-                      {relativeTime(w.mtime, t.home?.relativeTime)}
-                    </span>
-                  </div>
-                </div>
-              </Link>
-            ))}
-          </div>
-        )}
-      </div>
-    </div>
-  );
-}

package/_standalone/components/panels/agents-panel-resolve-status.ts

@@ -1,13 +0,0 @@
-export type AgentsPanelAgentDetailStatus = 'connected' | 'detected' | 'notFound';
-
-export function resolveAgentDetailStatus(
-  key: string,
-  connected: { key: string }[],
-  detected: { key: string }[],
-  notFound: { key: string }[],
-): AgentsPanelAgentDetailStatus | null {
-  if (connected.some(a => a.key === key)) return 'connected';
-  if (detected.some(a => a.key === key)) return 'detected';
-  if (notFound.some(a => a.key === key)) return 'notFound';
-  return null;
-}