fris-fruitig / react-firebase-file-uploader

An image uploader for react that uploads images to your firebase storage
https://npm.im/react-firebase-file-uploader
166 stars 45 forks source link

Old reference of onProgress & onUploadSuccess are called #51

Closed knxlab closed 3 years ago

knxlab commented 3 years ago

When used within a functionnal component, onProgress and on OnUploadSuccess are called with old reference of the functions.

For example :

const MyComponent = () => {
    const [ currentFileProgress, setCurrentFileProgress ] = useState(0);

    return (
        <FileUploader
            accept="*/*"
            storageRef={myStorageRef}
            onUploadStart={() => {}}
            onUploadError={() => {}}
            onUploadSuccess={() => {
                console.log("currentFileProgress", currentFileProgress);
                // THIS WILL DISPLAY '0'
            }}
            onProgress={progress => setCurrentFileProgress(progress)}
        />
    )
}

This is because onUploadSuccess and onProgress are being called inside the callback of a firebase task

The task is running, so if the component has new props, onUploadSuccess and onProgress wont be updated

sprmn commented 3 years ago

@knxlab Thank you for submitting the fix!