Development (#480) (#481)

* include restaurant information as part of the menu response (#471) * include restaurant information as part of the menu response * fix build errors * fix build errors --------- * 349 place order (#473) * include restaurant information as part of the menu response * fix build errors * fix build errors * fix the create order flow, from frontend to backend --------- * 349 place order (#476) * 349 place order (#478) * include restaurant information as part of the menu response * fix build errors * fix build errors * fix the create order flow, from frontend to backend * place order, add success animation and clear local storage if the cart has been filled for an hr and more * fix build errors * fix build errors * move the implementation of adding expiry to cart to addItemToCart handler * fix issues with creating notes when none was passwd * npm audit to upgrade packages with issues --------- * display api error message * display api error message --------- Co-authored-by: Olasunkanmi Oyinlola <[email protected]>
olasunkanmi-SE · Jan 20, 2024 · 195c122 · 195c122
1 parent 164a10e
commit 195c122
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 9 deletions.
diff --git a/frontend/src/apis/orderApi.ts b/frontend/src/apis/orderApi.ts
@@ -43,7 +43,6 @@ export const OrderApi = () => {
     return totalSelectedItemsPrice;
   };
 
-
   const cartItemsMapper = (orderSummary: OrderSummary[]): IcartItems[] => {
     const menus = orderSummary.flatMap((summary) => summary.menus);
     const cartItems = menus.map((menu) => {

diff --git a/frontend/src/components/Cart/ShoppinCartDetails.tsx b/frontend/src/components/Cart/ShoppinCartDetails.tsx
@@ -5,7 +5,13 @@ import { useNavigate } from "react-router-dom";
 import { CONSTANTS } from "../../constants/constant";
 import { useShoppingCart } from "../../hooks/UseShoppingCart";
 import { OrderSummary } from "../../reducers";
-import { calculateServiceCharge, calculateTotalOrderAmount, setLocalStorageData, wordWrap } from "../../utility/utils";
+import {
+  calculateServiceCharge,
+  calculateTotalOrderAmount,
+  clearStorage,
+  setLocalStorageData,
+  wordWrap,
+} from "../../utility/utils";
 import { QtyButton } from "../MenuItems/addItemButton";
 import { CallToAction } from "../Utilities/modal";
 import { CartSelectedItems } from "./CartSelectedItems";
@@ -14,9 +20,6 @@ import { OrderApi } from "../../apis/orderApi";
 import useAxiosPrivate from "../../hooks/useAxiosPrivate";
 import { useMutation } from "react-query";
 import { ICreateOrderDTO } from "../../dto/order";
-import Lottie from "lottie-react";
-import groovyWalkAnimation from "../../assets/animations/1704611321528.json";
-import success from "../../assets/animations/1704612008454.json";
 
 export const ShoppingCartDetails = () => {
   const navigate = useNavigate();
@@ -88,8 +91,14 @@ export const ShoppingCartDetails = () => {
     mutationFn: async (order: ICreateOrderDTO) => {
       return await axios.post("orders/create", order);
     },
-    onSuccess: (data, variables, context) => {},
-    onError: (data, variables, context) => {},
+    onSuccess: (data) => {
+      if (data.data.isSuccess) {
+        resetCart();
+        clearStorage();
+        closeCart();
+        navigate("/");
+      }
+    },
   });
 
   return (
@@ -214,7 +223,16 @@ export const ShoppingCartDetails = () => {
           {handleCreateOrder.isLoading ? (
             "Creating Order..."
           ) : (
-            <>{handleCreateOrder.isError ? <div>An error occurred: {handleCreateOrder.error.message}</div> : null}</>
+            <>
+              {handleCreateOrder.isError ? (
+                <div>
+                  An error occurred:{" "}
+                  {handleCreateOrder.error.response.data.message.message?.length
+                    ? handleCreateOrder.error.response.data.message.message.join(",")
+                    : handleCreateOrder.error.response.data.message.error}
+                </div>
+              ) : null}
+            </>
           )}
           {handleCreateOrder.isSuccess ? <div>Order processed successfully</div> : null}
         </div>

diff --git a/frontend/src/utility/utils.ts b/frontend/src/utility/utils.ts
@@ -81,6 +81,5 @@ export const cartExpiry = (date: string): boolean => {
   const specifiedDate: Date = new Date(date);
   const timeDifferenceMs: number = new Date().getTime() - specifiedDate.getTime();
   const hoursDifference: number = timeDifferenceMs / (1000 * 60 * 60);
-  console.log(hoursDifference);
   return hoursDifference > 1;
 };