Add sidebar upload progress toast and optional finish title#8308
Add sidebar upload progress toast and optional finish title#8308xfy0012 wants to merge 4 commits intomarimo-team:mainfrom
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
All contributors have signed the CLA ✍️ ✅ |
|
I have read the CLA Document and I hereby sign the CLA |
for more information, see https://pre-commit.ci
frontend/src/utils/download.ts
Outdated
| if (finishTitle) { | ||
| toast({ title: finishTitle }); | ||
| } |
There was a problem hiding this comment.
instead of creating another toast, you can update the existing toast, toast.update. And maybe set a short timeout so the toast can be seen before dismissed.
There was a problem hiding this comment.
updated this part: I now use loadingToast.update() instead of creating a secod toast, and set a short finish duration (1200ms)
| @@ -40,30 +41,49 @@ export function useFileExplorerUpload(options: DropzoneOptions = {}) { | |||
| }); | |||
| }, | |||
| onDrop: async (acceptedFiles) => { | |||
There was a problem hiding this comment.
just to check, this covers clicking on the upload button on the panel?
There was a problem hiding this comment.
Yes, it covers both click to upload and drag-drop.
frontend/src/utils/download.ts
Outdated
| export async function withLoadingToast<T>( | ||
| title: string, | ||
| fn: (progress: ProgressState) => Promise<T>, | ||
| finishTitle?: string, |
There was a problem hiding this comment.
I wonder if you can do onFinish?: Toast, so it's more flexible how you can call this.
There was a problem hiding this comment.
Yes, updated to onFinish?: ToastConfig (replacing finishTitle?: string) so the finish toast is configurable beyond just the title.
for more information, see https://pre-commit.ci
|
I also noticed a small UX edge case: if a drop includes both accepted and rejected files, users may see a rejection toast without a clear confirmation that the accepted files were uploaded successfully. Would you like me to address this in a small follow-up PR by showing a combined summary message (e.g. “Uploaded N files, skipped M files”)? |
2 participants
Summary
This PR adds upload progress feedback for file uploads from the editor sidebar. issue(#8120).
Description of Changes
withLoadingToast(frontend/src/utils/download.ts) with an optionalfinishTitleargument.frontend/src/components/editor/file-tree/upload.tsx) to reusewithLoadingToast.progress.addTotal(...)+progress.increment(1)).frontend/src/utils/__tests__/download.test.tsxfor:finishTitleis providedBehavior
Validation
pnpm --filter @marimo-team/frontend test src/utils/__tests__/download.test.tsx --runpnpm turbo --filter @marimo-team/frontend typecheck