And the way you use reducer works is we are dispatching an action and you can think of action.
What we would want to do and in our case is gonna be simply removing the item.
So how that is going to look like.
Well we're going to write dispatch and then we pass in our method and then we need to pass in the object.
So we're gonna pass in the object within the dispatch function.
An object always always needs to have a type property so it needs to have a tag and then type is just
going to say what kind of action type we would want.
Again in our case since we have remove item functionality I'm just not type here.
Remove and common convention is using all capital case letters.
No you don't have to do that.
But again it is a convention where you just type your action with all caps and then again you can name
this whatever you want you can call this bunny.
A matter in my case though since we are removing their item that's the reason why I used type.
And then I set it equal to remove.
So we have this patch in action now.
Well now we would want to check within reducer for that particular action because remember we have the
state and the state that we're passing in is in fact the second argument.
So when we set up use a reducer and we pass here get a card from local storage that is the state that
we're getting within the reducer.
That's the state we're accessing.
So again you can think of the state that you're going to be displaying in your court and in our case
we also have an action.
And the way it works within the reducer we check for those actions.
Now what can you say if and then action type action type and then we're going to go with is equal to
A remove if that is the case then I would want to do something you could do it this way or you could
use a switch the other way switch statement works is in the following way where we would type switch
then we're gonna say that we're going to depend on action type so whatever type of action we're gonna
have.
And then if the case is going to be removed then of course we would want to do something.
However there's also gonna be default one where we need to return a state.
Now why are we returning a state.
Because there's gonna be cases where your action type doesn't match anything that we've passed in here.
Now that would be by mistake or that could be by purpose doesn't really matter but it might be the cases
where you just want to return a state because you always always want to return a state from reducer
because that is what's responsible for the functionality where we can always display that state.
So we're going to go default and then we're going to return a state.
So again we could have set this up using ifs but common convention is using switch so we delete our
state OK.
But we're still returning this by default because that is the case and now we're going to set up our
first case where we're going say.
CASE AND THEN WE'RE LOOKING FOR OUR STRING OF remove.
So if the action type is remove and then of course we're gonna do something remove and what we would
want to do.
Well we're getting our state and the way it works with the reducer we always always need to return a
new state.
So state needs to be new and in our case what is the state.
Well that is all right.
Right.
Because we check for the card and if the card is not there where returning an empty array.
So we cannot just mutate the state directly.
We always Always need to return a new state.
And what do you think happens if we're using our filter method remember previously I copied all the
values and then I said filter and then we were looking for the item that didn't match Daddy.
Well the way it happens we're returning a new.
All right.
That's the reason why we're able to use the filter.
Now technically in our example it wasn't that important or when you're using the reducer it is crucial
that you're turning a new state meaning you can update the values.
But the actual value of returning has to be a new state.
And in our case if we're using filter the way it works we're going to return a new right.
That's the reason where I can say all right.
So case remove when I would want to remove the item I'm going to go with return then state that I'm
gonna use the filter method and then we can use the same functionality we already have here where if
the item I.D. is not matching well then we would want to remove that item.
However there is a slight catch.
So I'm just gonna copy and paste it here.
Everything's fine but you're probably wondering OK but where are we getting this I.D..
Because I know I have the item I.D. but it is not equal to I.D..
Okay.
So we're passing in within the remove item.
Correct.
But as you see once I dispatch the action I'm not passing the ideas down to my producer and the common
convention is setting this up within the payload property.
So you must must must have the type property with whatever action you don't want to do but then Optionally
you can pass in whatever data and in our case the data we're gonna be passing in is going to be an I.D.
and the way it's gonna work we're gonna go with payload.
Again this is an option you could call this Bunny doesn't matter.
I'm gonna show you in a second how you can access it but a common convention is calling this payload
and then just past the 80.
And in this case since my payload property is equal to an I.D. that I'm passing in.
If I had to reducer then instead of looking for just some random I.D. I can say stay that filter so
I'm returning a new array then check for the items that don't have the idea that I'm passing in and
where I'm passing in the actual I.D. property while I'm passing in within the action payload.
That of course is my property name.
We're going to save it and then everything is gonna work.
Now of course we can remove the items since we don't have anything within a cart.
We have the empty cart so we would need to of course fix the rest of the functionality.
And then once we do that we can start this thing out.
Whether everything makes sense as always.
Just remember the most important thing where from reducer you want to return a new state.
Since in our case the actual state wasn't all right.
If we use filter then of course we're returning and you hurry if you're not going to do that and your
functionality is not going to work.