From a126eb8e02c8a99ae2c9a77c79810931a8770fd0 Mon Sep 17 00:00:00 2001 From: Mohammed Al-yaseen Date: Mon, 15 Dec 2025 22:46:25 +0300 Subject: [PATCH] menu: enhnacncements --- .../AddToCartButton/AddToCartButton.tsx | 129 ++++++++++++++++-- .../CategoriesList/CategoriesList.tsx | 2 +- .../menu/components/MenuList/ProductCard.tsx | 65 +++++---- src/utils/types/appTypes.ts | 1 + 4 files changed, 149 insertions(+), 48 deletions(-) diff --git a/src/pages/menu/components/AddToCartButton/AddToCartButton.tsx b/src/pages/menu/components/AddToCartButton/AddToCartButton.tsx index 352eb0f..51324b6 100644 --- a/src/pages/menu/components/AddToCartButton/AddToCartButton.tsx +++ b/src/pages/menu/components/AddToCartButton/AddToCartButton.tsx @@ -8,7 +8,8 @@ import styles from "./AddToCartButton.module.css"; import { useAppSelector, useAppDispatch } from "redux/hooks"; import { Product } from "utils/types/appTypes"; import NextIcon from "components/Icons/NextIcon"; -import { addItem } from "features/order/orderSlice"; +import { addItem, updateQuantity, removeItem } from "features/order/orderSlice"; +import ProText from "components/ProText"; export function AddToCartButton({ item }: { item: Product }) { const { t } = useTranslation(); @@ -22,10 +23,12 @@ export function AddToCartButton({ item }: { item: Product }) { const { items } = useAppSelector((state) => state.order); // Check if product is in cart - const isInCart = - items - .filter((i) => i.id === item.id) - .reduce((total, item) => total + item.quantity, 0) > 0; + const cartItemsForProduct = items.filter((i) => i.id === item.id); + const totalQuantity = cartItemsForProduct.reduce( + (total, item) => total + item.quantity, + 0 + ); + const isInCart = totalQuantity > 0; // Check if item has extras, variants, or groups const hasOptions = @@ -33,6 +36,14 @@ export function AddToCartButton({ item }: { item: Product }) { (item.variants && item.variants.length > 0) || (item.theExtrasGroups && item.theExtrasGroups.length > 0); + // Find basic cart item (no variants/extras) - the one added by quick add + const basicCartItem = cartItemsForProduct.find( + (cartItem) => + (!cartItem.variant || cartItem.variant === "None") && + (!cartItem.extras || cartItem.extras.length === 0) && + (!cartItem.extrasgroupnew || cartItem.extrasgroupnew.length === 0) + ); + const handleClick = () => { if (restaurant && !restaurant.isOpened) { message.warning(t("menu.restaurantIsClosed")); @@ -46,7 +57,6 @@ export function AddToCartButton({ item }: { item: Product }) { } // If no options, add item directly to cart - console.log("hasOptions", hasOptions); if (!hasOptions) { dispatch( addItem({ @@ -66,6 +76,83 @@ export function AddToCartButton({ item }: { item: Product }) { } }; + const handleMinusClick = () => { + if (restaurant && !restaurant.isOpened) { + message.warning(t("menu.restaurantIsClosed")); + return; + } + + if (basicCartItem && basicCartItem.uniqueId) { + if (basicCartItem.quantity > 1) { + // Decrease quantity + dispatch( + updateQuantity({ + id: basicCartItem.id, + uniqueId: basicCartItem.uniqueId, + quantity: basicCartItem.quantity - 1, + }) + ); + } else { + // Remove item if quantity is 1 + dispatch(removeItem(basicCartItem.uniqueId)); + } + } else if (cartItemsForProduct.length > 0) { + // If no basic item found but items exist, remove the first one + const firstItem = cartItemsForProduct[0]; + if (firstItem.uniqueId) { + if (firstItem.quantity > 1) { + dispatch( + updateQuantity({ + id: firstItem.id, + uniqueId: firstItem.uniqueId, + quantity: firstItem.quantity - 1, + }) + ); + } else { + dispatch(removeItem(firstItem.uniqueId)); + } + } + } + }; + + const handlePlusClick = () => { + if (restaurant && !restaurant.isOpened) { + message.warning(t("menu.restaurantIsClosed")); + return; + } + + if (basicCartItem && basicCartItem.uniqueId) { + // Increase quantity of existing basic item + dispatch( + updateQuantity({ + id: basicCartItem.id, + uniqueId: basicCartItem.uniqueId, + quantity: basicCartItem.quantity + 1, + }) + ); + } else if (!hasOptions) { + // Add new basic item if no options + dispatch( + addItem({ + item: { + id: Number(item.id), + name: item.name, + price: item.price, + image: item.image, + description: item.description, + variant: "None", + isHasLoyalty: item.isHasLoyalty, + no_of_stamps_give: item.no_of_stamps_give, + }, + quantity: 1, + }), + ); + } else { + // If has options, navigate to product page + navigate(`/${subdomain}/product/${item.id}`); + } + }; + return isInCart ? ( <>
} + icon={} size="small" - onClick={handleClick} + onClick={handleMinusClick} className={styles.addButton} style={{ backgroundColor: "white", width: 28, height: 28, position: "absolute", - bottom: 8, - right: 64, + bottom: 9, + right: 70, minWidth: 28, }} /> + + {totalQuantity} +