'DropzoneComponent' does not have any construct or call signatures

[sonydaman]

I am using react typescript getting the following error.

TypeScript error in FileUpload.tsx(99,18):
JSX element type 'DropzoneComponent' does not have any construct or call signatures.  TS2604

  >  99 |                 <DropzoneComponent config={componentConfig}
        |                  ^
    100 |                        eventHandlers={eventHandlers}
    101 |                     djsConfig={djsConfig} />

[binhphan009]

import {DropzoneComponent} from 'react-dropzone-component'

[rogeliotg]

in my case was not following TS interface definition for eventHandlers:DropzoneComponentHandlers, after define type it was clear that the solution is drop nulls or change them by undefined:

var eventHandlers:DropzoneComponentHandlers = {
// This one receives the dropzone object as the first parameter
// and can be used to additional work with the dropzone.js
// object
init: undefined,
// All of these receive the event as first parameter:
drop: undefined,
dragstart: undefined,
dragend: undefined,
dragenter: undefined,
dragover: undefined,
dragleave: undefined,
// All of these receive the file as first parameter:
addedfile: undefined,
//removedfile: undefined,
thumbnail: undefined,
error: undefined,
processing: undefined,
uploadprogress: undefined,
sending: undefined,
//success: undefined,
complete: simpleCallBack,
canceled: undefined,
maxfilesreached: undefined,
maxfilesexceeded: undefined,
// All of these receive a list of files as first parameter
// and are only called if the uploadMultiple option
// in djsConfig is true:
processingmultiple: undefined,
sendingmultiple: undefined,
successmultiple: undefined,
completemultiple: undefined,
canceledmultiple: undefined,
// Special Events
totaluploadprogress: undefined,
reset: undefined,
queuecomplete: undefined,
success: undefined, //(file: any) => {
// Get server response
//const res = JSON.parse(file.xhr.responseText)
//let { media } = this.state
//media = [...media, res.data]
//this.setState({ media }, () => this.props.onUpload(res.data))
//},
removedfile: undefined //(file: any) => {
//let { media } = this.state
//if (media.length > 0) {
// TODO: get current removed media from file
// const removedMedia = this.state.media[0]
//media = media.filter(m => m.id !== removedMedia.id)
//this.setState({ media }, () => this.props.onRemove(removedMedia))
//}
//}

}