MaxFiles issue

[cannontechnology]

Describe the bug
Setting the following 2 props should result in replacing a single file, however it produces an error every other time. Also not crazy about the end-user experience of showing the files over the maxFile limit with errors on each. It should just replace the files up to the maxFiles size. (I have a workaround for both of these issues in the comment below).
maxFiles={1}
behaviour="replace"

To Reproduce
Steps to reproduce the behavior:

1. Go to https://codesandbox.io/s/dropzone-ui-complete-forked-4wempi
2. Drop a single image multiple times. Every other drop will produce a max files error

Expected behavior
No error should happen for a single file dropped multiple times.

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

• OS: [e.g. iOS]
• Browser [e.g. chrome, safari]
• Version [e.g. 22]

Smartphone (please complete the following information):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

Additional context
Add any other context about the problem here.

[cannontechnology]

Here is a workaround that I came up with that solves this issue and also will only set as many files that are set in the maxFiles prop.

const handleDrop = (incommingFiles) => { //TODO: remove workaround once issue is fixed in dropzone-ui/react //This will set the incoming files to the last X files (X = maxFiles prop) if (incommingFiles.length > props.maxFiles) { incommingFiles.splice(0,(incommingFiles.length-props.maxFiles)); } //TODO: remove workaround once issue is fixed in dropzone-ui/react //This will remove the bogus "Max amount" errors in the remaining files error array incommingFiles.map((file)=>{ file.errors = file.errors.filter((x) => ! x.startsWith("Max amount of files (")); file.valid = file.errors.length == 0; }) setFiles(incommingFiles); };

[JinSSJ3]

Hey there @cannontechnology . Thanks for notifying us about this issue.

We've just solved the problem in a new version of 🚀 @dropzone-ui/react (V.6.7.10). Please give it a try and let us know if there is something missing in order to fix the issue.

Thanks in advance.

[cannontechnology]

Hi @JinSSJ3 - Thanks for the quick reply but the issue is showing files over the max. See the attached images.

[JinSSJ3]

Hey @cannontechnology !

Thanks for the capture.
At this moment that is the expected behaviour, all files are shown to the user and they can remove then individually or all together by clicking the "clean" icon next to the "delete" icon on the right part of dropzone header. It is true that it would be better if <Dropzone/> component automatically removed all "non valid" files .
Sorry for the inconveninence, but checking our backlog we realized that this feature was already planned to implement. Once we 🚀 add it, we will notify you! ✉️

Thanks in advance.

[cannontechnology]

Thanks again @JinSSJ3. Understood regarding the backlog and appreciate the update. One other thing with the current functionality. If you really wanted that 6th file in my sample above and go to remove the 1st valid file. The 6th (now 5th of 5) file will still have the max files error.