Use custom hook every time an item in added in context

In React I have a context that stores a list of files being uploaded. I can add files to it, update the upload status and remove files. The Context doesn’t have any logic, it just keeps the data.

I have a custom hook that when used handles the upload logic of a single file, it uses other custom hooks inside it. This custom hook updates the context with the progress.

We have a popup component that handles the upload, the user can select the file to upload and it uses the custom hook for each file.

Now we want to be able to continue uploading and show a toast when the upload finishes. But when the user navigates to another page the popup component along with the custom hook are destroyed so it won’t update the context and we don’t know when the upload finishes.

Is it possible to add a file to context and the context itself use the custom hook for each file in the context?

  • Sounds to me that u need to put the custom hook at the same level of context, and u need to wire up some methods from that hook into context? so that children of context can access everything and wont bother anything to be destroyed?

    – 

  • Yes. I would like to use the hook and avoid it being destroyed.

    – 

Leave a Comment