How to sync client with server state?
Hey there,
I have a Create Post component has a button that opens a sidebar (drawer) that allows me to select the categories (think checkboxes) and I need to reflect the selected categories back to the Create Post component (I'm fetching the categories using react-query). In order to display selected categories back in Create Post component, I'm using Recoil to store the selected categories.
However, I'm worried with this approach (or I'm thinking too much). The point is, if a category is deleted, the data won't be in sync (when react-query refetch categories, maybe I can end up with a deleted category in state). In this example, imagine the "categoriesSelected" containing category "typescript", when it shouldn't because it was deleted. In the end, categories component will show all the correct categories, but the create component will show a non-existing category!
What is the "best practice" to handle and keep client state in sync when it depends of the server state?
I have a Create Post component has a button that opens a sidebar (drawer) that allows me to select the categories (think checkboxes) and I need to reflect the selected categories back to the Create Post component (I'm fetching the categories using react-query). In order to display selected categories back in Create Post component, I'm using Recoil to store the selected categories.
However, I'm worried with this approach (or I'm thinking too much). The point is, if a category is deleted, the data won't be in sync (when react-query refetch categories, maybe I can end up with a deleted category in state). In this example, imagine the "categoriesSelected" containing category "typescript", when it shouldn't because it was deleted. In the end, categories component will show all the correct categories, but the create component will show a non-existing category!
What is the "best practice" to handle and keep client state in sync when it depends of the server state?
