Question about redux thunk and nextjs (related to server actions and cache invalidation)
Unanswered
Dan posted this in #help-forum
DanOP
Hello all,
this is the flow I currently have:
- Page fetches data from the server in a server component (with caching)
- That data gets dispatched to redux store (in client component)
- I have a thunk that updates a resource through a server action
- That server action revalidates the page
- That revalidation refetches the data
- That refetch dispatches the updated data to the store
My question is, I added logic to update the resource in the redux store but I noticed it's getting overwritten by the second dispatch (the one that happens after revalidation) anyways, so what is the purpose of having logic in the thunk? I can't think of any downsides to not having logic there at all (by logic, I mean manipulating the redux store).
To give code example:
this is the flow I currently have:
- Page fetches data from the server in a server component (with caching)
- That data gets dispatched to redux store (in client component)
- I have a thunk that updates a resource through a server action
- That server action revalidates the page
- That revalidation refetches the data
- That refetch dispatches the updated data to the store
My question is, I added logic to update the resource in the redux store but I noticed it's getting overwritten by the second dispatch (the one that happens after revalidation) anyways, so what is the purpose of having logic in the thunk? I can't think of any downsides to not having logic there at all (by logic, I mean manipulating the redux store).
To give code example:
builder.addCase(addVote.fulfilled, (state, action) => {
state.loading = true;
state.projectIdeas.map((projectIdea) => {
if (projectIdea.id === action.payload.projectIdeaId) {
projectIdea.projectIdeaVotes.push(action.payload as ProjectIdeaVotes);
}
});
state.errors = {};
});
vs
builder.addCase(addVote.fulfilled, (state) => {
state.loading = true;
state.errors = {};
});