imported files from google gemini ai BUILD env

2025-11-10 08:28:40 -08:00
parent da3acd3a8a
commit f6ce97019e
114 changed files with 10955 additions and 2 deletions
--- a/components/BulkImporter.tsx
+++ b/components/BulkImporter.tsx
@@ -0,0 +1,77 @@
+import React, { useCallback, useState } from 'react';
+import { UploadIcon } from './icons/UploadIcon';
+
+interface BulkImporterProps {
+  onProcess: (files: FileList) => void;
+  isProcessing: boolean;
+}
+
+export const BulkImporter: React.FC<BulkImporterProps> = ({ onProcess, isProcessing }) => {
+  const [isDragging, setIsDragging] = useState(false);
+
+  const handleFiles = (files: FileList | null) => {
+    if (files && files.length > 0 && !isProcessing) {
+      onProcess(files);
+    }
+  };
+
+  const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    handleFiles(e.target.files);
+    // Reset input value to allow selecting the same file again
+    e.target.value = '';
+  };
+
+  const handleDragEnter = useCallback((e: React.DragEvent<HTMLLabelElement>) => {
+    e.preventDefault();
+    e.stopPropagation();
+    if (!isProcessing) setIsDragging(true);
+  }, [isProcessing]);
+
+  const handleDragLeave = useCallback((e: React.DragEvent<HTMLLabelElement>) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setIsDragging(false);
+  }, []);
+
+  const handleDrop = useCallback((e: React.DragEvent<HTMLLabelElement>) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setIsDragging(false);
+    if (!isProcessing && e.dataTransfer.files) {
+      handleFiles(e.dataTransfer.files);
+    }
+  }, [isProcessing, onProcess]);
+
+  const borderColor = isDragging ? 'border-brand-primary' : 'border-gray-300 dark:border-gray-600';
+  const bgColor = isDragging ? 'bg-brand-light/50 dark:bg-brand-dark/20' : 'bg-gray-50 dark:bg-gray-800';
+
+  return (
+    <div className="flex flex-col items-center justify-center w-full">
+        <label
+            htmlFor="bulk-file-upload"
+            onDragEnter={handleDragEnter}
+            onDragOver={handleDragEnter}
+            onDragLeave={handleDragLeave}
+            onDrop={handleDrop}
+            className={`flex flex-col items-center justify-center w-full h-48 border-2 ${borderColor} border-dashed rounded-lg transition-colors duration-300 ${isProcessing ? 'cursor-not-allowed opacity-60' : 'cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-700'}`}
+        >
+            <div className="flex flex-col items-center justify-center pt-5 pb-6 text-center">
+                <UploadIcon className="w-10 h-10 mb-3 text-gray-400" />
+                {isProcessing ? (
+                     <p className="mb-2 text-sm text-gray-600 dark:text-gray-300 font-semibold">
+                        Processing, please wait...
+                    </p>
+                ) : (
+                    <>
+                        <p className="mb-2 text-sm text-gray-500 dark:text-gray-400">
+                            <span className="font-semibold text-brand-primary">Click to upload</span> or drag and drop
+                        </p>
+                        <p className="text-xs text-gray-500 dark:text-gray-400">PNG, JPG, WEBP, or PDF</p>
+                    </>
+                )}
+            </div>
+            <input id="bulk-file-upload" type="file" className="hidden" accept="image/png, image/jpeg, image/webp, application/pdf" onChange={handleFileChange} disabled={isProcessing} multiple />
+        </label>
+    </div>
+  );
+};