@geminilight/mindos 0.6.7 → 0.6.12

package/app/components/ImportModal.tsx

@@ -2,12 +2,12 @@
 
 import { useEffect, useRef, useState, useCallback } from 'react';
 import {
-  X, FolderInput, Sparkles, FileText, AlertCircle,
-  AlertTriangle, Loader2, Check, ArrowLeft,
+  X, FolderInput, FolderOpen, Sparkles, FileText, AlertCircle,
+  AlertTriangle, Loader2, Check, ChevronDown,
 } from 'lucide-react';
 import { useLocale } from '@/lib/LocaleContext';
 import { useFileImport, type ImportIntent, type ConflictMode } from '@/hooks/useFileImport';
-import { openAskModal } from '@/hooks/useAskModal';
+import type { useAiOrganize } from '@/hooks/useAiOrganize';
 import { ALLOWED_IMPORT_EXTENSIONS } from '@/lib/core/file-convert';
 import type { LocalAttachment } from '@/lib/types';
 
@@ -16,11 +16,14 @@ interface ImportModalProps {
   onClose: () => void;
   defaultSpace?: string;
   initialFiles?: File[];
+  /** Lifted AI organize hook from SidebarLayout (shared with OrganizeToast) */
+  aiOrganize: ReturnType<typeof useAiOrganize>;
 }
 
 const ACCEPT = Array.from(ALLOWED_IMPORT_EXTENSIONS).join(',');
 
