<iman> update merchant

1 files changed, 212 insertions, 810 deletions

diff --git a/src/lib/merchant/components/SyaratDagang.jsx b/src/lib/merchant/components/SyaratDagang.jsx
index 3451fa96..96681064 100644
--- a/src/lib/merchant/components/SyaratDagang.jsx
+++ b/src/lib/merchant/components/SyaratDagang.jsx
@@ -51,43 +51,8 @@ const SyaratDagang = forwardRef(({ handleIsError, isKonfirmasi }, ref) => {
     resolver: yupResolver(validationSchema),
     defaultValues,
   });
-  const list_unit = [
-    {
-      value: 'Manufacturing',
-      label: 'Manufacturing',
-    },
-    {
-      value: 'Hospitality',
-      label: 'Hospitality',
-    },
-    {
-      value: 'Automotive',
-      label: 'Automotive',
-    },
-    {
-      value: 'Retail',
-      label: 'Retail',
-    },
-    {
-      value: 'Maining',
-      label: 'Maining',
-    },
-    {
-      value: 'Lain - Lain',
-      label: 'Lain - Lain',
-    },
-  ];
-  const [state, setState] = useState([]);
-  const [cities, setCities] = useState([]);
-  const [districts, setDistricts] = useState([]);
-  const [fileNames, setFileNames] = useState({});
-  const [DeatailFile, setDetailFile] = useState({});
-  const [subDistricts, setSubDistricts] = useState([]);
   const [bigData, setbigData] = useState([]);
-  const [zips, setZips] = useState([]);
   const [isExample, setIsExample] = useState(false);
-  const [BannerMerchant, setBannerMerchant] = useState();
-  const [isPkp, setIsPkp] = useState(false);
 
   const recaptchaRef = useRef(null);
   const router = useRouter();
