File attachment is taking too much time when using React Drop zone

I am using the react-dropzone library to drag or select files from the browser.

I have the below component to let the user select multiple files. Everything works except that if the user chooses more files let say 2 or more files with size 1 MB, the selection of documents is taking time. If the number of files is more, the more time it takes to selected the user-selected files.
As per my reading of the react-dropzone docs, it processes files as soon as it uploads. So I tried setting autoProcessQueue=’false’.
but no luck.

I just want to let the user select all the files without blocking for 30 or 40 secs after selecting files, and before send to the backend server.
I did the debug and the setSelectedUserFiles() is reached after all the files are processed internally by the DropZone. I am not sure if there is a way to disable it and let it process as part final submission of the form or click on the button.
In case if we can’t achieve the same, is there a way to show the message to the user that files are being attached.
Any help will be appreciated.

Below is my react component

const SelectUserFiles = () => {
  const [userName,setUserName] = userState('TestUser')
  const [selectedUserFiles,setSelectedUserFiles] = userState([])
  const handleUserFileUpload = async (acceptedFiles) => {
      await setSelectedUserFiles(acceptedFiles)
  return (
    <div className='myClass'>Select Files</div>
        onDrop={acceptedFiles => handleUserFileUpload(acceptedFiles)}
    //logic to send the files to backend axios with the files selectedUserFiles 

49 thoughts on “File attachment is taking too much time when using React Drop zone”

  1. 933413 613165The subsequent time I read a weblog, I hope that it doesnt disappoint me as a whole lot as this 1. I mean, I know it was my option to read, but I truly thought youd have something attention-grabbing to say. All I hear can be a bunch of whining about something which you possibly can repair need to you werent too busy on the lookout for attention. 755739