feat: revue de code, doc CODE_REVIEW, forfaits 2026, traduction LLM, providers avec modèle

Made-with: Cursor

frontend/src/app/dashboard/translate/FileDropZone.tsx

@@ -0,0 +1,51 @@
+'use client';
+
+import { useRef } from 'react';
+import { Upload } from 'lucide-react';
+import { cn } from '@/lib/utils';
+import type { UseFileUploadReturn } from './types';
+
+interface FileDropZoneProps {
+  upload: UseFileUploadReturn;
+}
+
+export function FileDropZone({ upload }: FileDropZoneProps) {
+  const inputRef = useRef<HTMLInputElement>(null);
+
+  const handleClick = () => {
+    inputRef.current?.click();
+  };
+
+  return (
+    <div
+      className={cn(
+        'relative flex flex-col items-center justify-center gap-3 rounded-lg border-2 border-dashed px-6 py-10 transition-colors cursor-pointer',
+        upload.isDragOver
+          ? 'border-primary bg-primary/5'
+          : 'border-border bg-muted/30 hover:border-muted-foreground/30'
+      )}
+      onDragOver={upload.handleDragOver}
+      onDragLeave={upload.handleDragLeave}
+      onDrop={upload.handleDrop}
+      onClick={handleClick}
+    >
+      <div className="flex size-12 items-center justify-center rounded-xl bg-secondary">
+        <Upload className="size-5 text-muted-foreground" />
+      </div>
+      <div className="flex flex-col items-center gap-1">
+        <p className="text-sm font-medium text-foreground">
+          Drag & drop your .xlsx, .docx, or .pptx file here
+        </p>
+        <p className="text-xs text-muted-foreground">or click to browse</p>
+      </div>
+      <input
+        ref={inputRef}
+        type="file"
+        accept=".xlsx,.docx,.pptx"
+        className="hidden"
+        onChange={upload.handleFileSelect}
+        aria-label="Upload file"
+      />
+    </div>
+  );
+}