import { cn } from '@/lib/utils';
import { useFileUpload } from './useFileUpload';
import { FileUploadDropzone } from './FileUploadDropzone';
import { FileUploadErrorList } from './FileUploadErrorList';
import { FileUploadFileList } from './FileUploadFileList';
import type { FileUploadProps } from './types';

/**
 * FileUpload - Composant d'upload de fichiers avec drag & drop et preview
 */
export function FileUpload({
  className,
  ...props
}: FileUploadProps) {
  const {
    dragActive,
    files,
    errors,
    fileInputRef,
    accept,
    multiple,
    maxSize,
    showPreview,
    disabled,
    handleDrag,
    handleDrop,
    handleFileInput,
    handleRemoveFile,
    handleClick,
  } = useFileUpload(props);

  return (
    <div className={cn('w-full', className)}>
      <FileUploadDropzone
        dragActive={dragActive}
        disabled={disabled}
        accept={accept}
        multiple={multiple}
        maxSize={maxSize}
        onDragEnter={handleDrag}
        onDragLeave={handleDrag}
        onDragOver={handleDrag}
        onDrop={handleDrop}
        onClick={handleClick}
      />
      <input
        ref={fileInputRef}
        type="file"
        accept={accept}
        multiple={multiple}
        onChange={handleFileInput}
        disabled={disabled}
        className="hidden"
      />
      <FileUploadErrorList errors={errors} />
      {showPreview && (
        <FileUploadFileList files={files} onRemove={handleRemoveFile} />
      )}
    </div>
  );
}