menu: on click on prduct open details as BS, also add redirect button to detials page if user click on redirect button

src/pages/checkout/page.tsx

@@ -3,7 +3,7 @@ import InputCard from "components/InputCard";
 import OrderSummary from "components/OrderSummary/OrderSummary";
 import PaymentMethods from "components/PaymentMethods/PaymentMethods";
 import ProHeader from "components/ProHeader/ProHeader";
-import { selectCart } from "features/order/orderSlice";
+import { selectCart, updateCollectionMethod } from "features/order/orderSlice";
 import { useTranslation } from "react-i18next";
 import { useAppSelector } from "redux/hooks";
 import styles from "../address/address.module.css";
@@ -13,11 +13,16 @@ import CheckoutButton from "./components/CheckoutButton";
 import { GiftCard } from "./components/GiftCard";
 import PhoneCard from "./components/phoneCard";
 import { OrderType } from "./hooks/types";
+import RewardWaiterCard from "pages/cart/components/RewardWaiterCard";
+import ProInputCard from "components/ProInputCard/ProInputCard";
+import ProRatioGroups from "components/ProRatioGroups/ProRatioGroups";
+import CouponCard from "pages/cart/components/CouponCard";
 
 export default function CheckoutPage() {
   const { t } = useTranslation();
   const [form] = Form.useForm();
-  const { phone, order, orderType } = useAppSelector(selectCart);
+  const { phone, order, orderType, collectionMethod } =
+    useAppSelector(selectCart);
   const { token } = useAppSelector((state) => state.auth);
   return (
     <>
@@ -53,8 +58,47 @@ export default function CheckoutPage() {
             {/* <RoomDetails />
             <OfficeDetails /> */}
             {/* <GiftDetails /> */}
-            <BriefMenu />
+            {/* <BriefMenu /> */}
             <PaymentMethods />
+            <CouponCard />
+
+            {/* Collection Method */}
+            {orderType === OrderType.Pickup && (
+              <ProInputCard title={t("cart.collectionMethod")}>
+                <Form.Item
+                  name="collectionMethod"
+                  required
+                  rules={[
+                    {
+                      required: true,
+                      message: t("cart.pleaseSelectCollectionMethod"),
+                    },
+                  ]}
+                >
+                  <ProRatioGroups
+                    options={[
+                      { label: t("cart.Cash"), value: "cod", price: "" },
+                      {
+                        label: t("cart.e-payment"),
+                        value: "paymentgateway",
+                        price: "",
+                      },
+                    ]}
+                    value={collectionMethod}
+                    onRatioClick={(value) => {
+                      if (value === "cod") {
+                        updateCollectionMethod(value);
+                      } else {
+                        updateCollectionMethod(value);
+                      }
+                    }}
+                  />
+                </Form.Item>
+              </ProInputCard>
+            )}
+
+            {/* Reward Your Waiter */}
+            <RewardWaiterCard />
             <OrderSummary />
           </Layout.Content>