implemt QRBottomSheet

src/pages/pay/components/PayButton.tsx

@@ -10,7 +10,6 @@ import { CustomAmountChoiceBottomSheet } from "./splitBill/CustomAmountChoiceBot
 import { EqualltyChoiceBottomSheet } from "./splitBill/EqualltyChoiceBottomSheet";
 import { PayForYourItemsChoiceBottomSheet } from "./splitBill/PayForYourItemsChoiceBottomSheet";
 import { SplitBillChoiceBottomSheet } from "./splitBill/SplitBillChoiceBottomSheet";
-import { QRBottomSheet } from "./splitBill/QRBottomSheet";
 
 type SplitWay = "customAmount" | "equality" | "payForItems" | null;
 
@@ -27,7 +26,6 @@ export default function PayButton({ form }: { form: FormInstance }) {
   const [isCustomAmountOpen, setIsCustomAmountOpen] = useState(false);
   const [isEqualityOpen, setIsEqualityOpen] = useState(false);
   const [isPayForItemsOpen, setIsPayForItemsOpen] = useState(false);
-  const [isQROpen, setIsQROpen] = useState(false);
 
   const handleSplitBillClick = useCallback(() => {
     if (selectedSplitWay === "customAmount") {
@@ -105,9 +103,6 @@ export default function PayButton({ form }: { form: FormInstance }) {
           setIsCustomAmountOpen(false);
         }}
         onRemoveSplitWay={handleRemoveSplitWay}
-        onSave={() => {
-          setIsQROpen(true);
-        }}
       />
 
       <EqualltyChoiceBottomSheet
@@ -116,21 +111,15 @@ export default function PayButton({ form }: { form: FormInstance }) {
           setIsEqualityOpen(false);
         }}
         onRemoveSplitWay={handleRemoveSplitWay}
-        onSave={() => {
-          setIsQROpen(true);
-        }}
       />
 
       <PayForYourItemsChoiceBottomSheet
         isOpen={isPayForItemsOpen}
         onClose={() => {
           setIsPayForItemsOpen(false);
-          setIsQROpen(true);
         }}
         onRemoveSplitWay={handleRemoveSplitWay}
       />
-
-      <QRBottomSheet isOpen={isQROpen} onClose={() => setIsQROpen(false)} />
     </>
   );
 }

src/pages/pay/components/splitBill/CustomAmountChoiceBottomSheet.tsx

@@ -12,11 +12,11 @@ import { useAppDispatch, useAppSelector } from "redux/hooks";
 import ProText from "components/ProText";
 import ArabicPrice from "components/ArabicPrice";
 import styles from "./SplitBill.module.css";
+import { QRBottomSheet } from "./QRBottomSheet";
 
 interface SplitBillChoiceBottomSheetProps {
   isOpen: boolean;
   onClose: () => void;
-  onSave?: (value: string) => void;
   onRemoveSplitWay?: () => void;
 }
 
