Delete preview is not working in DropzoneDialogBase.

[sanjays442]

Delete preview is not working in DropzoneDialogBase.

[panz3r]

Hi @sanjays442 ,

Thanks for your feedback, can you provide a bit more context about this issue? can you please share the part of code where you are using DropzoneDialogBase?

[sanjays442]

<DropzoneDialogBase
acceptedFiles={['image/*']}
fileObjects={fileObjects}
cancelButtonText={"cancel"}
submitButtonText={"submit"}
maxFileSize={5000000}
filesLimit="100"
open={open}
onAdd={newFileObjs => {
console.log('onAdd', newFileObjs);
setFileObjects([].concat(fileObjects, newFileObjs));
}}
onDelete={deleteFileObj => {
console.log('onDelete', deleteFileObj);
}}
onClose={() => setOpen(false)}
onSave={() => {
getImages(fileObjects);
setOpen(false);
}}
showPreviews={true}
showFileNamesInPreview={true}
/>

This is my code and also you can check in your reference site https://yuvaleros.github.io/material-ui-dropzone/. It is also not working here.

[panz3r]

Hi @sanjays442 ,

As it is the onDelete is implemented to only log the removed file, to actually remove it from the state you should write the required logic, the simplest implementation would be

onDelete={(deletedFileObj, removedIdx) => {
  console.log('onDelete', deleteFileObj);
  setFileObjects(currentFiles => currentFiles.filter((file, idx) => idx !== removedIdx));
}}

in the sample this logic is not implemented since it depends strictly on your use-case, the implementation I proposed above is a general purpose one but it might not be the right one for you.

[sanjays442]

Thank you worked