take "orderType" from url
This commit is contained in:
@@ -163,11 +163,8 @@ export default function AddressPage() {
|
||||
}}
|
||||
>
|
||||
<Link
|
||||
to={`/${id}/menu?orderType=delivery`}
|
||||
to={`/${id}/menu?orderType=${OrderType.Delivery}`}
|
||||
style={{ width: "100%" }}
|
||||
onClick={() => {
|
||||
localStorage.setItem("orderType", OrderType.Delivery);
|
||||
}}
|
||||
>
|
||||
<Button
|
||||
type="primary"
|
||||
|
||||
@@ -9,12 +9,12 @@ import { useScrollHandler } from "contexts/ScrollHandlerContext";
|
||||
import useBreakPoint from "hooks/useBreakPoint";
|
||||
import { useRestaurant } from "hooks/useRestaurant";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useParams } from "react-router-dom";
|
||||
import { useParams, useSearchParams } from "react-router-dom";
|
||||
import {
|
||||
useGetMenuQuery,
|
||||
useGetRestaurantDetailsQuery,
|
||||
} from "redux/api/others";
|
||||
import { useAppSelector, useAppDispatch } from "redux/hooks";
|
||||
import { useAppSelector } from "redux/hooks";
|
||||
import { default_image } from "utils/constants";
|
||||
import BackButton from "./components/BackButton";
|
||||
import { CartButton } from "./components/CartButton/CartButton";
|
||||
@@ -28,11 +28,10 @@ import SearchButton from "./components/SearchButton";
|
||||
import styles from "./menu.module.css";
|
||||
import { enumToSelectOptions } from "utils/helpers/helperFunctions.ts";
|
||||
import { OrderType } from "pages/checkout/hooks/types.ts";
|
||||
import { updateOrderType } from "features/order/orderSlice.ts";
|
||||
|
||||
function MenuPage() {
|
||||
const { id } = useParams();
|
||||
const dispatch = useAppDispatch();
|
||||
const [_, setSearchParams] = useSearchParams();
|
||||
const { isRTL } = useAppSelector((state) => state.locale);
|
||||
const { orderType } = useAppSelector((state) => state.order);
|
||||
const { t } = useTranslation();
|
||||
@@ -106,7 +105,7 @@ function MenuPage() {
|
||||
<Select
|
||||
value={orderType}
|
||||
onChange={(value) => {
|
||||
dispatch(updateOrderType(value));
|
||||
setSearchParams({ orderType: value });
|
||||
}}
|
||||
options={orderTypeOptions}
|
||||
variant="borderless"
|
||||
|
||||
@@ -53,7 +53,7 @@ export default function RestaurantServices({
|
||||
/>
|
||||
),
|
||||
color: "bg-blue-50 text-blue-600",
|
||||
href: `/${id}/menu?orderType=dine-in`,
|
||||
href: `/${id}/menu?orderType=${OrderType.DineIn}`,
|
||||
},
|
||||
]) ||
|
||||
[]),
|
||||
@@ -68,7 +68,7 @@ export default function RestaurantServices({
|
||||
/>
|
||||
),
|
||||
color: "bg-green-50 text-green-600",
|
||||
href: `/${id}/menu?orderType=pickup`,
|
||||
href: `/${id}/menu?orderType=${OrderType.Pickup}`,
|
||||
},
|
||||
]) ||
|
||||
[]),
|
||||
@@ -83,7 +83,7 @@ export default function RestaurantServices({
|
||||
/>
|
||||
),
|
||||
color: "bg-pink-50 text-pink-600",
|
||||
href: `/${id}/menu?orderType=gift`,
|
||||
href: `/${id}/menu?orderType=${OrderType.Gift}`,
|
||||
},
|
||||
]) ||
|
||||
[]),
|
||||
@@ -96,7 +96,7 @@ export default function RestaurantServices({
|
||||
<ToRoomIcon className={styles.serviceIcon + " " + styles.roomIcon} />
|
||||
),
|
||||
color: "bg-purple-50 text-purple-600",
|
||||
href: `/${id}/menu?orderType=room`,
|
||||
href: `/${id}/menu?orderType=${OrderType.ToRoom}`,
|
||||
},
|
||||
]) ||
|
||||
[]),
|
||||
@@ -111,7 +111,7 @@ export default function RestaurantServices({
|
||||
/>
|
||||
),
|
||||
color: "bg-orange-50 text-orange-600",
|
||||
href: `/${id}/menu?orderType=office`,
|
||||
href: `/${id}/menu?orderType=${OrderType.ToOffice}`,
|
||||
},
|
||||
]) ||
|
||||
[]),
|
||||
@@ -126,7 +126,7 @@ export default function RestaurantServices({
|
||||
/>
|
||||
),
|
||||
color: "bg-indigo-50 text-indigo-600",
|
||||
href: `/${id}/menu?orderType=booking`,
|
||||
href: `/${id}/menu?orderType=${OrderType.Booking}`,
|
||||
},
|
||||
]) ||
|
||||
[]),
|
||||
|
||||
@@ -5,7 +5,7 @@ import XIcon from "components/Icons/social/XIcon";
|
||||
import { LanguageSwitch } from "components/LanguageSwitch/LanguageSwitch";
|
||||
import ProText from "components/ProText";
|
||||
import ProTitle from "components/ProTitle";
|
||||
import { useAppSelector } from "redux/hooks";
|
||||
import { useAppSelector, useAppDispatch } from "redux/hooks";
|
||||
import styles from "./restaurant.module.css";
|
||||
import RestaurantServices from "./RestaurantServices";
|
||||
|
||||
@@ -13,13 +13,29 @@ import RestaurantServices from "./RestaurantServices";
|
||||
import Ads1 from "components/Ads/Ads1";
|
||||
import { Loader } from "components/Loader/Loader";
|
||||
import { useRestaurant } from "hooks/useRestaurant";
|
||||
import { useParams, Outlet, useLocation } from "react-router-dom";
|
||||
import {
|
||||
useParams,
|
||||
Outlet,
|
||||
useLocation,
|
||||
useSearchParams,
|
||||
} from "react-router-dom";
|
||||
import { useGetRestaurantDetailsQuery } from "redux/api/others";
|
||||
import LocalStorageHandler from "../menu/components/LocalStorageHandler";
|
||||
import { useEffect } from "react";
|
||||
import {
|
||||
updateOrderType,
|
||||
CART_STORAGE_KEYS,
|
||||
} from "features/order/orderSlice.ts";
|
||||
import { OrderType } from "pages/checkout/hooks/types.ts";
|
||||
|
||||
const storedOrderType = localStorage.getItem(CART_STORAGE_KEYS.ORDER_TYPE);
|
||||
|
||||
export default function RestaurantPage() {
|
||||
const dispatch = useAppDispatch();
|
||||
const param = useParams();
|
||||
const [searchParams] = useSearchParams();
|
||||
const { pathname } = useLocation();
|
||||
const { orderType } = useAppSelector((state) => state.order);
|
||||
const { isRTL } = useAppSelector((state) => state.locale);
|
||||
const { data: restaurant, isLoading } = useGetRestaurantDetailsQuery("595", {
|
||||
skip: !param.id,
|
||||
@@ -28,6 +44,18 @@ export default function RestaurantPage() {
|
||||
// Automatically load restaurant taxes when restaurant data is available
|
||||
useRestaurant(restaurant);
|
||||
|
||||
useEffect(() => {
|
||||
const urlOrderType = searchParams.get("orderType");
|
||||
if (urlOrderType && urlOrderType !== orderType)
|
||||
dispatch(updateOrderType(urlOrderType as OrderType));
|
||||
else if (
|
||||
storedOrderType &&
|
||||
storedOrderType !== "" &&
|
||||
storedOrderType !== orderType
|
||||
)
|
||||
dispatch(updateOrderType(storedOrderType as OrderType));
|
||||
}, [searchParams, orderType]);
|
||||
|
||||
if (isLoading) {
|
||||
return <Loader />;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user