@@ -32,7 +32,7 @@ export function CustomAmountChoiceBottomSheet({
   const [amount, setAmount] = useState<string>(
     splitBillAmount > 0 ? splitBillAmount.toString() : "",
   );
-
+  const [isQROpen, setIsQROpen] = useState(false);
   useEffect(() => {
     if (isOpen && splitBillAmount > 0) {
       setAmount(splitBillAmount.toString());
@@ -42,6 +42,7 @@ export function CustomAmountChoiceBottomSheet({
   const handleSave = () => {
     const numAmount = parseFloat(amount) || 0;
     dispatch(updateSplitBillAmount(numAmount));
+    setIsQROpen(true);
     onClose();
   };
 
@@ -61,6 +62,7 @@ export function CustomAmountChoiceBottomSheet({
   const previewRemaining = originalTotalBill - currentAmount;
 
   return (
+    <>
       <ProBottomSheet
         isOpen={isOpen}
         onClose={onClose}
@@ -191,5 +193,7 @@ export function CustomAmountChoiceBottomSheet({
           </Button>
         </div>
       </ProBottomSheet>
+      <QRBottomSheet isOpen={isQROpen} onClose={() => setIsQROpen(false)} />
+    </>
   );
 }

src/pages/pay/components/splitBill/EqualltyChoiceBottomSheet.tsx

@@ -1,6 +1,6 @@
 import { Button } from "antd";
 import { ProBottomSheet } from "components/ProBottomSheet/ProBottomSheet.tsx";
-import { useMemo } from "react";
+import { useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 
 import ProText from "components/ProText";
@@ -15,6 +15,7 @@ import { ProGray1 } from "ThemeConstants";
 import PayForActions from "../../../split-bill/components/PayForActions";
 import TotalPeopleActions from "../../../split-bill/components/TotalPeopleActions";
 import styles from "./SplitBill.module.css";
+import { QRBottomSheet } from "./QRBottomSheet";
 
 interface SplitBillChoiceBottomSheetProps {
   isOpen: boolean;
@@ -37,7 +38,7 @@ export function EqualltyChoiceBottomSheet({
   const dispatch = useAppDispatch();
   const { tmp, splitBillAmount } = useAppSelector(selectCart);
   const grandTotal = useAppSelector(selectGrandTotal);
-
+  const [isQROpen, setIsQROpen] = useState(false);
   const splitBillTmp = tmp as SplitBillTmp;
   const totalPeople = splitBillTmp?.totalPeople || 2;
   const payFor = splitBillTmp?.payFor || 1;
@@ -55,6 +56,7 @@ export function EqualltyChoiceBottomSheet({
 
   const handleSave = () => {
     dispatch(updateSplitBillAmount(splitAmount));
+    setIsQROpen(true);
     onClose();
   };
 
@@ -65,6 +67,7 @@ export function EqualltyChoiceBottomSheet({
   };
 
   return (
+    <>
       <ProBottomSheet
         isOpen={isOpen}
         onClose={onClose}
@@ -341,5 +344,7 @@ export function EqualltyChoiceBottomSheet({
           </div>
         </div>
       </ProBottomSheet>
+      <QRBottomSheet isOpen={isQROpen} onClose={() => setIsQROpen(false)} />
+    </>
   );
 }

src/pages/pay/components/splitBill/PayForYourItemsChoiceBottomSheet.tsx

@@ -8,6 +8,7 @@ import ProText from "components/ProText";
 import { selectCart, updateSplitBillAmount } from "features/order/orderSlice";
 import { useAppDispatch, useAppSelector } from "redux/hooks";
 import styles from "./SplitBill.module.css";
+import { QRBottomSheet } from "./QRBottomSheet";
 
 interface SplitBillChoiceBottomSheetProps {
   isOpen: boolean;
@@ -25,7 +26,7 @@ export function PayForYourItemsChoiceBottomSheet({
   const dispatch = useAppDispatch();
   const { items } = useAppSelector(selectCart);
   const [selectedItems, setSelectedItems] = useState<Set<string>>(new Set());
-
+  const [isQROpen, setIsQROpen] = useState(false);
   // Calculate total for selected items
   const selectedTotal = items
     .filter((item) => selectedItems.has(item.uniqueId || item.id.toString()))
@@ -56,6 +57,7 @@ export function PayForYourItemsChoiceBottomSheet({
 
   const handleSave = () => {
     dispatch(updateSplitBillAmount(selectedTotal));
+    setIsQROpen(true);
     onClose();
   };
 
@@ -67,6 +69,7 @@ export function PayForYourItemsChoiceBottomSheet({
   };
 
   return (
+    <>
       <ProBottomSheet
         isOpen={isOpen}
         onClose={onClose}
@@ -221,5 +224,7 @@ export function PayForYourItemsChoiceBottomSheet({
           </Button>
         </div>
       </ProBottomSheet>
+      <QRBottomSheet isOpen={isQROpen} onClose={() => setIsQROpen(false)} />
+    </>
   );
 }