enhance loyalty card

src/components/LoyaltyCard/LoyaltyCard.tsx

@@ -19,6 +19,7 @@ const LoyaltyCard = () => {
       (restaurant?.customer_loyalty_points || 0) <=
     0;
 
+
   return (
     <div className={styles.loyaltyContainer}>
       <Card className={styles.loyaltyCard}>
@@ -35,62 +36,64 @@ const LoyaltyCard = () => {
             </div>
           </div>
         )}
-        <Row
-          justify="space-between"
-          align="middle"
-          style={{ marginBottom: "0.5rem" }}
-        >
-          <Col>
-            <Row align="middle" gutter={[8, 8]}>
-              <Col>
-                <LoyaltyIcon className={styles.loyaltyIcon} />
-              </Col>
-              <Col>
-                <ProText style={{ fontSize: "1rem", fontWeight: 400 }}>
-                  {t("menu.loyaltyPoints")}
-                </ProText>
-              </Col>
-            </Row>
-            <ProText
-              type="secondary"
-              strong
-              style={{
-                fontSize: "14px",
-                fontWeight: 700,
-                position: "relative",
-                top: -2,
-              }}
-            >
-              {token &&
-                t("menu.loyaltyDescription", {
-                  value: restaurant?.loyalty_stamps ?? 0,
-                })}
-              {!token && (
-                <div style={{ paddingTop: 4 }}>
-                  <Link
-                    to={`/${subdomain}/login`}
-                    style={{
-                      color: colors.primary,
-                      textDecoration: "underline",
-                      fontSize: "14px",
-                      fontWeight: 400,
-                      padding: "0 4px",
-                    }}
-                  >
-                    {t("menu.joinUs")}
-                  </Link>
-                  <span style={{ fontSize: "14px", color: colors.secondary }}>
-                    {t("menu.joinUsDescription")}
-                  </span>
-                </div>
-              )}
-            </ProText>
-          </Col>
-          <Col>
-            <PresentIcon />
-          </Col>
-        </Row>
-        {token && (
+        {!isHasLoyaltyGift && (
+          <Row
+            justify="space-between"
+            align="middle"
+            style={{ marginBottom: "0.5rem" }}
+          >
+            <Col>
+              <Row align="middle" gutter={[8, 8]}>
+                <Col>
+                  <LoyaltyIcon className={styles.loyaltyIcon} />
+                </Col>
+                <Col>
+                  <ProText style={{ fontSize: "1rem", fontWeight: 400 }}>
+                    {t("menu.loyaltyPoints")}
+                  </ProText>
+                </Col>
+              </Row>
+              <ProText
+                type="secondary"
+                strong
+                style={{
+                  fontSize: "14px",
+                  fontWeight: 700,
+                  position: "relative",
+                  top: -2,
+                }}
+              >
+                {token &&
+                  t("menu.loyaltyDescription", {
+                    value: restaurant?.loyalty_stamps ?? 0,
+                  })}
+                {!token && (
+                  <div style={{ paddingTop: 4 }}>
+                    <Link
+                      to={`/${subdomain}/login`}
+                      style={{
+                        color: colors.primary,
+                        textDecoration: "underline",
+                        fontSize: "14px",
+                        fontWeight: 400,
+                        padding: "0 4px",
+                      }}
+                    >
+                      {t("menu.joinUs")}
+                    </Link>
+                    <span style={{ fontSize: "14px", color: colors.secondary }}>
+                      {t("menu.joinUsDescription")}
+                    </span>
+                  </div>
+                )}
+              </ProText>
+            </Col>
+            <Col>
+              <PresentIcon />
+            </Col>
+          </Row>
+        )}
+        {token && !isHasLoyaltyGift && (
           <Row justify="space-between" align="middle">
             <Col>
               <div className={styles.presentIcon}>

src/components/OrderSummary/OrderSummary.tsx

@@ -11,6 +11,7 @@ import {
 } from "features/order/orderSlice";
 import { OrderType } from "pages/checkout/hooks/types";
 import { useTranslation } from "react-i18next";
+import { useParams } from "react-router-dom";
 import { useGetRestaurantDetailsQuery } from "redux/api/others";
 import { useAppDispatch, useAppSelector } from "redux/hooks";
 import ProText from "../ProText";
@@ -20,7 +21,8 @@ import styles from "./OrderSummary.module.css";
 export default function OrderSummary() {
   const { t } = useTranslation();
   const { useLoyaltyPoints } = useAppSelector(selectCart);
-  const { data: restaurant } = useGetRestaurantDetailsQuery("595");
+  const { subdomain } = useParams();
+  const { data: restaurant } = useGetRestaurantDetailsQuery(subdomain);
   const { orderType } = useAppSelector(selectCart);
   const dispatch = useAppDispatch();
   const subtotal = useAppSelector(selectCartTotal);
@@ -53,7 +55,11 @@ export default function OrderSummary() {
           <div className={styles.summaryRow}>
             <ProText type="secondary">{t("cart.discount")}</ProText>
             <ArabicPrice
-              price={useLoyaltyPoints ? highestLoyaltyItem?.price || 0 : 0}
+              price={
+                useLoyaltyPoints && restaurant?.is_loyalty_enabled === 1
+                  ? highestLoyaltyItem?.price || 0
+                  : 0
+              }
             />
           </div>
           <div className={styles.summaryRow}>
@@ -69,7 +75,7 @@ export default function OrderSummary() {
           </div>
         </Space>
 
-        {isHasLoyaltyGift && (
+        {isHasLoyaltyGift && restaurant?.is_loyalty_enabled === 1 && (
           <>
             <br />
             <br />
@@ -90,14 +96,17 @@ export default function OrderSummary() {
           </div>
         )}
 
-        {isHasLoyaltyGift && useLoyaltyPoints && highestLoyaltyItem && (
-          <div style={{ marginTop: 8, color: "green", fontSize: "12px" }}>
-            {t("cart.loyaltyDiscountApplied", {
-              itemName: highestLoyaltyItem.name,
-              amount: Math.round(highestLoyaltyItem.price || 0).toFixed(2),
-            })}
-          </div>
-        )}
+        {isHasLoyaltyGift &&
+          useLoyaltyPoints &&
+          highestLoyaltyItem &&
+          restaurant?.is_loyalty_enabled === 1 && (
+            <div style={{ marginTop: 8, color: "green", fontSize: "12px" }}>
+              {t("cart.loyaltyDiscountApplied", {
+                itemName: highestLoyaltyItem.name,
+                amount: Math.round(highestLoyaltyItem.price || 0).toFixed(2),
+              })}
+            </div>
+          )}
       </Card>
     </>
   );