Transcript from the "Adding and Removing Products" Lesson
[00:00:00]
>> Okay, so we are really close to have our app, up and running. So the premise that we have is that if we add elements and we go to the order we see nothing. So it's not being added because we have a bag, the bag has to do with it one other.
[00:00:17] Okay, so we are actually adding to the cartAddproduct, but we are not receiving the product as an argument. And the bag is actually adding a product is not there. So, we need to receive from the menu item, the product we can call it B if you want or added product, so we don't have, we don't mess up with the variable names.
[00:00:40] And now if I add a black Americano and a cappuccino and I go to order, voila, we have the card. What happens if I try to delete this, we added the code to delete. So if I press delete. Nothing happens. But anyway, do you see that there is some kind of a glow effect when you click, we will receive that automatically.
[00:01:06] One effect when you click on a button, there is an animation going on there. So let me show you this. I go to offers. I go back to order. Again, I'm going to delete a cappuccino, I'm going to refer back to order. So if deleting the data from the data manager.
[00:01:30] But it's not updating the UI, why? How can we solve the problem? State, so if we go and see our page, our order page is actually a stateless widget. So nothing that happens within that widget. The whole page will be updated because it's an a stateless widget. So first we need to update or convert this into an stateful widget.
[00:02:00] If I try this now, we still have the same issue because the current remove call is the one that can trigger a change. Must be executed within a set statement because if not, it won't trigger a change. Does that makes sense? So if I add the black Americano and the cappuccino and then go to order, now It works.
[00:02:29] so if your widget is a stateless, it will never change you need to change that to a stateful and changes that you do inside that will trigger updates must be done within a set state call. Does it make sense? So something that we can do here also, just to finish this is in the order page.
[00:02:56] We can put an image here. So, because yeah, we don't have a message saying that, we can have a container, for example, wrap this with a container. And then we can actually say something like if, can we do an if here, let's say. So if data manager, by the way data is data manager here, now that we are in a stateful component the data manager is in the widget.
[00:03:24] We have two classes when we are doing a stateful from the state to access the properties of the widget, we need to access with widget. So if widget, and then we have data manager, okay. Blah, blah, blah blah. We can also do is before the return. That's probably going to be easier.
[00:03:49] So, when I'm going to ask if the length of the card is zero, so if it's zero, maybe I want to return a text saying your order is empty. And if not, I'm going to return that maybe I don't need the container actually, so I can remove the unnecessary container.
[00:04:08] So like, so I need to return this text. And then this is a constant text. And here it's complaining because there is already an empty property in arrays. So instead of asking for length equal to zero, you can just say is empty. Like so, we are missing a semicolon, And let's see what else do we need to adjust here.
[00:04:34] Okay, so I balance my parentheses and braces. And now we are back here. Order, okay? It looks fine. And if I delete this, it says your order is empty. We can attach, adding, center wherever we want over the text that says your order empty, okay? So, two more things quick things, what about the numbers it says 1.5 doesn't look like perfect.
[00:05:00] So if we wanna add two decimals here, in the order item, this case in the menu page, we go to the product item. And when we were showing the price here we can call two string as fixed. So doubles. They have a method, two string as fixed, where we can actually say how many decimal we want.
[00:05:26] And also in the order page, we can add in the last view if we want the total because we have already calculated the total in the car.