From 0a5e12b03eee0f559a19f7dce861161ff2ce5a49 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Fri, 23 May 2025 11:13:33 +0700
Subject: Revert "Form Merchant"

This reverts commit 5eed16f154dee8e72d9ac55ff5eb8a958e0e6db1.
---
 .../merchant/components/InformasiPerusahaan.jsx    | 1048 ++------------------
 1 file changed, 86 insertions(+), 962 deletions(-)

(limited to 'src/lib/merchant/components/InformasiPerusahaan.jsx')

diff --git a/src/lib/merchant/components/InformasiPerusahaan.jsx b/src/lib/merchant/components/InformasiPerusahaan.jsx
index 1e8704ac..ee5560a9 100644
--- a/src/lib/merchant/components/InformasiPerusahaan.jsx
+++ b/src/lib/merchant/components/InformasiPerusahaan.jsx
@@ -63,81 +63,6 @@ const CreateMerchant = forwardRef(
     const [zips, setZips] = useState([]);
     const [isExample, setIsExample] = useState(false);
     const [isPkp, setIsPkp] = useState(false);
-    const [fileNames, setFileNames] = useState({});
-    const [DeatailFile, setDetailFile] = useState({});
-    const npwpRef = useRef(null);
-    const sppkpRef = useRef(null);
-    const ktpDirutRef = useRef(null);
-    const kartuNamaRef = useRef(null);
-    const suratPernyataanRef = useRef(null);
-    const fotoKantorRef = useRef(null);
-
-     const handleConfirmSubmit = (format, base64) => {
-        if (format == 'pdf') {
-          setFormat(`application/${format}`);
-        } else if (format == 'png' || format == 'jpg' || format == 'jpeg') {
-          setFormat(`image/${format}`);
-        } else {
-          setFormat(format);
-        }
-        setBase64(
-          base64.trim().replace(/^"+/, '').replace(/"+$/, '').replaceAll('\\', '')
-        );
-        setIsExample(!isExample);
-      };
-      const handleInputChange = async (event) => {
-        let fileBase64 = '';
-        const { name } = event.target;
-        const file = event.target.files?.[0];
-        // Allowed file extensions
-        const allowedExtensions = ['pdf', 'png', 'jpg', 'jpeg'];
-        let fileExtension = '';
-        if (file) {
-          fileExtension = file.name.split('.').pop()?.toLowerCase(); // Extract file extension
-    
-          // Check if the file extension is allowed
-          if (!fileExtension || !allowedExtensions.includes(fileExtension)) {
-            toast.error(
-              'Format file yang diijinkan adalah .pdf, .png, .jpg, atau .jpeg',
-              { duration: 4000 }
-            );
-    
-            event.target.value = '';
-            return;
-          }
-    
-          // Check for file size
-          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);
-              updateFormDokumen(
-                name,
-                compressedFile.name,
-                fileExtension,
-                fileBase64
-              );
-            } catch (error) {
-              toast.error('Gagal mengompresi file', { duration: 4000 });
-            }
-          } else {
-            // Convert file to Base64
-            fileBase64 = await getFileBase64(file);
-            updateFormDokumen(name, file.name, fileExtension, fileBase64);
-          }
-          validateDokumen();
-        }
-      };
-    
 
     useEffect(() => {
       window.scrollTo({
@@ -171,49 +96,15 @@ const CreateMerchant = forwardRef(
       { value: 5, label: 'Wholesaler (Pedagang Besar)' },
     ];
 
-    const handleFileChange = async (event) => {
-          let fileBase64 = '';
-          const file = event.target.files[0];
-    
-          if (file.size > 2000000) {
-            // 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 });
-            // }
-            toast.error('Maks file size 2MB', { 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
-          }));
-        };
-
     useEffect(() => {
       const loadData = async () => {
         try {
           const data = await getMerchantApi();
           if (data) {
             reset({
-              name: data.name ? data.name : '',
+              pejabatName: data.pejabatName ? data.pejabatName : '',
+              PICName: data.picMerchant || '',
+              PICPosition: data.picPosition || '',
               address: data.address ? data.address : '',
               state: data.state ? data.state : '',
               city: data.city || '',
@@ -234,24 +125,6 @@ const CreateMerchant = forwardRef(
                 : null,
               website: data.website || '',
             });
-             setFileNames((prev) => ({
-              ...prev,
-              ['npwp']: data.fileNpwp ? data.fileNpwp.name : '',
-              ['sppkp']: data.fileSppkp ? data.fileSppkp.name : '',
-              ['dokumenKtpDirut']: data.fileDokumenKtpDirut
-                ? data.fileDokumenKtpDirut.name
-                : '',
-              ['kartuNama']: data.fileKartuNama ? data.fileKartuNama.name : '',
-              ['suratPernyataan']: data.fileSuratPernyataan
-                ? data.fileSuratPernyataan.name
-                : '',
-              ['fotoKantor']: data.fileFotoKantor
-                ? data.fileFotoKantor.name
-                : '',
-              ['dataProduk']: data.fileDataProduk
-                ? data.fileDataProduk.name
-                : '',
-            }));
           }
         } catch (error) {
           console.error('Error loading profile:', error);
@@ -271,7 +144,7 @@ const CreateMerchant = forwardRef(
           if (dataProfile.companyType == 'pkp') {
             setIsPkp(true);
           }
-          setValue('name', dataProfile?.name);
+          setValue('company', dataProfile?.name);
           setValue('address', dataProfile?.alamatBisnis);
           setValue('state', parseInt(dataProfile.stateId.id));
           setValue('city', parseInt(dataProfile.city.id));
@@ -282,49 +155,6 @@ const CreateMerchant = forwardRef(
           console.error('Error loading profile:', error);
         }
       };
-      const npwp = { name: fileNames.npwp, format: DeatailFile.npwp };
-      const sppkp = { name: fileNames.sppkp, format: DeatailFile.sppkp };
-      const dokumenKtpDirut = {
-        name: fileNames.dokumenKtpDirut,
-        format: DeatailFile.dokumenKtpDirut,
-      };
-      const kartuNama = {
-        name: fileNames.kartuNama,
-        format: DeatailFile.kartuNama,
-      };
-      const suratPernyataan = {
-        name: fileNames.suratPernyataan,
-        format: DeatailFile.suratPernyataan,
-      };
-      const fotoKantor = {
-        name: fileNames.fotoKantor,
-        format: DeatailFile.fotoKantor,
-      };
-      const dataProduk = {
-        name: fileNames.dataProduk,
-        format: DeatailFile.dataProduk,
-      };
-      const pricelist = {
-        name: fileNames.pricelist,
-        format: DeatailFile.pricelist,
-      };
-   const dokumen = {
-        file_npwp: { details: npwp.format ? npwp : '' },
-        file_sppkp: { details: sppkp.format ? sppkp : '' },
-        file_dokumenKtpDirut: {
-          details: dokumenKtpDirut.format ? dokumenKtpDirut : '',
-        },
-        file_kartuNama: { details: kartuNama.format ? kartuNama : '' },
-        file_suratPernyataan: {
-          details: suratPernyataan.format ? suratPernyataan : '',
-        },
-        file_fotoKantor: { details: fotoKantor.format ? fotoKantor : '' },
-        file_dataProduk: { details: dataProduk.format ? dataProduk : '' },
-      };
-      
-      let data = {
-        file_dokumen: JSON.stringify(dokumen),
-      };
 
       loadProfile();
     }, [auth?.parentId]);
@@ -447,41 +277,13 @@ const CreateMerchant = forwardRef(
         loadZip();
       }
     }, [watchsubDistrict, subDistricts]);
-    const [selected, setSelected] = useState('PKP');
     const onSubmitHandler = async (values) => {
-       const npwp = { name: fileNames.npwp, format: DeatailFile.npwp };
-      const sppkp = { name: fileNames.sppkp, format: DeatailFile.sppkp };
-      const dokumenKtpDirut = {
-        name: fileNames.dokumenKtpDirut,
-        format: DeatailFile.dokumenKtpDirut,
-      };
-      const kartuNama = {
-        name: fileNames.kartuNama,
-        format: DeatailFile.kartuNama,
-      };
-      const suratPernyataan = {
-        name: fileNames.suratPernyataan,
-        format: DeatailFile.suratPernyataan,
-      };
-      const fotoKantor = {
-        name: fileNames.fotoKantor,
-        format: DeatailFile.fotoKantor,
-      };
       const toastId = toast.loading('Mengirimkan formulir merchant...');
-      const dokumen = {
-        file_npwp: { details: npwp.format ? npwp : '' },
-        file_sppkp: { details: sppkp.format ? sppkp : '' },
-        file_dokumenKtpDirut: {
-          details: dokumenKtpDirut.format ? dokumenKtpDirut : '',
-        },
-        file_kartuNama: { details: kartuNama.format ? kartuNama : '' },
-        file_suratPernyataan: {
-          details: suratPernyataan.format ? suratPernyataan : '',
-        },
-        file_fotoKantor: { details: fotoKantor.format ? fotoKantor : '' },
-      };
       const data = {
-        name_merchant: 'Form Merchant - ' + values.name,
+        name_merchant: 'Form Merchant - ' + values.company,
+        pejabat_name: values.pejabatName,
+        pic_merchant: values.PICName,
+        pic_position: values.PICPosition,
         address: values.address,
         state: parseInt(values.state),
         city: parseInt(values.city),
@@ -497,9 +299,11 @@ const CreateMerchant = forwardRef(
         phone: values.phone,
         mobile: values.mobile,
         bisnis_type: values.bisnisType,
+        category_perusahaan: values.categoryPerusahaan,
+        website: values.website,
         description:
           'Nama Perusahaan : ' +
-          values.name +
+          values.company +
           ' \r\n  Alamat  : ' +
           values.address +
           ' \r\n  Kota  : ' +
@@ -510,27 +314,7 @@ const CreateMerchant = forwardRef(
           values.email +
           ' \r\n No Hp : ' +
           values.mobile,
-        file_dokumen: JSON.stringify(dokumen),
       };
-      const options = {
-        behavior: 'smooth',
-        block: 'center',
-      };
-      if (!dokumenKtpDirut.name && !isPkp) {
-        toast.error('KTP Dirut/Direktur wajib di tambahkan');
-        if (ktpDirutRef?.current) {
-          ktpDirutRef.current.scrollIntoView(options);
-        }
-        return;
-      }
-      if (!fotoKantor.name) {
-        toast.error('Foto Gudang / Kantor Bagian Depan wajib di tambahkan');
-        if (fotoKantorRef?.current) {
-          fotoKantorRef.current.scrollIntoView(options);
-        }
-        return;
-      }
-        
       const create_leads = await createMerchantApi({ data });
       if (create_leads) {
         toast.dismiss(toastId);
@@ -552,9 +336,6 @@ const CreateMerchant = forwardRef(
       return;
     }
     // Tetap di bagian atas, tidak boleh ada kondisi sebelum hook
-     const onInvalid = (errors) => {
-    console.error('Form validation errors:', errors);
-  };
 
     
 
@@ -580,51 +361,18 @@ const CreateMerchant = forwardRef(
         <DesktopView>
           <div className='container flex flex-col items-star py-4 '>
             <h2 className='text-xs md:text-title-sm font-semibold mb-6'>
-              Informasi Bisnis
+              Informasi Perusahaan
             </h2>
 
             <div className='w-full mt-4'>
               <form
-              
-                onSubmit={handleSubmit(onSubmitHandler, onInvalid)}
+                onSubmit={handleSubmit(onSubmitHandler)}
                 className='flex flex-col gap-4'
               >
-                <Controller
-                  name="bisnisType"
-                  control={control}
-                  render={({ field }) => (
-                    <div className="space-y-2">
-                      <label className="font-semibold text-gray-800">Tipe Bisnis</label>
-                      <div className="flex items-center space-x-6">
-                        {dataBisnisType.map((option) => (
-                          <label key={option.value} className="flex items-center space-x-2 cursor-pointer">
-                            <input
-                              type="radio"
-                              value={option.label}
-                              checked={field.value === option.value}
-                              onChange={() => field.onChange(option.value)}
-                              className="sr-only peer"
-                            />
-                            <div className="w-4 h-4 rounded-full border-2 border-red-100 flex items-center justify-center 
-               peer-checked:border-[5px] peer-checked:border-red-500 
-               peer-focus:outline peer-focus:outline-red-100">
-                              <div className="absolute top-1/2 left-1/2 w-2.5 h-2.5 bg-red-500 rounded-full -translate-x-1/2 -translate-y-1/2 opacity-0 peer-checked:opacity-200" />
-                            </div>
-                            <span className="text-sm text-gray-800">{option.label}</span>
-                          </label>
-                        ))}
-                      </div>
-                      <div className='text-caption-2 text-danger-500 mt-1'>
-                      { errors.bisnisType?.message}
-                       </div>
-                    </div>
-                    
-                  )}
-                />
                 <div className='w-full flex flex-row'>
                   <div className='w-2/5'>
                     <label className='form-label  text-nowrap'>
-                      Nama BIsnis
+                      Nama Perusahaan
                     </label>
                     {!isKonfirmasi && (
                       <span className='opacity-65 text-xs'>
@@ -634,7 +382,7 @@ const CreateMerchant = forwardRef(
                   </div>
                   <div className='w-3/5'>
                     <input
-                      {...register('name')}
+                      {...register('company')}
                       placeholder='Masukkan nama perusahaan'
                       type='text'
                       className='form-input'
@@ -643,11 +391,11 @@ const CreateMerchant = forwardRef(
                       Format: PT. INDOTEKNIK DOTCOM GEMILANG
                     </span>
                     <div className='text-caption-2 text-danger-500 mt-1'>
-                      {errors.name?.message}
+                      {errors.company?.message}
                     </div>
                   </div>
                 </div>
-                {/* <div className='w-full flex flex-row'>
+                <div className='w-full flex flex-row'>
                   <div className='w-2/5'>
                     <label className='form-label  text-nowrap'>
                       Pejabat Berwenang
@@ -714,7 +462,7 @@ const CreateMerchant = forwardRef(
                       {errors.PICPosition?.message}
                     </div>
                   </div>
-                </div> */}
+                </div>
                 <div className='w-full flex flex-row'>
                   <div className='w-2/5'>
                     <label className='form-label text-nowrap'>
@@ -825,17 +573,30 @@ const CreateMerchant = forwardRef(
                         </div>
                         <div className='zip  w-full'>
                           <Controller
-                          name="zip"
-                          control={control}
-                          render={({ field }) => (
-                            <input
-                              {...field}
-                              placeholder="Kode Pos"
-                              type="number"
-                              className="form-input"
-                              disabled={!watchsubDistrict}
-                            />
-                          )}
+                            name='zip'
+                            control={control}
+                            render={(props) => (
+                              <>
+                                {/* Jika zips tidak kosong, tampilkan dropdown */}
+                                {zips.length < 0 ? (
+                                  // Jika zips kosong, tampilkan input manual
+                                  <input
+                                    {...register('zip')}
+                                    placeholder='Kode Pos'
+                                    type='number'
+                                    className='form-input'
+                                    disabled={!watchsubDistrict}
+                                  />
+                                ) : (
+                                  <HookFormSelect
+                                    {...props}
+                                    options={zips}
+                                    disabled={!watchsubDistrict}
+                                    placeholder='Zip'
+                                  />
+                                )}
+                              </>
+                            )}
                           />
                           <div className='text-caption-2 text-danger-500 mt-1'>
                             {errors.zip?.message}
@@ -908,7 +669,7 @@ const CreateMerchant = forwardRef(
                 <div className='w-full flex flex-row'>
                   <div className='w-2/5'>
                     <label className='form-label  text-nowrap'>
-                      Email Bisnis
+                      Email Perusahaan
                     </label>
                   </div>
                   <div className='w-3/5'>
@@ -962,7 +723,7 @@ const CreateMerchant = forwardRef(
                 <div className='w-full flex flex-row'>
                   <div className='w-2/5'>
                     <label className='form-label  text-nowrap'>
-                      No. Telepon Bisnis
+                      No. Telepon Perusahaan
                     </label>
                     {!isKonfirmasi && (
                       <span className='opacity-65 text-xs'>
@@ -1011,402 +772,7 @@ const CreateMerchant = forwardRef(
                     </div>
                   </div>
                 </div>
-                <div className='w-full flex flex-row'>
-                  <div className='w-2/5'>
-                    <label className='form-label  text-nowrap'>
-                      KTP Dirut/Direktur{' '}
-                      {isPkp && <span className=' opacity-60'>(Opsional)</span>}
-                    </label>
-                    {!isKonfirmasi && (
-                      <span className='opacity-65 text-xs'>
-                        Pastikan dokumen yang anda upload sudah benar
-                      </span>
-                    )}
-                  </div>
-                  <div
-                    className={`w-3/5 flex flex-col justify-between ${
-                      isKonfirmasi ? 'items-end' : 'items-start'
-                    }`}
-                    ref={ktpDirutRef}
-                  >
-                    <div
-                      className={`flex flex-row items-start ${
-                        isKonfirmasi ? 'justify-end' : 'justify-start'
-                      } gap-2 w-full`}
-                    >
-                      {isKonfirmasi && (
-                        <span className='mt-2 text-gray-600 line-clamp-2'>
-                          {fileNames.dokumenKtpDirut}
-                        </span>
-                      )}
-                      <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}
-                      />
-                      {!isKonfirmasi && (
-                        <span className='mt-2 text-gray-600 line-clamp-2'>
-                          {fileNames.dokumenKtpDirut}
-                        </span>
-                      )}
-                    </div>
-                    {!isKonfirmasi && (
-                      <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>
-
-                <div className='w-full flex flex-row'>
-                  <div className='w-2/5'>
-                    <label
-                      className='form-label  text-nowrap'
-                      ref={kartuNamaRef}
-                    >
-                      Kartu Nama <span className=' opacity-60'>(Opsional)</span>{' '}
-                    </label>
-                    {!isKonfirmasi && (
-                      <span className='opacity-65 text-xs'>
-                        Pastikan dokumen yang anda upload sudah benar
-                      </span>
-                    )}
-                  </div>
-                  <div
-                    className={`w-3/5 flex flex-col justify-between ${
-                      isKonfirmasi ? 'items-end' : 'items-start'
-                    }`}
-                  >
-                    <div className='flex flex-row items-start justify-start gap-2'>
-                      {isKonfirmasi && (
-                        <span className='mt-2 text-gray-600 line-clamp-2'>
-                          {fileNames.kartuNama}
-                        </span>
-                      )}
-                      <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}
-                      />
-                      {!isKonfirmasi && (
-                        <span className='mt-2 text-gray-600 line-clamp-2'>
-                          {fileNames.kartuNama}
-                        </span>
-                      )}
-                    </div>
-                    {!isKonfirmasi && (
-                      <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>
-                <div className='w-full flex flex-row'>
-                  <div className='w-2/5'>
-                    <label className='form-label  text-nowrap'>
-                      NPWP{' '}
-                      {!isPkp && (
-                        <span className=' opacity-60'>(Opsional)</span>
-                      )}
-                    </label>
-                    {!isKonfirmasi && (
-                      <span className='opacity-65 text-xs'>
-                        Pastikan dokumen yang anda upload sudah benar
-                      </span>
-                    )}
-                  </div>
-                  <div
-                    className={`w-3/5 flex flex-col justify-between ${
-                      isKonfirmasi ? 'items-end' : 'items-start'
-                    }`}
-                    ref={npwpRef}
-                  >
-                    <div
-                      className={`flex flex-row items-start gap-2 w-full ${
-                        isKonfirmasi ? 'justify-end' : 'justify-start'
-                      }`}
-                    >
-                      {isKonfirmasi && (
-                        <span className='mt-2 text-gray-600 line-clamp-2'>
-                          {fileNames.npwp}
-                        </span>
-                      )}
-                      <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}
-                      />
-                      {!isKonfirmasi && (
-                        <span className='mt-2 text-gray-600 line-clamp-2'>
-                          {fileNames.npwp}
-                        </span>
-                      )}
-                    </div>
-                    {!isKonfirmasi && (
-                      <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>
-                 <div
-                  className={`w-full flex flex-row items-start ${
-                    isKonfirmasi && 'gap-2'
-                  } `}
-                >
-                  <div className='w-2/5 flex flex-row justify-between items-center '>
-                    <div>
-                      <label className='form-label  text-nowrap' ref={sppkpRef}>
-                        SPPKP{' '}
-                        {!isPkp && (
-                          <span className=' opacity-60'>(Opsional)</span>
-                        )}
-                      </label>
-                      {!isKonfirmasi && (
-                        <span className='opacity-65 text-xs'>
-                          Pastikan dokumen yang anda upload sudah benar
-                        </span>
-                      )}
-                    </div>
-                    <div
-                      onClick={() => setIsExample(!isExample)}
-                      className={`h-fit ${
-                        !isKonfirmasi && 'mr-8'
-                      }  rounded text-white p-2 flex flex-row items-center bg-red-500 hover:cursor-pointer hover:bg-red-400`}
-                    >
-                      <EyeIcon
-                        className={`${isKonfirmasi ? 'w-4' : 'w-4 mr-2'} `}
-                      />
-                      {!isKonfirmasi && (
-                        <p className='font-light text-xs '>Lihat Contoh</p>
-                      )}
-                    </div>
-                  </div>
-                  <div
-                    className={`w-3/5 flex flex-col justify-between ${
-                      isKonfirmasi ? 'items-end' : 'items-start'
-                    }`}
-                  >
-                    <div className='flex flex-row items-start justify-start gap-2'>
-                      {isKonfirmasi && (
-                        <span className='mt-2 text-gray-600 line-clamp-2 '>
-                          {fileNames.sppkp}
-                        </span>
-                      )}
-                      <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}
-                      />
-                    {!isKonfirmasi && (
-                        <span className='mt-2 text-gray-600 line-clamp-2'>
-                          {fileNames.sppkp}
-                        </span>
-                      )}
-                    </div>
-                    {!isKonfirmasi && (
-                      <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>
-                
-                <div className='w-full flex flex-row items-start '>
-                  <div className='w-2/5 flex flex-row justify-between items-center '>
-                    <div>
-                      <label
-                        className={`form-label  ${
-                          isKonfirmasi ? 'text-wrap' : ' text-nowrap'
-                        }`}
-                        ref={suratPernyataanRef}
-                      >
-                        Surat Pernyataan Nomor Rekening{' '}
-                        <span className=' opacity-60'>(Opsional)</span>
-                      </label>
-                      {!isKonfirmasi && (
-                        <span className='opacity-65 text-xs'>
-                          Wajib diisi jika nomor rekening berbeda dengan nama
-                          perusahaan
-                        </span>
-                      )}
-                    </div>
-                    <a
-                      href='/file/Surat Pernyataan Nomor Rekening.docx'
-                      download='Surat Pernyataan Nomor Rekening.docx'
-                      className='h-fit mr-8 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'>Download Template</p>
-                    </a>
-                  </div>
-                  <div
-                    className={`w-3/5 flex flex-col justify-between ${
-                      isKonfirmasi ? 'items-end' : 'items-start'
-                    }`}
-                  >
-                    <div className='flex flex-row items-start justify-start gap-2'>
-                      {isKonfirmasi && (
-                        <span className='mt-2 text-gray-600 line-clamp-2'>
-                          {fileNames.suratPernyataan}
-                        </span>
-                      )}
-                      <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}
-                      />
-                      {!isKonfirmasi && (
-                        <span className='mt-2 text-gray-600 line-clamp-2'>
-                          {fileNames.suratPernyataan}
-                        </span>
-                      )}
-                    </div>
-                    {!isKonfirmasi && (
-                      <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>
-                <div className='w-full flex flex-row items-start '>
-                  <div className='w-2/5 flex flex-col justify-start items-start '>
-                    <label
-                      className={`form-label   ${
-                        isKonfirmasi ? 'text-wrap' : 'text-nowrap'
-                      }`}
-                      ref={fotoKantorRef}
-                    >
-                      Foto Gudang / Kantor Bagian Depan
-                    </label>
-                    {!isKonfirmasi && (
-                      <span className='opacity-65 text-xs'>
-                        Pastikan dokumen yang anda upload sudah benar
-                      </span>
-                    )}
-                  </div>
-                  <div
-                    className={`w-3/5 flex flex-col justify-between ${
-                      isKonfirmasi ? 'items-end' : 'items-start'
-                    }`}
-                  >
-                    <div className='flex flex-row items-start justify-start gap-2'>
-                      {isKonfirmasi && (
-                        <span className='mt-2 text-gray-600 line-clamp-2'>
-                          {fileNames.fotoKantor}
-                        </span>
-                      )}
-                      <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}
-                      />
-                      {!isKonfirmasi && (
-                        <span className='mt-2 text-gray-600 line-clamp-2'>
-                          {fileNames.fotoKantor}
-                        </span>
-                      )}
-                    </div>
-                    {!isKonfirmasi && (
-                      <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>
-{/* 
                 <div className='flex flex-row  justify-between items-center'>
                   <div className='w-2/5'>
                     <label className='form-label text-nowrap'>
@@ -1501,7 +867,7 @@ const CreateMerchant = forwardRef(
                       {errors.website?.message}
                     </div>
                   </div>
-                </div> */}
+                </div>
 
                 <div className=''>
                   {/* <div>
@@ -1529,7 +895,7 @@ const CreateMerchant = forwardRef(
                         type='submit'
                         className='btn-light bg-red-500 rounded-lg text-white w-fit py-2 px-4 md:w-fit mt-2 ml-0 md:ml-auto flex justify-between hover:bg-red-400'
                       >
-                        <span className={` `}>Daftar Merchant</span>
+                        <span className={` `}>Langkah Selanjutnya</span>
                         {<ChevronRightIcon className='w-5' />}
                       </button>
                     </div>
@@ -1547,37 +913,6 @@ const CreateMerchant = forwardRef(
                 Informasi Perusahaan
               </h2>
             )}
-             <Controller
-                  name="bisnisType"
-                  control={control}
-                  render={({ field }) => (
-                    <div className="space-y-2">
-                      <label className="font-semibold text-gray-800">Tipe Bisnis</label>
-                      <div className="flex items-center space-x-6">
-                        {dataBisnisType.map((option) => (
-                          <label key={option.value} className="flex items-center space-x-2 cursor-pointer">
-                            <input
-                              type="radio"
-                              value={option.value}
-                              checked={field.bisnisType === option.label}
-                              onChange={() => field.onChange(option.label)}
-                              className="sr-only peer"
-                            />
-                            <div className="w-4 h-4 rounded-full border-2 border-red-100 flex items-center justify-center 
-               peer-checked:border-[5px] peer-checked:border-red-500 
-               peer-focus:outline peer-focus:outline-red-100">
-                              <div className="absolute top-1/2 left-1/2 w-2.5 h-2.5 bg-red-500 rounded-full -translate-x-1/2 -translate-y-1/2 opacity-0 peer-checked:opacity-200" />
-                            </div>
-                            <span className="text-sm text-gray-800">{option.label}</span>
-                          </label>
-                        ))}
-                      </div>
-                        <div className='text-caption-2 text-danger-500 mt-1'>
-                          {errors.bisnisType?.message}
-                        </div>
-                    </div>
-                  )}
-                />
 
             <div className='w-full mt-4'>
               <form
@@ -1587,23 +922,23 @@ const CreateMerchant = forwardRef(
                 <div className='w-full flex flex-col'>
                   <div className='w-full'>
                     <label className='form-label  text-nowrap'>
-                      Nama Bisnis
+                      Nama Perusahaan
                     </label>
                     <input
-                      {...register('name')}
+                      {...register('company')}
                       placeholder='Format: PT. INDOTEKNIK DOTCOM GEMILANG'
                       type='text'
                       className='form-input'
                     />
                     <div className='text-caption-2 text-danger-500 mt-1'>
-                      {errors.name?.message}
+                      {errors.company?.message}
                     </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 flex flex-col'>
                   <div className='w-full'>
                     <label className='form-label  text-nowrap'>
                       Pejabat Berwenang
@@ -1658,7 +993,7 @@ const CreateMerchant = forwardRef(
                       isi dengan jabatan sales / penanggung jawab
                     </span>
                   </div>
-                </div> */}
+                </div>
                 <div className='w-full flex flex-col'>
                   <div className='w-full'>
                     <label className='form-label text-nowrap'>
@@ -1745,18 +1080,29 @@ const CreateMerchant = forwardRef(
                       </div>
                       <div className='zip  w-full'>
                         <Controller
-                          name="zip"
+                          name='zip'
                           control={control}
-                          render={({ field }) => (
-                            <input
-                              {...field}
-                              placeholder="Kode Pos"
-                              type="number"
-                              className="form-input"
-                              disabled={!watchsubDistrict}
-                            />
+                          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>
@@ -1810,7 +1156,7 @@ const CreateMerchant = forwardRef(
                 </div>
                 <div className='w-full flex flex-col'>
                   <label className='form-label  text-nowrap'>
-                    Email Bisnis
+                    Email Perusahaan
                   </label>
                   <input
                     {...register('email')}
@@ -1859,7 +1205,7 @@ const CreateMerchant = forwardRef(
                 </div>
                 <div className='w-full flex flex-col'>
                   <label className='form-label  text-nowrap'>
-                    No. Telepon Bisnis
+                    No. Telepon Perusahaan
                   </label>
                   <input
                     {...register('phone')}
@@ -1891,236 +1237,7 @@ const CreateMerchant = forwardRef(
                     Isi detail perusahaan sesuai dengan data yang terdaftar
                   </span>
                 </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-center 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-center 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'>
-                  <label className='form-label  text-nowrap'>
-                    NPWP{' '}
-                    {!isPkp && <span className=' opacity-60'>(Opsional)</span>}
-                  </label>
-                  <div className='flex flex-row items-center 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'
-                    >
-                      <EyeIcon className={`w-4 mr-2 `} />
-
-                      <p className='font-light text-xs '>Lihat Contoh</p>
-                    </div>
-                  </div>
-                  <div className='flex flex-row items-center 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 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-center 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-center 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=' 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='flex flex-col'>
+                <div className='flex flex-col'>
                   <label className='form-label text-nowrap'>Tipe Bisnis</label>
                   <div className='flex flex-col '>
                     <Controller
@@ -2186,7 +1303,7 @@ const CreateMerchant = forwardRef(
                   <div className='text-caption-2 text-danger-500 mt-1'>
                     {errors.website?.message}
                   </div>
-                </div> */}
+                </div>
 
                 <div className=''>
                   {/* <div>
@@ -2214,7 +1331,7 @@ const CreateMerchant = forwardRef(
                         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={` `}>Daftar Merchant</span>
+                        <span className={` `}>Langkah Selanjutnya</span>
                         {<ChevronRightIcon className='w-5' />}
                       </button>
                     </div>
@@ -2231,7 +1348,10 @@ const CreateMerchant = forwardRef(
 );
 
 const validationSchema = Yup.object().shape({
-  name: Yup.string().required('Harus di-isi'),
+  company: Yup.string().required('Harus di-isi'),
+  pejabatName: Yup.string().required('Harus di-isi'),
+  PICName: Yup.string().required('Harus di-isi'),
+  PICPosition: Yup.string().required('Harus di-isi'),
   address: Yup.string().required('Harus di-isi'),
   state: Yup.string().required('Harus dipilih'),
   city: Yup.string().required('Harus dipilih'),
@@ -2253,9 +1373,13 @@ const validationSchema = Yup.object().shape({
   phone: Yup.string().required('Harus di-isi'),
   mobile: Yup.string().required('Harus di-isi'),
   bisnisType: Yup.string().required('Harus dipilih'),
+  categoryPerusahaan: Yup.string().required('Harus dipilih'),
 });
 const defaultValues = {
-  name: '',
+  company: '',
+  pejabatName: '',
+  PICName: '',
+  PICPosition: '',
   address: '',
   state: '',
   city: '',
-- 
cgit v1.2.3

