From 9a9f85110cbfa76b15b3c5ee2406897e4a3eca1d Mon Sep 17 00:00:00 2001
From: oscarzhou <oscarzhou0727@icloud.com>
Date: Thu, 10 Dec 2020 20:55:49 +1300
Subject: [PATCH] container: remove ingredient safely by passing disabledInfo

---
 .../BuildControl/BuildControl.js              |  9 ++++--
 .../Burger/BuildControls/BuildControls.js     |  4 ++-
 src/containers/BurgerBuilder/BurgerBuilder.js | 31 +++++++++++++++++--
 3 files changed, 39 insertions(+), 5 deletions(-)

diff --git a/src/components/Burger/BuildControls/BuildControl/BuildControl.js b/src/components/Burger/BuildControls/BuildControl/BuildControl.js
index 10b48e5..4a8ad49 100644
--- a/src/components/Burger/BuildControls/BuildControl/BuildControl.js
+++ b/src/components/Burger/BuildControls/BuildControl/BuildControl.js
@@ -5,8 +5,13 @@ import classes from './BuildControl.css';
 const buildControl = (props) => (
     <div className={classes.BuildControl}>
         <div className={classes.Label}>{props.name}</div>
-        <button className={classes.Less}>Less</button>
-        <button className={classes.More} onClick={props.added}>More</button>
+        <button
+            className={classes.Less}
+            onClick={props.removed}
+            disabled={props.disabled}>Less</button>
+        <button
+            className={classes.More}
+            onClick={props.added}>More</button>
     </div>
 )
 
diff --git a/src/components/Burger/BuildControls/BuildControls.js b/src/components/Burger/BuildControls/BuildControls.js
index bced256..ac5563f 100644
--- a/src/components/Burger/BuildControls/BuildControls.js
+++ b/src/components/Burger/BuildControls/BuildControls.js
@@ -16,7 +16,9 @@ const buildControls = (props) => (
             <BuildControl 
             key={ctrl.name} 
             name={ctrl.name} 
-            added={() => props.ingredientAdded(ctrl.type) }/>
+            added={() => props.ingredientAdded(ctrl.type) }
+            removed={() => props.ingredientRemoved(ctrl.type)}
+            disabled={props.disabled[ctrl.type]} />
         ))}
     </div>
 )
diff --git a/src/containers/BurgerBuilder/BurgerBuilder.js b/src/containers/BurgerBuilder/BurgerBuilder.js
index bd9dcc2..cd91a4d 100644
--- a/src/containers/BurgerBuilder/BurgerBuilder.js
+++ b/src/containers/BurgerBuilder/BurgerBuilder.js
@@ -32,7 +32,8 @@ class BurgerBuilder extends Component {
         updatedIngredient[type] = newCount;
 
         const priceAddition = INGREDIENT_PRICE[type];
-        const newPrice = this.state.totalPrice + priceAddition;
+        const oldPrice = this.state.totalPrice;
+        const newPrice = oldPrice + priceAddition;
         this.setState({
             totalPrice: newPrice,
             ingredients: updatedIngredient,
@@ -40,15 +41,41 @@ class BurgerBuilder extends Component {
     }
 
     removeIngredientHandler = (type) => {
+        const oldCount = this.state.ingredients[type];
+        if (oldCount <= 0){
+            return;
+        }
+        const newCount = oldCount - 1;
+        const updatedIngredient = {
+            ...this.state.ingredients,
+        };
+        updatedIngredient[type] = newCount;
 
+        const priceDeduction = INGREDIENT_PRICE[type];
+        const oldPrice = this.state.totalPrice;
+        const newPrice = oldPrice - priceDeduction ;
+        this.setState({
+            totalPrice: newPrice,
+            ingredients: updatedIngredient,
+        });
     }
 
     render() {
+        const disabledInfo = {
+            ...this.state.ingredients
+        };
+
+        for (let key in disabledInfo) {
+            disabledInfo[key] = disabledInfo[key] <= 0;
+        }
+
         return (
             <Aux>
                 <Burger ingredients={this.state.ingredients}  />
                 <BuildControls 
-                    ingredientAdded={this.addIngredientHandler} />
+                    ingredientAdded={this.addIngredientHandler} 
+                    ingredientRemoved={this.removeIngredientHandler}
+                    disabled={disabledInfo} />
             </Aux>
         );
     };