Some with our basic functionality in place, I'm going to close the no card container, I don't think
I'm going to need that and then I'm going to look for my car item just so each and every item that I
have in a cart.
And then as far as the props at the moment, we get props, of course, from the card container because
we're passing in for each item, the image, the title price and the amount.
But there's no functionality.
And again, we're going to have to use the connect method or start by import than connect.
And it is coming from react readers.
Now, I also want to write away, import my reactions.
So decrease, increase and remove.
So right before or after doesn't really matter.
Go with import.
We have to increase.
Then decrease.
And then also we had a small fraction, of course, it is coming from and then again, we need to go
to levels up and look for the actions.
So we have to connect and we have our actions now.
Well, remember, in the bottom, we needed to export Crinum what we needed to wrap it in the correct
function.
So I'm going to go with my connect function.
I will pass in my Crinum.
And then we have our two arguments.
Now, in this case, do we need to have a first argument?
Do we need a map state to perhaps function?
Well, we already getting all the props that we need from the court container.
Correct.
So that's all good.
Now, what we need, though, is the dispatch.
So in order to avoid getting the first function, we can just bypass it by passing in the novel.
Now, we're just going to pass in the second argument.
And the second argument is also a function, or in this case, it maps the dispatch function to our
prompts.
So, again, naming is up to you, but a common practice is naming this map dispatched perhaps and similar
way how we had mapped Theta as a function.
We do the same thing for the dispatch in this case.
Again, I'm going to switch to our function just because and what happens as a prop.
We are getting our dispatch.
So same set up again.
We're still setting up our object that we are turning that will be map to our props or in this function,
the parameter is our dispatch method.
Now, the difference in this case is the fact that we're not mapping our static state values to the
props.
In fact, I we want to set up my props as functions.
And I'm going to start with the first one with a remove and then one by one we will add the other ones
layer.
So remove is equal.
And now let me make a mistake.
So first, I'm going to show you how we will fail if we will not set this up as a function.
So I'm going to pass in my dispatch and then remember, we needed to pass in the type.
And then, of course, we still have our correct action and that is removed.
But then once I say it and if we will open up the console, you'll see that I have three times you remove
a map because I have three items.
And then instead of running this, once the user clicks on a button, I invoke it right away because
I have this patch in work.
And that's the reason why when you're setting up your prop, you need to set it equal to a function
that returns this dispatch like so.
So let me set it properly.
And now in a console, you don't see any more the console log, because now we will run it when the
user clicks on about.
So that is my first prop, the removed prop that is equal to a result, the arrow function that returns
a dispatch with a type of room.
And of course now we need to head on up.
And then right after the amount, I will look for my remove prop, which is a function, and then after
that we're looking for our button and the same how we had four clear cut we're going to have on click.
But again, we do not want to invoke this right away.
So curly braces, man.
First, let's set up a arrow function and now let's write a remove and then in fact invoke it.
Let's save that.
And now each and every time I'm going to press on or move, you'll see in a console that the item is
removed or at least a console log that says that let's click.
We have your remove amount, then you remove amount and then you remove the amount.
So that works.
We're passing in our removing action.
And I guess now we would want to start working on the actual functionality.