Release (#260)

* Development (#235) * update github workflow yaml file * rename the frontend folder * Development (#237) * update github workflow yaml file * rename the frontend folder * create the checkout button * Development (#239) * update github workflow yaml file * rename the frontend folder * create the checkout button * create dynamic route * update the routing definition and getmenubyId API call * Merge branch 'development' of github.com:olasunkanmi-SE/restaurant into development * remove the styling for menu name * Development (#241) * update github workflow yaml file * rename the frontend folder * create the checkout button * create dynamic route * update the routing definition and getmenubyId API call * Merge branch 'development' of github.com:olasunkanmi-SE/restaurant into development * remove the styling for menu name * optimize the components * conditionally render the checkout component * remove code smell * Development (#242) * update github workflow yaml file * rename the frontend folder * create the checkout button * create dynamic route * update the routing definition and getmenubyId API call * Merge branch 'development' of github.com:olasunkanmi-SE/restaurant into development * remove the styling for menu name * optimize the components * conditionally render the checkout component * remove code smell * Merge branch 'release' into development * Development (#244) * update github workflow yaml file * rename the frontend folder * create the checkout button * create dynamic route * update the routing definition and getmenubyId API call * Merge branch 'development' of github.com:olasunkanmi-SE/restaurant into development * remove the styling for menu name * optimize the components * conditionally render the checkout component * remove code smell * Merge branch 'release' into development * update the menu item page and clean up the navigation * Development (#246) * update github workflow yaml file * rename the frontend folder * create the checkout button * create dynamic route * update the routing definition and getmenubyId API call * Merge branch 'development' of github.com:olasunkanmi-SE/restaurant into development * remove the styling for menu name * optimize the components * conditionally render the checkout component * remove code smell * Merge branch 'release' into development * update the menu item page and clean up the navigation * create the delete menu repo method, service and controller * create the delete menu API * Development (#248) * update github workflow yaml file * rename the frontend folder * create the checkout button * create dynamic route * update the routing definition and getmenubyId API call * Merge branch 'development' of github.com:olasunkanmi-SE/restaurant into development * remove the styling for menu name * optimize the components * conditionally render the checkout component * remove code smell * Merge branch 'release' into development * update the menu item page and clean up the navigation * create the delete menu repo method, service and controller * create the delete menu API * update food menu component to include item id * update food menu component to include item id * add the add menu item to cart functionality * implement add menu items to cart * fix build errors * fix code smell * Development (#250) * update github workflow yaml file * rename the frontend folder * create the checkout button * create dynamic route * update the routing definition and getmenubyId API call * Merge branch 'development' of github.com:olasunkanmi-SE/restaurant into development * remove the styling for menu name * optimize the components * conditionally render the checkout component * remove code smell * Merge branch 'release' into development * update the menu item page and clean up the navigation * create the delete menu repo method, service and controller * create the delete menu API * update food menu component to include item id * update food menu component to include item id * add the add menu item to cart functionality * implement add menu items to cart * fix build errors * fix code smell * create the item quantity button component * Development (#252) * update github workflow yaml file * rename the frontend folder * create the checkout button * create dynamic route * update the routing definition and getmenubyId API call * Merge branch 'development' of github.com:olasunkanmi-SE/restaurant into development * remove the styling for menu name * optimize the components * conditionally render the checkout component * remove code smell * Merge branch 'release' into development * update the menu item page and clean up the navigation * create the delete menu repo method, service and controller * create the delete menu API * update food menu component to include item id * update food menu component to include item id * add the add menu item to cart functionality * implement add menu items to cart * fix build errors * fix code smell * create the item quantity button component * update the menu list ui * Development (#254) * update github workflow yaml file * rename the frontend folder * create the checkout button * create dynamic route * update the routing definition and getmenubyId API call * Merge branch 'development' of github.com:olasunkanmi-SE/restaurant into development * remove the styling for menu name * optimize the components * conditionally render the checkout component * remove code smell * Merge branch 'release' into development * update the menu item page and clean up the navigation * create the delete menu repo method, service and controller * create the delete menu API * update food menu component to include item id * update food menu component to include item id * add the add menu item to cart functionality * implement add menu items to cart * fix build errors * fix code smell * create the item quantity button component * update the menu list ui * implement the add items to cart functionality * fix code smell * Development (#256) * update github workflow yaml file * rename the frontend folder * create the checkout button * create dynamic route * update the routing definition and getmenubyId API call * Merge branch 'development' of github.com:olasunkanmi-SE/restaurant into development * remove the styling for menu name * optimize the components * conditionally render the checkout component * remove code smell * Merge branch 'release' into development * update the menu item page and clean up the navigation * create the delete menu repo method, service and controller * create the delete menu API * update food menu component to include item id * update food menu component to include item id * add the add menu item to cart functionality * implement add menu items to cart * fix build errors * fix code smell * create the item quantity button component * update the menu list ui * implement the add items to cart functionality * fix code smell * create the selected items summary * update cart reducer * Development (#257) * update github workflow yaml file * rename the frontend folder * create the checkout button * create dynamic route * update the routing definition and getmenubyId API call * Merge branch 'development' of github.com:olasunkanmi-SE/restaurant into development * remove the styling for menu name * optimize the components * conditionally render the checkout component * remove code smell * Merge branch 'release' into development * update the menu item page and clean up the navigation * create the delete menu repo method, service and controller * create the delete menu API * update food menu component to include item id * update food menu component to include item id * add the add menu item to cart functionality * implement add menu items to cart * fix build errors * fix code smell * create the item quantity button component * update the menu list ui * implement the add items to cart functionality * fix code smell * create the selected items summary * update cart reducer * update the add item to cart implementation * Development (#259) * update github workflow yaml file * rename the frontend folder * create the checkout button * create dynamic route * update the routing definition and getmenubyId API call * Merge branch 'development' of github.com:olasunkanmi-SE/restaurant into development * remove the styling for menu name * optimize the components * conditionally render the checkout component * remove code smell * Merge branch 'release' into development * update the menu item page and clean up the navigation * create the delete menu repo method, service and controller * create the delete menu API * update food menu component to include item id * update food menu component to include item id * add the add menu item to cart functionality * implement add menu items to cart * fix build errors * fix code smell * create the item quantity button component * update the menu list ui * implement the add items to cart functionality * fix code smell * create the selected items summary * update cart reducer * update the add item to cart implementation * create folder structure for componsnts
olasunkanmi-SE · Apr 5, 2023 · 050de41 · 050de41
1 parent 233f9e0
commit 050de41
Show file tree

Hide file tree

Showing 25 changed files with 76 additions and 30 deletions.
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
@@ -1,9 +1,9 @@
 import { Col, Container } from "react-bootstrap";
 import { Navigate, Route, Routes } from "react-router-dom";
-import { Navigation } from "./components";
 import { ShoppingCartProvider } from "./contexts/shoppingCartContext";
 import { About, FoodMenu, Home, SignUp } from "./pages";
-import { CheckOutOrAddToCart } from "./components/Conditional";
+import { CheckOutOrAddToCart } from "./components/Utilities/Conditional";
+import { Navigation } from "./components/Utilities/Navbar";
 
 function App() {
   return (

diff --git a/frontend/src/application/mappers/MenuItem.mapper.ts b/frontend/src/application/mappers/MenuItem.mapper.ts
@@ -1,4 +1,4 @@
-import { ItemsSummary } from "../../components/CartItemsList";
+import { ItemsSummary } from "../../components/Cart/CartItemsList";
 import { CartItem, selectedItem } from "../../reducers";
 
 export const selectedItemToMenuMapper = (selectedItem: selectedItem): Partial<CartItem> => {
@@ -15,4 +15,4 @@ export const ItemToSummaryMapper = (item: selectedItem): ItemsSummary => {
     name: item.name,
     qty: item.quantity || 0,
   };
-};
+};
diff --git a/frontend/src/components/SignInForm.tsx → ...nd/src/components/AppForms/SignInForm.tsx b/frontend/src/components/SignInForm.tsx → ...nd/src/components/AppForms/SignInForm.tsx
@@ -2,7 +2,7 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { Button, Card, Form } from "react-bootstrap";
 import { SubmitHandler, useForm } from "react-hook-form";
 import { z } from "zod";
-import { FormInput } from "./form/form-input";
+import { FormInput } from "../Forms/form-input";
 
 export type loginFormProps = {
   email: string;

diff --git a/frontend/src/components/SignUp.tsx → frontend/src/components/AppForms/SignUp.tsx b/frontend/src/components/SignUp.tsx → frontend/src/components/AppForms/SignUp.tsx
@@ -4,7 +4,7 @@ import { SubmitHandler, useForm } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 import { Card } from "react-bootstrap";
-import { FormInput } from "./form/form-input";
+import { FormInput } from "../Forms/form-input";
 
 export type RegisterFormProps = {
   email: string;

diff --git a/frontend/src/components/AddToCart.tsx → frontend/src/components/Cart/AddToCart.tsx b/frontend/src/components/AddToCart.tsx → frontend/src/components/Cart/AddToCart.tsx
@@ -1,6 +1,6 @@
 import { CSSProperties } from "react";
 import { Button, Stack } from "react-bootstrap";
-import { QtyButton } from "./addItemButton";
+import { QtyButton } from "../MenuItems/addItemButton";
 
 const addToCartStyle: CSSProperties = {
   textAlign: "center",

diff --git a/frontend/src/components/Cart/CartItemsList.tsx b/frontend/src/components/Cart/CartItemsList.tsx
@@ -0,0 +1,42 @@
+import { Stack } from "react-bootstrap";
+import { ItemToSummaryMapper } from "../../application/mappers/MenuItem.mapper";
+import { useShoppingCart } from "../../hooks/UseShoppingCart";
+
+export type ItemsSummary = {
+  id: string;
+  name: string;
+  qty: number;
+};
+
+export const CartItemsList = () => {
+  const { menus } = useShoppingCart();
+  let itemSummaries: ItemsSummary[] = [];
+  if (menus && menus.length) {
+    const itemsMap = new Map<string, ItemsSummary>();
+    const selectedItems = menus.map((menu) => menu.selectedItems || []);
+    const flattenedSelectedItems = selectedItems.flat();
+    flattenedSelectedItems.forEach((item) => {
+      const selectedItem = ItemToSummaryMapper(item);
+      if (itemsMap.has(item.id)) {
+        itemsMap.get(item.id)!.qty += 1;
+      } else {
+        itemsMap.set(item.id, selectedItem);
+      }
+    });
+    for (const item of itemsMap.values()) {
+      itemSummaries.push(item);
+    }
+  }
+
+  return (
+    <div className="">
+      <Stack direction="horizontal" gap={3} className="gap-3">
+        {itemSummaries.map((item) => (
+          <small style={{ marginLeft: "4px", fontSize: "11px" }} key={item.id}>
+            +{item.name.toLowerCase()} x {item.qty}
+          </small>
+        ))}
+      </Stack>
+    </div>
+  );
+};
diff --git a/...rc/components/form/form-error-message.tsx → ...c/components/Forms/form-error-message.tsx b/...rc/components/form/form-error-message.tsx → ...c/components/Forms/form-error-message.tsx
diff --git a/frontend/src/components/form/form-input.tsx → frontend/src/components/Forms/form-input.tsx b/frontend/src/components/form/form-input.tsx → frontend/src/components/Forms/form-input.tsx
diff --git a/frontend/src/components/form/input.tsx → frontend/src/components/Forms/input.tsx b/frontend/src/components/form/input.tsx → frontend/src/components/Forms/input.tsx
diff --git a/frontend/src/components/MenuInfo.tsx → frontend/src/components/Menu/MenuInfo.tsx b/frontend/src/components/MenuInfo.tsx → frontend/src/components/Menu/MenuInfo.tsx
@@ -1,5 +1,5 @@
 import { CSSProperties } from "react";
-import { QtyButton } from "./addItemButton";
+import { QtyButton } from "../MenuItems/addItemButton";
 
 type description = {
   name: string;

diff --git a/frontend/src/components/MenuItem.tsx → frontend/src/components/Menu/MenuItem.tsx b/frontend/src/components/MenuItem.tsx → frontend/src/components/Menu/MenuItem.tsx
diff --git a/frontend/src/components/MenuList.tsx → frontend/src/components/Menu/MenuList.tsx b/frontend/src/components/MenuList.tsx → frontend/src/components/Menu/MenuList.tsx
@@ -1,8 +1,8 @@
 import { Col, Row } from "react-bootstrap";
 import { useQuery } from "react-query";
 import { Link } from "react-router-dom";
-import { getMenus } from "../apis";
-import { IMenuData, IMenus } from "../models/menu.model";
+import { IMenuData, IMenus } from "../../models/menu.model";
+import { getMenus } from "../../apis";
 import { MenuItem } from "./MenuItem";
 
 export const MenuList = () => {

diff --git a/frontend/src/components/FoodItemList.tsx → ...src/components/MenuItems/FoodItemList.tsx b/frontend/src/components/FoodItemList.tsx → ...src/components/MenuItems/FoodItemList.tsx
@@ -1,12 +1,13 @@
 import { Stack } from "react-bootstrap";
-import { useShoppingCart } from "../hooks/UseShoppingCart";
-import { storeItemProps } from "./StoreItem";
+import { useShoppingCart } from "../../hooks/UseShoppingCart";
 import { QtyButton } from "./addItemButton";
+import { storeItemProps } from "./StoreItem";
 
 type foodItem = storeItemProps & { itemId: string; itemPrice: number };
 
 export const FoodItemList = ({ name, itemId, itemPrice, id, basePrice }: Omit<foodItem, "items">) => {
-  const { addItemToCart } = useShoppingCart();
+  const { addItemToCart, menus } = useShoppingCart();
+  let itemQty: number = 0;
   const handleClick = () => {
     return addItemToCart({
       id: itemId,
@@ -16,13 +17,22 @@ export const FoodItemList = ({ name, itemId, itemPrice, id, basePrice }: Omit<fo
       menuPrice: basePrice,
     });
   };
+  if (menus && menus.length) {
+    const selectedItems = menus.map((menu) => menu.selectedItems || []);
+    const flattenedSelectedItems = selectedItems.flat();
+    flattenedSelectedItems.forEach((item) => {
+      if (item.id === itemId) {
+        itemQty = item.quantity!;
+      }
+    });
+  }
   return (
     <>
       <Stack direction="horizontal" gap={3}>
         <QtyButton sign={"increment"} onClick={handleClick} />
         <div>{name}</div>
         <div className=" ms-auto"> +RM {itemPrice}</div>
-        <div>x0</div>
+        <div>x {itemQty}</div>
         <QtyButton sign={"decrement"} onClick={handleClick} />
       </Stack>
       <hr></hr>

diff --git a/frontend/src/components/StoreItem.tsx → ...nd/src/components/MenuItems/StoreItem.tsx b/frontend/src/components/StoreItem.tsx → ...nd/src/components/MenuItems/StoreItem.tsx
@@ -1,7 +1,6 @@
 import { Card, Col, Row } from "react-bootstrap";
+import { Item } from "../../reducers";
 import { FoodItemList } from "./FoodItemList";
-import { Item } from "../reducers";
-import { CartItemsList } from "./CartItemsList";
 
 export type storeItemProps = {
   id: string;

diff --git a/frontend/src/components/addItemButton.tsx → ...rc/components/MenuItems/addItemButton.tsx b/frontend/src/components/addItemButton.tsx → ...rc/components/MenuItems/addItemButton.tsx
diff --git a/frontend/src/components/AddonScrollBar.tsx → ...c/components/Utilities/AddonScrollBar.tsx b/frontend/src/components/AddonScrollBar.tsx → ...c/components/Utilities/AddonScrollBar.tsx
@@ -1,4 +1,4 @@
-import React, { CSSProperties } from "react";
+import React from "react";
 import { Button, Stack } from "react-bootstrap";
 export const AddonScrollBar = () => {
   return (

diff --git a/frontend/src/components/Checkout.tsx → ...end/src/components/Utilities/Checkout.tsx b/frontend/src/components/Checkout.tsx → ...end/src/components/Utilities/Checkout.tsx
@@ -1,6 +1,6 @@
 import { CSSProperties } from "react";
-import { useShoppingCart } from "../hooks/UseShoppingCart";
 import { Stack } from "react-bootstrap";
+import { useShoppingCart } from "../../hooks/UseShoppingCart";
 
 const checkoutStyle: CSSProperties = {
   zIndex: 9999,

diff --git a/frontend/src/components/Conditional.tsx → .../src/components/Utilities/Conditional.tsx b/frontend/src/components/Conditional.tsx → .../src/components/Utilities/Conditional.tsx
diff --git a/...components/IncrementOrDecrementButton.tsx → .../Utilities/IncrementOrDecrementButton.tsx b/...components/IncrementOrDecrementButton.tsx → .../Utilities/IncrementOrDecrementButton.tsx
diff --git a/frontend/src/components/Navbar.tsx → frontend/src/components/Utilities/Navbar.tsx b/frontend/src/components/Navbar.tsx → frontend/src/components/Utilities/Navbar.tsx
@@ -4,7 +4,7 @@ import { Button, Nav, Stack } from "react-bootstrap";
 import Container from "react-bootstrap/Container";
 import Navbar from "react-bootstrap/Navbar";
 import { NavLink, Outlet, useNavigate } from "react-router-dom";
-import { useShoppingCart } from "../hooks/UseShoppingCart";
+import { useShoppingCart } from "../../hooks/UseShoppingCart";
 
 export const Navigation = () => {
   const { quantity } = useShoppingCart();

diff --git a/frontend/src/components/SnackBar.tsx → ...end/src/components/Utilities/SnackBar.tsx b/frontend/src/components/SnackBar.tsx → ...end/src/components/Utilities/SnackBar.tsx
diff --git a/frontend/src/components/index.tsx b/frontend/src/components/index.tsx
diff --git a/frontend/src/pages/FoodMenu.tsx b/frontend/src/pages/FoodMenu.tsx
@@ -1,10 +1,11 @@
 import { useParams } from "react-router-dom";
 import { getMenuById } from "../apis";
-import { AddToCartButton, StoreItem } from "../components";
 import { useShoppingCart } from "../hooks/UseShoppingCart";
 import { IItem } from "../models/item.model";
 import { Item } from "../reducers";
-import { CartItemsList } from "../components/CartItemsList";
+import { CartItemsList } from "../components/Cart/CartItemsList";
+import { StoreItem } from "../components/MenuItems/StoreItem";
+import { AddToCartButton } from "../components/Cart/AddToCart";
 
 const mapItems = (items: IItem[]): Item[] => {
   const stateItem =

diff --git a/frontend/src/pages/Home.tsx b/frontend/src/pages/Home.tsx
@@ -1,5 +1,5 @@
-import { MenuList } from "../components";
-import { AddonScrollBar } from "../components/AddonScrollBar";
+import { MenuList } from "../components/Menu/MenuList";
+import { AddonScrollBar } from "../components/Utilities/AddonScrollBar";
 
 export const Home = () => {
   return (

diff --git a/frontend/src/pages/SignUp.tsx b/frontend/src/pages/SignUp.tsx
@@ -1,4 +1,4 @@
-import { AuthForm } from "../components/SignUp";
+import { AuthForm } from "../components/AppForms/SignUp";
 
 export const SignUp = () => {
   return (