Feature request: Enhancements to FileDrop

[ntjess]

Hi there!

After using FileDrop{Multiple} for a few months, a few limitations keep arising that are difficult to patch:

• Reuploads of the same file are ignored, and it is quite difficult to "clear" the state of the FileDrop to listen for reuploads
• Customizing the dropzone appearance is impossible; ideally we can provide our own element from Solara land
• Users can drop files while the previous drop is still uploading, leading to undefined behavior
• Most file uploaders allow dropping or clicking, while FileDrop only allows dropping

I ended up implementing a DropOrInputFile{s} which combines logic from FileDrop and InputFile widgets to resolve all these points:

• Clicking and dropping behaviors are added to a solara activator element passed to the function
• Clicking the widget brings up a file browser
• Much easier to use than InputFile, which doesn't allow custom widgets and complicates the process of reading file data
• Minor improvements like allowing a reupload of the same file name and disabling the widget during upload, though these changes are easily provided as a PR to the existing FileDrop

My question is this: If I were to open source the implementation, would you prefer it as a contrib element in a third-party package, new DropOrInputFile{s} elements within core solara, or a modification of FileDrop/FileDropMultiple?

Source Code for video

@sl.component
def Page():
    DefaultPageStyle()
    text, set_text = sl.use_state(b"")

    def on_file(file: FileInfo):
        set_text(file["file_obj"].read(100))

    with sl.Column(style="width: 350px"):
        DropOrInputFile(on_file=on_file)
        DropOrInputFile(
            sl.Card("Drag onto a custom element", style="background-color: green"),
            on_file=on_file,
        )

    if text:
        sl.HTML("h2", "First 100 bytes of the file:")
        sl.Text(str(text))

Recording.at.2024-09-27.11.19.06.mp4

[maartenbreddels]

Hi Natha,

• Reuploads of the same file are ignored, and it is quite difficult to "clear" the state of the FileDrop to listen for reuploads

Ok, that sounds like a bug. Do you mean the same filename with different content? Can you give an example how to reproduce that?

• Customizing the dropzone appearance is impossible; ideally we can provide our own element from Solara land

Yes, what I'd like to have, is the FileDrop to take optional children, where it would render those, instead of the default implementation. We should then also feed it some kinda of overlay element it should render when the drag over event triggers. What do you think?

• Users can drop files while the previous drop is still uploading, leading to undefined behavior

Another bug, thanks!

Ideally, I'd like to see it go into solara, maybe a new component called FileUpload?

cheers,

Maarten