biteships

3 files changed, 121 insertions, 115 deletions

diff --git a/src/lib/checkout/components/Checkout.jsx b/src/lib/checkout/components/Checkout.jsx
index 33cfaa87..92a94834 100644
--- a/src/lib/checkout/components/Checkout.jsx
+++ b/src/lib/checkout/components/Checkout.jsx
@@ -34,6 +34,7 @@ import ExpedisiList from '../api/ExpedisiList';
 import { getVoucher } from '../api/getVoucher';
 import { useAddress } from '../stores/useAdress';
 import SectionExpedition from './SectionExpedition';
+import { useCheckout } from '../stores/stateCheckout';
 
 const SELF_PICKUP_ID = 32;
 
@@ -125,7 +126,6 @@ const Checkout = () => {
     }
   }, [addresses]);
 
-  const [products, setProducts] = useState(null);
   const [totalWeight, setTotalWeight] = useState(0);
   const [priceCheck, setPriceCheck] = useState(false);
   const [listExpedisi, setExpedisi] = useState([]);
@@ -133,8 +133,6 @@ const Checkout = () => {
   const [selectedExpedisi, setSelectedExpedisi] = useState(0);
   const [selectedCarrierId, setselectedCarrierId] = useState(0);
   const [selectedCarrier, setselectedCarrier] = useState(0);
-  const [biayaKirim, setBiayaKirim] = useState(0);
-  const [checkWeigth, setCheckWeight] = useState(false);
   const [selectedServiceType, setSelectedServiceType] = useState(null);
   const [selectedExpedisiService, setselectedExpedisiService] = useState(null);
   const [etd, setEtd] = useState(null);
@@ -149,11 +147,11 @@ const Checkout = () => {
   const [findCodeVoucher, SetFindVoucher] = useState(null);
   const [selisihHargaCode, SetSelisihHargaCode] = useState(null);
   const [buttonTerapkan, SetButtonTerapkan] = useState(false);
-  const [checkoutValidation, setCheckoutValidation] = useState(false);
   const [loadingVoucher, setLoadingVoucher] = useState(true);
   const [loadingRajaOngkir, setLoadingRajaOngkir] = useState(false);
   const [grandTotal, setGrandTotal] = useState(0);
-  const [hasFlashSale, setHasFlashSale] = useState(false);
+
+  const {checkWeigth, setCheckWeight, hasFlashSale, setHasFlashSale, checkoutValidation, setCheckoutValidation, biayaKirim, setBiayaKirim, products, setProducts} = useCheckout();
 
   const expedisiValidation = useRef(null);
 
@@ -571,6 +569,9 @@ const Checkout = () => {
     cartCheckout?.discountVoucher +
     (cartCheckout?.discountVoucherShipping || 0);
 
+
+  console.log('etd', etd, calculateEstimatedArrival(etd), splitDuration(etd));
+
   return (
     <>
       <BottomPopup
diff --git a/src/lib/checkout/components/SectionExpedition.jsx b/src/lib/checkout/components/SectionExpedition.jsx
index ead65a6f..27224e5b 100644
--- a/src/lib/checkout/components/SectionExpedition.jsx
+++ b/src/lib/checkout/components/SectionExpedition.jsx
@@ -1,27 +1,34 @@
-import React, { useEffect, useState } from 'react';
+import { Spinner } from '@chakra-ui/react';
+import axios from 'axios';
+import { AnimatePresence, motion } from 'framer-motion';
+import React, { useState } from 'react';
+import { useForm } from 'react-hook-form';
 import { useQuery } from 'react-query';
-import GetRatesCourierBiteship from '../api/getRatesCourier';
 import { useAddress } from '../stores/useAdress';
-import axios, { AxiosResponse } from 'axios';
-import { useForm, Controller } from 'react-hook-form';
-import { AnimatePresence, motion } from 'framer-motion';
-import { Spinner } from '@chakra-ui/react';
 
 import currencyFormat from '@/core/utils/currencyFormat';
+import { useCheckout } from '../stores/stateCheckout';
 
 function mappingItems(products) {
   return products?.map((item) => ({
     name: item.parent.name,
     description: `${item.code} - ${item.name}`,
     value: item.price.priceDiscount,
-    weight: item.weight,
+    weight: item.weight * 1000 * item.quantity,
     quantity: item.quantity,
+    canInstant: item.availableQuantity > item.quantity ? true : false,
   }));
 }
 
-function mappingCourier(couriers) {
+function mappingCourier(couriers, notIncludeInstant = false) {
   return couriers?.reduce((result, item) => {
     const { courier_code, courier_service_code } = item;
+    if (
+      notIncludeInstant &&
+      ['hours'].includes(item.shipment_duration_unit.toLowerCase())
+    ) {
+      return result;
+    }
 
     // Jika courier_code belum ada di result, buat objek baru untuknya
     if (!result[courier_code]) {
@@ -54,6 +61,10 @@ function mappingCourier(couriers) {
   }, {});
 }
 
+function hasCanInstantFalse(items) {
+  return items.some((item) => item.canInstant === false);
+}
+
 // interface CourierService {
 //   courier_name: string;
 //   courier_code: string;
@@ -86,8 +97,13 @@ export default function SectionExpedition({ products }) {
   const [selectedService, setSelectedService] = useState(null);
   const [isOpen, setIsOpen] = useState(false);
 
+  const { checkWeigth, checkoutValidation } = useCheckout();
+
   let destination = {};
   let items = mappingItems(products);
+
+  let notIncludeInstant = hasCanInstantFalse(items);
+  console.log('instanCourier', items);
   if (addressMaps) {
     destination = {
       origin_latitude: -6.3031123,
@@ -118,27 +134,31 @@ export default function SectionExpedition({ products }) {
     }
   };
 
-  // const fetchExpedition = async () => await GetRatesCourierBiteship({ destination, items });
   const { data, isLoading } = useQuery(
     ['expedition', JSON.stringify(destination), JSON.stringify(items)],
     fetchExpedition,
     {
-      enabled: Boolean(Object.keys(destination).length) && items?.length > 0,
+      enabled:
+        Boolean(Object.keys(destination).length) &&
+        items?.length > 0 &&
+        !checkWeigth,
       staleTime: Infinity,
       cacheTime: Infinity,
     }
   );
 
-  const couriers = mappingCourier(data?.data?.pricing);
+  console.log('data', data);
 
-  console.log('couriers', couriers);
+  const couriers = mappingCourier(data?.data?.pricing, true) || null;
 
   const onCourierChange = (e) => {
+    setIsOpen(false);
     const courier = e.target.value;
-    console.log('courier', courier);
+    setSelectedService(null);
     setSelectedCourier(courier);
+    console.log('courier', courier);
     // Menentukan layanan berdasarkan pengiriman yang dipilih
-    if (courier && couriers[courier]) {
+    if (courier && courier !== '0' && courier !== '32' && couriers[courier]) {
       setServiceOptions(Object.values(couriers[courier]?.service_type));
     } else {
       setServiceOptions([]);
@@ -156,7 +176,6 @@ export default function SectionExpedition({ products }) {
 
   return (
     <form onSubmit={handleSubmit(onSubmit)}>
-      {/* Dropdown untuk memilih jenis pengiriman */}
       <div className='px-4 py-2'>
         <div className='flex justify-between items-center'>
           <div className='font-medium'>Pilih Ekspedisi: </div>
@@ -167,8 +186,8 @@ export default function SectionExpedition({ products }) {
                 onChange={onCourierChange}
                 required
               >
-                <option value='0,0'>Pilih Pengiriman</option>
-                <option value='1,32'>SELF PICKUP</option>
+                <option value='0'>Pilih Pengiriman</option>
+                <option value='32'>SELF PICKUP</option>
                 {couriers &&
                   Object.values(couriers)?.map((expedisi) => (
                     <option
@@ -197,108 +216,89 @@ export default function SectionExpedition({ products }) {
                 )}
               </AnimatePresence>
             </div>
-            {/* {checkoutValidation && (
-            <span className='text-sm text-red-500'>
-              *silahkan pilih expedisi
-            </span>
-          )} */}
+            {checkoutValidation && (
+              <span className='text-sm text-red-500'>
+                *silahkan pilih expedisi
+              </span>
+            )}
           </div>
-          {/* <style jsx>{`
-          .shake {
-            animation: shake 0.4s ease-in-out;
-          }
-        `}</style> */}
+          <style jsx>{`
+            .shake {
+              animation: shake 0.4s ease-in-out;
+            }
+          `}</style>
         </div>
-        {/* {checkWeigth == true && (
-        <p className='mt-4 text-gray_r-11 leading-6'>
-          Mohon maaf, pengiriman hanya tersedia untuk self pickup karena
-          terdapat barang yang belum diatur beratnya. Mohon atur berat barang
-          dengan menghubungi admin melalui{' '}
-          <a
-            className='text-danger-500 inline'
-            href='https://api.whatsapp.com/send?phone=6281717181922'
-          >
-            tautan ini
-          </a>
-        </p>
-      )} */}
+        {checkWeigth == true && (
+          <p className='mt-4 text-gray_r-11 leading-6'>
+            Mohon maaf, pengiriman hanya tersedia untuk self pickup karena
+            terdapat barang yang belum diatur beratnya. Mohon atur berat barang
+            dengan menghubungi admin melalui{' '}
+            <a
+              className='text-danger-500 inline'
+              href='https://api.whatsapp.com/send?phone=6281717181922'
+            >
+              tautan ini
+            </a>
+          </p>
+        )}
       </div>
 
-      {selectedCourier && (
-        <div className='px-4 py-2'>
-          <div className='flex justify-between items-center'>
-            <div className='font-medium'>Tipe Layanan Ekspedisi: </div>
-            <div className='w-[350px]'>
-              <div className='relative'>
-                {/* Custom Select Input Field */}
-                <div
-                  className='w-full p-2 border rounded-lg bg-white cursor-pointer'
-                  onClick={() => setIsOpen(!isOpen)}
-                >
-                  {selectedService ? (
-                    <div className='flex justify-between'>
-                      <span>{selectedService.service_name}</span>
-                      <span className='font-semibold'>
-                        {currencyFormat(selectedService.price)}
+      {selectedCourier &&
+        selectedCourier !== '32' &&
+        selectedCourier !== '0' && (
+          <div className='px-4 py-2'>
+            <div className='flex justify-between items-center'>
+              <div className='font-medium'>Tipe Layanan Ekspedisi: </div>
+              <div className='w-[350px]'>
+                <div className='relative'>
+                  {/* Custom Select Input Field */}
+                  <div
+                    className='w-full p-2 border rounded-lg bg-white cursor-pointer'
+                    onClick={() => setIsOpen(!isOpen)}
+                  >
+                    {selectedService ? (
+                      <div className='flex justify-between'>
+                        <span>{selectedService.service_name}</span>
+                        <span className='font-semibold'>
+                          {currencyFormat(selectedService.price)}
+                        </span>
+                      </div>
+                    ) : (
+                      <span className='text-gray-500'>
+                        Pilih layanan pengiriman
                       </span>
+                    )}
+                  </div>
+
+                  {/* Dropdown Options */}
+                  {isOpen && (
+                    <div className='absolute w-full bg-white border rounded-lg mt-1 shadow-lg z-10'>
+                      {serviceOptions.map((service) => (
+                        <div
+                          key={service.service_type}
+                          onClick={() => handleSelect(service)}
+                          className='flex justify-between p-2 items-center hover:bg-gray-100 cursor-pointer'
+                        >
+                          <div>
+                            <p className='font-semibold'>
+                              {service.service_name}
+                            </p>
+                            <p className='text-gray-600 text-sm'>
+                              Estimasi Tiba {service.duration}
+                            </p>
+                          </div>
+                          <span className='font-semibold'>
+                            {currencyFormat(service.price)}
+                          </span>
+                        </div>
+                      ))}
                     </div>
-                  ) : (
-                    <span className='text-gray-500'>
-                      Pilih layanan pengiriman
-                    </span>
                   )}
                 </div>
-
-                {/* Dropdown Options */}
-                {isOpen && (
-                  <div className='absolute w-full bg-white border rounded-lg mt-1 shadow-lg z-10'>
-                    {serviceOptions.map((service) => (
-                      <div
-                        key={service.service_type}
-                        onClick={() => handleSelect(service)}
-                        className='flex justify-between p-2 items-center hover:bg-gray-100 cursor-pointer'
-                      >
-                        <div>
-                          <p className='font-semibold'>
-                            {service.service_name}
-                          </p>
-                          <p className='text-gray-600 text-sm'>
-                            Estimasi Tiba {service.duration}
-                          </p>
-                        </div>
-                        <span className='font-semibold'>{currencyFormat(service.price)}</span>
-                      </div>
-                    ))}
-                  </div>
-                )}
               </div>
-              {/* <select
-                className='form-input'
-                // onChange={(e) => setSelectedServiceType(e.target.value)}
-              >
-                {serviceOptions.map(
-                  (service: { service_name: string; service_type: string; duration: string, price: number }) => (
-                    <option
-                      value={service?.service_type}
-                      key={service.service_type}
-                    >
-                      <div className='flex items-center gap-x-4'>
-                        <div>
-                          <label>{service?.service_name}</label>
-                          <span> Estimasi Tiba {service?.duration} </span>
-                        </div>
-                        <div>
-                          <label>{service.price}</label>
-                        </div>
-                      </div>
-                    </option>
-                  )
-                )}
-              </select> */}
             </div>
           </div>
-        </div>
-      )}
+        )}
     </form>
   );
 }
diff --git a/src/lib/checkout/stores/stateCheckout.js b/src/lib/checkout/stores/stateCheckout.js
index 5d2904dd..97b0c64e 100644
--- a/src/lib/checkout/stores/stateCheckout.js
+++ b/src/lib/checkout/stores/stateCheckout.js
@@ -1,11 +1,16 @@
 import { create } from "zustand";
 
-export const stateCheckout = create((set) => ({
+export const useCheckout = create((set) => ({
+    products : null,
     checkWeigth : false,
     hasFlashSale : false,
     checkoutValidation : false,
-    setCheckWeigth : (checkWeigth) => set({ checkWeigth }),
+    biayaKirim : 0,
+    etd : null,
+    setCheckWeight : (checkWeigth) => set({ checkWeigth }),
     setHasFlashSale : (hasFlashSale) => set({ hasFlashSale }),
     setCheckoutValidation : (checkoutValidation) => set({ checkoutValidation }),
+    setBiayaKirim : (biayaKirim) => set({ biayaKirim }),
+    setProducts : (products) => set({ products }),
 
 }))
\ No newline at end of file