-export default function ImportModal({ open, onClose, defaultSpace, initialFiles }: ImportModalProps) {
+
+export default function ImportModal({ open, onClose, defaultSpace, initialFiles, aiOrganize }: ImportModalProps) {
   const { t } = useLocale();
   const im = useFileImport();
   const overlayRef = useRef<HTMLDivElement>(null);
@@ -28,6 +31,8 @@ export default function ImportModal({ open, onClose, defaultSpace, initialFiles
   const [spaces, setSpaces] = useState<Array<{ name: string; path: string }>>([]);
   const [closing, setClosing] = useState(false);
   const [showSuccess, setShowSuccess] = useState(false);
+  const [conflictFiles, setConflictFiles] = useState<string[]>([]);
+  const [showConflictOptions, setShowConflictOptions] = useState(false);
   const initializedRef = useRef(false);
 
   useEffect(() => {
@@ -38,6 +43,8 @@ export default function ImportModal({ open, onClose, defaultSpace, initialFiles
     if (initializedRef.current) return;
     initializedRef.current = true;
     im.reset();
+    setConflictFiles([]);
+    setShowConflictOptions(false);
     if (defaultSpace) im.setTargetSpace(defaultSpace);
     if (initialFiles && initialFiles.length > 0) {
       im.addFiles(initialFiles);
@@ -53,7 +60,7 @@ export default function ImportModal({ open, onClose, defaultSpace, initialFiles
       if (!confirm(t.fileImport.discardMessage(im.files.length))) return;
     }
     setClosing(true);
-    setTimeout(() => { setClosing(false); onClose(); im.reset(); }, 150);
+    setTimeout(() => { setClosing(false); onClose(); im.reset(); setConflictFiles([]); setShowConflictOptions(false); }, 150);
   }, [im, onClose, t]);
 
   useEffect(() => {
@@ -65,30 +72,40 @@ export default function ImportModal({ open, onClose, defaultSpace, initialFiles
     return () => window.removeEventListener('keydown', handler, true);
   }, [open, handleClose]);
 
+  const checkConflicts = useCallback(async (fileNames: string[], space: string) => {
+    try {
+      const names = fileNames.map(encodeURIComponent).join(',');
+      const spaceParam = space ? `&space=${encodeURIComponent(space)}` : '';
+      const res = await fetch(`/api/file?op=check_conflicts&names=${names}${spaceParam}`);
+      if (res.ok) {
+        const data = await res.json();
+        setConflictFiles(data.conflicts ?? []);
+        setShowConflictOptions((data.conflicts ?? []).length > 0);
+      }
+    } catch { /* best-effort */ }
+  }, []);
+
   const handleIntentSelect = useCallback((intent: ImportIntent) => {
     im.setIntent(intent);
     if (intent === 'archive') {
       im.setStep('archive_config');
+      const names = im.validFiles.map(f => f.name);
+      checkConflicts(names, im.targetSpace);
     } else {
       const attachments: LocalAttachment[] = im.validFiles.map(f => ({
         name: f.name,
         content: f.content!,
       }));
-      setClosing(true);
-      setTimeout(() => {
-        setClosing(false);
-        onClose();
-        window.dispatchEvent(new CustomEvent('mindos:inject-ask-files', {
-          detail: { files: attachments },
-        }));
-        const prompt = attachments.length === 1
-          ? t.fileImport.digestPromptSingle(attachments[0].name)
-          : t.fileImport.digestPromptMulti(attachments.length);
-        openAskModal(prompt);
-        im.reset();
-      }, 150);
+      const space = im.targetSpace || undefined;
+      const prompt = attachments.length === 1
+        ? (t.fileImport.digestPromptSingle as (name: string, space?: string) => string)(attachments[0].name, space)
+        : (t.fileImport.digestPromptMulti as (n: number, space?: string) => string)(attachments.length, space);
+      // Start AI organize and immediately close modal — toast takes over
+      aiOrganize.start(attachments, prompt);
+      onClose();
+      im.reset();
     }
-  }, [im, onClose, t]);
+  }, [im, t, aiOrganize, onClose]);
 
   const handleArchiveSubmit = useCallback(async () => {
     await im.doArchive();
@@ -107,6 +124,15 @@ export default function ImportModal({ open, onClose, defaultSpace, initialFiles
     }
   }, [im, onClose]);
 
+  useEffect(() => {
+    if (im.step === 'archive_config') {
+      const names = im.validFiles.map(f => f.name);
+      checkConflicts(names, im.targetSpace);
+    }
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [im.targetSpace]);
+
+
   useEffect(() => {
     if (im.step === 'done' && im.result) {
       if (im.result.created.length > 0) {
@@ -126,28 +152,28 @@ export default function ImportModal({ open, onClose, defaultSpace, initialFiles
     }
   }, [im.step, im.result, onClose, im]);
 
-  if (!open && !closing) return null;
-
   const hasFiles = im.files.length > 0;
   const isSelectStep = im.step === 'select';
   const isArchiveConfig = im.step === 'archive_config';
   const isImporting = im.step === 'importing';
 
+  if (!open && !closing) return null;
+
   return (
     <>
       <div
         ref={overlayRef}
-        className={`fixed inset-0 z-50 bg-black/60 backdrop-blur-sm flex items-center justify-center p-4 transition-opacity duration-200 ${closing ? 'opacity-0' : 'opacity-100'}`}
+        className={`fixed inset-0 z-50 modal-backdrop flex items-center justify-center p-4 transition-opacity duration-200 ${closing ? 'opacity-0' : 'opacity-100'}`}
         onClick={(e) => { if (e.target === overlayRef.current) handleClose(); }}
       >
         <div
-          className={`w-full max-w-lg bg-card rounded-xl shadow-xl border border-border transition-all duration-200 ${closing ? 'opacity-0 scale-[0.98]' : 'opacity-100 scale-100'}`}
+          className={`w-full max-w-lg max-h-[80vh] flex flex-col bg-card rounded-xl shadow-xl border border-border transition-all duration-200 ${closing ? 'opacity-0 scale-[0.98]' : 'opacity-100 scale-100'}`}
           role="dialog"
           aria-modal="true"
           aria-label={t.fileImport.title}
         >
           {/* Header */}
-          <div className="flex items-start justify-between px-5 pt-5 pb-2">
+          <div className="flex items-start justify-between px-5 pt-5 pb-2 shrink-0">
             <div>
               {isArchiveConfig && (
                 <button
@@ -173,7 +199,7 @@ export default function ImportModal({ open, onClose, defaultSpace, initialFiles
             </button>
           </div>
 
-          <div className="px-5 pb-5">
+          <div className="px-5 pb-5 overflow-y-auto min-h-0">
             {/* DropZone */}
             {isSelectStep && (
               <div
@@ -289,9 +315,14 @@ export default function ImportModal({ open, onClose, defaultSpace, initialFiles
                       const stem = f.name.replace(/\.[^.]+$/, '');
                       const targetName = `${stem}.${targetExt}`;
                       const targetPath = im.targetSpace ? `${im.targetSpace}/${targetName}` : targetName;
+                      const hasConflict = conflictFiles.includes(f.name);
                       return (
-                        <div key={`preview-${idx}`} className="text-xs text-muted-foreground px-3">
-                          {f.name} <span className="text-muted-foreground/50">{t.fileImport.arrowTo}</span> {targetPath}
+                        <div key={`preview-${idx}`} className="flex items-center gap-1.5 text-xs text-muted-foreground px-3">
+                          <span className="truncate">{f.name}</span>
+                          <span className="text-muted-foreground/50 shrink-0">{t.fileImport.arrowTo}</span>
+                          <FolderOpen size={12} className="text-muted-foreground/60 shrink-0" />
+                          <span className={`truncate ${hasConflict ? 'text-[var(--amber)]' : ''}`}>{targetPath}</span>
+                          {hasConflict && <AlertTriangle size={11} className="text-[var(--amber)] shrink-0" />}
                         </div>
                       );
                     })}
@@ -315,7 +346,7 @@ export default function ImportModal({ open, onClose, defaultSpace, initialFiles
                 <button
                   onClick={() => handleIntentSelect('digest')}
                   className="flex flex-col items-center gap-2 p-4 border border-border rounded-lg cursor-pointer transition-all duration-150 bg-card hover:border-[var(--amber)]/50 hover:shadow-sm active:scale-[0.98] text-left"
-                  disabled={im.validFiles.length === 0}
+                  disabled={im.validFiles.length === 0 || aiOrganize.phase === 'organizing'}
                 >
                   <Sparkles size={24} className="text-[var(--amber)]" />
                   <span className="text-sm font-medium text-foreground">{t.fileImport.digestTitle}</span>
@@ -342,46 +373,58 @@ export default function ImportModal({ open, onClose, defaultSpace, initialFiles
                   </select>
                 </div>
 
-                {/* Conflict strategy */}
-                <div>
-                  <label className="text-xs font-medium text-foreground mb-1.5 block">{t.fileImport.conflictLabel}</label>
-                  <div className="flex flex-col gap-1.5">
-                    {([
-                      { value: 'rename' as ConflictMode, label: t.fileImport.conflictRename },
-                      { value: 'skip' as ConflictMode, label: t.fileImport.conflictSkip },
-                      { value: 'overwrite' as ConflictMode, label: t.fileImport.conflictOverwrite },
-                    ]).map(opt => (
-                      <label
-                        key={opt.value}
-                        className={`flex items-center gap-2 py-1 text-sm cursor-pointer ${
-                          opt.value === 'overwrite' ? 'text-error' : 'text-foreground'
-                        }`}
-                      >
-                        <input
-                          type="radio"
-                          name="conflict"
-                          value={opt.value}
-                          checked={im.conflict === opt.value}
-                          onChange={() => im.setConflict(opt.value)}
-                          className="accent-[var(--amber)]"
-                        />
-                        {opt.label}
-                        {opt.value === 'overwrite' && (
-                          <AlertTriangle size={13} className="text-error shrink-0" />
+                {/* Conflict strategy — progressive disclosure */}
+                {conflictFiles.length > 0 ? (
+                  <div>
+                    <button
+                      type="button"
+                      onClick={() => setShowConflictOptions(v => !v)}
+                      className="flex items-center gap-1.5 text-xs font-medium text-[var(--amber)] hover:opacity-80 transition-colors"
+                    >
+                      <AlertTriangle size={12} className="shrink-0" />
+                      {t.fileImport.conflictsFound(conflictFiles.length)}
+                      <ChevronDown size={12} className={`shrink-0 transition-transform duration-200 ${showConflictOptions ? 'rotate-180' : ''}`} />
+                    </button>
+                    {showConflictOptions && (
+                      <div className="flex flex-col gap-1.5 mt-2 pl-0.5">
+                        {([
+                          { value: 'rename' as ConflictMode, label: t.fileImport.conflictRename },
+                          { value: 'skip' as ConflictMode, label: t.fileImport.conflictSkip },
+                          { value: 'overwrite' as ConflictMode, label: t.fileImport.conflictOverwrite },
+                        ]).map(opt => (
+                          <label
+                            key={opt.value}
+                            className={`flex items-center gap-2 py-0.5 text-xs cursor-pointer ${
+                              opt.value === 'overwrite' ? 'text-error' : 'text-foreground'
+                            }`}
+                          >
+                            <input
+                              type="radio"
+                              name="conflict"
+                              value={opt.value}
+                              checked={im.conflict === opt.value}
+                              onChange={() => im.setConflict(opt.value)}
+                              className="accent-[var(--amber)]"
+                            />
+                            {opt.label}
+                            {opt.value === 'overwrite' && (
+                              <AlertTriangle size={11} className="text-error shrink-0" />
+                            )}
+                          </label>
+                        ))}
+                        {im.conflict === 'overwrite' && (
+                          <p className="text-2xs text-error/80 pl-5">{t.fileImport.overwriteWarn}</p>
                         )}
-                      </label>
-                    ))}
-                    {im.conflict === 'overwrite' && (
-                      <p className="text-2xs text-error/80 pl-6">{t.fileImport.overwriteWarn}</p>
+                      </div>
                     )}
                   </div>
-                </div>
+                ) : null}
 
                 {/* Actions */}
                 <div className="flex items-center justify-end gap-3 pt-2">
                   <button
                     onClick={handleClose}
-                    className="text-sm text-muted-foreground hover:text-foreground transition-colors px-3 py-2"
+                    className="text-xs text-muted-foreground/70 hover:text-muted-foreground transition-colors px-2 py-1.5"
                   >
                     {t.fileImport.cancel}
                   </button>
@@ -407,6 +450,7 @@ export default function ImportModal({ open, onClose, defaultSpace, initialFiles
                 </div>
               </div>
             )}
+
           </div>
         </div>
       </div>

package/app/components/MarkdownView.tsx

@@ -77,6 +77,9 @@ const components: Components = {
       </div>
     );
   },
+  li({ children, ...props }) {
+    return <li {...props} suppressHydrationWarning>{children}</li>;
+  },
   a({ href, children, ...props }) {
     const isExternal = href?.startsWith('http');
     return (

package/app/components/OnboardingView.tsx

@@ -137,7 +137,7 @@ export default function OnboardingView() {
         <button
           type="button"
           onClick={() => window.dispatchEvent(new CustomEvent('mindos:open-import'))}
-          className="text-xs text-[var(--amber)] hover:underline transition-colors"
+          className="text-xs text-[var(--amber-text)] hover:underline transition-colors"
         >
           {t.fileImport.onboardingHint}
         </button>