update loyalty discount calculations

src/components/OrderSummary/OrderSummary.tsx

@@ -6,6 +6,7 @@ import {
   selectDiscountTotal,
   selectGrandTotal,
   selectHighestPricedLoyaltyItem,
+  totalTaxes,
 } from "features/order/orderSlice";
 import { OrderType } from "pages/checkout/hooks/types";
 import { useTranslation } from "react-i18next";
@@ -25,12 +26,13 @@ export default function OrderSummary() {
   const { orderType } = useAppSelector(selectCart);
   const subtotal = useAppSelector(selectCartTotal);
   const highestLoyaltyItem = useAppSelector(selectHighestPricedLoyaltyItem);
+  const totalTaxesAmount = useAppSelector(totalTaxes);
   const grandTotal = useAppSelector(selectGrandTotal);
   const discountAmount = useAppSelector(selectDiscountTotal);
 
   const isHasLoyaltyGift =
     (restaurant?.loyalty_stamps ?? 0) -
-      (restaurant?.customer_loyalty_points ?? 0) <=
+    (restaurant?.customer_loyalty_points ?? 0) <=
     0;
 
   const titlesStyle: CSSProperties = {
@@ -111,9 +113,9 @@ export default function OrderSummary() {
                 }}
               >
                 {isHasLoyaltyGift &&
-                useLoyaltyPoints &&
+                  useLoyaltyPoints &&
-                highestLoyaltyItem &&
+                  highestLoyaltyItem &&
-                restaurant?.is_loyalty_enabled === 1 ? (
+                  restaurant?.is_loyalty_enabled === 1 ? (
                   <Tag
                     color="green"
                     style={{
@@ -135,7 +137,7 @@ export default function OrderSummary() {
                   </Tag>
                 ) : null}
                 <ArabicPrice
-                  price={discountAmount}
+                  price={discountAmount + (useLoyaltyPoints && restaurant?.is_loyalty_enabled === 1 ? ((highestLoyaltyItem?.price || 0) * (totalTaxesAmount / 100)) : 0)}
                   textStyle={{ ...titlesStyle, color: "#434E5C" }}
                 />
               </div>

src/features/order/orderSlice.ts

@@ -824,21 +824,31 @@ export const selectLoyaltyItems = createSelector([selectOrderItems], (items) =>
   items.filter((item) => item.isHasLoyalty),
 );
 
+// Tax selectors
+export const selectTaxes = (state: RootState) => state.order.restaurant.taxes;
+export const totalTaxes = (state: RootState) => {
+  const taxes = selectTaxes(state);
+  const totalTaxes = taxes?.reduce((total, tax) => total + parseFloat(tax.percentage), 0) || 0;
+  const vat = (state.order.restaurant?.vat || 0);
+  return totalTaxes + vat;
+};
+
 export const selectHighestPricedLoyaltyItem = (state: RootState) => {
   const loyaltyItems = selectLoyaltyItems(state);
   if (loyaltyItems.length === 0) return null;
-
+  const highestItem = loyaltyItems.reduce((highest, current) =>
-  return loyaltyItems.reduce((highest, current) =>
     current.price > highest.price ? current : highest,
-  );
+  )
+  return highestItem;
 };
 
-export const selectDiscountTotal = (state: RootState) =>
+export const selectDiscountTotal = (state: RootState) => {
-  (state.order.discount.value / 100) * selectCartTotal(state) +
+  return (state.order.discount.value / 100) * selectCartTotal(state) +
-  (state.order.useLoyaltyPoints &&
+    (state.order.useLoyaltyPoints &&
-    state.order.restaurant?.is_loyalty_enabled === 1
+      state.order.restaurant?.is_loyalty_enabled === 1
-    ? selectHighestPricedLoyaltyItem(state)?.price || 0
+      ? ((selectHighestPricedLoyaltyItem(state)?.price || 0))
-    : 0);
+      : 0);
+}
 
 export const selectLoyaltyValidation = createSelector(
   [(state: RootState) => state.order.useLoyaltyPoints, selectLoyaltyItems],
@@ -853,8 +863,7 @@ export const selectLoyaltyValidation = createSelector(
   }),
 );
 
-// Tax selectors
+
-export const selectTaxes = (state: RootState) => state.order.restaurant.taxes;
 
 export const selectTaxAmount = (state: RootState) => {
   const subtotal = selectCartTotal(state) - selectDiscountTotal(state);