OrderType completed as well

Author: areebsattar

src/components/Order/Order.jsx

@@ -1,15 +1,15 @@
 import { useState } from "react";
 import RestaurantButton from "../RestaurantButton/RestaurantButton";
 
-function Order() {
+function Order({orderType}) {
   const [pizzas, setPizzas] = useState(0);
 
   const OrderOne = () => {
     setPizzas(pizzas + 1);
   };
   return (
     <>
-      <li className="restaurant__item">Pizzas: {pizzas} </li>
+      <li className="restaurant__item">{orderType}: {pizzas} </li>
       <RestaurantButton OrderOne={OrderOne} />
     </>
   );

src/components/Restaurant/Restaurant.jsx

@@ -5,7 +5,9 @@ function Restaurant() {
     <section className="restaurant">
       <h3 className="restaurant__heading">Restaurant Orders</h3>
       <ul className="restaurant__list">
-        <Order />
+        <Order orderType={"Pizzas"} />
+        <Order orderType={"Salads"} />
+        <Order orderType={"Chocolate Cake"} />
       </ul>
     </section>
   );

src/components/RestaurantButton/RestaurantButton.jsx

@@ -3,7 +3,7 @@ function RestaurantButton({ OrderOne }) {
   return (
     <>
       <button type="button" className="button restaurant__button" onClick={OrderOne}>
-        Add Pizzas
+        Add
       </button>
     </>
   );