import React, { useState } from "react";
import { FileUploader } from "react-drag-drop-files";


/**
 * https://www.npmjs.com/package/react-drag-drop-files를 참고해주세요.
 * @param {fileTypes} const fileTypes = ["JPG", "PNG", "GIF"]; 
 * @returns 
 */
function FileDragDrop({fileTypes, children, multiple, label, onDrop, handleChange, file, setFile, dropMessageStyle, name, maxSize, disabled}) {

  return (
    <FileUploader
        hoverTitle=" "
        handleChange={handleChange}
        name={name}
        types={fileTypes ? fileTypes : "*"}
        multiple={multiple ? multiple : false}
        label={label}
        onDrop={onDrop}
        dropMessageStyle={dropMessageStyle}
        maxSize={maxSize}
        disabled={disabled}        
        onSelect={(e)=> {
          e = e || window.event;
        }}
    >
        {children && children}
    </FileUploader>
  );
}

export default FileDragDrop;