File Upload with Background Processing and Toast Updates in Nextjs
I'm in the process of planning a feature for my Next.js project. The feature involves a file upload form, and once users submit files, they should be redirected to another page while the file upload process occurs in the background. I want to implement a toast at the bottom right of the page that displays the upload progress (similar to Google Drive). The goal is to allow users to navigate across pages while the upload toast persists and updates accordingly.
I'm seeking advice on the best approach to implement this feature, particularly whether it's achievable without using a state management library. My initial thought was to utilize a layout.tsx and integrate the upload progress toast there. However, I'm uncertain about where to invoke the upload function and how to establish a connection between the upload progress and the toast. Any guidance on how to implement this architecture effectively would be greatly appreciated.
I'm seeking advice on the best approach to implement this feature, particularly whether it's achievable without using a state management library. My initial thought was to utilize a layout.tsx and integrate the upload progress toast there. However, I'm uncertain about where to invoke the upload function and how to establish a connection between the upload progress and the toast. Any guidance on how to implement this architecture effectively would be greatly appreciated.
