After making an API POST request from our UploadForm component, we cause a redirect using
navigate("/").
This successfully takes us back to our Main component, but doesn't cause a re-render, thus showing the old music state data from the API call in App.
I am not sure how to fix this. An immediate thought would be to access the music array state from upload form, and after POST request, update music state to include the new formData as well.
Was able to fix this by creating a function that make an additional API call on the App component once a form was submitted. Quick work around. I believe useContext is a better approach.
After making an API POST request from our UploadForm component, we cause a redirect using navigate("/").
This successfully takes us back to our Main component, but doesn't cause a re-render, thus showing the old music state data from the API call in App.
I am not sure how to fix this. An immediate thought would be to access the music array state from upload form, and after POST request, update music state to include the new formData as well.