panel icon indicating copy to clipboard operation
panel copied to clipboard

Improve experience for Multifile/Folder Upload

Open hoxbro opened this issue 2 months ago • 0 comments

Currently, the FileUpload widget looks like something from the '90s, which is "good enough" for simple cases.

 Screenshot 2024-04-30 14 40 11

A case where one could argue that it could be improved are:

  1. Better feedback for the process of uploading multiple files. This could be a two-step procedure a) Uploading of files to the browser. If we can monitor the process of individual files, I suggest adding a progress bar per file. If not, then we can do one for all files. b) When the files are synchronized to the server. This could be done with a green checkmark for each file or one for all.
  2. The second thing is that it is currently not possible to upload a folder/directory directly. This can solved by enabling the HTML attribute webkitdirectory. I have a POC here. A limitation of this attribute is you will get a warning message (for security reasons).  Screenshot 2024-04-30 14 35 15

The good thing is the files will have information on the folder structure, as shown in this playground example.    Screenshot 2024-04-30 14 35 24

Some inspiration for how a more modern could look:

  • If we want to implement it ourselves [ref]
  • A finished product [filepond]

hoxbro avatar Apr 30 '24 12:04 hoxbro