Using the Response from an Async Thunk to Update the Redux State
Any data coming back from our thunk's payloadCreator function is returned in the action payload. Here we'll look at the builder case for checkoutCart.fulfilled and type the action with PayloadAction<{ success: boolean }> and then update the global state based on that payload response.
Jamund Ferguson: [0:00] If we go into our store and add some products and then go to the Checkout page and open up our web inspector, you'll notice that when I hit Checkout, I'm calling checkout-success.json and it comes back saying success: true.
[0:12] What happens if for some reason that comes back saying success: false? How do we handle those responses? Open up cartSlice.ts and head down to the builder case for checkoutCart.fulfilled. Let's add a second argument here of action, and this one is going to be of type PayloadAction. The payload itself is going to be an object with success as a Boolean.
[0:31] In the function body, we can type const { success } = action.payload. Then we can say if (success) set state.checkoutState to READY and state.items to empty object, basically resetting our shopping cart, after we check out. Else, if for some reason it wasn't successful, then we'll set state.checkoutState = "ERROR".
[0:53] All right, let's go see how that looks. Let's go add some products. When I click Checkout, if it comes back successfully, it actually empties the cart.
Member comments are a way for members to communicate, interact, and ask questions about a lesson.
The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io
Be on-Topic
Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.
Avoid meta-discussion
Code Problems?
Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context
Details and Context
Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!