import { DropzoneOptions, useDropzone } from 'react-dropzone';
// import { toast } from 'react-hot-toast';

const useImageUpload = (
  options?: Partial<DropzoneOptions>,
  onDrop?: (files: File[]) => void,
) => {
  const { getRootProps, getInputProps, isDragActive } = useDropzone({
    accept: {
      'image/*': ['.jpeg', '.png'],
      'video/mp4': ['.mp4', '.MP4'],
    },
    multiple: false,
    onDrop: onDrop
      ? onDrop
      : acceptedFiles => {
          // if (acceptedFiles.length > 10) {
          // 	toast('You can only upload 10 images max.', {
          // 		icon: '⚠️',
          // 	});
          // }
          acceptedFiles.forEach(file => {
            try {
              const reader = new FileReader();
              reader.onloadend = () => {};
              reader.readAsDataURL(file);
            } catch (err) {
              console.error(err);
            }
          });
        },
    ...options,
  });

  return { getRootProps, getInputProps, isDragActive };
};

export default useImageUpload;