Add drag and drop file uploads #19086
Conversation
|
|
||
| function RenderDragDrop() { | ||
| const handleChange = (files: FileList) => { | ||
| console.log("files: ", files); |
|
@lukeheath love it! Looks great. Definitely create a story w/ the What happens when you drag multiple valid files in their? What multiple files with one invalid file? I think we can dig into these during drafting. Heads up that the Loom is only capturing your Chrome windows. So we can't see the "drag file from Finder" interaction in the vid. |
|
@noahtalerman Cool! I created a story here, assigned to you, and placed in the "Prioritized" column on the drafting board: #19128 As for file uploads, currently, the UI only supports single file uploads, but it wouldn't be difficult to support multiple files (in both file picker and drag and drop) if we want. |
@lukeheath got it. Hey @marko-lisica, @mike-j-thomas, @rachaelshaw, heads up we filed a story (#19128) to add drag-and-drop. Question: If we also add support for multiple file upload, what do we expect to happen if I drag 3 valid files and 1 invalid file. Do the 3 get uploaded? Do I see success message? Error message? I'm sure there are patterns we can borrow from other apps. |
|
@noahtalerman, (I wasn't sure whether to post this here or in the story (#19128). It's been some time since I've done a drag-and-drop, but I expect it would be something like this:
|
@noahtalerman I had a little time to add drag-and-drop uploads to the UI today. Check out https://www.loom.com/share/ea8e0fa9cefa4a9d8c2d4c1c504a742e for a demo.
It's only applied to one file upload box, but if you think this is worthwhile, I will update the others and put in a proper story for processing.