import * as React from 'react';
import { useCallback } from 'react';
import { useDropzone } from 'react-dropzone';
import { getFileHash, getChunk } from './utils';

export interface AppProps {
  uploadFiles: (files: File[]) => void;
}

const App: React.FC<AppProps> = props => {
  const onDrop = useCallback((files: File[]) => {
    props.uploadFiles(files);
  }, []);

  const { getRootProps, getInputProps } = useDropzone({ onDrop });
  return (
    <div {...getRootProps()}>
      <input type="file" style={{ display: 'none' }} {...getInputProps()} />
      {props.children}
    </div>
  );
};

export default App;

export { getFileHash, getChunk };