menu: make back btn navigate to service page if token existed

src/layouts/app/hooks/useHeaderMenu.tsx

@@ -9,6 +9,7 @@ import LoyaltyAndRewardIcon from "components/Icons/LoyaltyAndRewardIcon";
 import MyOrderIcon from "components/Icons/MyOrderIcon";
 import { logoutThunk } from "features/auth/authSlice";
 import { setLocale, setLocalesThunk } from "features/locale/localeSlice";
+import { clearCart } from "features/order/orderSlice";
 import { toggleTheme } from "features/theme/themeSlice";
 import i18n from "i18n/i18n";
 import { useTranslation } from "react-i18next";
@@ -106,6 +107,7 @@ export default function useHeaderMenu() {
             label: <div>{t("common.logout")}</div>,
             onClick: () => {
               dispatch(logoutThunk());
+              dispatch(clearCart());
             },
           },
         ]

src/pages/menu/components/BackButton.tsx

@@ -1,15 +1,21 @@
 import { Button } from "antd";
 import BackIcon from "components/Icons/BackIcon";
 import NextIcon from "components/Icons/NextIcon";
+import { useNavigate } from "react-router-dom";
 import { useAppSelector } from "redux/hooks";
 
 interface BackButtonProps {
-  navigateBack?: boolean; // true = use router.back(), false = just clear state
+  customRoute?: string;
 }
 
-export default function BackButton({ navigateBack = true }: BackButtonProps) {
+export default function BackButton({ customRoute }: BackButtonProps) {
+  const router = useNavigate();
   const handleBack = () => {
-    if (navigateBack) window.history.back();
+    if (customRoute) {
+      router(customRoute);
+    } else {
+      router(-1);
+    }
   };
   const { isRTL } = useAppSelector((state) => state.locale);
 

src/pages/menu/page.tsx

@@ -38,6 +38,7 @@ function MenuPage() {
   const { subdomain } = useParams();
   const { isRTL } = useAppSelector((state) => state.locale);
   const { orderType } = useAppSelector((state) => state.order);
+  const { token } = useAppSelector((state) => state.auth);
   const { t } = useTranslation();
   const { data: restaurant, isLoading: isLoadingRestaurant } =
     useGetRestaurantDetailsQuery(subdomain, {
@@ -91,7 +92,9 @@ function MenuPage() {
             <div
               className={`${styles.headerFloatingBtn} ${styles.backButtonContainer}`}
             >
-              <BackButton />
+              <BackButton
+                {...(token ? { customRoute: `/${subdomain}` } : {})}
+              />
             </div>
             <div
               className={`${styles.headerFloatingBtn} ${styles.orderTypeSelectContainer} order-type-select-container`}