@@ -96,7 +61,6 @@ const SyaratDagang = forwardRef(({ handleIsError, isKonfirmasi }, ref) => {
     const loadData = async () => {
       const data = await getMerchantApi();
       setbigData(data);
-      console.log('data vendor', data);
       if (data) {
         reset({
           isKembaliBarang: data.isKembaliBarang || '',
@@ -134,12 +98,13 @@ const SyaratDagang = forwardRef(({ handleIsError, isKonfirmasi }, ref) => {
 
     loadData();
   }, []);
-  console.log('sertifikatProduk', watch('sertifikatProduk'));
   useEffect(() => {
-    window.scrollTo({
-      top: 0,
-      behavior: 'smooth',
-    });
+    if (!isKonfirmasi) {
+      window.scrollTo({
+        top: 0,
+        behavior: 'smooth',
+      });
+    }
   }, []);
   useImperativeHandle(ref, () => () => {
     handleSubmit(onSubmitHandler)();
@@ -148,16 +113,7 @@ const SyaratDagang = forwardRef(({ handleIsError, isKonfirmasi }, ref) => {
   if (auth == false) {
     router.push(`/login?next=${encodeURIComponent('/daftar-merchant')}`);
   }
-  const dataTerhitungSejak = [
-    { value: 1, label: 'Terima PO' },
-    { value: 2, label: 'Barang Dikirimkan' },
-    { value: 3, label: 'Tukar Faktur' },
-  ];
-  const dataBisnisType = [
-    { value: 1, label: 'PT' },
-    { value: 2, label: 'CV' },
-    { value: 3, label: 'Perorangan' },
-  ];
+
   const dataGaransi = [
     { value: 1, label: '6 Bulan Garansi' },
     { value: 2, label: '1 Tahun Garansi' },
@@ -169,14 +125,6 @@ const SyaratDagang = forwardRef(({ handleIsError, isKonfirmasi }, ref) => {
     { value: 'minimum pembelian', label: 'Minimum pembelian' },
   ];
 
-  const dataCategoryPerusahaan = [
-    { value: 1, label: 'Principal (Pemegang merk/Produsen)' },
-    { value: 2, label: 'Sole Distributor (Distributor Tunggal)' },
-    { value: 3, label: 'Authorized Distributor (Distributor Resmi)' },
-    { value: 4, label: 'Importer (Pengimpor Barang)' },
-    { value: 5, label: 'Wholesaler (Pedagang Besar)' },
-  ];
-
   const category_produk = [
     { id: 0, name: 'TKDN' },
     { id: 1, name: 'SNI' },
@@ -184,8 +132,6 @@ const SyaratDagang = forwardRef(({ handleIsError, isKonfirmasi }, ref) => {
     { id: 3, name: '' },
   ];
 
-  const firstColumn = category_produk;
-
   const [selectedIds, setSelectedIds] = useState(
     watch('sertifikatProduk')
       ? watch('sertifikatProduk').split(',').map(Number)
@@ -193,7 +139,6 @@ const SyaratDagang = forwardRef(({ handleIsError, isKonfirmasi }, ref) => {
     // form.sertifikatProduk ? form.sertifikatProduk.split(',').map(Number) : [] // Parse string menjadi array angka
     // [] // Parse string menjadi array angka
   );
-  console.log('selectedIds', selectedIds);
   const handleCheckboxChange = (id) => {
     const updatedSelected = selectedIds.includes(id)
       ? selectedIds.filter((selectedId) => selectedId !== id)
@@ -225,149 +170,7 @@ const SyaratDagang = forwardRef(({ handleIsError, isKonfirmasi }, ref) => {
   const handleCheckboxTenggatWaktuChange = (value) => {
     setValue('tenggatWaktu', `${value}`);
   };
-  useEffect(() => {
-    const loadProfile = async () => {
-      try {
-        const dataProfile = await addressApi({
-          id: auth.parentId ? auth.parentId : auth.partnerId,
-        });
-        if (dataProfile.companyType == 'pkp') {
-          setIsPkp(true);
-        }
-        setValue('company', dataProfile?.name);
-        setValue('address', dataProfile?.alamatBisnis);
-        setValue('state', parseInt(dataProfile.stateId.id));
-        setValue('city', parseInt(dataProfile.city.id));
-        setValue('district', parseInt(dataProfile.district.id));
-        setValue('subDistrict', parseInt(dataProfile.subDistrict.id));
-        setValue('zip', parseInt(dataProfile.zip));
-      } catch (error) {
-        console.error('Error loading profile:', error);
-      }
-    };
-
-    loadProfile();
-  }, [auth?.parentId]);
-
-  useEffect(() => {
-    const loadState = async () => {
-      let dataState = await stateApi({ tempo: false });
-      dataState = dataState.map((state) => ({
-        value: state.id,
-        label: state.name,
-      }));
-      setState(dataState);
-    };
-    loadState();
-  }, []);
-
-  const watchState = watch('state');
-  useEffect(() => {
-    if (auth == false) {
-      return;
-    }
-    if (watchState) {
-      // setValue('city', '');
-      const loadCities = async () => {
-        let dataCities = await cityApi({ stateId: watchState });
-        dataCities = dataCities?.map((city) => ({
-          value: city.id,
-          label: city.name,
-        }));
-        setCities(dataCities);
-      };
-      loadCities();
-    }
-  }, [auth, watchState]);
-
-  const watchCity = watch('city');
-
-  useEffect(() => {
-    if (watchCity) {
-      setValue('district', '');
-      const loadDistricts = async () => {
-        let dataDistricts = await districtApi({ cityId: watchCity });
-        dataDistricts = dataDistricts.map((district) => ({
-          value: district.id,
-          label: district.name,
-        }));
-        setDistricts(dataDistricts);
-      };
-      loadDistricts();
-    }
-  }, [watchCity]);
-
-  const watchDistrict = watch('district');
-  useEffect(() => {
-    if (watchDistrict) {
-      setValue('subDistrict', '');
-      const loadSubDistricts = async () => {
-        let dataSubDistricts = await subDistrictApi({
-          districtId: watchDistrict,
-        });
-        dataSubDistricts = dataSubDistricts.map((district) => ({
-          value: district.id,
-          label: district.name,
-        }));
-        setSubDistricts(dataSubDistricts);
-      };
-      loadSubDistricts();
-    }
-  }, [watchDistrict]);
-
-  const watchsubDistrict = watch('subDistrict');
-
-  useEffect(() => {
-    let kelurahan = '';
-    let kecamatan = '';
-
-    if (watchDistrict) {
-      setValue('zip', '');
-      for (const data in districts) {
-        if (districts[data].value == watchDistrict) {
-          kecamatan = districts[data].label.toLowerCase();
-        }
-      }
-    }
-
-    if (watchsubDistrict) {
-      for (const data in subDistricts) {
-        if (subDistricts[data].value == watchsubDistrict) {
-          kelurahan = subDistricts[data].label.toLowerCase();
-        }
-      }
-      const loadZip = async () => {
-        const response = await fetch(
-          `https://alamat.thecloudalert.com/api/cari/index/?keyword=${kelurahan}`
-        );
-
-        let dataMasuk = []; // Array untuk menyimpan kode pos yang sudah diproses
-
-        const result = await response.json();
-
-        // Filter dan map data
-        const dataZips = result.result
-          .filter((zip) => zip.kecamatan.toLowerCase() === kecamatan) // Filter berdasarkan kecamatan
-          .filter((zip) => {
-            // Pastikan zip.kodepos belum ada di dataMasuk
-            if (dataMasuk.includes(zip.kodepos)) {
-              return false; // Jika sudah ada, maka skip (tidak akan ditambahkan)
-            } else {
-              dataMasuk.push(zip.kodepos); // Tambahkan ke dataMasuk
-              return true; // Tambahkan zip ke hasil
-            }
-          })
-          .map((zip) => ({
-            value: parseInt(zip.kodepos),
-            label: zip.kodepos,
-          }));
-
-        setZips(dataZips); // Set hasil ke state
-      };
 
-      loadZip();
-    }
-  }, [watchsubDistrict, subDistricts]);
   const onSubmitHandler = async (values) => {
     const toastId = toast.loading('Mengirimkan formulir merchant...');
     const data = {
@@ -407,40 +210,6 @@ const SyaratDagang = forwardRef(({ handleIsError, isKonfirmasi }, ref) => {
   }
   // Tetap di bagian atas, tidak boleh ada kondisi sebelum hook
 
-  const handleFileChange = async (event) => {
-    let fileBase64 = '';
-    const file = event.target.files[0];
-
-    if (file.size > 500000) {
-      try {
-        const toastId = toast.loading('mencoba mengompresi file...');
-        // Compress image file
-        const options = {
-          maxSizeMB: 0.5, // Target size in MB
-          maxWidthOrHeight: 1920, // Adjust as needed
-          useWebWorker: true,
-        };
-        const compressedFile = await imageCompression(file, options);
-        toast.success('berhasil mengompresi file', { duration: 4000 });
-        // Convert compressed file to Base64
-        fileBase64 = await getFileBase64(compressedFile);
-      } catch (error) {
-        toast.error('Gagal mengompresi file', { duration: 4000 });
-      }
-    } else {
-      // Convert file to Base64
-      fileBase64 = await getFileBase64(file);
-    }
-    const fieldName = event.target.name; // Nama input file
-    setDetailFile((prev) => ({
-      ...prev,
-      [fieldName]: file ? fileBase64 : '', // Tambahkan atau perbarui file di state
-    }));
-    setFileNames((prev) => ({
-      ...prev,
-      [fieldName]: file ? file.name : '', // Tambahkan atau perbarui file di state
-    }));
-  };
   return (
     <>
       <BottomPopup
@@ -762,25 +531,9 @@ const SyaratDagang = forwardRef(({ handleIsError, isKonfirmasi }, ref) => {
       </DesktopView>
       <MobileView>
         <div className='container flex flex-col items-star py-4'>
-          {BannerMerchant && (
-            <ImageBanner
-              src={BannerMerchant}
-              alt='FORM MERCHANT'
-              width={1000}
-              height={160}
-              className='w-full mt-6'
-            />
+          {!isKonfirmasi && (
+            <h2 className='font-semibold mb-6 text-xl'>Syarat Perdagangan</h2>
           )}
-          <h1 className='text-h-sm md:text-title-sm font-semibold mb-6 text-center'>
-            Form Merchant
-          </h1>
-          <div className='text-center mb-6'>
-            Lorem ipsum dolor sit amet consectetur. Commodo suspendisse at enim
-            magnis ut quisque rhoncus. Felis volutpat fringilla sollicitudin
-            ultricies. Enim non eget in lorem netus. Nisl pharetra accumsan diam
-            suspendisse.
-          </div>
-          <h2 className='font-semibold mb-6'>Informasi Perusahaan</h2>
 
           <div className='w-full mt-4'>
             <form
@@ -790,583 +543,226 @@ const SyaratDagang = forwardRef(({ handleIsError, isKonfirmasi }, ref) => {
               <div className='w-full flex flex-col'>
                 <div className='w-full'>
                   <label className='form-label  text-nowrap'>
-                    Nama Perusahaan
+                    Syarat Pengembalian Barang
                   </label>
-                  <input
-                    {...register('company')}
-                    placeholder='Format: PT. INDOTEKNIK DOTCOM GEMILANG'
-                    type='text'
-                    className='form-input'
-                  />
-                  <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errors.company?.message}
+                  <div className='flex gap-x-4 flex-col w-full'>
+                    <RadioGroup
+                      onChange={handleCheckboxReturChange}
+                      value={watch('isKembaliBarang')}
+                    >
+                      <Stack direction='column'>
+                        <div className='flex flex-row text-nowrap gap-2'>
+                          <Radio colorScheme='red' value='ya'>
+                            Ya, dapat diretur
+                          </Radio>
+                          {watch('isKembaliBarang') == 'ya' && (
+                            <textarea
+                              {...register('textReturn')}
+                              placeholder='jelaskan syarat pengembalian'
+                              type='textarea'
+                              className='form-input w-full'
+                            />
+                          )}
+                        </div>
+                        <Radio colorScheme='red' value='tidak'>
+                          Tidak dapat diretur
+                        </Radio>
+                      </Stack>
+                    </RadioGroup>
+                    <div className='text-caption-2 text-danger-500 mt-1'>
+                      {errors.isKembaliBarang?.message}
+                    </div>
                   </div>
-                  <span className='opacity-65 text-xs'>
-                    Isi detail perusahaan sesuai dengan nama yang terdaftar{' '}
-                  </span>
                 </div>
               </div>
               <div className='w-full flex flex-col'>
                 <div className='w-full'>
-                  <label className='form-label  text-nowrap'>Nama PIC</label>
-                  <input
-                    {...register('PICName')}
-                    placeholder='Masukkan Nama PIC '
-                    type='text'
-                    className='form-input'
-                  />
-                  <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errors.PICName?.message}
+                  <label className='form-label  text-nowrap'>
+                    Tenggat Waktu Perubahan Harga
+                  </label>
+                  <div className='flex gap-x-4 flex-col w-full'>
+                    <RadioGroup
+                      onChange={handleCheckboxTenggatWaktuChange}
+                      value={watch('tenggatWaktu')}
+                    >
+                      <Stack direction='column'>
+                        <Radio
+                          colorScheme='red'
+                          value='14'
+                          onChange={() => setValue('customTenggatWaktu', ' ')}
+                        >
+                          14 hari sejak data dikirimkan
+                        </Radio>
+                        <Radio
+                          colorScheme='red'
+                          value='30'
+                          onChange={() => setValue('customTenggatWaktu', ' ')}
+                        >
+                          30 hari sejak data dikirimkan
+                        </Radio>
+                        <div className='flex flex-row gap-2'>
+                          <Radio colorScheme='red' value='custom'></Radio>
+                          <input
+                            {...register('customTenggatWaktu')}
+                            placeholder='Masukkan jumlah hari untuk tenggat waktu'
+                            type='text'
+                            onFocus={() => setValue('tenggatWaktu', 'custom')}
+                            className='form-input mt-2'
+                          />
+                        </div>
+                      </Stack>
+                    </RadioGroup>
+                    <div className='text-caption-2 text-danger-500 mt-1'>
+                      {errors.tenggatWaktu?.message}
+                    </div>
                   </div>
-                  <span className='opacity-65 text-xs'>
-                    Isi dengan nama sales / penanggung jawab
-                  </span>
                 </div>
               </div>
               <div className='w-full flex flex-col'>
                 <div className='w-full'>
-                  <label className='form-label text-nowrap'>
-                    Alamat Perusahaan
+                  <label className='form-label  text-nowrap'>
+                    Dokumen/Sertifikat yang Dimiliki Oleh Brand
                   </label>
-                  <input
-                    {...register('address')}
-                    placeholder='Masukkan alamat lengkap perusahaan'
-                    type='text'
-                    className='form-input'
-                  />
-                  <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errors.address?.message}
-                  </div>
-                  <div className='flex flex-row w-full justify-between gap-2'>
-                    <div className='provinsi w-full'>
-                      <Controller
-                        name='state'
-                        control={control}
-                        render={(props) => (
-                          <HookFormSelect
-                            {...props}
-                            options={state}
-                            placeholder='Provinsi'
-                          />
-                        )}
-                      />
-                      <div className='text-caption-2 text-danger-500 mt-1'>
-                        {errors.state?.message}
-                      </div>
-                    </div>
-                    <div className='kab w-full'>
-                      <Controller
-                        name='city'
-                        control={control}
-                        render={(props) => (
-                          <HookFormSelect
-                            {...props}
-                            options={cities}
-                            disabled={!watchState}
-                            placeholder='Kab/Kota'
-                          />
-                        )}
+                  <div
+                    className='flex flex-col gap-2 w-full'
+                    //   ref={categoryProdukRef}
+                  >
+                    <Checkbox
+                      colorScheme='red'
+                      key={0}
+                      onChange={() => handleCheckboxChange(0)}
+                      isChecked={isChecked(0)}
+                    >
+                      TKDN
+                    </Checkbox>
+                    <Checkbox
+                      colorScheme='red'
+                      key={1}
+                      onChange={() => handleCheckboxChange(1)}
+                      isChecked={isChecked(1)}
+                    >
+                      SNI
+                    </Checkbox>
+                    <Checkbox
+                      colorScheme='red'
+                      key={2}
+                      onChange={() => handleCheckboxChange(2)}
+                      isChecked={isChecked(2)}
+                    >
+                      K3L
+                    </Checkbox>
+                    <div className='flex flex-row gap-2 w-full'>
+                      <Checkbox
+                        colorScheme='red'
+                        key={3}
+                        onChange={() => handleCheckboxChange(3)}
+                        isChecked={isChecked(3)}
+                      ></Checkbox>
+                      <input
+                        {...register('customSertifikatProduk')}
+                        placeholder='Masukkan Dokumen/Sertifikat yang dimiliki oleh brand'
+                        type='text'
+                        onFocus={() => {
+                          custom_sertifikat_produk_handle();
+                        }}
+                        // onFocus={() => handleCheckboxChange(4)}
+                        className='form-input mt-2'
                       />
-                      <div className='text-caption-2 text-danger-500 mt-1'>
-                        {errors.city?.message}
-                      </div>
                     </div>
                   </div>
-                  <div className='flex flex-row w-full justify-between gap-2'>
-                    <div className='kec w-full'>
-                      <Controller
-                        name='district'
-                        control={control}
-                        render={(props) => (
-                          <HookFormSelect
-                            {...props}
-                            options={districts}
-                            disabled={!watchState || !watchCity}
-                            placeholder='Kecamatan'
-                          />
-                        )}
-                      />
-                      <div className='text-caption-2 text-danger-500 mt-1'>
-                        {errors.district?.message}
-                      </div>
-                    </div>
-                    <div className='kel w-full'>
-                      <Controller
-                        name='subDistrict'
-                        control={control}
-                        render={(props) => (
-                          <HookFormSelect
-                            {...props}
-                            options={subDistricts}
-                            disabled={!watchDistrict}
-                            placeholder='Kelurahan'
-                          />
-                        )}
-                      />
-                      <div className='text-caption-2 text-danger-500 mt-1'>
-                        {errors.subDistrict?.message}
-                      </div>
-                    </div>
-                    <div className='zip  w-full'>
-                      <Controller
-                        name='zip'
-                        control={control}
-                        render={(props) => (
-                          <>
-                            {zips.length > 0 ? (
-                              <HookFormSelect
-                                {...props}
-                                options={zips}
-                                disabled={!watchsubDistrict}
-                                placeholder='Zip'
-                              />
-                            ) : (
-                              <input
-                                {...register('zip')}
-                                placeholder='Kode Pos'
-                                type='number'
-                                className='form-input'
-                                disabled={!watchsubDistrict}
-                              />
-                            )}
-                          </>
-                        )}
-                      />
-                      <div className='text-caption-2 text-danger-500 mt-1'>
-                        {errors.zip?.message}
-                      </div>
-                    </div>
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errors.sertifikatProduk?.message}
                   </div>
                 </div>
-                <span className='opacity-65 text-xs'>
-                  Alamat sesuai dengan alamat perusahaan
-                </span>
               </div>
+
               <div className='w-full flex flex-col'>
-                <label className='form-label  text-nowrap'>Data Bank</label>
+                <label className='form-label  text-nowrap'>Garansi</label>
                 <div className='w-full flex flex-row gap-2'>
-                  <div>
-                    <input
-                      {...register('bank')}
-                      placeholder='Nama bank'
-                      type='text'
-                      className='form-input'
-                    />
-                    <div className='text-caption-2 text-danger-500 mt-1'>
-                      {errors.bank?.message}
-                    </div>
-                  </div>
-                  <div>
-                    <input
-                      {...register('rekening')}
-                      placeholder='Nama Rekening'
-                      type='text'
-                      className='form-input'
-                    />
-                    <div className='text-caption-2 text-danger-500 mt-1'>
-                      {errors.rekening?.message}
-                    </div>
-                  </div>
-                  <div>
-                    <input
-                      {...register('accountNumber')}
-                      placeholder='Nomor Rekening Bank'
-                      type='number'
-                      className='form-input'
-                    />
-                    <div className='text-caption-2 text-danger-500 mt-1'>
-                      {errors.accountNumber?.message}
-                    </div>
+                  <Controller
+                    name='tempoGaransi'
+                    control={control}
+                    render={(props) => (
+                      <HookFormSelect
+                        {...props}
+                        options={dataGaransi}
+                        placeholder={'Pilih durasi garansi'}
+                      />
+                    )}
+                  />
+
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errors.tempoGaransi?.message}
                   </div>
                 </div>
-                <span className='opacity-65 text-xs'>
-                  Isi detail data bank perusahaan anda
-                </span>
-              </div>
-              <div className='w-full flex flex-col'>
-                <label className='form-label  text-nowrap'>
-                  Email Perusahaan
-                </label>
-                <input
-                  {...register('email')}
-                  placeholder='contoh@email.com'
-                  type='email'
-                  className='form-input'
-                />
-                <div className='text-caption-2 text-danger-500 mt-1'>
-                  {errors.email?.message}
-                </div>
-                <span className='opacity-65 text-xs'>
-                  Isi detail perusahaan sesuai dengan data yang terdaftar
-                </span>
-              </div>
-              <div className='w-full flex flex-col'>
-                <label className='form-label  text-nowrap'>Email Sales</label>
-                <input
-                  {...register('emailSales')}
-                  placeholder='contoh@email.com'
-                  type='email'
-                  className='form-input'
-                />
-                <div className='text-caption-2 text-danger-500 mt-1'>
-                  {errors.emailSales?.message}
-                </div>
-                <span className='opacity-65 text-xs'>
-                  Isi detail perusahaan sesuai dengan data yang terdaftar
-                </span>
-              </div>
-              <div className='w-full flex flex-col'>
-                <label className='form-label  text-nowrap'>Email Finance</label>
-                <input
-                  {...register('emailFinance')}
-                  placeholder='contoh@email.com'
-                  type='email'
-                  className='form-input'
-                />
-                <div className='text-caption-2 text-danger-500 mt-1'>
-                  {errors.emailFinance?.message}
-                </div>
-                <span className='opacity-65 text-xs'>
-                  Isi detail perusahaan sesuai dengan data yang terdaftar
-                </span>
               </div>
               <div className='w-full flex flex-col'>
                 <label className='form-label  text-nowrap'>
-                  No. Telepon Perusahaan
+                  Jelaskan Garansi yang dimaksud!
                 </label>
-                <input
-                  {...register('phone')}
-                  placeholder='Format: 08123456789 / (021) 123 4567'
-                  type='tel'
-                  className='form-input'
-                />
-                <div className='text-caption-2 text-danger-500 mt-1'>
-                  {errors.phone?.message}
-                </div>
-                <span className='opacity-65 text-xs'>
-                  Isi detail perusahaan sesuai dengan data yang terdaftar
-                </span>
-              </div>
-              <div className='w-full flex flex-col'>
-                <label className='form-label  text-nowrap'>No. Handphone</label>
-                <input
-                  {...register('mobile')}
-                  placeholder='Masukkan nomor handphone'
-                  type='tel'
+                <textarea
+                  {...register('explainGaransi')}
+                  placeholder='Jelaskan bagian apa yang termasuk garansi'
+                  type='textarea'
                   className='form-input'
+                  rows={4}
+                  cols={40}
                 />
                 <div className='text-caption-2 text-danger-500 mt-1'>
-                  {errors.mobile?.message}
+                  {errors.explainGaransi?.message}
                 </div>
-                <span className='opacity-65 text-xs'>
-                  Isi detail perusahaan sesuai dengan data yang terdaftar
-                </span>
               </div>
               <div className='w-full flex flex-col'>
                 <label className='form-label  text-nowrap'>
-                  Harga Tayang (HET){' '}
-                  <span className=' opacity-60'>(Opsional)</span>
-                </label>
-                <input
-                  {...register('hargaTayang')}
-                  placeholder='Masukkan Harga Tayang (HET)'
-                  type='text'
-                  className='form-input'
-                />
-                <div className='text-caption-2 text-danger-500 mt-1'>
-                  {errors.hargaTayang?.message}
-                </div>
-              </div>
-
-              <div className='w-full flex flex-col gap-2'>
-                <label className='form-label  text-nowrap'>
-                  NPWP{' '}
-                  {!isPkp && <span className=' opacity-60'>(Opsional)</span>}
+                  Apakah Memiliki Minimum Order Quantity (MOQ)
                 </label>
-                <div className='flex flex-row items-start justify-start gap-2'>
-                  <label
-                    htmlFor='npwp'
-                    className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
-                  >
-                    {fileNames.npwp ? 'Ubah Dokumen' : 'Upload Dokumen'}
-                  </label>
-                  <input
-                    {...register('npwp')}
-                    type='file'
-                    className='form-input hidden'
-                    accept='.pdf,.png,.jpg,.jpeg'
-                    id='npwp'
-                    onChange={(e) => {
-                      handleFileChange(e); // Untuk update UI (opsional)
-                    }}
-                    aria-invalid={errors.npwp?.message}
-                  />
-                  <span className=' text-gray-600 line-clamp-2'>
-                    {fileNames.npwp}
-                  </span>
-                </div>
-                <span className='text-xs opacity-60 text-red-500'>
-                  Format: pdf, jpeg, jpg, png. max file size 2MB
-                </span>
-
-                <div className='text-caption-2 text-danger-500 mt-1'>
-                  {errors.npwp?.message}
-                </div>
-              </div>
-              <div className='w-full flex flex-col gap-2 items-start '>
-                <div className='flex flex-row w-full justify-between items-center '>
-                  <label className='form-label  text-nowrap'>
-                    SPPKP{' '}
-                    {!isPkp && <span className=' opacity-60'>(Opsional)</span>}
-                  </label>
-                  <div
-                    onClick={() => setIsExample(!isExample)}
-                    className='h-fit  rounded text-white p-2 flex flex-row items-center bg-red-500 hover:cursor-pointer hover:bg-red-400'
+                <div className='flex gap-x-4 flex-col w-full'>
+                  <RadioGroup
+                    onChange={handleCheckboxOrderQuantityChange}
+                    value={
+                      watch('minimumPembelian')
+                        ? 'ya'
+                        : watch('isOrderQuantity')
+                    }
                   >
-                    <EyeIcon className={`w-4 mr-2 `} />
+                    <Stack direction='column'>
+                      <div className='flex flex-row text-nowrap gap-2'>
+                        <Radio
+                          colorScheme='red'
+                          value='ya'
+                          onChange={() => setValue('isOrderQuantity', 'ya')}
+                        >
+                          Ya
+                        </Radio>
 
-                    <p className='font-light text-xs '>Lihat Contoh</p>
+                        <Controller
+                          name='minimumPembelian'
+                          control={control}
+                          render={(props) => (
+                            <HookFormSelect
+                              {...props}
+                              options={dataMinimumOrderQuantity}
+                              placeholder={'Pilih jenis minimum order quantity'}
+                              onFocus={() => setValue('isOrderQuantity', 'ya')}
+                            />
+                          )}
+                        />
+                      </div>
+                      <Radio
+                        colorScheme='red'
+                        value='tidak'
+                        onChange={() => setValue('minimumPembelian', '')}
+                      >
+                        Tidak Ada
+                      </Radio>
+                    </Stack>
+                  </RadioGroup>
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errors.isOrderQuantity?.message}
                   </div>
                 </div>
-                <div className='flex flex-row items-start justify-start gap-2'>
-                  <label
-                    htmlFor='sppkp'
-                    className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
-                  >
-                    {fileNames.sppkp ? 'Ubah Dokumen' : 'Upload Dokumen'}
-                  </label>
-                  <input
-                    {...register('sppkp')}
-                    type='file'
-                    className='form-input hidden'
-                    accept='.pdf,.png,.jpg,.jpeg'
-                    id='sppkp'
-                    onChange={handleFileChange}
-                    aria-invalid={errors.sppkp?.message}
-                  />
-                  <span className=' text-gray-600 line-clamp-2'>
-                    {fileNames.sppkp}
-                  </span>
-                </div>
-                <span className='text-xs opacity-60 text-red-500'>
-                  Format: pdf, jpeg, jpg, png. max file size 2MB
-                </span>
-
-                <div className='text-caption-2 text-danger-500 mt-1'>
-                  {errors.sppkp?.message}
-                </div>
-              </div>
-
-              <div className='w-full flex flex-col gap-2'>
-                <label className='form-label  text-nowrap'>
-                  KTP Dirut/Direktur{' '}
-                  {isPkp && <span className=' opacity-60'>(Opsional)</span>}
-                </label>
-                <div className='flex flex-row items-start justify-start gap-2 '>
-                  <label
-                    htmlFor='dokumenKtpDirut'
-                    className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
-                  >
-                    {fileNames.dokumenKtpDirut
-                      ? 'Ubah Dokumen'
-                      : 'Upload Dokumen'}
-                  </label>
-                  <input
-                    {...register('dokumenKtpDirut')}
-                    type='file'
-                    className='form-input hidden'
-                    accept='.pdf,.png,.jpg,.jpeg'
-                    id='dokumenKtpDirut'
-                    onChange={handleFileChange}
-                    aria-invalid={errors.dokumenKtpDirut?.message}
-                  />
-                  <span className=' text-gray-600 line-clamp-2'>
-                    {fileNames.dokumenKtpDirut}
-                  </span>
-                </div>
-                <span className='text-xs opacity-60 text-red-500'>
-                  Format: pdf, jpeg, jpg, png. max file size 2MB
-                </span>
-
-                <div className='text-caption-2 text-danger-500 mt-1'>
-                  {errors.dokumenKtpDirut?.message}
-                </div>
-              </div>
-
-              <div className='w-full flex flex-col gap-2'>
-                <label className='form-label  text-nowrap'>
-                  Kartu Nama <span className=' opacity-60'>(Opsional)</span>{' '}
-                </label>
-                <div className='flex flex-row items-start justify-start gap-2'>
-                  <label
-                    htmlFor='kartuNama'
-                    className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
-                  >
-                    {fileNames.kartuNama ? 'Ubah Dokumen' : 'Upload Dokumen'}
-                  </label>
-                  <input
-                    {...register('kartuNama')}
-                    type='file'
-                    className='form-input hidden'
-                    accept='.pdf,.png,.jpg,.jpeg'
-                    id='kartuNama'
-                    onChange={handleFileChange}
-                    aria-invalid={errors.kartuNama?.message}
-                  />
-                  <span className=' text-gray-600 line-clamp-2'>
-                    {fileNames.kartuNama}
-                  </span>
-                </div>
-                <span className='text-xs opacity-60 text-red-500'>
-                  Format: pdf, jpeg, jpg, png. max file size 2MB
-                </span>
-
-                <div className='text-caption-2 text-danger-500 mt-1'>
-                  {errors.kartuNama?.message}
-                </div>
-              </div>
-
-              <div className='w-full flex flex-col gap-2 items-start '>
-                <div className='flex flex-row w-full justify-between items-center'>
-                  <label className='form-label  text-wrap'>
-                    Surat Pernyataan Nomor Rekening{' '}
-                    <span className=' opacity-60'>(Opsional)</span>
-                  </label>
-                  <a
-                    href='/file/Surat Pernyataan Nomor Rekening.docx'
-                    download='Surat Pernyataan Nomor Rekening.docx'
-                    className='h-fit rounded text-white p-2 flex flex-row items-center bg-red-500 hover:cursor-pointer hover:bg-red-400'
-                  >
-                    <p className='font-light text-xs text-nowrap'>
-                      Download Template
-                    </p>
-                  </a>
-                </div>
-                <div className='flex flex-row items-start justify-start gap-2'>
-                  <label
-                    htmlFor='suratPernyataan'
-                    className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
-                  >
-                    {fileNames.suratPernyataan
-                      ? 'Ubah Dokumen'
-                      : 'Upload Dokumen'}
-                  </label>
-                  <input
-                    {...register('suratPernyataan')}
-                    type='file'
-                    className='form-input hidden'
-                    accept='.pdf,.png,.jpg,.jpeg'
-                    id='suratPernyataan'
-                    onChange={handleFileChange}
-                    aria-invalid={errors.suratPernyataan?.message}
-                  />
-                  <span className=' text-gray-600 line-clamp-2'>
-                    {fileNames.suratPernyataan}
-                  </span>
-                </div>
-                <span className='text-xs opacity-60 text-red-500'>
-                  Format: pdf, jpeg, jpg, png. max file size 2MB
-                </span>
-
-                <div className='text-caption-2 text-danger-500 mt-1'>
-                  {errors.suratPernyataan?.message}
-                </div>
-              </div>
-              <div className='w-full flex flex-col gap-2 items-start '>
-                <label className='form-label  text-nowrap'>
-                  Foto Gudang / Kantor Bagian Depan
-                </label>
-                <div className='flex flex-row items-start justify-start gap-2'>
-                  <label
-                    htmlFor='fotoKantor'
-                    className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
-                  >
-                    {fileNames.fotoKantor ? 'Ubah Dokumen' : 'Upload Dokumen'}
-                  </label>
-                  <input
-                    {...register('fotoKantor')}
-                    type='file'
-                    className='form-input hidden'
-                    accept='.pdf,.png,.jpg,.jpeg'
-                    id='fotoKantor'
-                    onChange={handleFileChange}
-                    aria-invalid={errors.fotoKantor?.message}
-                  />
-                  <span className='mt-2 text-gray-600 line-clamp-2'>
-                    {fileNames.fotoKantor}
-                  </span>
-                </div>
-                <span className='text-xs opacity-60 text-red-500'>
-                  Format: pdf, jpeg, jpg, png. max file size 2MB
-                </span>
-
-                <div className='text-caption-2 text-danger-500 mt-1'>
-                  {errors.fotoKantor?.message}
-                </div>
-              </div>
-              <div className='w-full flex flex-col gap-2 items-start '>
-                <label className='form-label  text-nowrap'>
-                  Data Produk (Item Name, Gambar, Deskripsi){' '}
-                  <span className=' opacity-60'>(Opsional)</span>{' '}
-                </label>
-                <div className='flex flex-row items-start justify-start gap-2'>
-                  <label
-                    htmlFor='dataProduk'
-                    className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
-                  >
-                    {fileNames.dataProduk ? 'Ubah Dokumen' : 'Upload Dokumen'}
-                  </label>
-                  <input
-                    {...register('dataProduk')}
-                    type='file'
-                    className='form-input hidden'
-                    accept='.pdf,.png,.jpg,.jpeg'
-                    id='dataProduk'
-                    onChange={handleFileChange}
-                    aria-invalid={errors.dataProduk?.message}
-                  />
-                  <span className='mt-2 text-gray-600 line-clamp-2'>
-                    {fileNames.dataProduk}
-                  </span>
-                </div>
-                <span className='text-xs opacity-60 text-red-500'>
-                  Format: pdf, jpeg, jpg, png. max file size 2MB
-                </span>
-
-                <div className='text-caption-2 text-danger-500 mt-1'>
-                  {errors.fotoKantor?.message}
-                </div>
               </div>
-              <div className='w-full flex flex-col gap-2 items-start '>
-                <label className='form-label  text-nowrap'>Pricelist</label>
-                <div className='flex flex-row items-start justify-start gap-2'>
-                  <label
-                    htmlFor='pricelist'
-                    className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
-                  >
-                    {fileNames.pricelist ? 'Ubah Dokumen' : 'Upload Dokumen'}
-                  </label>
-                  <input
-                    {...register('pricelist')}
-                    type='file'
-                    className='form-input hidden'
-                    accept='.pdf,.png,.jpg,.jpeg'
-                    id='pricelist'
-                    onChange={handleFileChange}
-                    aria-invalid={errors.pricelist?.message}
-                  />
-                  <span className='mt-2 text-gray-600 line-clamp-2'>
-                    {fileNames.pricelist}
-                  </span>
-                </div>
-                <span className='text-xs opacity-60 text-red-500'>
-                  Format: pdf, jpeg, jpg, png. max file size 2MB
-                </span>
 
-                <div className='text-caption-2 text-danger-500 mt-1'>
-                  {errors.pricelist?.message}
-                </div>
-              </div>
               <div className=''>
                 {/* <div>
                   <ReCAPTCHA
@@ -1375,23 +771,29 @@ const SyaratDagang = forwardRef(({ handleIsError, isKonfirmasi }, ref) => {
                   />
                 </div> */}
               </div>
-              <div className='flex justify-end mb-4'>
-                <Button
-                  colorScheme='red'
-                  className='w-full md:w-fit'
-                  type='submit'
-                >
-                  Daftar Merchant{' '}
-                  {/* {<ChevronRightIcon className='w-5' color='white' />} */}
-                </Button>
-                <div>
-                  {/* <button
-                  type='submit'
-                  className='btn-yellow w-full md:w-fit mt-6 ml-0 md:ml-auto'
-                >
-                  Simpan
-                </button> */}
-                </div>
+              <div className='flex justify-center w-full '>
+                {/* <Button
+                                              colorScheme='red'
+                                              className='w-full md:w-fit'
+                                              type='submit'
+                                            >
+                                              Daftar Merchant{' '}
+                                              {<ChevronRightIcon className='w-5' color='white' />}
+                                            </Button> */}
+                {!isKonfirmasi && (
+                  <div className='w-full'>
+                    <span className='text-xs opacity-60'>
+                      *Pastikan data yang anda masukan sudah benar dan sesuai
+                    </span>
+                    <button
+                      type='submit'
+                      className='btn-light bg-red-500 rounded-lg text-white w-full py-2 px-4 md:w-fit mt-2 ml-0 md:ml-auto flex justify-center hover:bg-red-400'
+                    >
+                      <span className={` `}>Langkah Selanjutnya</span>
+                      {<ChevronRightIcon className='w-5' />}
+                    </button>
+                  </div>
+                )}
               </div>
             </form>
             <PageContent path='/daftar-merchant' />