cart refactor code

src/pages/cart/components/CartMobileTabletLayout.tsx

@@ -1,6 +1,6 @@
 import ProHeader from "components/ProHeader/ProHeader.tsx";
 import styles from "pages/cart/cart.module.css";
-import { Space, Card, Divider, Button, message } from "antd";
+import { Space, Card, Divider, Button } from "antd";
 import ProTitle from "components/ProTitle.tsx";
 import { Link, useParams } from "react-router-dom";
 import { colors, ProBlack2 } from "ThemeConstants.ts";
@@ -14,14 +14,12 @@ import ProInputCard from "components/ProInputCard/ProInputCard.tsx";
 import ProRatioGroups from "components/ProRatioGroups/ProRatioGroups.tsx";
 import {
   updateCollectionMethod,
-  updateEstimateTime,
   selectCart,
 } from "features/order/orderSlice.ts";
 
 import OrderSummary from "components/OrderSummary/OrderSummary.tsx";
-import { EstimateTimeBottomSheet } from "components/CustomBottomSheet/EstimateTimeBottomSheet.tsx";
-import { useAppSelector, useAppDispatch } from "redux/hooks.ts";
-import { useState } from "react";
+import { useAppSelector } from "redux/hooks.ts";
+
 import { useTranslation } from "react-i18next";
 import SpecialRequestCard from "pages/cart/components/SpecialRequestCard.tsx";
 import useBreakPoint from "hooks/useBreakPoint.ts";
@@ -29,12 +27,11 @@ import CouponCard from "pages/cart/components/CouponCard.tsx";
 import RewardWaiterCard from "pages/cart/components/RewardWaiterCard.tsx";
 import CarPlateCard from "pages/cart/components/CarPlateCard.tsx";
 import TableNumberCard from "pages/cart/components/TableNumberCard.tsx";
+import TimeEstimateCard from "pages/cart/components/timeEstimate/TimeEstimateCard.tsx";
 
 export default function CartMobileTabletLayout() {
   const { t } = useTranslation();
-  const dispatch = useAppDispatch();
-  const { items, estimateTimeDate, collectionMethod } =
-    useAppSelector(selectCart);
+  const { items, collectionMethod } = useAppSelector(selectCart);
   const { id } = useParams();
 
   const { isMobile, isTablet } = useBreakPoint();
@@ -44,18 +41,6 @@ export default function CartMobileTabletLayout() {
   const { themeName } = useAppSelector((state) => state.theme);
   const orderType = localStorage.getItem("orderType");
 
-  const [estimateWay, setEstimateWay] = useState("now");
-  const [isEstimateTimeOpen, setIsEstimateTimeOpen] = useState(false);
-
-  const handleEstimateTimeSave = (date: Date, time: string) => {
-    dispatch(updateEstimateTime({ date, time }));
-    message.success(t("cart.estimateTime") + " " + t("updatedSuccessfully"));
-  };
-
-  const handleEstimateTimeClose = () => {
-    setIsEstimateTimeOpen(false);
-  };
-
   const getMenuItemImageStyle = () => {
     if (isMobile) {
       return {
@@ -239,24 +224,7 @@ export default function CartMobileTabletLayout() {
 
           {/* Estimate Time */}
           {(orderType === "delivery" || orderType === "pickup") && (
-            <ProInputCard title={t("cart.estimateTime")}>
-              <ProRatioGroups
-                options={[
-                  { label: t("cart.now"), value: "now", price: "" },
-                  { label: t("cart.later"), value: "later", price: "" },
-                ]}
-                value={estimateWay}
-                onRatioClick={(value) => {
-                  if (value === "now") {
-                    setEstimateWay(value);
-                    handleEstimateTimeSave(new Date(), "now");
-                  } else {
-                    setEstimateWay(value);
-                    setIsEstimateTimeOpen(true);
-                  }
-                }}
-              />
-            </ProInputCard>
+            <TimeEstimateCard />
           )}
 
           {/* Collection Method */}
@@ -353,13 +321,6 @@ export default function CartMobileTabletLayout() {
       </div>
 
       {/* Mobile/Tablet Bottom Sheets */}
-
-      <EstimateTimeBottomSheet
-        isOpen={isEstimateTimeOpen}
-        onClose={handleEstimateTimeClose}
-        initialDate={estimateTimeDate}
-        onSave={handleEstimateTimeSave}
-      />
     </>
   );
 }