Yuvaleros/material-ui-dropzone

filesLimit accepts more than 1 files when set to 1 on DropzoneAreaBase

onkelsmo opened this issue · 2 comments

Bug Report

Describe the bug

When i use DropzoneAreaBase and set filesLimit to 1 no limit will be provided.
Also see src/components/DropzoneAreaBase.js in handleDropAccepted

if (filesLimit > 1 && fileObjects.length + acceptedFiles.length > filesLimit) {
    this.setState({
        openSnackBar: true,
        snackbarMessage: getFileLimitExceedMessage(filesLimit),
        snackbarVariant: 'error',
    }, this.notifyAlert);
    return;
}

Steps to reproduce

<DropzoneAreaBase
          filesLimit={1}
          acceptedFiles={['image/*']}
          fileObjects={fileObjects}
          onAdd={newFileObjs => {
            console.log('onAdd', newFileObjs)
            setFileObjects([].concat(fileObjects, newFileObjs))
          }}
          onDelete={deleteFileObj => {
            console.log('onDelete', deleteFileObj)

            let clearedArray = fileObjects.filter(
              element => element.data !== deleteFileObj.data
            )
            setFileObjects(clearedArray)
          }}
        />

Expected behavior

Upload just one image on DropzoneAreaBase

Versions

  • OS: MacOS 10.15.7
  • Browser: chrome, safari
  • @material-ui/core version: 4.9.2
  • material-ui-dropzone version: 3.5.0

<DropzoneAreaBase
          filesLimit={this.props.filesLimit}
          onAdd={ newFileObjs => {
              this.props.filesLimit === 1
                 ? this.setState({ fileObjects: newFileObjs })
                 : this.setState((state, props) => {
                     {
                       fileObjects: state.fileObjects.concat(newFileObjs);
                     }
                   });
             }}          
        />


<DropzoneAreaBase
          filesLimit={this.props.filesLimit}
          onAdd={ newFileObjs => {
              this.props.filesLimit === 1
                 ? this.setState({ fileObjects: newFileObjs })
                 : this.setState((state, props) => {
                     {
                       fileObjects: state.fileObjects.concat(newFileObjs);
                     }
                   });
             }}          
        />

Thanks!