payment section

src/app/[name]/(Dialogs)/order/checkout/[id]/components/AddressSection.tsx

@@ -92,9 +92,9 @@ export const AddressSection = () => {
     }
 
     // اگر آدرس انتخاب شده وجود ندارد، نمایش نده
-    if (!selectedAddress) {
-        return null;
-    }
+    // if (!selectedAddress) {
+    //     return null;
+    // }
 
     return (
         <>
@@ -112,9 +112,9 @@ export const AddressSection = () => {
                     </div>
                     <p className='mt-6 text-sm2'>
                         <div className='font-bold'>
-                            {selectedAddress.title}
+                            {selectedAddress?.title}
                         </div>
-                        {formatAddress(selectedAddress)}
+                        {selectedAddress && formatAddress(selectedAddress)}
                     </p>
                 </div>
             </section>

src/app/[name]/(Dialogs)/order/checkout/[id]/components/PaymentSection.tsx

@@ -3,14 +3,16 @@
 import { Card, Icon, Wallet2 } from 'iconsax-react';
 import { useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
-import { useGetPaymentMethod } from '../../hooks/useOrderData';
+import { useGetPaymentMethod, useSetPaymentMethod } from '../../hooks/useOrderData';
+import { useCheckoutStore } from '../../store/Store';
 
 type PaymentSectionProps = {
     paymentType: string;
     onPaymentTypeChange: (id: string) => void;
 };
 
-const getIconByMethod = (method: "CardOnDelivery" | "Cash" | "Online", gateway: string | null): Icon => {
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+const getIconByMethod = (method: "CardOnDelivery" | "Cash" | "Online", _gateway: string | null): Icon => {
     if (method === "Online" || method === "CardOnDelivery") {
         return Card;
     }
@@ -24,6 +26,8 @@ export const PaymentSection = ({ paymentType, onPaymentTypeChange }: PaymentSect
 
     const { t } = useTranslation('parallels', { keyPrefix: 'OrderDetail' });
     const { data: paymentMethod } = useGetPaymentMethod();
+    const { mutate: setPaymentMethod } = useSetPaymentMethod();
+    const { setIsSelectedPayment } = useCheckoutStore();
 
     const paymentOptions = useMemo(() => {
         if (!paymentMethod?.data) return [];
@@ -56,7 +60,14 @@ export const PaymentSection = ({ paymentType, onPaymentTypeChange }: PaymentSect
                             </label>
                             <input
                                 checked={paymentType === id}
-                                onChange={() => onPaymentTypeChange(id)}
+                                onChange={() => {
+                                    onPaymentTypeChange(id);
+                                    setPaymentMethod(id, {
+                                        onSuccess: () => {
+                                            setIsSelectedPayment(true);
+                                        },
+                                    });
+                                }}
                                 type='radio'
                                 name='paymentMethod'
                                 id={`paymentMethod${id}`}

src/app/[name]/(Dialogs)/order/checkout/hooks/useOrderData.ts

@@ -4,6 +4,7 @@ import {
   getShipmentMethod,
   setAddressCart,
   setDeliveryMethod,
+  setPaymentMethod,
 } from "../service/OrderService";
 
 export const useGetShipmentMethod = () => {
@@ -31,3 +32,9 @@ export const useSetDeliveryMethod = () => {
     mutationFn: setDeliveryMethod,
   });
 };
+
+export const useSetPaymentMethod = () => {
+  return useMutation({
+    mutationFn: setPaymentMethod,
+  });
+};

src/app/[name]/(Dialogs)/order/checkout/service/OrderService.ts

@@ -29,3 +29,10 @@ export const setDeliveryMethod = async (id: string) => {
   });
   return data;
 };
+
+export const setPaymentMethod = async (id: string) => {
+  const { data } = await api.patch("/public/cart/payment-method", {
+    paymentMethodId: id,
+  });
+  return data;
+};