How do you handle stale data when using React and REST APIs

Question

If you have a component that displays some data fetched from a REST API and another component that modifies that data on the backend using a post request how do you keep the first components state fresh? The Apollo client for graphql seems to have some nice functionality to facilitate this but I can't think up a good solution while using REST. Thanks!

plastic_bag · Accepted Answer

You can use either SWR[0] or React Query[1] hooks to write a query to fetch data for the first component and whenever you make a post request from the second component, you call the mutation function to revalidate the first component's data and replace it.
[0]https://swr.vercel.app/docs/mutation
[1]https://react-query.tanstack.com/guides/mutations