How to show previous uploaded files when dashboard is opened again in a React app?

In my React app users can select some image (s) with the Uppy drag and drop and dashboard plugins:

And then close the image selection modal, choose some image options and if they want to select more image (s) files before upload they can open the modal again, the previous selected images are stored in a useRef and it contains the successfully, failed, etc, properties that I get in the event listener:

uppy.on('complete', files => {
        data.current.files = files

How can I get the images from the data.current.files.successfully reference and set then back when the user open the modal again, in a way that I can skip the “Drop files here” step and show the dashboard with the list of previous uploaded files?

I tried the options here but it didn’t work.

Here is the entire component:

const SelectImage = ({ data }) => {
    const uppy = new Uppy({
        id: 'uppy',
        autoProceed: true,
        restrictions: {
            // maxFileSize: 10mb
            maxFileSize: 10485760,
            // minFileSize: null,
            // maxTotalFileSize: 100mb
            maxTotalFileSize: 104857600,
            maxNumberOfFiles: 1000,
            // minNumberOfFiles: null,
            allowedFileTypes: ['.jpg', '.jpeg', '.png']
        .use(DropTarget, { id: 'DropTarget', target: document.body })
        .use(Compressor, { id: 'Compressor' })

    uppy.on('complete', files => {
        data.current.files = files

    return (


What you are referring to I think is a “Media library”, which can show all files of a user across multiple sessions. This is on the backlog but not prioritized at the moment. If you want to show files that were previously added in the same session, make sure to not unmount the dashboard.