Merge pull request #37 from areebsattar/FeatureRestaurantState

NW6 | OrlandoMorales | FeatureRestaurantState-ReactModule | Week2

Author: Sabella-8

src/components/App/App.scss

@@ -17,6 +17,10 @@
   margin-top: 30%;
 }
 
+.restaurant {
+  margin-bottom: 20px;
+}
+
 .footer {
   background-color: var(--color--paper);
   padding: var(--space--m);

src/components/Restaurant/Restaurant.jsx

@@ -1,16 +1,25 @@
-const Restaurant = () => {
-  const pizzas = 0;
+import { useState } from "react";
+
+function Restaurant() {
+  const [pizzas, setPizzas] = useState(0);
+
+  function buttonAdd() {
+    setPizzas(pizzas + 1);
+  }
+
   return (
     <section className="restaurant">
       <h3 className="restaurant__heading">Restaurant Orders</h3>
       <ul className="restaurant__list">
         <li className="restaurant__item">
           Pizzas: {pizzas}{" "}
-          <button className="button restaurant__button">Add</button>
+          <button className="button restaurant__button" onClick={buttonAdd}>
+            Add
+          </button>
         </li>
       </ul>
     </section>
   );
-};
+}
 
 export default Restaurant;