From 915dc67e1ce31eab1f2415cc8df95cebb75a137d Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Fri, 13 Dec 2024 14:18:03 +0700
Subject: <iman>update pengajuan tempo request

---
 src/lib/auth/components/CompanyProfile.jsx         |  30 +
 src/lib/pengajuan-tempo/component/Dokumen.jsx      | 664 +++++++++++-----
 .../component/KonfirmasiDokumen.jsx                | 855 +++++++++++++++------
 .../pengajuan-tempo/component/KontakPerusahaan.jsx |   2 +-
 .../pengajuan-tempo/component/PengajuanTempo.jsx   |  23 +-
 src/lib/pengajuan-tempo/component/Pengiriman.jsx   | 733 ++++++++++++++----
 src/lib/pengajuan-tempo/component/Referensi.jsx    |  64 +-
 .../component/informasiPerusahaan.jsx              | 382 ++++++---
 src/lib/tempo/components/Tempo.jsx                 |  50 +-
 9 files changed, 2119 insertions(+), 684 deletions(-)

(limited to 'src/lib')

diff --git a/src/lib/auth/components/CompanyProfile.jsx b/src/lib/auth/components/CompanyProfile.jsx
index 7bda992f..220d5be1 100644
--- a/src/lib/auth/components/CompanyProfile.jsx
+++ b/src/lib/auth/components/CompanyProfile.jsx
@@ -61,6 +61,8 @@ const CompanyProfile = () => {
       setValue('npwp', dataProfile.npwp);
       setValue('alamat_wajib_pajak', dataProfile.alamatWajibPajak);
       setValue('alamat_bisnis', dataProfile.alamatBisnis);
+      setValue('email_bisnis', dataProfile.email);
+      setValue('mobile_bisnis', dataProfile.mobile);
     };
     if (auth) loadProfile();
   }, [auth, setValue]);
@@ -75,6 +77,8 @@ const CompanyProfile = () => {
         tax_name: values.taxName,
         alamat_lengkap_text: values.alamat_wajib_pajak,
         street: values.alamat_bisnis,
+        email: values.email_bisnis,
+        mobile: values.mobile_bisnis,
       };
       const isUpdated = await odooApi(
         'PUT',
@@ -198,6 +202,28 @@ const CompanyProfile = () => {
                 {errors.taxName?.message}
               </div>
             </div>
+            <div>
+              <label>Email Bisnis</label>
+              <input
+                {...register('email_bisnis')}
+                type='email'
+                className='form-input mt-3'
+              />
+              <div className='text-caption-2 text-danger-500 mt-1'>
+                {errors.email_bisnis?.message}
+              </div>
+            </div>
+            <div>
+              <label>No. Handphone Bisnis</label>
+              <input
+                {...register('mobile_bisnis')}
+                type='tel'
+                className='form-input mt-3'
+              />
+              <div className='text-caption-2 text-danger-500 mt-1'>
+                {errors.mobile_bisnis?.message}
+              </div>
+            </div>
             <div>
               <label>Alamat Wajib Pajak</label>
               <input
@@ -250,6 +276,8 @@ const validationSchema = Yup.object().shape({
   taxName: Yup.string().required('Harus di-isi'),
   npwp: Yup.string().required('Harus di-isi'),
   name: Yup.string().required('Harus di-isi'),
+  email_bisnis: Yup.string().required('Harus di-isi'),
+  mobile_bisnis: Yup.string().required('Harus di-isi'),
   industry: Yup.string().required('Harus di-pilih'),
   companyType: Yup.string().required('Harus di-pilih'),
 });
@@ -258,6 +286,8 @@ const defaultValues = {
   industry: '',
   companyType: '',
   name: '',
+  email_bisnis: '',
+  mobile_bisnis: '',
   taxName: '',
   npwp: '',
   alamat_wajib_pajak: '',
diff --git a/src/lib/pengajuan-tempo/component/Dokumen.jsx b/src/lib/pengajuan-tempo/component/Dokumen.jsx
index d74e85be..00bb715a 100644
--- a/src/lib/pengajuan-tempo/component/Dokumen.jsx
+++ b/src/lib/pengajuan-tempo/component/Dokumen.jsx
@@ -167,13 +167,101 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
           <form className='flex mt-4 flex-col w-full '>
             <div className='w-full grid grid-cols-[1fr_auto_1fr] gap-5'>
               <div className='kolom-kiri w-full grid grid-rows-2 gap-7 '>
+                <div
+                  className='w-full grid grid-cols-2 gap-5'
+                  ref={dokumenNpwpRef}
+                >
+                  <div>
+                    <label className='form-label  text-nowrap'>
+                      NPWP Perusahaan
+                    </label>
+                    <span className='text-xs opacity-60 text-red-500'>
+                      Format: pdf, jpeg, jpg, png. max file size 2MB
+                    </span>
+                  </div>
+                  <div className=''>
+                    <div className='flex flex-col items-start'>
+                      <label
+                        htmlFor='dokumenNpwp'
+                        className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                      >
+                        {formDokumen?.dokumenNpwp?.name
+                          ? 'Ubah Dokumen'
+                          : 'Upload Dokumen'}
+                      </label>
+                      <input
+                        // value={formDokumen.dokumenNpwp}
+                        id='dokumenNpwp'
+                        name='dokumenNpwp'
+                        type='file'
+                        title=' '
+                        className='hidden'
+                        aria-invalid={errorsDokumen.dokumenNpwp}
+                        onChange={handleInputChange}
+                        accept='.pdf,.png,.jpg,.jpeg'
+                      />
+                      <span className='mt-2 text-gray-600 line-clamp-2'>
+                        {formDokumen?.dokumenNpwp?.name}
+                      </span>
+                    </div>
+                    {chekValid && (
+                      <div className='text-caption-2 text-danger-500 mt-1'>
+                        {errorsDokumen.dokumenNpwp}
+                      </div>
+                    )}
+                  </div>
+                </div>
+
+                <div
+                  className='w-full grid grid-cols-2 gap-5'
+                  ref={dokumenSppkpRef}
+                >
+                  <div>
+                    <label className='form-label  text-nowrap'>SPPKP</label>
+                    <span className='text-xs opacity-60 text-red-500'>
+                      Format: pdf, jpeg, jpg, png. max file size 2MB
+                    </span>
+                  </div>
+                  <div className=''>
+                    <div className='flex flex-col items-start'>
+                      <label
+                        htmlFor='dokumenSppkp'
+                        className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                      >
+                        {formDokumen?.dokumenSppkp?.name.length > 0
+                          ? 'Ubah Dokumen'
+                          : 'Upload Dokumen'}
+                      </label>
+                      <input
+                        // value={formDokumen.dokumenSppkp}
+                        id='dokumenSppkp'
+                        name='dokumenSppkp'
+                        type='file'
+                        className='hidden'
+                        aria-invalid={errorsDokumen.dokumenSppkp}
+                        onChange={handleInputChange}
+                        accept='.pdf,.png,.jpg,.jpeg'
+                      />
+                      <span className='mt-2 text-gray-600 line-clamp-2'>
+                        {formDokumen?.dokumenSppkp?.name}
+                      </span>
+                    </div>
+
+                    {chekValid && (
+                      <div className='text-caption-2 text-danger-500 mt-1'>
+                        {errorsDokumen.dokumenSppkp}
+                      </div>
+                    )}
+                  </div>
+                </div>
+
                 <div
                   className='w-full grid grid-cols-2 gap-5'
                   ref={dokumenNibRef}
                 >
                   <div>
                     <label className='form-label  text-nowrap'>
-                      NIB (SIUP/TDP/SKDP){' '}
+                      NIB
                       <span className='text-danger-500 text-xl'>*</span>
                     </label>
                     <span className='text-xs opacity-60 text-red-500'>
@@ -201,7 +289,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                         onChange={handleInputChange}
                         accept='.pdf,.png,.jpg,.jpeg'
                       />
-                      <span className='mt-2 text-gray-600'>
+                      <span className='mt-2 text-gray-600 line-clamp-2'>
                         {formDokumen?.dokumenNib?.name}
                       </span>
                     </div>
@@ -212,56 +300,53 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     )}
                   </div>
                 </div>
-                <div
-                  className='w-full grid grid-cols-2 gap-5'
-                  ref={dokumenNpwpRef}
-                >
+
+                <div className='w-full grid grid-cols-2 gap-5'>
                   <div>
                     <label className='form-label  text-nowrap'>
-                      NPWP Perusahaan
+                      SIUP <span className=' opacity-60'>(Opsional)</span>{' '}
                     </label>
                     <span className='text-xs opacity-60 text-red-500'>
                       Format: pdf, jpeg, jpg, png. max file size 2MB
                     </span>
                   </div>
                   <div className=''>
-                    <div className='flex flex-col items-start'>
+                    <div className='flex flex-col items-start '>
                       <label
-                        htmlFor='dokumenNpwp'
+                        htmlFor='dokumenSiup'
                         className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
                       >
-                        {formDokumen?.dokumenNpwp?.name
+                        {formDokumen?.dokumenSiup?.name.length > 0
                           ? 'Ubah Dokumen'
                           : 'Upload Dokumen'}
                       </label>
                       <input
-                        // value={formDokumen.dokumenNpwp}
-                        id='dokumenNpwp'
-                        name='dokumenNpwp'
+                        // value={formDokumen.dokumenAktaPerubahan}
+                        id='dokumenSiup'
+                        name='dokumenSiup'
                         type='file'
-                        title=' '
                         className='hidden'
-                        aria-invalid={errorsDokumen.dokumenNpwp}
+                        aria-invalid={errorsDokumen.dokumenAktaPerubahan}
                         onChange={handleInputChange}
                         accept='.pdf,.png,.jpg,.jpeg'
                       />
-                      <span className='mt-2 text-gray-600'>
-                        {formDokumen?.dokumenNpwp?.name}
+                      <span className='mt-2 text-gray-600 line-clamp-2'>
+                        {formDokumen?.dokumenSiup?.name}
                       </span>
                     </div>
                     {chekValid && (
                       <div className='text-caption-2 text-danger-500 mt-1'>
-                        {errorsDokumen.dokumenNpwp}
+                        {errorsDokumen.dokumenSiup}
                       </div>
                     )}
                   </div>
                 </div>
-                <div
-                  className='w-full grid grid-cols-2 gap-5'
-                  ref={dokumenSppkpRef}
-                >
+
+                <div className='w-full grid grid-cols-2 gap-5'>
                   <div>
-                    <label className='form-label  text-nowrap'>SPPKP</label>
+                    <label className='form-label  text-nowrap'>
+                      TDP <span className=' opacity-60'>(Opsional)</span>{' '}
+                    </label>
                     <span className='text-xs opacity-60 text-red-500'>
                       Format: pdf, jpeg, jpg, png. max file size 2MB
                     </span>
@@ -269,43 +354,39 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                   <div className=''>
                     <div className='flex flex-col items-start'>
                       <label
-                        htmlFor='dokumenSppkp'
+                        htmlFor='dokumenTdp'
                         className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
                       >
-                        {formDokumen?.dokumenSppkp?.name.length > 0
+                        {formDokumen?.dokumenTdp?.name.length > 0
                           ? 'Ubah Dokumen'
                           : 'Upload Dokumen'}
                       </label>
                       <input
-                        // value={formDokumen.dokumenSppkp}
-                        id='dokumenSppkp'
-                        name='dokumenSppkp'
+                        // value={formDokumen.dokumenAktaPerubahan}
+                        id='dokumenTdp'
+                        name='dokumenTdp'
                         type='file'
                         className='hidden'
-                        aria-invalid={errorsDokumen.dokumenSppkp}
+                        aria-invalid={errorsDokumen.dokumenTdp}
                         onChange={handleInputChange}
                         accept='.pdf,.png,.jpg,.jpeg'
                       />
-                      <span className='mt-2 text-gray-600'>
-                        {formDokumen?.dokumenSppkp?.name}
+                      <span className='mt-2 text-gray-600 line-clamp-2'>
+                        {formDokumen?.dokumenTdp?.name}
                       </span>
                     </div>
-
                     {chekValid && (
                       <div className='text-caption-2 text-danger-500 mt-1'>
-                        {errorsDokumen.dokumenSppkp}
+                        {errorsDokumen.dokumenTdp}
                       </div>
                     )}
                   </div>
                 </div>
-                <div
-                  className='w-full grid grid-cols-2 gap-5'
-                  ref={dokumenAktaPerubahanRef}
-                >
+
+                <div className='w-full grid grid-cols-2 gap-5'>
                   <div>
                     <label className='form-label  text-nowrap'>
-                      Akta Perubahan{' '}
-                      <span className=' opacity-60'>(Opsional)</span>{' '}
+                      SKDP <span className=' opacity-60'>(Opsional)</span>{' '}
                     </label>
                     <span className='text-xs opacity-60 text-red-500'>
                       Format: pdf, jpeg, jpg, png. max file size 2MB
@@ -314,43 +395,39 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                   <div className=''>
                     <div className='flex flex-col items-start'>
                       <label
-                        htmlFor='dokumenAktaPerubahan'
+                        htmlFor='dokumenSkdp'
                         className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
                       >
-                        {formDokumen?.dokumenAktaPerubahan?.name.length > 0
+                        {formDokumen?.dokumenSkdp?.name.length > 0
                           ? 'Ubah Dokumen'
                           : 'Upload Dokumen'}
                       </label>
                       <input
                         // value={formDokumen.dokumenAktaPerubahan}
-                        id='dokumenAktaPerubahan'
-                        name='dokumenAktaPerubahan'
+                        id='dokumenSkdp'
+                        name='dokumenSkdp'
                         type='file'
                         className='hidden'
-                        aria-invalid={errorsDokumen.dokumenAktaPerubahan}
+                        aria-invalid={errorsDokumen.dokumenSkdp}
                         onChange={handleInputChange}
                         accept='.pdf,.png,.jpg,.jpeg'
                       />
-                      <span className='mt-2 text-gray-600'>
-                        {formDokumen?.dokumenAktaPerubahan?.name}
+                      <span className='mt-2 text-gray-600 line-clamp-2'>
+                        {formDokumen?.dokumenSkdp?.name}
                       </span>
                     </div>
                     {chekValid && (
                       <div className='text-caption-2 text-danger-500 mt-1'>
-                        {errorsDokumen.dokumenAktaPerubahan}
+                        {errorsDokumen.dokumenSkdp}
                       </div>
                     )}
                   </div>
                 </div>
-                <div
-                  className='w-full grid grid-cols-2 gap-5'
-                  ref={dokumenKtpDirutRef}
-                >
+
+                <div className='w-full grid grid-cols-2 gap-5'>
                   <div>
                     <label className='form-label  text-nowrap'>
-                      KTP Dirut/Direktur{' '}
-                      <span className=' opacity-60'>(Opsional)</span>{' '}
-                      <span className='text-danger-500 text-xl'>*</span>
+                      SKT <span className=' opacity-60'>(Opsional)</span>{' '}
                     </label>
                     <span className='text-xs opacity-60 text-red-500'>
                       Format: pdf, jpeg, jpg, png. max file size 2MB
@@ -359,31 +436,30 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                   <div className=''>
                     <div className='flex flex-col items-start'>
                       <label
-                        htmlFor='dokumenKtpDirut'
+                        htmlFor='dokumenSkt'
                         className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
                       >
-                        {formDokumen?.dokumenKtpDirut?.name
+                        {formDokumen?.dokumenSkt?.name.length > 0
                           ? 'Ubah Dokumen'
                           : 'Upload Dokumen'}
                       </label>
                       <input
-                        // value={formDokumen.dokumenKtpDirut}
-                        id='dokumenKtpDirut'
-                        name='dokumenKtpDirut'
+                        // value={formDokumen.dokumenAktaPerubahan}
+                        id='dokumenSkt'
+                        name='dokumenSkt'
                         type='file'
                         className='hidden'
-                        aria-invalid={errorsDokumen.dokumenKtpDirut}
+                        aria-invalid={errorsDokumen.dokumenSkt}
                         onChange={handleInputChange}
                         accept='.pdf,.png,.jpg,.jpeg'
                       />
-                      <span className='mt-2 text-gray-600'>
-                        {formDokumen?.dokumenKtpDirut?.name}
+                      <span className='mt-2 text-gray-600 line-clamp-2'>
+                        {formDokumen?.dokumenSkt?.name}
                       </span>
                     </div>
-
                     {chekValid && (
                       <div className='text-caption-2 text-danger-500 mt-1'>
-                        {errorsDokumen.dokumenKtpDirut}
+                        {errorsDokumen.dokumenSkt}
                       </div>
                     )}
                   </div>
@@ -425,7 +501,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                         onChange={handleInputChange}
                         accept='.pdf,.png,.jpg,.jpeg'
                       />
-                      <span className='mt-2 text-gray-600'>
+                      <span className='mt-2 text-gray-600 line-clamp-2'>
                         {formDokumen?.dokumenAktaPendirian?.name}
                       </span>
                     </div>
@@ -437,14 +513,15 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     )}
                   </div>
                 </div>
+
                 <div
                   className='w-full grid grid-cols-2 gap-5'
-                  ref={dokumenLaporanKeuanganRef}
+                  ref={dokumenAktaPerubahanRef}
                 >
                   <div>
                     <label className='form-label  text-nowrap'>
-                      Laporan Keuangan
-                      <span className=' opacity-60'>(Opsional)</span>
+                      Akta Perubahan{' '}
+                      <span className=' opacity-60'>(Opsional)</span>{' '}
                     </label>
                     <span className='text-xs opacity-60 text-red-500'>
                       Format: pdf, jpeg, jpg, png. max file size 2MB
@@ -453,35 +530,80 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                   <div className=''>
                     <div className='flex flex-col items-start'>
                       <label
-                        htmlFor='dokumenLaporanKeuangan'
+                        htmlFor='dokumenAktaPerubahan'
                         className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
                       >
-                        {formDokumen?.dokumenLaporanKeuangan?.name
+                        {formDokumen?.dokumenAktaPerubahan?.name.length > 0
                           ? 'Ubah Dokumen'
                           : 'Upload Dokumen'}
                       </label>
                       <input
-                        // value={formDokumen.dokumenLaporanKeuangan}
-                        id='dokumenLaporanKeuangan'
-                        name='dokumenLaporanKeuangan'
+                        // value={formDokumen.dokumenAktaPerubahan}
+                        id='dokumenAktaPerubahan'
+                        name='dokumenAktaPerubahan'
                         type='file'
                         className='hidden'
-                        aria-invalid={errorsDokumen.dokumenLaporanKeuangan}
+                        aria-invalid={errorsDokumen.dokumenAktaPerubahan}
                         onChange={handleInputChange}
                         accept='.pdf,.png,.jpg,.jpeg'
                       />
-                      <span className='mt-2 text-gray-600'>
-                        {formDokumen?.dokumenLaporanKeuangan?.name}
+                      <span className='mt-2 text-gray-600 line-clamp-2'>
+                        {formDokumen?.dokumenAktaPerubahan?.name}
+                      </span>
+                    </div>
+                    {chekValid && (
+                      <div className='text-caption-2 text-danger-500 mt-1'>
+                        {errorsDokumen.dokumenAktaPerubahan}
+                      </div>
+                    )}
+                  </div>
+                </div>
+
+                <div
+                  className='w-full grid grid-cols-2 gap-5'
+                  ref={dokumenTempatBekerjaRef}
+                >
+                  <div>
+                    <label className='form-label  text-nowrap'>
+                      Foto tempat kerja
+                    </label>
+                    <span className='text-xs opacity-60 text-red-500'>
+                      Format: pdf, jpeg, jpg, png. max file size 2MB
+                    </span>
+                  </div>
+                  <div className=''>
+                    <div className='flex flex-col items-start'>
+                      <label
+                        htmlFor='dokumenTempatBekerja'
+                        className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                      >
+                        {formDokumen?.dokumenTempatBekerja?.name
+                          ? 'Ubah Dokumen'
+                          : 'Upload Dokumen'}
+                      </label>
+                      <input
+                        // value={formDokumen.dokumenTempatBekerja}
+                        id='dokumenTempatBekerja'
+                        name='dokumenTempatBekerja'
+                        type='file'
+                        className='hidden'
+                        aria-invalid={errorsDokumen.dokumenTempatBekerja}
+                        onChange={handleInputChange}
+                        accept='.pdf,.png,.jpg,.jpeg'
+                      />
+                      <span className='mt-2 text-gray-600 line-clamp-2'>
+                        {formDokumen?.dokumenTempatBekerja?.name}
                       </span>
                     </div>
 
                     {chekValid && (
                       <div className='text-caption-2 text-danger-500 mt-1'>
-                        {errorsDokumen.dokumenLaporanKeuangan}
+                        {errorsDokumen.dokumenTempatBekerja}
                       </div>
                     )}
                   </div>
                 </div>
+
                 <div
                   className='w-full grid grid-cols-2 gap-5'
                   ref={dokumenFotoKantorRef}
@@ -514,7 +636,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                         onChange={handleInputChange}
                         accept='.pdf,.png,.jpg,.jpeg'
                       />
-                      <span className='mt-2 text-gray-600'>
+                      <span className='mt-2 text-gray-600 line-clamp-2'>
                         {formDokumen?.dokumenFotoKantor?.name}
                       </span>
                     </div>
@@ -526,13 +648,16 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     )}
                   </div>
                 </div>
+
                 <div
                   className='w-full grid grid-cols-2 gap-5'
-                  ref={dokumenTempatBekerjaRef}
+                  ref={dokumenKtpDirutRef}
                 >
                   <div>
                     <label className='form-label  text-nowrap'>
-                      Foto tempat kerja
+                      KTP Dirut/Direktur{' '}
+                      <span className=' opacity-60'>(Opsional)</span>{' '}
+                      <span className='text-danger-500 text-xl'>*</span>
                     </label>
                     <span className='text-xs opacity-60 text-red-500'>
                       Format: pdf, jpeg, jpg, png. max file size 2MB
@@ -541,35 +666,81 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                   <div className=''>
                     <div className='flex flex-col items-start'>
                       <label
-                        htmlFor='dokumenTempatBekerja'
+                        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'
                       >
-                        {formDokumen?.dokumenTempatBekerja?.name
+                        {formDokumen?.dokumenKtpDirut?.name
                           ? 'Ubah Dokumen'
                           : 'Upload Dokumen'}
                       </label>
                       <input
-                        // value={formDokumen.dokumenTempatBekerja}
-                        id='dokumenTempatBekerja'
-                        name='dokumenTempatBekerja'
+                        // value={formDokumen.dokumenKtpDirut}
+                        id='dokumenKtpDirut'
+                        name='dokumenKtpDirut'
+                        type='file'
+                        className='hidden'
+                        aria-invalid={errorsDokumen.dokumenKtpDirut}
+                        onChange={handleInputChange}
+                        accept='.pdf,.png,.jpg,.jpeg'
+                      />
+                      <span className='mt-2 text-gray-600 line-clamp-2'>
+                        {formDokumen?.dokumenKtpDirut?.name}
+                      </span>
+                    </div>
+
+                    {chekValid && (
+                      <div className='text-caption-2 text-danger-500 mt-1'>
+                        {errorsDokumen.dokumenKtpDirut}
+                      </div>
+                    )}
+                  </div>
+                </div>
+                <div
+                  className='w-full grid grid-cols-2 gap-5'
+                  ref={dokumenLaporanKeuanganRef}
+                >
+                  <div>
+                    <label className='form-label  text-nowrap'>
+                      Laporan Keuangan
+                      <span className=' opacity-60'>(Opsional)</span>
+                    </label>
+                    <span className='text-xs opacity-60 text-red-500'>
+                      Format: pdf, jpeg, jpg, png. max file size 2MB
+                    </span>
+                  </div>
+                  <div className=''>
+                    <div className='flex flex-col items-start'>
+                      <label
+                        htmlFor='dokumenLaporanKeuangan'
+                        className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                      >
+                        {formDokumen?.dokumenLaporanKeuangan?.name
+                          ? 'Ubah Dokumen'
+                          : 'Upload Dokumen'}
+                      </label>
+                      <input
+                        // value={formDokumen.dokumenLaporanKeuangan}
+                        id='dokumenLaporanKeuangan'
+                        name='dokumenLaporanKeuangan'
                         type='file'
                         className='hidden'
-                        aria-invalid={errorsDokumen.dokumenTempatBekerja}
+                        aria-invalid={errorsDokumen.dokumenLaporanKeuangan}
                         onChange={handleInputChange}
                         accept='.pdf,.png,.jpg,.jpeg'
                       />
-                      <span className='mt-2 text-gray-600'>
-                        {formDokumen?.dokumenTempatBekerja?.name}
+                      <span className='mt-2 text-gray-600 line-clamp-2'>
+                        {formDokumen?.dokumenLaporanKeuangan?.name}
                       </span>
                     </div>
 
                     {chekValid && (
                       <div className='text-caption-2 text-danger-500 mt-1'>
-                        {errorsDokumen.dokumenTempatBekerja}
+                        {errorsDokumen.dokumenLaporanKeuangan}
                       </div>
                     )}
                   </div>
                 </div>
+
                 <div></div>
               </div>
             </div>
@@ -583,11 +754,11 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               <p className='font-bold'>Upload Progress</p>
               <p>
                 <span className='text-red-500 font-bold'>
-                  {parseInt((getJumlahDokumenDiisi() / 9) * 100)} %
+                  {parseInt((getJumlahDokumenDiisi() / 13) * 100)} %
                 </span>
                 <span className='ml-2 opacity-60'>
-                  {getJumlahDokumenDiisi() >= 4
-                    ? getJumlahDokumenDiisi() == 9
+                  {getJumlahDokumenDiisi() >= 5
+                    ? getJumlahDokumenDiisi() == 13
                       ? 'Selesai'
                       : 'Sedikit Lagi'
                     : ''}
@@ -603,7 +774,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               baseBgColor='#E5E7EB'
               labelColor='#e80909'
               labelSize='0'
-              maxCompleted={9}
+              maxCompleted={13}
               height='14px'
             />
             <span className='opacity-75'>
@@ -624,9 +795,82 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
           </h1>
           <form className='flex mt-4 flex-col w-full '>
             <div className='w-full flex flex-col gap-4'>
+              <div className='w-full flex flex-col gap-2' ref={dokumenNpwpRef}>
+                <label className='form-label  text-nowrap'>
+                  NPWP Perusahaan
+                </label>
+                <div className='flex flex-row gap-2'>
+                  <label
+                    htmlFor='dokumenNpwp'
+                    className='cursor-pointer   bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
+                  >
+                    {formDokumen?.dokumenNpwp?.name
+                      ? 'Ubah Dokumen'
+                      : 'Upload Dokumen'}
+                  </label>
+                  <input
+                    // value={formDokumen.dokumenNpwp}
+                    id='dokumenNpwp'
+                    name='dokumenNpwp'
+                    type='file'
+                    title=' '
+                    className='hidden'
+                    aria-invalid={errorsDokumen.dokumenNpwp}
+                    onChange={handleInputChange}
+                    accept='.pdf,.png,.jpg,.jpeg'
+                  />
+                  <span className='mt-2 text-gray-600 line-clamp-2 truncate'>
+                    {formDokumen?.dokumenNpwp?.name}
+                  </span>
+                </div>
+                <span className='text-xs opacity-60 text-red-500'>
+                  Format: pdf, jpeg, jpg, png. max file size 2MB
+                </span>
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenNpwp}
+                  </div>
+                )}
+              </div>
+
+              <div className='w-full flex flex-col gap-2' ref={dokumenSppkpRef}>
+                <label className='form-label  text-nowrap'>SPPKP</label>
+                <div className='flex flex-row gap-2'>
+                  <label
+                    htmlFor='dokumenSppkp'
+                    className='cursor-pointer  bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
+                  >
+                    {formDokumen?.dokumenSppkp?.name
+                      ? 'Ubah Dokumen'
+                      : 'Upload Dokumen'}
+                  </label>
+                  <input
+                    // value={formDokumen.dokumenNpwp}
+                    id='dokumenSppkp'
+                    name='dokumenSppkp'
+                    type='file'
+                    title=' '
+                    className='hidden'
+                    aria-invalid={errorsDokumen.dokumenSppkp}
+                    onChange={handleInputChange}
+                    accept='.pdf,.png,.jpg,.jpeg'
+                  />
+                  <span className='mt-2 text-gray-600 line-clamp-2 truncate'>
+                    {formDokumen?.dokumenSppkp?.name}
+                  </span>
+                </div>
+                <span className='text-xs opacity-60 text-red-500'>
+                  Format: pdf, jpeg, jpg, png. max file size 2MB
+                </span>
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenSppkp}
+                  </div>
+                )}
+              </div>
               <div className='w-full flex flex-col gap-2' ref={dokumenNibRef}>
                 <label className='form-label  text-nowrap'>
-                  NIB (SIUP/TDP/SKDP){' '}
+                  NIB
                   <span className='text-danger-500 text-xl'>*</span>
                 </label>
                 <div className='flex flex-row gap-2'>
@@ -649,7 +893,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     onChange={handleInputChange}
                     accept='.pdf,.png,.jpg,.jpeg'
                   />
-                  <span className='mt-2 text-gray-600 truncate'>
+                  <span className='mt-2 text-gray-600 line-clamp-2 truncate'>
                     {formDokumen?.dokumenNib?.name}
                   </span>
                 </div>
@@ -663,32 +907,32 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 )}
               </div>
 
-              <div className='w-full flex flex-col gap-2' ref={dokumenNpwpRef}>
+              <div className='w-full flex flex-col gap-2'>
                 <label className='form-label  text-nowrap'>
-                  NPWP Perusahaan
+                  SIUP <span className=' opacity-60'>(Opsional)</span>
                 </label>
                 <div className='flex flex-row gap-2'>
                   <label
-                    htmlFor='dokumenNpwp'
-                    className='cursor-pointer   bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
+                    htmlFor='dokumenSiup'
+                    className='cursor-pointer  bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
                   >
-                    {formDokumen?.dokumenNpwp?.name
+                    {formDokumen?.dokumenSiup?.name
                       ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
                     // value={formDokumen.dokumenNpwp}
-                    id='dokumenNpwp'
-                    name='dokumenNpwp'
+                    id='dokumenSiup'
+                    name='dokumenSiup'
                     type='file'
                     title=' '
                     className='hidden'
-                    aria-invalid={errorsDokumen.dokumenNpwp}
+                    aria-invalid={errorsDokumen.dokumenSiup}
                     onChange={handleInputChange}
                     accept='.pdf,.png,.jpg,.jpeg'
                   />
-                  <span className='mt-2 text-gray-600 truncate'>
-                    {formDokumen?.dokumenNpwp?.name}
+                  <span className='mt-2 text-gray-600 line-clamp-2 truncate'>
+                    {formDokumen?.dokumenSiup?.name}
                   </span>
                 </div>
                 <span className='text-xs opacity-60 text-red-500'>
@@ -696,35 +940,37 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 </span>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errorsDokumen.dokumenNpwp}
+                    {errorsDokumen.dokumenSiup}
                   </div>
                 )}
               </div>
 
-              <div className='w-full flex flex-col gap-2' ref={dokumenSppkpRef}>
-                <label className='form-label  text-nowrap'>SPPKP</label>
+              <div className='w-full flex flex-col gap-2'>
+                <label className='form-label  text-nowrap'>
+                  TDP <span className=' opacity-60'>(Opsional)</span>
+                </label>
                 <div className='flex flex-row gap-2'>
                   <label
-                    htmlFor='dokumenSppkp'
+                    htmlFor='dokumenTdp'
                     className='cursor-pointer  bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
                   >
-                    {formDokumen?.dokumenSppkp?.name
+                    {formDokumen?.dokumenTdp?.name
                       ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
                     // value={formDokumen.dokumenNpwp}
-                    id='dokumenSppkp'
-                    name='dokumenSppkp'
+                    id='dokumenTdp'
+                    name='dokumenTdp'
                     type='file'
                     title=' '
                     className='hidden'
-                    aria-invalid={errorsDokumen.dokumenSppkp}
+                    aria-invalid={errorsDokumen.dokumenTdp}
                     onChange={handleInputChange}
                     accept='.pdf,.png,.jpg,.jpeg'
                   />
-                  <span className='mt-2 text-gray-600 truncate'>
-                    {formDokumen?.dokumenSppkp?.name}
+                  <span className='mt-2 text-gray-600 line-clamp-2 truncate'>
+                    {formDokumen?.dokumenTdp?.name}
                   </span>
                 </div>
                 <span className='text-xs opacity-60 text-red-500'>
@@ -732,40 +978,36 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 </span>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errorsDokumen.dokumenSppkp}
+                    {errorsDokumen.dokumenTdp}
                   </div>
                 )}
               </div>
-
-              <div
-                className='w-full flex flex-col gap-2'
-                ref={dokumenAktaPerubahanRef}
-              >
+              <div className='w-full flex flex-col gap-2'>
                 <label className='form-label  text-nowrap'>
-                  Akta Perubahan <span className=' opacity-60'>(Opsional)</span>
+                  SKDP <span className=' opacity-60'>(Opsional)</span>
                 </label>
                 <div className='flex flex-row gap-2'>
                   <label
-                    htmlFor='dokumenAktaPerubahan'
+                    htmlFor='dokumenSkdp'
                     className='cursor-pointer  bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
                   >
-                    {formDokumen?.dokumenAktaPerubahan?.name
+                    {formDokumen?.dokumenTdp?.name
                       ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
                     // value={formDokumen.dokumenNpwp}
-                    id='dokumenAktaPerubahan'
-                    name='dokumenAktaPerubahan'
+                    id='dokumenSkdp'
+                    name='dokumenSkdp'
                     type='file'
                     title=' '
                     className='hidden'
-                    aria-invalid={errorsDokumen.dokumenAktaPerubahan}
+                    aria-invalid={errorsDokumen.dokumenSkdp}
                     onChange={handleInputChange}
                     accept='.pdf,.png,.jpg,.jpeg'
                   />
-                  <span className='mt-2 text-gray-600 truncate'>
-                    {formDokumen?.dokumenAktaPerubahan?.name}
+                  <span className='mt-2 text-gray-600 line-clamp-2 truncate'>
+                    {formDokumen?.dokumenSkdp?.name}
                   </span>
                 </div>
                 <span className='text-xs opacity-60 text-red-500'>
@@ -773,42 +1015,36 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 </span>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errorsDokumen.dokumenAktaPerubahan}
+                    {errorsDokumen.dokumenSkdp}
                   </div>
                 )}
               </div>
-
-              <div
-                className='w-full flex flex-col gap-2'
-                ref={dokumenKtpDirutRef}
-              >
+              <div className='w-full flex flex-col gap-2'>
                 <label className='form-label  text-nowrap'>
-                  KTP Dirut/Direktur{' '}
-                  <span className=' opacity-60'>(Opsional)</span>{' '}
-                  <span className='text-danger-500 text-xl'>*</span>
+                  SKT <span className=' opacity-60'>(Opsional)</span>
                 </label>
                 <div className='flex flex-row gap-2'>
                   <label
-                    htmlFor='dokumenKtpDirut'
+                    htmlFor='dokumenSkt'
                     className='cursor-pointer  bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
                   >
-                    {formDokumen?.dokumenKtpDirut?.name
+                    {formDokumen?.dokumenSkt?.name
                       ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
                     // value={formDokumen.dokumenNpwp}
-                    id='dokumenKtpDirut'
-                    name='dokumenKtpDirut'
+                    id='dokumenSkt'
+                    name='dokumenSkt'
                     type='file'
                     title=' '
                     className='hidden'
-                    aria-invalid={errorsDokumen.dokumenKtpDirut}
+                    aria-invalid={errorsDokumen.dokumenSkt}
                     onChange={handleInputChange}
                     accept='.pdf,.png,.jpg,.jpeg'
                   />
-                  <span className='mt-2 text-gray-600 truncate'>
-                    {formDokumen?.dokumenKtpDirut?.name}
+                  <span className='mt-2 text-gray-600 line-clamp-2 truncate'>
+                    {formDokumen?.dokumenSkt?.name}
                   </span>
                 </div>
                 <span className='text-xs opacity-60 text-red-500'>
@@ -816,11 +1052,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 </span>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errorsDokumen.dokumenKtpDirut}
+                    {errorsDokumen.dokumenSkdp}
                   </div>
                 )}
               </div>
-
               <div
                 className='w-full flex flex-col gap-2'
                 ref={dokumenAktaPendirianRef}
@@ -849,7 +1084,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     onChange={handleInputChange}
                     accept='.pdf,.png,.jpg,.jpeg'
                   />
-                  <span className='mt-2 text-gray-600 truncate'>
+                  <span className='mt-2 text-gray-600 line-clamp-2 truncate'>
                     {formDokumen?.dokumenAktaPendirian?.name}
                   </span>
                 </div>
@@ -862,37 +1097,35 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                   </div>
                 )}
               </div>
-
               <div
                 className='w-full flex flex-col gap-2'
-                ref={dokumenLaporanKeuanganRef}
+                ref={dokumenAktaPerubahanRef}
               >
                 <label className='form-label  text-nowrap'>
-                  Laporan Keuangan{' '}
-                  <span className=' opacity-60'>(Opsional)</span>
+                  Akta Perubahan <span className=' opacity-60'>(Opsional)</span>
                 </label>
                 <div className='flex flex-row gap-2'>
                   <label
-                    htmlFor='dokumenLaporanKeuangan'
+                    htmlFor='dokumenAktaPerubahan'
                     className='cursor-pointer  bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
                   >
-                    {formDokumen?.dokumenLaporanKeuangan?.name
+                    {formDokumen?.dokumenAktaPerubahan?.name
                       ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
                     // value={formDokumen.dokumenNpwp}
-                    id='dokumenLaporanKeuangan'
-                    name='dokumenLaporanKeuangan'
+                    id='dokumenAktaPerubahan'
+                    name='dokumenAktaPerubahan'
                     type='file'
                     title=' '
                     className='hidden'
-                    aria-invalid={errorsDokumen.dokumenLaporanKeuangan}
+                    aria-invalid={errorsDokumen.dokumenAktaPerubahan}
                     onChange={handleInputChange}
                     accept='.pdf,.png,.jpg,.jpeg'
                   />
-                  <span className='mt-2 text-gray-600 truncate'>
-                    {formDokumen?.dokumenLaporanKeuangan?.name}
+                  <span className='mt-2 text-gray-600 line-clamp-2 truncate'>
+                    {formDokumen?.dokumenAktaPerubahan?.name}
                   </span>
                 </div>
                 <span className='text-xs opacity-60 text-red-500'>
@@ -900,11 +1133,51 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 </span>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errorsDokumen.dokumenLaporanKeuangan}
+                    {errorsDokumen.dokumenAktaPerubahan}
                   </div>
                 )}
               </div>
 
+              <div
+                className='w-full flex flex-col gap-2'
+                ref={dokumenTempatBekerjaRef}
+              >
+                <label className='form-label  text-nowrap'>
+                  Foto tempat kerja
+                </label>
+                <div className='flex flex-row gap-2'>
+                  <label
+                    htmlFor='dokumenTempatBekerja'
+                    className='cursor-pointer  bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
+                  >
+                    {formDokumen?.dokumenTempatBekerja?.name
+                      ? 'Ubah Dokumen'
+                      : 'Upload Dokumen'}
+                  </label>
+                  <input
+                    // value={formDokumen.dokumenNpwp}
+                    id='dokumenTempatBekerja'
+                    name='dokumenTempatBekerja'
+                    type='file'
+                    title=' '
+                    className='hidden'
+                    aria-invalid={errorsDokumen.dokumenTempatBekerja}
+                    onChange={handleInputChange}
+                    accept='.pdf,.png,.jpg,.jpeg'
+                  />
+                  <span className='mt-2 text-gray-600 line-clamp-2 truncate'>
+                    {formDokumen?.dokumenTempatBekerja?.name}
+                  </span>
+                </div>
+                <span className='text-xs opacity-60 text-red-500'>
+                  Format: pdf, jpeg, jpg, png. max file size 2MB
+                </span>
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenTempatBekerja}
+                  </div>
+                )}
+              </div>
               <div
                 className='w-full flex flex-col gap-2'
                 ref={dokumenFotoKantorRef}
@@ -932,7 +1205,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     onChange={handleInputChange}
                     accept='.pdf,.png,.jpg,.jpeg'
                   />
-                  <span className='mt-2 text-gray-600 truncate'>
+                  <span className='mt-2 text-gray-600 line-clamp-2 truncate'>
                     {formDokumen?.dokumenFotoKantor?.name}
                   </span>
                 </div>
@@ -945,36 +1218,79 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                   </div>
                 )}
               </div>
+              <div
+                className='w-full flex flex-col gap-2'
+                ref={dokumenKtpDirutRef}
+              >
+                <label className='form-label  text-nowrap'>
+                  KTP Dirut/Direktur{' '}
+                  <span className=' opacity-60'>(Opsional)</span>{' '}
+                  <span className='text-danger-500 text-xl'>*</span>
+                </label>
+                <div className='flex flex-row gap-2'>
+                  <label
+                    htmlFor='dokumenKtpDirut'
+                    className='cursor-pointer  bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
+                  >
+                    {formDokumen?.dokumenKtpDirut?.name
+                      ? 'Ubah Dokumen'
+                      : 'Upload Dokumen'}
+                  </label>
+                  <input
+                    // value={formDokumen.dokumenNpwp}
+                    id='dokumenKtpDirut'
+                    name='dokumenKtpDirut'
+                    type='file'
+                    title=' '
+                    className='hidden'
+                    aria-invalid={errorsDokumen.dokumenKtpDirut}
+                    onChange={handleInputChange}
+                    accept='.pdf,.png,.jpg,.jpeg'
+                  />
+                  <span className='mt-2 text-gray-600 line-clamp-2 truncate'>
+                    {formDokumen?.dokumenKtpDirut?.name}
+                  </span>
+                </div>
+                <span className='text-xs opacity-60 text-red-500'>
+                  Format: pdf, jpeg, jpg, png. max file size 2MB
+                </span>
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenKtpDirut}
+                  </div>
+                )}
+              </div>
 
               <div
                 className='w-full flex flex-col gap-2'
-                ref={dokumenTempatBekerjaRef}
+                ref={dokumenLaporanKeuanganRef}
               >
                 <label className='form-label  text-nowrap'>
-                  Foto tempat kerja
+                  Laporan Keuangan{' '}
+                  <span className=' opacity-60'>(Opsional)</span>
                 </label>
                 <div className='flex flex-row gap-2'>
                   <label
-                    htmlFor='dokumenTempatBekerja'
+                    htmlFor='dokumenLaporanKeuangan'
                     className='cursor-pointer  bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded w-fit min-w-40 text-nowrap text-center flex items-center justify-center'
                   >
-                    {formDokumen?.dokumenTempatBekerja?.name
+                    {formDokumen?.dokumenLaporanKeuangan?.name
                       ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
                     // value={formDokumen.dokumenNpwp}
-                    id='dokumenTempatBekerja'
-                    name='dokumenTempatBekerja'
+                    id='dokumenLaporanKeuangan'
+                    name='dokumenLaporanKeuangan'
                     type='file'
                     title=' '
                     className='hidden'
-                    aria-invalid={errorsDokumen.dokumenTempatBekerja}
+                    aria-invalid={errorsDokumen.dokumenLaporanKeuangan}
                     onChange={handleInputChange}
                     accept='.pdf,.png,.jpg,.jpeg'
                   />
                   <span className='mt-2 text-gray-600 truncate'>
-                    {formDokumen?.dokumenTempatBekerja?.name}
+                    {formDokumen?.dokumenLaporanKeuangan?.name}
                   </span>
                 </div>
                 <span className='text-xs opacity-60 text-red-500'>
@@ -982,7 +1298,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 </span>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errorsDokumen.dokumenTempatBekerja}
+                    {errorsDokumen.dokumenLaporanKeuangan}
                   </div>
                 )}
               </div>
@@ -997,11 +1313,11 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               <p className='font-bold'>Upload Progress</p>
               <p>
                 <span className='text-red-500 font-bold'>
-                  {parseInt((getJumlahDokumenDiisi() / 9) * 100)} %
+                  {parseInt((getJumlahDokumenDiisi() / 13) * 100)} %
                 </span>
                 <span className='ml-2 opacity-60'>
-                  {getJumlahDokumenDiisi() >= 4
-                    ? getJumlahDokumenDiisi() == 9
+                  {getJumlahDokumenDiisi() >= 5
+                    ? getJumlahDokumenDiisi() == 13
                       ? 'Selesai'
                       : 'Sedikit Lagi'
                     : ''}
@@ -1017,7 +1333,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               baseBgColor='#E5E7EB'
               labelColor='#e80909'
               labelSize='0'
-              maxCompleted={9}
+              maxCompleted={13}
               height='10px'
             />
             <span className='opacity-75 text-xs text-red-500'>
diff --git a/src/lib/pengajuan-tempo/component/KonfirmasiDokumen.jsx b/src/lib/pengajuan-tempo/component/KonfirmasiDokumen.jsx
index 19b7fed2..ca571167 100644
--- a/src/lib/pengajuan-tempo/component/KonfirmasiDokumen.jsx
+++ b/src/lib/pengajuan-tempo/component/KonfirmasiDokumen.jsx
@@ -178,16 +178,116 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
           <h1 className={`font-bold ${isKonfirmasi ? 'text-xl' : ''}`}>
             Dokumen
           </h1>
-          <form className='flex flex-col w-full gap-5'>
-            <div className='w-full flex flex-row items-center '>
-              <div className='w-2/5'>
+          <form className='flex flex-col w-full gap-5  '>
+            <div className='w-full flex flex-row items-center  '>
+              <div className='w-2/5 flex'>
                 <label className='form-label  text-nowrap'>
-                  NIB (SIUP/TDP/SKDP)
+                  NPWP Perusahaan
                 </label>
               </div>
               <div className='w-3/5'>
                 <div className='flex flex-row items-start justify-between'>
-                  <span className='w-3/5  text-gray-600 truncate'>
+                  <span className='w-3/5  text-gray-600 truncate max-w-48'>
+                    {formDokumen?.dokumenNpwp?.name}
+                  </span>
+                  <div className='w-2/5 flex flex-row gap-2'>
+                    <label
+                      htmlFor='dokumenNpwp'
+                      className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
+                    >
+                      {formDokumen?.dokumenNpwp?.name ? 'Ubah' : 'Upload'}
+                    </label>
+                    <input
+                      // value={formDokumen?.dokumenNib?.name}
+                      id='dokumenNpwp'
+                      name='dokumenNpwp'
+                      type='file'
+                      title=' '
+                      ref={dokumenNpwpRef}
+                      className='hidden'
+                      aria-invalid={errorsDokumen.dokumenNpwp}
+                      onChange={handleInputChange}
+                      accept='.pdf,.png,.jpg,.jpeg'
+                    />
+                    <button
+                      className='rounded text-white p-2 flex flex-row bg-red-500 hover:cursor-pointer hover:bg-red-400'
+                      type='button'
+                      onClick={() =>
+                        handleConfirmSubmit(
+                          formDokumen.dokumenNpwp.format,
+                          formDokumen.dokumenNpwp.base64
+                        )
+                      }
+                    >
+                      <EyeIcon className={`w-4 ${isDesktop && ''}`} />
+                    </button>
+                  </div>
+                </div>
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenNpwp}
+                  </div>
+                )}
+              </div>
+            </div>
+            <div className='w-full flex flex-row items-center '>
+              <div className='w-2/5'>
+                <label className='form-label  text-nowrap'>SPPKP</label>
+              </div>
+              <div className='w-3/5'>
+                <div className='flex flex-row items-start justify-between'>
+                  <span className='w-3/5  text-gray-600 truncate max-w-48'>
+                    {formDokumen?.dokumenSppkp?.name}
+                  </span>
+                  <div className='w-2/5 flex flex-row gap-2'>
+                    <label
+                      htmlFor='dokumenSppkp'
+                      className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
+                    >
+                      {formDokumen?.dokumenSppkp?.name.length > 0
+                        ? 'Ubah'
+                        : 'Upload'}
+                    </label>
+                    <input
+                      // value={formDokumen?.dokumenNib?.name}
+                      id='dokumenSppkp'
+                      name='dokumenSppkp'
+                      type='file'
+                      title=' '
+                      ref={dokumenSppkpRef}
+                      className='hidden'
+                      aria-invalid={errorsDokumen.dokumenSppkp}
+                      onChange={handleInputChange}
+                      accept='.pdf,.png,.jpg,.jpeg'
+                    />
+                    <button
+                      className='rounded text-white p-2 flex flex-row bg-red-500 hover:cursor-pointer hover:bg-red-400'
+                      type='button'
+                      onClick={() =>
+                        handleConfirmSubmit(
+                          formDokumen.dokumenSppkp.format,
+                          formDokumen.dokumenSppkp.base64
+                        )
+                      }
+                    >
+                      <EyeIcon className={`w-4 ${isDesktop && ''}`} />
+                    </button>
+                  </div>
+                </div>
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenSppkp}
+                  </div>
+                )}
+              </div>
+            </div>
+            <div className='w-full flex flex-row items-center '>
+              <div className='w-2/5'>
+                <label className='form-label  text-nowrap'>NIB</label>
+              </div>
+              <div className='w-3/5'>
+                <div className='flex flex-row items-start justify-between'>
+                  <span className='w-3/5  text-gray-600 truncate max-w-48'>
                     {formDokumen?.dokumenNib?.name}
                   </span>
                   <div className='w-2/5 flex flex-row gap-2'>
@@ -230,33 +330,33 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 )}
               </div>
             </div>
+
             <div className='w-full flex flex-row items-center '>
               <div className='w-2/5'>
                 <label className='form-label  text-nowrap'>
-                  NPWP Perusahaan
+                  SIUP <span className=' opacity-60'>(Opsional)</span>
                 </label>
               </div>
               <div className='w-3/5'>
                 <div className='flex flex-row items-start justify-between'>
-                  <span className='w-3/5  text-gray-600 truncate'>
-                    {formDokumen?.dokumenNpwp?.name}
+                  <span className='w-3/5  text-gray-600 truncate max-w-48'>
+                    {formDokumen?.dokumenSiup?.name}
                   </span>
                   <div className='w-2/5 flex flex-row gap-2'>
                     <label
-                      htmlFor='dokumenNpwp'
+                      htmlFor='dokumenSiup'
                       className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
                     >
-                      {formDokumen?.dokumenNpwp?.name ? 'Ubah' : 'Upload'}
+                      {formDokumen.dokumenSiup.name ? 'Ubah' : 'Upload'}
                     </label>
                     <input
                       // value={formDokumen?.dokumenNib?.name}
-                      id='dokumenNpwp'
-                      name='dokumenNpwp'
+                      id='dokumenSiup'
+                      name='dokumenSiup'
                       type='file'
                       title=' '
-                      ref={dokumenNpwpRef}
                       className='hidden'
-                      aria-invalid={errorsDokumen.dokumenNpwp}
+                      aria-invalid={errorsDokumen.dokumenSiup}
                       onChange={handleInputChange}
                       accept='.pdf,.png,.jpg,.jpeg'
                     />
@@ -265,8 +365,8 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       type='button'
                       onClick={() =>
                         handleConfirmSubmit(
-                          formDokumen.dokumenNpwp.format,
-                          formDokumen.dokumenNpwp.base64
+                          formDokumen.dokumenSiup.format,
+                          formDokumen.dokumenSiup.base64
                         )
                       }
                     >
@@ -276,38 +376,303 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 </div>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errorsDokumen.dokumenNpwp}
+                    {errorsDokumen.dokumenSiup}
                   </div>
                 )}
               </div>
             </div>
+
             <div className='w-full flex flex-row items-center '>
               <div className='w-2/5'>
-                <label className='form-label  text-nowrap'>SPPKP</label>
+                <label className='form-label  text-nowrap'>
+                  TDP <span className=' opacity-60'>(Opsional)</span>
+                </label>
               </div>
               <div className='w-3/5'>
                 <div className='flex flex-row items-start justify-between'>
-                  <span className='w-3/5  text-gray-600 truncate'>
-                    {formDokumen?.dokumenSppkp?.name}
+                  <span className='w-3/5  text-gray-600 truncate max-w-48'>
+                    {formDokumen?.dokumenTdp?.name}
                   </span>
                   <div className='w-2/5 flex flex-row gap-2'>
                     <label
-                      htmlFor='dokumenSppkp'
+                      htmlFor='dokumenTdp'
                       className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
                     >
-                      {formDokumen?.dokumenSppkp?.name.length > 0
+                      {formDokumen.dokumenTdp.name ? 'Ubah' : 'Upload'}
+                    </label>
+                    <input
+                      // value={formDokumen?.dokumenNib?.name}
+                      id='dokumenTdp'
+                      name='dokumenTdp'
+                      type='file'
+                      title=' '
+                      className='hidden'
+                      aria-invalid={errorsDokumen.dokumenTdp}
+                      onChange={handleInputChange}
+                      accept='.pdf,.png,.jpg,.jpeg'
+                    />
+                    <button
+                      className='rounded text-white p-2 flex flex-row bg-red-500 hover:cursor-pointer hover:bg-red-400'
+                      type='button'
+                      onClick={() =>
+                        handleConfirmSubmit(
+                          formDokumen.dokumenTdp.format,
+                          formDokumen.dokumenTdp.base64
+                        )
+                      }
+                    >
+                      <EyeIcon className={`w-4 ${isDesktop && ''}`} />
+                    </button>
+                  </div>
+                </div>
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenTdp}
+                  </div>
+                )}
+              </div>
+            </div>
+
+            <div className='w-full flex flex-row items-center '>
+              <div className='w-2/5'>
+                <label className='form-label  text-nowrap'>
+                  SKDP <span className=' opacity-60'>(Opsional)</span>
+                </label>
+              </div>
+              <div className='w-3/5'>
+                <div className='flex flex-row items-start justify-between'>
+                  <span className='w-3/5  text-gray-600 truncate max-w-48'>
+                    {formDokumen?.dokumenSkdp?.name}
+                  </span>
+                  <div className='w-2/5 flex flex-row gap-2'>
+                    <label
+                      htmlFor='dokumenSkdp'
+                      className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
+                    >
+                      {formDokumen.dokumenSkdp.name ? 'Ubah' : 'Upload'}
+                    </label>
+                    <input
+                      // value={formDokumen?.dokumenNib?.name}
+                      id='dokumenSkdp'
+                      name='dokumenSkdp'
+                      type='file'
+                      title=' '
+                      className='hidden'
+                      aria-invalid={errorsDokumen.dokumenSkdp}
+                      onChange={handleInputChange}
+                      accept='.pdf,.png,.jpg,.jpeg'
+                    />
+                    <button
+                      className='rounded text-white p-2 flex flex-row bg-red-500 hover:cursor-pointer hover:bg-red-400'
+                      type='button'
+                      onClick={() =>
+                        handleConfirmSubmit(
+                          formDokumen.dokumenSkdp.format,
+                          formDokumen.dokumenSkdp.base64
+                        )
+                      }
+                    >
+                      <EyeIcon className={`w-4 ${isDesktop && ''}`} />
+                    </button>
+                  </div>
+                </div>
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenSkdp}
+                  </div>
+                )}
+              </div>
+            </div>
+
+            <div className='w-full flex flex-row items-center '>
+              <div className='w-2/5'>
+                <label className='form-label  text-nowrap'>
+                  SKT <span className=' opacity-60'>(Opsional)</span>
+                </label>
+              </div>
+              <div className='w-3/5'>
+                <div className='flex flex-row items-start justify-between'>
+                  <span className='w-3/5  text-gray-600 truncate max-w-48'>
+                    {formDokumen?.dokumenSkt?.name}
+                  </span>
+                  <div className='w-2/5 flex flex-row gap-2'>
+                    <label
+                      htmlFor='dokumenSkt'
+                      className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
+                    >
+                      {formDokumen.dokumenSkt.name ? 'Ubah' : 'Upload'}
+                    </label>
+                    <input
+                      // value={formDokumen?.dokumenNib?.name}
+                      id='dokumenSkt'
+                      name='dokumenSkt'
+                      type='file'
+                      title=' '
+                      className='hidden'
+                      aria-invalid={errorsDokumen.dokumenSkt}
+                      onChange={handleInputChange}
+                      accept='.pdf,.png,.jpg,.jpeg'
+                    />
+                    <button
+                      className='rounded text-white p-2 flex flex-row bg-red-500 hover:cursor-pointer hover:bg-red-400'
+                      type='button'
+                      onClick={() =>
+                        handleConfirmSubmit(
+                          formDokumen.dokumenSkt.format,
+                          formDokumen.dokumenSkt.base64
+                        )
+                      }
+                    >
+                      <EyeIcon className={`w-4 ${isDesktop && ''}`} />
+                    </button>
+                  </div>
+                </div>
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenSkt}
+                  </div>
+                )}
+              </div>
+            </div>
+
+            <div className='w-full flex flex-row items-center '>
+              <div className='w-2/5'>
+                <label className='form-label  text-nowrap'>
+                  Akta Pendirian <span className=' opacity-60'>(Opsional)</span>
+                </label>
+              </div>
+              <div className='w-3/5'>
+                <div className='flex flex-row items-start justify-between'>
+                  <span className='w-3/5  text-gray-600 truncate max-w-48'>
+                    {formDokumen?.dokumenAktaPendirian?.name}
+                  </span>
+                  <div className='w-2/5 flex flex-row gap-2'>
+                    <label
+                      htmlFor='dokumenAktaPendirian'
+                      className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
+                    >
+                      {formDokumen?.dokumenAktaPendirian?.name
                         ? 'Ubah'
                         : 'Upload'}
                     </label>
                     <input
                       // value={formDokumen?.dokumenNib?.name}
-                      id='dokumenSppkp'
-                      name='dokumenSppkp'
+                      id='dokumenAktaPendirian'
+                      name='dokumenAktaPendirian'
                       type='file'
                       title=' '
-                      ref={dokumenSppkpRef}
+                      ref={dokumenAktaPendirianRef}
+                      className='hidden'
+                      aria-invalid={errorsDokumen.dokumenAktaPendirian}
+                      onChange={handleInputChange}
+                      accept='.pdf,.png,.jpg,.jpeg'
+                    />
+                    <button
+                      className='rounded text-white p-2 flex flex-row bg-red-500 hover:cursor-pointer hover:bg-red-400'
+                      type='button'
+                      onClick={() =>
+                        handleConfirmSubmit(
+                          formDokumen.dokumenAktaPendirian.format,
+                          formDokumen.dokumenAktaPendirian.base64
+                        )
+                      }
+                    >
+                      <EyeIcon className={`w-4 ${isDesktop && ''}`} />
+                    </button>
+                  </div>
+                </div>
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenAktaPendirian}
+                  </div>
+                )}
+              </div>
+            </div>
+
+            <div className='w-full flex flex-row items-center '>
+              <div className='w-2/5'>
+                <label className='form-label  text-nowrap'>
+                  {' '}
+                  Akta Perubahan <span className=' opacity-60'>(Opsional)</span>
+                </label>
+              </div>
+              <div className='w-3/5'>
+                <div className='flex flex-row items-start justify-between'>
+                  <span className='w-3/5  text-gray-600 truncate max-w-48'>
+                    {formDokumen?.dokumenAktaPerubahan?.name}
+                  </span>
+                  <div className='w-2/5 flex flex-row gap-2'>
+                    <label
+                      htmlFor='dokumenAktaPerubahan'
+                      className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
+                    >
+                      {formDokumen.dokumenAktaPerubahan.name
+                        ? 'Ubah'
+                        : 'Upload'}
+                    </label>
+                    <input
+                      // value={formDokumen?.dokumenNib?.name}
+                      id='dokumenAktaPerubahan'
+                      name='dokumenAktaPerubahan'
+                      type='file'
+                      title=' '
+                      ref={dokumenAktaPerubahanRef}
+                      className='hidden'
+                      aria-invalid={errorsDokumen.dokumenAktaPerubahan}
+                      onChange={handleInputChange}
+                      accept='.pdf,.png,.jpg,.jpeg'
+                    />
+                    <button
+                      className='rounded text-white p-2 flex flex-row bg-red-500 hover:cursor-pointer hover:bg-red-400'
+                      type='button'
+                      onClick={() =>
+                        handleConfirmSubmit(
+                          formDokumen.dokumenAktaPerubahan.format,
+                          formDokumen.dokumenAktaPerubahan.base64
+                        )
+                      }
+                    >
+                      <EyeIcon className={`w-4 ${isDesktop && ''}`} />
+                    </button>
+                  </div>
+                </div>
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenAktaPerubahan}
+                  </div>
+                )}
+              </div>
+            </div>
+
+            <div className='w-full flex flex-row items-center '>
+              <div className='w-2/5'>
+                <label className='form-label  text-nowrap'>
+                  Foto tempat kerja
+                </label>
+              </div>
+              <div className='w-3/5'>
+                <div className='flex flex-row items-start justify-between'>
+                  <span className='w-3/5  text-gray-600 truncate max-w-48'>
+                    {formDokumen?.dokumenTempatBekerja?.name}
+                  </span>
+                  <div className='w-2/5 flex flex-row gap-2'>
+                    <label
+                      htmlFor='dokumenTempatBekerja'
+                      className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
+                    >
+                      {formDokumen?.dokumenTempatBekerja?.name
+                        ? 'Ubah'
+                        : 'Upload'}
+                    </label>
+                    <input
+                      // value={formDokumen?.dokumenNib?.name}
+                      id='dokumenTempatBekerja'
+                      name='dokumenTempatBekerja'
+                      type='file'
+                      title=' '
+                      ref={dokumenTempatBekerjaRef}
                       className='hidden'
-                      aria-invalid={errorsDokumen.dokumenSppkp}
+                      aria-invalid={errorsDokumen.dokumenTempatBekerja}
                       onChange={handleInputChange}
                       accept='.pdf,.png,.jpg,.jpeg'
                     />
@@ -316,8 +681,8 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       type='button'
                       onClick={() =>
                         handleConfirmSubmit(
-                          formDokumen.dokumenSppkp.format,
-                          formDokumen.dokumenSppkp.base64
+                          formDokumen.dokumenTempatBekerja.format,
+                          formDokumen.dokumenTempatBekerja.base64
                         )
                       }
                     >
@@ -327,7 +692,7 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 </div>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errorsDokumen.dokumenSppkp}
+                    {errorsDokumen.dokumenTempatBekerja}
                   </div>
                 )}
               </div>
@@ -336,33 +701,30 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
             <div className='w-full flex flex-row items-center '>
               <div className='w-2/5'>
                 <label className='form-label  text-nowrap'>
-                  {' '}
-                  Akta Perubahan <span className=' opacity-60'>(Opsional)</span>
+                  Foto Kantor (Tampak Depan)
                 </label>
               </div>
               <div className='w-3/5'>
                 <div className='flex flex-row items-start justify-between'>
-                  <span className='w-3/5  text-gray-600 truncate'>
-                    {formDokumen?.dokumenAktaPerubahan?.name}
+                  <span className='w-3/5  text-gray-600 truncate max-w-48'>
+                    {formDokumen?.dokumenFotoKantor?.name}
                   </span>
                   <div className='w-2/5 flex flex-row gap-2'>
                     <label
-                      htmlFor='dokumenAktaPerubahan'
+                      htmlFor='dokumenFotoKantor'
                       className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
                     >
-                      {formDokumen.dokumenAktaPerubahan.name
-                        ? 'Ubah'
-                        : 'Upload'}
+                      {formDokumen?.dokumenFotoKantor?.name ? 'Ubah' : 'Upload'}
                     </label>
                     <input
                       // value={formDokumen?.dokumenNib?.name}
-                      id='dokumenAktaPerubahan'
-                      name='dokumendokumenAktaPerubahanSppkp'
+                      id='dokumenFotoKantor'
+                      name='dokumenFotoKantor'
                       type='file'
                       title=' '
-                      ref={dokumenAktaPerubahanRef}
+                      ref={dokumenFotoKantorRef}
                       className='hidden'
-                      aria-invalid={errorsDokumen.dokumenAktaPerubahan}
+                      aria-invalid={errorsDokumen.dokumenFotoKantor}
                       onChange={handleInputChange}
                       accept='.pdf,.png,.jpg,.jpeg'
                     />
@@ -371,8 +733,8 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       type='button'
                       onClick={() =>
                         handleConfirmSubmit(
-                          formDokumen.dokumenAktaPerubahan.format,
-                          formDokumen.dokumenAktaPerubahan.base64
+                          formDokumen.dokumenFotoKantor.format,
+                          formDokumen.dokumenFotoKantor.base64
                         )
                       }
                     >
@@ -382,7 +744,7 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 </div>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errorsDokumen.dokumenAktaPerubahan}
+                    {errorsDokumen.dokumenFotoKantor}
                   </div>
                 )}
               </div>
@@ -397,7 +759,7 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               </div>
               <div className='w-3/5'>
                 <div className='flex flex-row items-start justify-between'>
-                  <span className='w-3/5  text-gray-600 truncate'>
+                  <span className='w-3/5  text-gray-600 truncate max-w-48'>
                     {formDokumen?.dokumenKtpDirut?.name}
                   </span>
                   <div className='w-2/5 flex flex-row gap-2'>
@@ -444,32 +806,33 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
             <div className='w-full flex flex-row items-center '>
               <div className='w-2/5'>
                 <label className='form-label  text-nowrap'>
-                  Akta Pendirian <span className=' opacity-60'>(Opsional)</span>
+                  Laporan Keuangan
+                  <span className=' opacity-60'>(Opsional)</span>
                 </label>
               </div>
               <div className='w-3/5'>
                 <div className='flex flex-row items-start justify-between'>
-                  <span className='w-3/5  text-gray-600 truncate'>
-                    {formDokumen?.dokumenAktaPendirian?.name}
+                  <span className='w-3/5  text-gray-600 truncate max-w-48'>
+                    {formDokumen?.dokumenLaporanKeuangan?.name}
                   </span>
                   <div className='w-2/5 flex flex-row gap-2'>
                     <label
-                      htmlFor='dokumenAktaPendirian'
+                      htmlFor='dokumenLaporanKeuangan'
                       className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
                     >
-                      {formDokumen?.dokumenAktaPendirian?.name
+                      {formDokumen?.dokumenLaporanKeuangan?.name
                         ? 'Ubah'
                         : 'Upload'}
                     </label>
                     <input
                       // value={formDokumen?.dokumenNib?.name}
-                      id='dokumenAktaPendirian'
-                      name='dokumenAktaPendirian'
+                      id='dokumenLaporanKeuangan'
+                      name='dokumenLaporanKeuangan'
                       type='file'
                       title=' '
-                      ref={dokumenAktaPendirianRef}
+                      ref={dokumenLaporanKeuanganRef}
                       className='hidden'
-                      aria-invalid={errorsDokumen.dokumenAktaPendirian}
+                      aria-invalid={errorsDokumen.dokumenLaporanKeuangan}
                       onChange={handleInputChange}
                       accept='.pdf,.png,.jpg,.jpeg'
                     />
@@ -478,8 +841,8 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       type='button'
                       onClick={() =>
                         handleConfirmSubmit(
-                          formDokumen.dokumenAktaPendirian.format,
-                          formDokumen.dokumenAktaPendirian.base64
+                          formDokumen.dokumenLaporanKeuangan.format,
+                          formDokumen.dokumenLaporanKeuangan.base64
                         )
                       }
                     >
@@ -489,42 +852,45 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 </div>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errorsDokumen.dokumenAktaPendirian}
+                    {errorsDokumen.dokumenLaporanKeuangan}
                   </div>
                 )}
               </div>
             </div>
-
+          </form>
+        </div>
+      )}
+      {isMobile && (
+        <div className=''>
+          <h1 className={`font-bold ${isKonfirmasi ? 'hidden' : 'text-xl'}`}>
+            Dokumen
+          </h1>
+          <form className='flex flex-col w-full gap-5 text-sm'>
             <div className='w-full flex flex-row items-center '>
               <div className='w-2/5'>
-                <label className='form-label  text-nowrap'>
-                  Laporan Keuangan
-                  <span className=' opacity-60'>(Opsional)</span>
-                </label>
+                <label className='form-label  text-wrap'>NPWP Perusahaan</label>
               </div>
               <div className='w-3/5'>
                 <div className='flex flex-row items-start justify-between'>
-                  <span className='w-3/5  text-gray-600 truncate'>
-                    {formDokumen?.dokumenLaporanKeuangan?.name}
+                  <span className='w-2/5  text-gray-600 truncate '>
+                    {formDokumen?.dokumenNpwp?.name}
                   </span>
-                  <div className='w-2/5 flex flex-row gap-2'>
+                  <div className='w-3/5 flex flex-row gap-2'>
                     <label
-                      htmlFor='dokumenLaporanKeuangan'
+                      htmlFor='dokumenNpwp'
                       className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
                     >
-                      {formDokumen?.dokumenLaporanKeuangan?.name
-                        ? 'Ubah'
-                        : 'Upload'}
+                      {formDokumen?.dokumenNpwp?.name ? 'Sudah' : 'Upload'}
                     </label>
                     <input
                       // value={formDokumen?.dokumenNib?.name}
-                      id='dokumenLaporanKeuangan'
-                      name='dokumenLaporanKeuangan'
+                      id='dokumenNpwp'
+                      name='dokumenNpwp'
                       type='file'
                       title=' '
-                      ref={dokumenLaporanKeuanganRef}
+                      ref={dokumenNpwpRef}
                       className='hidden'
-                      aria-invalid={errorsDokumen.dokumenLaporanKeuangan}
+                      aria-invalid={errorsDokumen.dokumenNpwp}
                       onChange={handleInputChange}
                       accept='.pdf,.png,.jpg,.jpeg'
                     />
@@ -533,8 +899,8 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       type='button'
                       onClick={() =>
                         handleConfirmSubmit(
-                          formDokumen.dokumenLaporanKeuangan.format,
-                          formDokumen.dokumenLaporanKeuangan.base64
+                          formDokumen.dokumenNpwp.format,
+                          formDokumen.dokumenNpwp.base64
                         )
                       }
                     >
@@ -544,39 +910,36 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 </div>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errorsDokumen.dokumenLaporanKeuangan}
+                    {errorsDokumen.dokumenNpwp}
                   </div>
                 )}
               </div>
             </div>
-
             <div className='w-full flex flex-row items-center '>
               <div className='w-2/5'>
-                <label className='form-label  text-nowrap'>
-                  Foto Kantor (Tampak Depan)
-                </label>
+                <label className='form-label  text-wrap'>SPPKP</label>
               </div>
               <div className='w-3/5'>
                 <div className='flex flex-row items-start justify-between'>
-                  <span className='w-3/5  text-gray-600 truncate'>
-                    {formDokumen?.dokumenFotoKantor?.name}
+                  <span className='w-2/5  text-gray-600 truncate '>
+                    {formDokumen?.dokumenSppkp?.name}
                   </span>
-                  <div className='w-2/5 flex flex-row gap-2'>
+                  <div className='w-3/5 flex flex-row gap-2'>
                     <label
-                      htmlFor='dokumenFotoKantor'
+                      htmlFor='dokumenSppkp'
                       className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
                     >
-                      {formDokumen?.dokumenFotoKantor?.name ? 'Ubah' : 'Upload'}
+                      {formDokumen?.dokumenSppkp?.name ? 'Ubah' : 'Upload'}
                     </label>
                     <input
                       // value={formDokumen?.dokumenNib?.name}
-                      id='dokumenFotoKantor'
-                      name='dokumenFotoKantor'
+                      id='dokumenSppkp'
+                      name='dokumenSppkp'
                       type='file'
                       title=' '
-                      ref={dokumenFotoKantorRef}
+                      ref={dokumenSppkpRef}
                       className='hidden'
-                      aria-invalid={errorsDokumen.dokumenFotoKantor}
+                      aria-invalid={errorsDokumen.dokumenSppkp}
                       onChange={handleInputChange}
                       accept='.pdf,.png,.jpg,.jpeg'
                     />
@@ -585,8 +948,8 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       type='button'
                       onClick={() =>
                         handleConfirmSubmit(
-                          formDokumen.dokumenFotoKantor.format,
-                          formDokumen.dokumenFotoKantor.base64
+                          formDokumen.dokumenSppkp.format,
+                          formDokumen.dokumenSppkp.base64
                         )
                       }
                     >
@@ -596,7 +959,7 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 </div>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errorsDokumen.dokumenFotoKantor}
+                    {errorsDokumen.dokumenSppkp}
                   </div>
                 )}
               </div>
@@ -604,33 +967,81 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
 
             <div className='w-full flex flex-row items-center '>
               <div className='w-2/5'>
-                <label className='form-label  text-nowrap'>
-                  Foto tempat kerja
+                <label className='form-label  text-wrap'>NIB</label>
+              </div>
+              <div className='w-3/5'>
+                <div className='flex flex-row items-center justify-start'>
+                  <span className='w-2/5  text-gray-600 truncate '>
+                    {formDokumen?.dokumenNib?.name}
+                  </span>
+                  <div className='w-3/5 flex flex-row gap-2'>
+                    <label
+                      htmlFor='dokumenNib'
+                      className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
+                    >
+                      {formDokumen?.dokumenNib?.name ? 'Ubah' : 'Upload'}
+                    </label>
+                    <input
+                      // value={formDokumen?.dokumenNib?.name}
+                      id='dokumenNib'
+                      name='dokumenNib'
+                      type='file'
+                      title=' '
+                      ref={dokumenNibRef}
+                      className='hidden'
+                      aria-invalid={errorsDokumen.dokumenNib}
+                      onChange={handleInputChange}
+                      accept='.pdf,.png,.jpg,.jpeg'
+                    />
+                    <button
+                      className='rounded text-white p-2 flex flex-row bg-red-500 hover:cursor-pointer hover:bg-red-400'
+                      type='button'
+                      onClick={() =>
+                        handleConfirmSubmit(
+                          formDokumen.dokumenNib.format,
+                          formDokumen.dokumenNib.base64
+                        )
+                      }
+                    >
+                      <EyeIcon className={`w-4 ${isDesktop && ''}`} />
+                    </button>
+                  </div>
+                </div>
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenNib}
+                  </div>
+                )}
+              </div>
+            </div>
+
+            <div className='w-full flex flex-row items-center '>
+              <div className='w-2/5'>
+                <label className='form-label  text-wrap'>
+                  SIUP <span className=' opacity-60'>(Opsional)</span>
                 </label>
               </div>
               <div className='w-3/5'>
                 <div className='flex flex-row items-start justify-between'>
-                  <span className='w-3/5  text-gray-600 truncate'>
-                    {formDokumen?.dokumenTempatBekerja?.name}
+                  <span className='w-2/5  text-gray-600 truncate '>
+                    {formDokumen?.dokumenSiup?.name}
                   </span>
-                  <div className='w-2/5 flex flex-row gap-2'>
+                  <div className='w-3/5 flex flex-row gap-2'>
                     <label
-                      htmlFor='dokumenTempatBekerja'
+                      htmlFor='dokumenSiup'
                       className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
                     >
-                      {formDokumen?.dokumenTempatBekerja?.name
-                        ? 'Ubah'
-                        : 'Upload'}
+                      {formDokumen?.dokumenSiup?.name ? 'Ubah' : 'Upload'}
                     </label>
                     <input
                       // value={formDokumen?.dokumenNib?.name}
-                      id='dokumenTempatBekerja'
-                      name='dokumenTempatBekerja'
+                      id='dokumenSiup'
+                      name='dokumenSiup'
                       type='file'
                       title=' '
-                      ref={dokumenTempatBekerjaRef}
+                      ref={dokumenAktaPerubahanRef}
                       className='hidden'
-                      aria-invalid={errorsDokumen.dokumenTempatBekerja}
+                      aria-invalid={errorsDokumen.dokumenSiup}
                       onChange={handleInputChange}
                       accept='.pdf,.png,.jpg,.jpeg'
                     />
@@ -639,66 +1050,50 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       type='button'
                       onClick={() =>
                         handleConfirmSubmit(
-                          formDokumen.dokumenTempatBekerja.format,
-                          formDokumen.dokumenTempatBekerja.base64
+                          formDokumen.dokumenSiup.format,
+                          formDokumen.dokumenSiup.base64
                         )
                       }
                     >
                       <EyeIcon className={`w-4 ${isDesktop && ''}`} />
                     </button>
                   </div>
-                  {/* <Image
-                src={`data:image/png;base64, ${formDokumen.dokumenNib.base64}`}
-                alt='Contoh SPPKP'
-                className='w-full h-full '
-                width={800}
-                height={800}
-                quality={85}
-              /> */}
                 </div>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errorsDokumen.dokumenTempatBekerja}
+                    {errorsDokumen.dokumenSiup}
                   </div>
                 )}
               </div>
             </div>
-          </form>
-        </div>
-      )}
-      {isMobile && (
-        <div>
-          <h1 className={`font-bold ${isKonfirmasi ? 'hidden' : 'text-xl'}`}>
-            Dokumen
-          </h1>
-          <form className='flex flex-col w-full gap-5 text-sm'>
+
             <div className='w-full flex flex-row items-center '>
               <div className='w-2/5'>
                 <label className='form-label  text-wrap'>
-                  NIB (SIUP/TDP/SKDP)
+                  TDP <span className=' opacity-60'>(Opsional)</span>
                 </label>
               </div>
               <div className='w-3/5'>
-                <div className='flex flex-row items-center justify-start'>
-                  <span className='w-3/5  text-gray-600 truncate'>
-                    {formDokumen?.dokumenNib?.name}
+                <div className='flex flex-row items-start justify-between'>
+                  <span className='w-2/5  text-gray-600 truncate '>
+                    {formDokumen?.dokumenTdp?.name}
                   </span>
-                  <div className='w-2/5 flex flex-row gap-2'>
+                  <div className='w-3/5 flex flex-row gap-2'>
                     <label
-                      htmlFor='dokumenNib'
+                      htmlFor='dokumenTdp'
                       className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
                     >
-                      {formDokumen?.dokumenNib?.name ? 'Ubah' : 'Upload'}
+                      {formDokumen?.dokumenTdp?.name ? 'Ubah' : 'Upload'}
                     </label>
                     <input
                       // value={formDokumen?.dokumenNib?.name}
-                      id='dokumenNib'
-                      name='dokumenNib'
+                      id='dokumenTdp'
+                      name='dokumenTdp'
                       type='file'
                       title=' '
-                      ref={dokumenNibRef}
+                      ref={dokumenAktaPerubahanRef}
                       className='hidden'
-                      aria-invalid={errorsDokumen.dokumenNib}
+                      aria-invalid={errorsDokumen.dokumenTdp}
                       onChange={handleInputChange}
                       accept='.pdf,.png,.jpg,.jpeg'
                     />
@@ -707,8 +1102,8 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       type='button'
                       onClick={() =>
                         handleConfirmSubmit(
-                          formDokumen.dokumenNib.format,
-                          formDokumen.dokumenNib.base64
+                          formDokumen.dokumenTdp.format,
+                          formDokumen.dokumenTdp.base64
                         )
                       }
                     >
@@ -718,36 +1113,38 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 </div>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errorsDokumen.dokumenNib}
+                    {errorsDokumen.dokumenTdp}
                   </div>
                 )}
               </div>
             </div>
             <div className='w-full flex flex-row items-center '>
               <div className='w-2/5'>
-                <label className='form-label  text-wrap'>NPWP Perusahaan</label>
+                <label className='form-label  text-wrap'>
+                  SKDP <span className=' opacity-60'>(Opsional)</span>
+                </label>
               </div>
               <div className='w-3/5'>
                 <div className='flex flex-row items-start justify-between'>
-                  <span className='w-3/5  text-gray-600 truncate'>
-                    {formDokumen?.dokumenNpwp?.name}
+                  <span className='w-2/5  text-gray-600 truncate '>
+                    {formDokumen?.dokumenSkdp?.name}
                   </span>
-                  <div className='w-2/5 flex flex-row gap-2'>
+                  <div className='w-3/5 flex flex-row gap-2'>
                     <label
-                      htmlFor='dokumenNpwp'
+                      htmlFor='dokumenSkdp'
                       className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
                     >
-                      {formDokumen?.dokumenNpwp?.name ? 'Sudah' : 'Upload'}
+                      {formDokumen?.dokumenSkdp?.name ? 'Ubah' : 'Upload'}
                     </label>
                     <input
                       // value={formDokumen?.dokumenNib?.name}
-                      id='dokumenNpwp'
-                      name='dokumenNpwp'
+                      id='dokumenSkdp'
+                      name='dokumenSkdp'
                       type='file'
                       title=' '
-                      ref={dokumenNpwpRef}
+                      ref={dokumenAktaPerubahanRef}
                       className='hidden'
-                      aria-invalid={errorsDokumen.dokumenNpwp}
+                      aria-invalid={errorsDokumen.dokumenSkdp}
                       onChange={handleInputChange}
                       accept='.pdf,.png,.jpg,.jpeg'
                     />
@@ -756,8 +1153,8 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       type='button'
                       onClick={() =>
                         handleConfirmSubmit(
-                          formDokumen.dokumenNpwp.format,
-                          formDokumen.dokumenNpwp.base64
+                          formDokumen.dokumenSkdp.format,
+                          formDokumen.dokumenSkdp.base64
                         )
                       }
                     >
@@ -767,36 +1164,38 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 </div>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errorsDokumen.dokumenNpwp}
+                    {errorsDokumen.dokumenSkdp}
                   </div>
                 )}
               </div>
             </div>
             <div className='w-full flex flex-row items-center '>
               <div className='w-2/5'>
-                <label className='form-label  text-wrap'>SPPKP</label>
+                <label className='form-label  text-wrap'>
+                  SKT <span className=' opacity-60'>(Opsional)</span>
+                </label>
               </div>
               <div className='w-3/5'>
                 <div className='flex flex-row items-start justify-between'>
-                  <span className='w-3/5  text-gray-600 truncate'>
-                    {formDokumen?.dokumenSppkp?.name}
+                  <span className='w-2/5  text-gray-600 truncate '>
+                    {formDokumen?.dokumenSkt?.name}
                   </span>
-                  <div className='w-2/5 flex flex-row gap-2'>
+                  <div className='w-3/5 flex flex-row gap-2'>
                     <label
-                      htmlFor='dokumenSppkp'
+                      htmlFor='dokumenSkt'
                       className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
                     >
-                      {formDokumen?.dokumenSppkp?.name ? 'Ubah' : 'Upload'}
+                      {formDokumen?.dokumenSkt?.name ? 'Ubah' : 'Upload'}
                     </label>
                     <input
                       // value={formDokumen?.dokumenNib?.name}
-                      id='dokumenSppkp'
-                      name='dokumenSppkp'
+                      id='dokumenSkt'
+                      name='dokumenSkt'
                       type='file'
                       title=' '
-                      ref={dokumenSppkpRef}
+                      ref={dokumenAktaPerubahanRef}
                       className='hidden'
-                      aria-invalid={errorsDokumen.dokumenSppkp}
+                      aria-invalid={errorsDokumen.dokumenSkt}
                       onChange={handleInputChange}
                       accept='.pdf,.png,.jpg,.jpeg'
                     />
@@ -805,8 +1204,8 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       type='button'
                       onClick={() =>
                         handleConfirmSubmit(
-                          formDokumen.dokumenSppkp.format,
-                          formDokumen.dokumenSppkp.base64
+                          formDokumen.dokumenSkt.format,
+                          formDokumen.dokumenSkt.base64
                         )
                       }
                     >
@@ -816,7 +1215,7 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 </div>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
-                    {errorsDokumen.dokumenSppkp}
+                    {errorsDokumen.dokumenSkt}
                   </div>
                 )}
               </div>
@@ -831,10 +1230,10 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               </div>
               <div className='w-3/5'>
                 <div className='flex flex-row items-start justify-between'>
-                  <span className='w-3/5  text-gray-600 truncate'>
+                  <span className='w-2/5  text-gray-600 truncate '>
                     {formDokumen?.dokumenAktaPerubahan?.name}
                   </span>
-                  <div className='w-2/5 flex flex-row gap-2'>
+                  <div className='w-3/5 flex flex-row gap-2'>
                     <label
                       htmlFor='dokumenAktaPerubahan'
                       className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
@@ -846,7 +1245,7 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     <input
                       // value={formDokumen?.dokumenNib?.name}
                       id='dokumenAktaPerubahan'
-                      name='dokumendokumenAktaPerubahanSppkp'
+                      name='dokumenAktaPerubahan'
                       type='file'
                       title=' '
                       ref={dokumenAktaPerubahanRef}
@@ -886,10 +1285,10 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               </div>
               <div className='w-3/5'>
                 <div className='flex flex-row items-start justify-between'>
-                  <span className='w-3/5  text-gray-600 truncate'>
+                  <span className='w-2/5  text-gray-600 truncate '>
                     {formDokumen?.dokumenKtpDirut?.name}
                   </span>
-                  <div className='w-2/5 flex flex-row gap-2'>
+                  <div className='w-3/5 flex flex-row gap-2'>
                     <label
                       htmlFor='dokumenKtpDirut'
                       className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
@@ -938,10 +1337,10 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               </div>
               <div className='w-3/5'>
                 <div className='flex flex-row items-start justify-between'>
-                  <span className='w-3/5  text-gray-600 truncate'>
+                  <span className='w-2/5  text-gray-600 truncate '>
                     {formDokumen?.dokumenAktaPendirian?.name}
                   </span>
-                  <div className='w-2/5 flex flex-row gap-2'>
+                  <div className='w-3/5 flex flex-row gap-2'>
                     <label
                       htmlFor='dokumenAktaPendirian'
                       className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
@@ -993,10 +1392,10 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               </div>
               <div className='w-3/5'>
                 <div className='flex flex-row items-start justify-between'>
-                  <span className='w-3/5  text-gray-600 truncate'>
+                  <span className='w-2/5  text-gray-600 truncate '>
                     {formDokumen?.dokumenLaporanKeuangan?.name}
                   </span>
-                  <div className='w-2/5 flex flex-row gap-2'>
+                  <div className='w-3/5 flex flex-row gap-2'>
                     <label
                       htmlFor='dokumenLaporanKeuangan'
                       className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
@@ -1047,10 +1446,10 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               </div>
               <div className='w-3/5'>
                 <div className='flex flex-row items-start justify-between'>
-                  <span className='w-3/5  text-gray-600 truncate'>
+                  <span className='w-2/5  text-gray-600 truncate '>
                     {formDokumen?.dokumenFotoKantor?.name}
                   </span>
-                  <div className='w-2/5 flex flex-row gap-2'>
+                  <div className='w-3/5 flex flex-row gap-2'>
                     <label
                       htmlFor='dokumenFotoKantor'
                       className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20 text-center'
@@ -1099,10 +1498,10 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               </div>
               <div className='w-3/5'>
                 <div className='flex flex-row items-start justify-between'>
-                  <span className='w-3/5  text-gray-600 truncate'>
+                  <span className='w-2/5  text-gray-600 truncate'>
                     {formDokumen?.dokumenTempatBekerja?.name}
                   </span>
-                  <div className='w-2/5 flex flex-row gap-2'>
+                  <div className='w-3/5 flex flex-row gap-2'>
                     <label
                       htmlFor='dokumenTempatBekerja'
                       className='cursor-pointer bg-red-500 hover:bg-red-600 text-white py-1 px-3 text-sm rounded min-w-20'
@@ -1184,46 +1583,23 @@ const KonfirmasiDokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
           close={() => setIsExample(false)}
         >
           <div className='flex  justify-center items-center p-2'>
-            {!format.includes('undifined') ? (
-              <object
-                data={`data:${format};base64,${base64}`}
-                type={format}
-                width='100%'
-                height='100%'
-                onError={(e) => {
-                  // Jika <object> gagal menampilkan PDF, unduh otomatis
-                  const link = document.createElement('a');
-                  link.href = `data:${format};base64,${base64}`;
-                  link.download = 'document.pdf';
-                  link.click();
-                }}
-              >
-                PDF tidak dapat ditampilkan.
-                <a
-                  href={`data:${format};base64,${base64}`}
-                  download='document.pdf'
-                >
-                  {' '}
-                  Klik <span className='text-red-500'>di sini</span> untuk
-                  mengunduh PDF
-                </a>
-              </object>
-            ) : (
-              <embed
-                src={
-                  '/web/image/2540181?unique=7050288dd34d7318bf059e7f362540f6ad5533f9'
-                }
-                width='100%'
-                height='600px'
-              />
-            )}
-            {/* <embed
-              src={
-                '/web/image/2540181?unique=7050288dd34d7318bf059e7f362540f6ad5533f9'
-              }
+            {/* <iframe
+              src={`${
+                format == null ? url : `data:${format};base64,${base64}`
+              }`}
+              // src={`http://192.168.23.244:8069` + `${format}`}
+              // src={format}
+              width='800px'
+              height='600px'
+              title='Document'
+            ></iframe> */}
+            <embed
+              src={`${
+                format == null ? url : `data:${format};base64,${base64}`
+              }`}
               width='100%'
               height='600px'
-            /> */}
+            />
           </div>
         </BottomPopup>
       )}
@@ -1242,7 +1618,7 @@ export default KonfirmasiDokumen;
   title='NPWP File'
   frameBorder='0'
   sandbox
-></iframe> */
+  ></iframe> */
 }
 {
   /* <Image
@@ -1252,5 +1628,48 @@ export default KonfirmasiDokumen;
   width={1200}
   height={1200}
   quality={85}
-/> */
+  /> */
 }
+
+// <div className='flex  justify-center items-center p-2'>
+//   {!format.includes('undifined') ? (
+//     <object
+//       data={`data:${format};base64,${base64}`}
+//       type={format}
+//       width='100%'
+//       height='100%'
+//       onError={(e) => {
+//         // Jika <object> gagal menampilkan PDF, unduh otomatis
+//         const link = document.createElement('a');
+//         link.href = `data:${format};base64,${base64}`;
+//         link.download = 'document.pdf';
+//         link.click();
+//       }}
+//     >
+//       PDF tidak dapat ditampilkan.
+//       <a
+//         href={`data:${format};base64,${base64}`}
+//         download='document.pdf'
+//       >
+//         {' '}
+//         Klik <span className='text-red-500'>di sini</span> untuk
+//         mengunduh PDF
+//       </a>
+//     </object>
+//   ) : (
+//     <embed
+//       src={
+//         '/web/image/2540181?unique=7050288dd34d7318bf059e7f362540f6ad5533f9'
+//       }
+//       width='100%'
+//       height='600px'
+//     />
+//   )}
+//   {/* <embed
+//     src={
+//       '/web/image/2540181?unique=7050288dd34d7318bf059e7f362540f6ad5533f9'
+//     }
+//     width='100%'
+//     height='600px'
+//   /> */}
+// </div>
diff --git a/src/lib/pengajuan-tempo/component/KontakPerusahaan.jsx b/src/lib/pengajuan-tempo/component/KontakPerusahaan.jsx
index 77bf4316..1ea2223e 100644
--- a/src/lib/pengajuan-tempo/component/KontakPerusahaan.jsx
+++ b/src/lib/pengajuan-tempo/component/KontakPerusahaan.jsx
@@ -139,7 +139,7 @@ const KontakPerusahaan = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
 
               <div className='flex flex-row  justify-between items-start'>
                 <div className='w-2/5'>
-                  <label className='form-label text-nowrap'>
+                  <label className='form-label text-wrap'>
                     No. HP Direktur{' '}
                     <span className=' opacity-60'>(Opsional)</span>
                   </label>
diff --git a/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx b/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx
index aff49373..b4f4ac9b 100644
--- a/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx
+++ b/src/lib/pengajuan-tempo/component/PengajuanTempo.jsx
@@ -178,7 +178,6 @@ const PengajuanTempo = () => {
           `/api/v1/partner/detail-tempo/${auth.parentId}`
         );
         const transformedData = transformKeysToCamelCase(dataPaymentTerm);
-
         setBigData(transformedData);
       } catch (error) {
         console.error('Error loading dataPaymentTerm:', error);
@@ -419,6 +418,7 @@ const PengajuanTempo = () => {
     setIsLoading(true);
     try {
       let address4;
+      let address3;
       const address = await createPengajuanTempoApi({
         id: 0,
         partner_id: auth.partnerId,
@@ -435,7 +435,7 @@ const PengajuanTempo = () => {
           ...formKontakPerson,
         });
         if (address2.id) {
-          const address3 = await createPengajuanTempoApi({
+          address3 = await createPengajuanTempoApi({
             id: address2.id,
             partner_id: auth.partnerId,
             user_id: address2.userId,
@@ -451,16 +451,20 @@ const PengajuanTempo = () => {
               tempo_request: true,
               formDocs: JSON.stringify(formattedDokumen),
             });
+          } else {
+            address4 = await createPengajuanTempoApi({
+              id: address3.id,
+              partner_id: auth.partnerId,
+              user_id: address3.userId,
+              tempo_request: true,
+            });
           }
         }
       }
 
-      toast.dismiss(toastId);
-      setIsLoading(false);
-      toast.success('Pengajuan tempo berhasil dilakukan');
       if (address4?.id) {
+        toast.success('Pengajuan tempo berhasil dilakukan');
         const toastId = toast.loading('Mengubah status akun...');
-        setIsLoading(true);
         const isUpdated = await editAuthTempo();
         if (isUpdated?.user) {
           const update = await setAuth(isUpdated.user);
@@ -479,6 +483,11 @@ const PengajuanTempo = () => {
           removeFromLocalStorage();
           return;
         }
+      } else {
+        toast.dismiss(toastId);
+        setIsLoading(false);
+
+        toast.error('Terjadi kesalahan dalam pengiriman formulir');
       }
     } catch (error) {
       toast.dismiss(toastId);
@@ -518,7 +527,7 @@ const PengajuanTempo = () => {
   return (
     <>
       <div className='container flex flex-col items-center '>
-        <h1 className='text-h-sm md:text-title-sm font-semibold text-center mb-6'>
+        <h1 className=' font-semibold text-center mb-6'>
           Form Pengajuan Tempo
         </h1>
         <p className='text-center mb-4'>
diff --git a/src/lib/pengajuan-tempo/component/Pengiriman.jsx b/src/lib/pengajuan-tempo/component/Pengiriman.jsx
index 000f209c..cfc8aeb5 100644
--- a/src/lib/pengajuan-tempo/component/Pengiriman.jsx
+++ b/src/lib/pengajuan-tempo/component/Pengiriman.jsx
@@ -4,6 +4,8 @@ import HookFormSelect from '@/core/components/elements/Select/HookFormSelect';
 import odooApi from '~/libs/odooApi';
 import stateApi from '@/lib/address/api/stateApi.js';
 import cityApi from '@/lib/address/api/cityApi';
+import districtApi from '@/lib/address/api/districtApi';
+import subDistrictApi from '@/lib/address/api/subDistrictApi';
 import { Radio, RadioGroup, Stack, Checkbox } from '@chakra-ui/react';
 import {
   usePengajuanTempoStorePengiriman,
@@ -20,10 +22,16 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
     validatePengiriman,
     updateFormPengiriman,
   } = usePengajuanTempoStorePengiriman();
-  const { form, errors, validate, updateForm } = usePengajuanTempoStore();
+  const { form } = usePengajuanTempoStore();
   const [states, setState] = useState([]);
   const [cities, setCities] = useState([]);
+  const [districts, setDistricts] = useState([]);
+  const [subDistricts, setSubDistricts] = useState([]);
+  const [zips, setZips] = useState([]);
   const [citiesInvoice, setCitiesInvoice] = useState([]);
+  const [districtsInvoice, setDistrictsInvoice] = useState([]);
+  const [subDistrictsInvoice, setSubDistrictsInvoice] = useState([]);
+  const [zipsInvoice, setZipsInvoice] = useState([]);
   const [sameAddress, setSameAddress] = useState(false);
   const [sameAddressStreet, setSameAddressStreet] = useState(false);
   const [everyWeekday, setEveryWeekday] = useState(false);
@@ -104,6 +112,10 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   const watchState = watch('statePengiriman');
   useEffect(() => {
     // updateFormPengiriman('cityPengiriman', '');
+    // setValue('cityPengiriman', '');
+    // setValue('districtPengiriman', '');
+    // setValue('subDistrictPengiriman', '');
+    // setValue('zipPengiriman', '');
     if (watchState) {
       updateFormPengiriman('statePengiriman', `${watchState}`);
       validatePengiriman();
@@ -120,16 +132,86 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   }, [watchState]);
 
   const watchCity = watch('cityPengiriman');
+
   useEffect(() => {
     if (watchCity) {
       updateFormPengiriman('cityPengiriman', `${watchCity}`);
       validatePengiriman();
+      const loadDistricts = async () => {
+        let dataDistricts = await districtApi({ cityId: watchCity });
+        dataDistricts = dataDistricts.map((district) => ({
+          value: district.id,
+          label: district.name,
+        }));
+        setDistricts(dataDistricts);
+      };
+      loadDistricts();
+    }
+  }, [watchCity, setValue]);
+
+  const watchDistrict = watch('districtPengiriman');
+  useEffect(() => {
+    // setValue('subDistrictPengiriman', '');
+    if (watchDistrict) {
+      updateFormPengiriman('districtPengiriman', `${watchDistrict}`);
+      validatePengiriman();
+      const loadSubDistricts = async () => {
+        let dataSubDistricts = await subDistrictApi({
+          districtId: watchDistrict,
+        });
+        dataSubDistricts = dataSubDistricts.map((district) => ({
+          value: district.id,
+          label: district.name,
+        }));
+        setSubDistricts(dataSubDistricts);
+      };
+      loadSubDistricts();
+    }
+  }, [watchDistrict, setValue]);
+
+  const watchsubDistrict = watch('subDistrictPengiriman');
+
+  useEffect(() => {
+    let kelurahan = '';
+
+    if (watchsubDistrict) {
+      updateFormPengiriman('subDistrictPengiriman', `${watchsubDistrict}`);
+      validatePengiriman();
+      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}`
+        );
+
+        const result = await response.json();
+        const dataZips = result.result.map((zip) => ({
+          value: parseInt(zip.kodepos),
+          label: zip.kodepos,
+        }));
+        setZips(dataZips);
+      };
+      loadZip();
     }
-  }, [watchCity]);
+  }, [watchsubDistrict, setValue, subDistricts]);
+
+  const watchZip = watch('zipPengiriman');
+  useEffect(() => {
+    if (watchZip) {
+      updateFormPengiriman('zipPengiriman', `${watchZip}`);
+      validatePengiriman();
+    }
+  }, [watchZip, setValue]);
 
   const watchStateInvoice = watch('stateInvoice');
   useEffect(() => {
-    // updateFormPengiriman('cityPengiriman', '');
+    // setValue('cityInvoice', '');
+    // setValue('districtInvoice', '');
+    // setValue('subDistrictInvoice', '');
+    // setValue('zipInvoice', '');
     if (watchStateInvoice) {
       updateFormPengiriman('stateInvoice', `${watchStateInvoice}`);
       validatePengiriman();
@@ -150,9 +232,75 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
     if (watchCityInvoice) {
       updateFormPengiriman('cityInvoice', `${watchCityInvoice}`);
       validatePengiriman();
+      const loadDistricts = async () => {
+        let dataDistricts = await districtApi({ cityId: watchCityInvoice });
+        dataDistricts = dataDistricts.map((district) => ({
+          value: district.id,
+          label: district.name,
+        }));
+        setDistrictsInvoice(dataDistricts);
+      };
+      loadDistricts();
     }
   }, [watchCityInvoice]);
 
+  const watchDistrictInvoice = watch('districtInvoice');
+  useEffect(() => {
+    // setValue('subDistrictInvoice', '');
+    if (watchDistrictInvoice) {
+      updateFormPengiriman('districtInvoice', `${watchDistrictInvoice}`);
+      validatePengiriman();
+      const loadSubDistricts = async () => {
+        let dataSubDistricts = await subDistrictApi({
+          districtId: watchDistrictInvoice,
+        });
+        dataSubDistricts = dataSubDistricts.map((district) => ({
+          value: district.id,
+          label: district.name,
+        }));
+        setSubDistrictsInvoice(dataSubDistricts);
+      };
+      loadSubDistricts();
+    }
+  }, [watchDistrictInvoice, setValue]);
+
+  const watchsubDistrictInvoice = watch('subDistrictInvoice');
+
+  useEffect(() => {
+    let kelurahan = '';
+
+    if (watchsubDistrictInvoice) {
+      updateFormPengiriman('subDistrictInvoice', `${watchsubDistrictInvoice}`);
+      validatePengiriman();
+      for (const data in subDistrictsInvoice) {
+        if (subDistrictsInvoice[data].value == watchsubDistrictInvoice) {
+          kelurahan = subDistrictsInvoice[data].label.toLowerCase();
+        }
+      }
+      const loadZip = async () => {
+        const response = await fetch(
+          `https://alamat.thecloudalert.com/api/cari/index/?keyword=${kelurahan}`
+        );
+
+        const result = await response.json();
+        const dataZips = result.result.map((zip) => ({
+          value: parseInt(zip.kodepos),
+          label: zip.kodepos,
+        }));
+        setZipsInvoice(dataZips);
+      };
+      loadZip();
+    }
+  }, [watchsubDistrictInvoice, setValue, subDistrictsInvoice]);
+
+  const watchZipInvoice = watch('zipInvoice');
+  useEffect(() => {
+    if (watchZipInvoice) {
+      updateFormPengiriman('zipInvoice', `${watchZipInvoice}`);
+      validatePengiriman();
+    }
+  }, [watchZipInvoice, setValue]);
+
   const handleInputChange = (event) => {
     const { name, value } = event.target;
     updateFormPengiriman(name, value);
@@ -208,11 +356,16 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   const streetPengirimanRef = useRef(null);
   const statePengirimanRef = useRef(null);
   const cityPengirimanRef = useRef(null);
+  const districtPengirimanRef = useRef(null);
+  const subDistrictPengirimanRef = useRef(null);
   const zipRef = useRef(null);
   const invoicePicRef = useRef(null);
   const streetInvoiceRef = useRef(null);
   const stateInvoiceRef = useRef(null);
   const cityInvoiceRef = useRef(null);
+  const districtInvoiceRef = useRef(null);
+  const subDistrictInvoiceRef = useRef(null);
+  const zipInvoiceRef = useRef(null);
   const everyWeekdayInputRef = useRef(null);
   const everyWeekInputRef = useRef(null);
   const dokumenPengirimanRef = useRef(null);
@@ -243,6 +396,20 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
           cityPengirimanRef.current.scrollIntoView(options);
           return;
         }
+        if (
+          errorsPengiriman.districtsPengiriman &&
+          districtPengirimanRef.current
+        ) {
+          districtPengirimanRef.current.scrollIntoView(options);
+          return;
+        }
+        if (
+          errorsPengiriman.subDistrictsPengiriman &&
+          subDistrictPengirimanRef.current
+        ) {
+          subDistrictPengirimanRef.current.scrollIntoView(options);
+          return;
+        }
         if (errorsPengiriman.zip && zipRef.current) {
           zipRef.current.scrollIntoView(options);
           return;
@@ -263,6 +430,21 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
           cityInvoiceRef.current.scrollIntoView(options);
           return;
         }
+        if (errorsPengiriman.districtsInvoice && districtInvoiceRef.current) {
+          districtInvoiceRef.current.scrollIntoView(options);
+          return;
+        }
+        if (
+          errorsPengiriman.subDistrictsInvoice &&
+          subDistrictInvoiceRef.current
+        ) {
+          subDistrictInvoiceRef.current.scrollIntoView(options);
+          return;
+        }
+        if (errorsPengiriman.zipInvoice && zipInvoiceRef.current) {
+          zipInvoiceRef.current.scrollIntoView(options);
+          return;
+        }
         if (
           errorsPengiriman.everyWeekdayInput &&
           everyWeekdayInputRef.current
@@ -312,6 +494,8 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   useEffect(() => {
     if (formPengiriman.isSameAddreesStreet == 'true') {
       setSameAddressStreet(true);
+    } else {
+      setSameAddressStreet(false);
     }
   }, [formPengiriman.isSameAddreesStreet]);
   useEffect(() => {
@@ -361,14 +545,53 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   //   }
   //   validatePengiriman();
   // }, [formPengiriman.isSameAddrees, formPengiriman.isSameAddreesStreet]);
+
+  useEffect(() => {
+    if (sameAddressStreet) {
+      updateFormPengiriman('streetPengiriman', form.street);
+      updateFormPengiriman('statePengiriman', form.state);
+      setValue('statePengiriman', parseInt(form.state));
+      updateFormPengiriman('cityPengiriman', form.city);
+      setValue('cityPengiriman', parseInt(form.city));
+      updateFormPengiriman('districtPengiriman', form.district);
+      setValue('districtPengiriman', parseInt(form.district));
+      updateFormPengiriman('subDistrictPengiriman', form.subDistrict);
+      setValue('subDistrictPengiriman', parseInt(form.subDistrict));
+      updateFormPengiriman('zipPengiriman', form.zip);
+      setValue('zipPengiriman', parseInt(form.zip));
+    }
+    // else {
+    //   updateFormPengiriman('streetPengiriman', '');
+    //   updateFormPengiriman('statePengiriman', '');
+    //   updateFormPengiriman('cityPengiriman', '');
+    //   updateFormPengiriman('zipPengiriman', '');
+    //   setValue('streetPengiriman', '');
+    //   setValue('statePengiriman', '');
+    //   setValue('cityPengiriman', '');
+    // }
+    validatePengiriman();
+  }, [
+    sameAddressStreet,
+    form.state,
+    form.city,
+    form.district,
+    form.subDistrict,
+    form.zip,
+  ]);
+
   useEffect(() => {
     if (sameAddress) {
-      updateFormPengiriman('streetInvoice', formPengiriman.streetPengiriman);
-      updateFormPengiriman('stateInvoice', formPengiriman.statePengiriman);
-      setValue('stateInvoice', parseInt(formPengiriman.statePengiriman));
-      updateFormPengiriman('cityInvoice', formPengiriman.cityPengiriman);
-      setValue('cityInvoice', parseInt(formPengiriman.cityPengiriman));
-      updateFormPengiriman('isSameAddrees', `${sameAddress}`);
+      updateFormPengiriman('streetInvoice', form.street);
+      updateFormPengiriman('stateInvoice', form.state);
+      setValue('stateInvoice', parseInt(form.state));
+      updateFormPengiriman('cityInvoice', form.city);
+      setValue('cityInvoice', parseInt(form.city));
+      updateFormPengiriman('districtInvoice', form.district);
+      setValue('districtInvoice', parseInt(form.district));
+      updateFormPengiriman('subDistrictInvoice', form.subDistrict);
+      setValue('subDistrictInvoice', parseInt(form.subDistrict));
+      updateFormPengiriman('zipInvoice', form.zip);
+      setValue('zipInvoice', parseInt(form.zip));
     } else {
       // updateFormPengiriman('streetInvoice', '');
       // updateFormPengiriman('stateInvoice', '');
@@ -380,40 +603,44 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
     validatePengiriman();
   }, [
     sameAddress,
-    formPengiriman.streetPengiriman,
-    formPengiriman.statePengiriman,
-    formPengiriman.cityPengiriman,
+    form.street,
+    form.state,
+    form.city,
+    form.district,
+    form.subDistrict,
   ]);
 
-  useEffect(() => {
-    if (sameAddress) {
-      updateFormPengiriman('streetInvoice', formPengiriman.streetPengiriman);
-      updateFormPengiriman('stateInvoice', formPengiriman.statePengiriman);
-      setValue('stateInvoice', parseInt(formPengiriman.statePengiriman));
-      updateFormPengiriman('cityInvoice', formPengiriman.cityPengiriman);
-      setValue('cityInvoice', parseInt(formPengiriman.cityPengiriman));
-      updateFormPengiriman('isSameAddrees', `${sameAddress}`);
-    } else {
-      // updateFormPengiriman('stateInvoice', formPengiriman.stateInvoice);
-      // setValue('stateInvoice', parseInt(formPengiriman.stateInvoice));
-      // updateFormPengiriman('cityInvoice', formPengiriman.cityInvoice);
-      // setValue('cityInvoice', parseInt(formPengiriman.cityInvoice));
-    }
-    validatePengiriman();
-  }, [
-    sameAddress,
-    formPengiriman.streetPengiriman,
-    formPengiriman.statePengiriman,
-    formPengiriman.cityPengiriman,
-  ]);
+  // useEffect(() => {
+  //   if (sameAddress) {
+  //     updateFormPengiriman('streetInvoice', formPengiriman.streetPengiriman);
+  //     updateFormPengiriman('stateInvoice', formPengiriman.statePengiriman);
+  //     setValue('stateInvoice', parseInt(formPengiriman.statePengiriman));
+  //     updateFormPengiriman('cityInvoice', formPengiriman.cityPengiriman);
+  //     setValue('cityInvoice', parseInt(formPengiriman.cityPengiriman));
+
+  //     updateFormPengiriman('isSameAddrees', `${sameAddress}`);
+  //   } else {
+  //     // updateFormPengiriman('stateInvoice', formPengiriman.stateInvoice);
+  //     // setValue('stateInvoice', parseInt(formPengiriman.stateInvoice));
+  //     // updateFormPengiriman('cityInvoice', formPengiriman.cityInvoice);
+  //     // setValue('cityInvoice', parseInt(formPengiriman.cityInvoice));
+  //   }
+  //   validatePengiriman();
+  // }, [
+  //   sameAddress,
+  //   formPengiriman.streetPengiriman,
+  //   formPengiriman.statePengiriman,
+  //   formPengiriman.cityPengiriman,
+  // ]);
+
+  // useEffect(() => {
+  //   if (formPengiriman.sameAddressStreet?.toLowerCase().includes('true')) {
+  //     setSameAddressStreet(true);
+  //   } else {
+  //     setSameAddressStreet(false);
+  //   }
+  // }, [formPengiriman.sameAddressStreet]);
 
-  useEffect(() => {
-    if (formPengiriman.sameAddressStreet?.toLowerCase().includes('true')) {
-      setSameAddressStreet(true);
-    } else {
-      setSameAddressStreet(false);
-    }
-  }, [formPengiriman.sameAddressStreet]);
   useEffect(() => {
     if (formPengiriman.statePengiriman) {
       setValue('statePengiriman', parseInt(formPengiriman.statePengiriman));
@@ -424,6 +651,27 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
       setValue('cityPengiriman', parseInt(formPengiriman.cityPengiriman));
     }
   }, [formPengiriman.cityPengiriman]);
+  useEffect(() => {
+    if (formPengiriman.districtPengiriman) {
+      setValue(
+        'districtPengiriman',
+        parseInt(formPengiriman.districtPengiriman)
+      );
+    }
+  }, [formPengiriman.districtPengiriman]);
+  useEffect(() => {
+    if (formPengiriman.subDistrictPengiriman) {
+      setValue(
+        'subDistrictPengiriman',
+        parseInt(formPengiriman.subDistrictPengiriman)
+      );
+    }
+  }, [formPengiriman.subDistrictPengiriman]);
+  useEffect(() => {
+    if (formPengiriman.zipPengiriman) {
+      setValue('zipPengiriman', parseInt(formPengiriman.zipPengiriman));
+    }
+  }, [formPengiriman.zipPengiriman]);
   useEffect(() => {
     if (formPengiriman.stateInvoice) {
       setValue('stateInvoice', parseInt(formPengiriman.stateInvoice));
@@ -434,28 +682,24 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
       setValue('cityInvoice', parseInt(formPengiriman.cityInvoice));
     }
   }, [formPengiriman.cityInvoice]);
-
   useEffect(() => {
-    if (sameAddressStreet) {
-      updateFormPengiriman('streetPengiriman', form.street);
-      updateFormPengiriman('statePengiriman', form.state);
-      setValue('statePengiriman', parseInt(form.state));
-      updateFormPengiriman('cityPengiriman', form.city);
-      setValue('cityPengiriman', parseInt(form.city));
-      updateFormPengiriman('zipPengiriman', form.zip);
-      updateFormPengiriman('isSameAddreesStreet', `${sameAddressStreet}`);
+    if (formPengiriman.districtInvoice) {
+      setValue('districtInvoice', parseInt(formPengiriman.districtInvoice));
     }
-    // else {
-    //   updateFormPengiriman('streetPengiriman', '');
-    //   updateFormPengiriman('statePengiriman', '');
-    //   updateFormPengiriman('cityPengiriman', '');
-    //   updateFormPengiriman('zipPengiriman', '');
-    //   setValue('streetPengiriman', '');
-    //   setValue('statePengiriman', '');
-    //   setValue('cityPengiriman', '');
-    // }
-    validatePengiriman();
-  }, [sameAddressStreet]);
+  }, [formPengiriman.districtInvoice]);
+  useEffect(() => {
+    if (formPengiriman.subDistrictInvoice) {
+      setValue(
+        'subDistrictInvoice',
+        parseInt(formPengiriman.subDistrictInvoice)
+      );
+    }
+  }, [formPengiriman.subDistrictInvoice]);
+  useEffect(() => {
+    if (formPengiriman.zipInvoice) {
+      setValue('zipInvoice', parseInt(formPengiriman.zipInvoice));
+    }
+  }, [formPengiriman.zipInvoice]);
 
   const getFromLocalStorage = (key) => {
     const itemStr = localStorage.getItem(key);
@@ -531,75 +775,28 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   const handleChangeSameAddress = () => {
     // setSameAddress(!sameAddress);
     // if (sameAddress) {
-    //   console.log('sameAddress adalah', sameAddress);
     //   updateFormPengiriman('sameAddress', `true`);
     // } else {
-    //   console.log('sameAddress merupakan', sameAddress);
     // }
     updateFormPengiriman('isSameAddrees', `${!sameAddress}`);
-    validate();
+    validatePengiriman();
   };
   const handleChangeSameAddressStreet = () => {
     // updateFormPengiriman('sameAddressStreet', `${!sameAddressStreet}`);
     // setSameAddressStreet(!sameAddressStreet);
-    if (sameAddressStreet == false) {
-      updateFormPengiriman('streetPengiriman', '');
-      updateFormPengiriman('statePengiriman', '');
-      updateFormPengiriman('cityPengiriman', '');
-      updateFormPengiriman('zipPengiriman', '');
-      setValue('streetPengiriman', '');
-      setValue('statePengiriman', '');
-      setValue('cityPengiriman', '');
-    }
+    // if (sameAddressStreet == false) {
+    //   updateFormPengiriman('streetPengiriman', '');
+    //   updateFormPengiriman('statePengiriman', '');
+    //   updateFormPengiriman('cityPengiriman', '');
+    //   updateFormPengiriman('zipPengiriman', '');
+    //   setValue('streetPengiriman', '');
+    //   setValue('statePengiriman', '');
+    //   setValue('cityPengiriman', '');
+    // }
     updateFormPengiriman('isSameAddreesStreet', `${!sameAddressStreet}`);
-    validate();
+    validatePengiriman();
   };
 
-  useEffect(() => {
-    const options = {
-      behavior: 'smooth',
-      block: 'center',
-    };
-
-    const loadIndustries = async () => {
-      const watchZip = formPengiriman.zipPengiriman?.trim(); // Menghapus spasi berlebih
-
-      // Validasi: hanya eksekusi jika watchZip valid (contoh: minimal 5 karakter)
-      if (watchZip && watchZip.length >= 5) {
-        const loadZip = async () => {
-          try {
-            const response = await fetch(
-              `https://alamat.thecloudalert.com/api/cari/index/?keyword=${watchZip}`
-            );
-
-            const result = await response.json();
-
-            if (!result.result.length > 0) {
-              toast.error('Alamat pos salah');
-              updateFormPengiriman('zipPengiriman', ''); // Reset form.zip jika salah
-              validate(); // Memanggil validasi formulir
-              return false;
-            } else {
-              updateFormPengiriman('zipPengiriman', watchZip);
-              validate();
-              return true; // Jika valid
-            }
-          } catch (error) {
-            toast.error('Terjadi kesalahan saat memeriksa alamat pos.');
-            console.error('Error:', error);
-            return false;
-          }
-        };
-
-        const isValidZip = await loadZip();
-        if (!isValidZip) {
-          zipRef.current.scrollIntoView(options);
-        }
-      }
-    };
-
-    loadIndustries();
-  }, [formPengiriman.zipPengiriman]);
   return (
     <>
       {isDesktop && (
@@ -737,22 +934,62 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                           </div>
                         )}
                       </div>
-                      <div className='w-1/3'>
-                        <input
-                          id='zipPengiriman'
-                          aria-label='zipPengiriman'
-                          disabled={sameAddressStreet}
+                      <div className='w-1/3' ref={districtPengirimanRef}>
+                        <Controller
+                          name='districtPengiriman'
+                          control={control}
+                          render={(props) => (
+                            <HookFormSelect
+                              {...props}
+                              options={districts}
+                              disabled={
+                                !watchState || !watchCity || sameAddressStreet
+                              }
+                              placeholder='Kelurahan'
+                            />
+                          )}
+                        />
+                        {chekValid && (
+                          <div className='text-caption-2 text-danger-500 mt-1'>
+                            {errors.subDistrictPengiriman}
+                          </div>
+                        )}
+                      </div>
+                      <div className='w-1/3' ref={subDistrictPengirimanRef}>
+                        <Controller
+                          name='subDistrictPengiriman'
+                          control={control}
+                          render={(props) => (
+                            <HookFormSelect
+                              {...props}
+                              options={subDistricts}
+                              disabled={!watchDistrict || sameAddressStreet}
+                              placeholder='Kelurahan'
+                            />
+                          )}
+                        />
+                        {chekValid && (
+                          <div className='text-caption-2 text-danger-500 mt-1'>
+                            {errors.subDistrictPengiriman}
+                          </div>
+                        )}
+                      </div>
+                      <div className='w-1/3' ref={zipRef}>
+                        <Controller
                           name='zipPengiriman'
-                          ref={zipRef}
-                          placeholder='Kode Pos'
-                          type='number'
-                          value={formPengiriman.zipPengiriman}
-                          className='form-input'
-                          onChange={handleInputChange}
+                          control={control}
+                          render={(props) => (
+                            <HookFormSelect
+                              {...props}
+                              options={zips}
+                              disabled={!watchsubDistrict || sameAddressStreet}
+                              placeholder='Zip'
+                            />
+                          )}
                         />
                         {chekValid && (
                           <div className='text-caption-2 text-danger-500 mt-1'>
-                            {errorsPengiriman.zipPengiriman}
+                            {errors.zipPengiriman}
                           </div>
                         )}
                       </div>
@@ -822,7 +1059,7 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       isChecked={sameAddress}
                       onChange={handleChangeSameAddress}
                     >
-                      Alamat invoice sama dengan alamat pengiriman
+                      Alamat invoice sama dengan alamat bisnis
                     </Checkbox>
                   </div>
 
@@ -893,6 +1130,67 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                           </div>
                         )}
                       </div>
+                      <div className='w-1/3' ref={districtInvoiceRef}>
+                        <Controller
+                          name='districtInvoice'
+                          control={control}
+                          render={(props) => (
+                            <HookFormSelect
+                              {...props}
+                              options={districtsInvoice}
+                              disabled={
+                                !watchStateInvoice ||
+                                !watchCityInvoice ||
+                                sameAddress
+                              }
+                              placeholder='Kecamatan'
+                            />
+                          )}
+                        />
+                        {chekValid && (
+                          <div className='text-caption-2 text-danger-500 mt-1'>
+                            {errors.districtInvoice}
+                          </div>
+                        )}
+                      </div>
+                      <div className='w-1/3' ref={subDistrictInvoiceRef}>
+                        <Controller
+                          name='subDistrictInvoice'
+                          control={control}
+                          render={(props) => (
+                            <HookFormSelect
+                              {...props}
+                              options={subDistrictsInvoice}
+                              disabled={!watchDistrictInvoice || sameAddress}
+                              placeholder='Kelurahan'
+                            />
+                          )}
+                        />
+                        {chekValid && (
+                          <div className='text-caption-2 text-danger-500 mt-1'>
+                            {errors.subDistrictsInvoice}
+                          </div>
+                        )}
+                      </div>
+                      <div className='w-1/3' ref={zipInvoiceRef}>
+                        <Controller
+                          name='zipInvoice'
+                          control={control}
+                          render={(props) => (
+                            <HookFormSelect
+                              {...props}
+                              options={zipsInvoice}
+                              disabled={!watchsubDistrictInvoice || sameAddress}
+                              placeholder='Zip'
+                            />
+                          )}
+                        />
+                        {chekValid && (
+                          <div className='text-caption-2 text-danger-500 mt-1'>
+                            {errors.zipInvoice}
+                          </div>
+                        )}
+                      </div>
                     </div>
                   </>
                 </div>
@@ -1002,29 +1300,31 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     Lembar Penerimaan Barang (LPB)
                   </Checkbox>
 
-                  {/* <div className='flex gap-3 flex-col'>
+                  <div className='flex gap-3 flex-col'>
                     <Checkbox
                       colorScheme='red'
                       key='4'
-                      isChecked={isChecked(4)}
+                      isChecked={
+                        isChecked(4) || formPengiriman.dokumenKirimInput
+                      }
                       onChange={() => handleCheckboxChange(4)}
                     >
                       Lainnya
                     </Checkbox>
                     <textarea
-                      id='dokumenPengirimanInput'
-                      name='dokumenPengirimanInput'
-                      aria-label='dokumenPengirimanInput'
+                      id='dokumenKirimInput'
+                      name='dokumenKirimInput'
+                      aria-label='dokumenKirimInput'
                       placeholder='isi manual dokumen yang anda mau'
                       type='textarea'
                       ref={dokumenPengirimanInputRef}
-                      value={formPengiriman.dokumenPengirimanInput}
+                      value={formPengiriman.dokumenKirimInput}
                       className='form-input'
                       rows={4}
                       cols={40}
                       onChange={handleInputChange}
                     />
-                  </div> */}
+                  </div>
                   {chekValid && (
                     <div className='text-caption-2 text-danger-500 mt-1'>
                       {errorsPengiriman.dokumenPengiriman}
@@ -1036,12 +1336,12 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               <div className='flex flex-row  justify-between items-start'>
                 <div className='w-2/5'>
                   <label className='form-label   text-wrap'>
-                    Dokumen saat Pengiriman Barang{' '}
+                    Dokumen yang dibawa saat pengiriman barang
                     <span className=' opacity-60'>(Opsional)</span>
                   </label>
                   {!isKonfirmasi && (
                     <span className='text-xs opacity-60'>
-                      Dokumen lampiran saat pengiriman barang
+                      Dokumen lampiran yang dibawa saat pengiriman barang
                     </span>
                   )}
                 </div>
@@ -1207,7 +1507,7 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     )}
                   </div>
                   <div
-                    className='w-1/3'
+                    className='w-3/5'
                     ref={cityPengirimanRef}
                     aria-label='cityPengiriman'
                   >
@@ -1229,7 +1529,7 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       </div>
                     )}
                   </div>
-                  <div className='w-1/3'>
+                  {/* <div className='w-1/3'>
                     <input
                       id='zipPengiriman'
                       aria-label='zipPengiriman'
@@ -1247,6 +1547,67 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                         {errorsPengiriman.zipPengiriman}
                       </div>
                     )}
+                  </div> */}
+                </div>
+                <div className='flex flex-row w-full gap-2'>
+                  <div className='w-1/3' ref={districtPengirimanRef}>
+                    <Controller
+                      name='districtPengiriman'
+                      control={control}
+                      render={(props) => (
+                        <HookFormSelect
+                          {...props}
+                          options={districts}
+                          disabled={
+                            !watchState || !watchCity || sameAddressStreet
+                          }
+                          placeholder='Kelurahan'
+                        />
+                      )}
+                    />
+                    {chekValid && (
+                      <div className='text-caption-2 text-danger-500 mt-1'>
+                        {errors.subDistrictPengiriman}
+                      </div>
+                    )}
+                  </div>
+                  <div className='w-1/3' ref={subDistrictPengirimanRef}>
+                    <Controller
+                      name='subDistrictPengiriman'
+                      control={control}
+                      render={(props) => (
+                        <HookFormSelect
+                          {...props}
+                          options={subDistricts}
+                          disabled={!watchDistrict || sameAddressStreet}
+                          placeholder='Kelurahan'
+                        />
+                      )}
+                    />
+                    {chekValid && (
+                      <div className='text-caption-2 text-danger-500 mt-1'>
+                        {errors.subDistrictPengiriman}
+                      </div>
+                    )}
+                  </div>
+                  <div className='w-1/3' ref={zipRef}>
+                    <Controller
+                      name='zipPengiriman'
+                      control={control}
+                      render={(props) => (
+                        <HookFormSelect
+                          {...props}
+                          options={zips}
+                          disabled={!watchsubDistrict || sameAddressStreet}
+                          placeholder='Zip'
+                        />
+                      )}
+                    />
+                    {chekValid && (
+                      <div className='text-caption-2 text-danger-500 mt-1'>
+                        {errors.zipPengiriman}
+                      </div>
+                    )}
                   </div>
                 </div>
               </div>
@@ -1372,6 +1733,69 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       )}
                     </div>
                   </div>
+                  <div className='sub-alamat flex flex-row w-full gap-3'>
+                    <div className='w-1/3' ref={districtInvoiceRef}>
+                      <Controller
+                        name='districtInvoice'
+                        control={control}
+                        render={(props) => (
+                          <HookFormSelect
+                            {...props}
+                            options={districtsInvoice}
+                            disabled={
+                              !watchStateInvoice ||
+                              !watchCityInvoice ||
+                              sameAddress
+                            }
+                            placeholder='Kecamatan'
+                          />
+                        )}
+                      />
+                      {chekValid && (
+                        <div className='text-caption-2 text-danger-500 mt-1'>
+                          {errors.districtInvoice}
+                        </div>
+                      )}
+                    </div>
+                    <div className='w-1/3' ref={subDistrictInvoiceRef}>
+                      <Controller
+                        name='subDistrictInvoice'
+                        control={control}
+                        render={(props) => (
+                          <HookFormSelect
+                            {...props}
+                            options={subDistrictsInvoice}
+                            disabled={!watchDistrictInvoice || sameAddress}
+                            placeholder='Kelurahan'
+                          />
+                        )}
+                      />
+                      {chekValid && (
+                        <div className='text-caption-2 text-danger-500 mt-1'>
+                          {errors.subDistrictsInvoice}
+                        </div>
+                      )}
+                    </div>
+                    <div className='w-1/3' ref={zipInvoiceRef}>
+                      <Controller
+                        name='zipInvoice'
+                        control={control}
+                        render={(props) => (
+                          <HookFormSelect
+                            {...props}
+                            options={zipsInvoice}
+                            disabled={!watchsubDistrictInvoice || sameAddress}
+                            placeholder='Zip'
+                          />
+                        )}
+                      />
+                      {chekValid && (
+                        <div className='text-caption-2 text-danger-500 mt-1'>
+                          {errors.zipInvoice}
+                        </div>
+                      )}
+                    </div>
+                  </div>
                 </>
               </div>
 
@@ -1478,6 +1902,31 @@ const Pengiriman = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                   >
                     Lembar Penerimaan Barang (LPB)
                   </Checkbox>
+                  <div className='flex gap-3 flex-col'>
+                    <Checkbox
+                      colorScheme='red'
+                      key='4'
+                      isChecked={
+                        isChecked(4) || formPengiriman.dokumenKirimInput
+                      }
+                      onChange={() => handleCheckboxChange(4)}
+                    >
+                      Lainnya
+                    </Checkbox>
+                    <textarea
+                      id='dokumenKirimInput'
+                      name='dokumenKirimInput'
+                      aria-label='dokumenKirimInput'
+                      placeholder='isi manual dokumen yang anda mau'
+                      type='textarea'
+                      ref={dokumenPengirimanInputRef}
+                      value={formPengiriman.dokumenKirimInput}
+                      className='form-input'
+                      rows={4}
+                      cols={40}
+                      onChange={handleInputChange}
+                    />
+                  </div>
 
                   {chekValid && (
                     <div className='text-caption-2 text-danger-500 mt-1'>
diff --git a/src/lib/pengajuan-tempo/component/Referensi.jsx b/src/lib/pengajuan-tempo/component/Referensi.jsx
index 1b7b0f4c..9e154166 100644
--- a/src/lib/pengajuan-tempo/component/Referensi.jsx
+++ b/src/lib/pengajuan-tempo/component/Referensi.jsx
@@ -111,6 +111,7 @@ const Referensi = ({ chekValid, buttonSubmitClick, data }) => {
       );
       setSupplierData(updatedSuppliers);
       setChangeConfirmation(false);
+      updateHasSave(false);
     }
   };
 
@@ -207,7 +208,7 @@ const Referensi = ({ chekValid, buttonSubmitClick, data }) => {
       <BottomPopup
         active={changeConfirmation}
         close={() => setChangeConfirmation(false)}
-        title='Ubah profil Bisnis'
+        title='Konfirmasi Hapus Data'
       >
         <div className='leading-7 text-gray_r-12/80'>
           Apakah anda yakin menghapus data?
@@ -297,7 +298,7 @@ const Referensi = ({ chekValid, buttonSubmitClick, data }) => {
                         placeholder='Type Durasi Tempo'
                       />
                     </td>
-                    <td className='flex flex-row gap-2'>
+                    <td className='flex flex-row gap-2 justify-center items-center'>
                       <input
                         name='creditLimit'
                         type='text'
@@ -374,24 +375,26 @@ const Referensi = ({ chekValid, buttonSubmitClick, data }) => {
             </table>
           </form>
           <div className='flex items-center gap-4 mt-8'>
-            <button
+            {/* <button
               onClick={handleAddNewSupplier}
               className='bg-gray-200 border border-gray-500 rounded-md text-sm text-gray-500 p-2 h-11 mb-1 content-center flex flex-row justify-center items-center'
             >
               {<PlusCircleIcon className='w-5 mr-2' />}
               {''} Tambah Data Baru
-            </button>
-            <button
-              onClick={simpanData}
-              className={`bg-red-500 border border-red-500 rounded-md text-sm text-white p-2 h-11 mb-1 content-center flex flex-row justify-center items-center ${
-                hasSavedata ? 'hidden' : ''
-              }`}
-            >
-              Simpan Data
-            </button>
-            <span className='text-sm opacity-60 text-red-500'>
-              *Klik simpan sebelum lanjut ke tahap selanjutnya
-            </span>
+            </button> */}
+            {!hasSavedata && (
+              <>
+                <button
+                  onClick={simpanData}
+                  className={`bg-red-500 border border-red-500 rounded-md text-sm text-white p-2 h-11 mb-1 content-center flex flex-row justify-center items-center `}
+                >
+                  Simpan Data
+                </button>
+                <span className='text-sm opacity-60 text-red-500'>
+                  *Klik simpan sebelum lanjut ke tahap selanjutnya
+                </span>
+              </>
+            )}
           </div>
         </div>
       )}
@@ -424,7 +427,12 @@ const Referensi = ({ chekValid, buttonSubmitClick, data }) => {
                       {supplier.supplier}
                     </p>
                     <div className='w-1/5 flex justify-end items-center gap-2'>
-                      <Trash2Icon size={16} color='red' />
+                      <Trash2Icon
+                        size={16}
+                        color='red'
+                        onClick={() => handleOpenConfirmation(index)}
+                        className='cursor-pointer'
+                      />
                       {openIndexes.includes(index) ? (
                         <ChevronUpIcon className='w-4' />
                       ) : (
@@ -590,17 +598,19 @@ const Referensi = ({ chekValid, buttonSubmitClick, data }) => {
             </form>
           </div>
           <div className='flex flex-col justify-start items-start gap-4 mt-8'>
-            <span className='text-xs opacity-60 text-red-500'>
-              *Klik simpan sebelum lanjut ke tahap selanjutnya
-            </span>
-            <button
-              onClick={simpanData}
-              className={`bg-gray-200 border border-gray-500 rounded-md w-full text-sm text-gray-500 p-2 h-11 mb-1 content-center flex flex-row justify-center items-center ${
-                hasSavedata ? 'hidden' : ''
-              }`}
-            >
-              Simpan Data
-            </button>
+            {!hasSavedata && (
+              <>
+                <span className='text-xs opacity-60 text-red-500'>
+                  *Klik simpan sebelum lanjut ke tahap selanjutnya
+                </span>
+                <button
+                  onClick={simpanData}
+                  className={`bg-red-500 border border-red-500 rounded-md w-full text-sm text-white p-2 h-11 mb-1 content-center flex flex-row justify-center items-center`}
+                >
+                  Simpan Data
+                </button>
+              </>
+            )}
           </div>
         </div>
       )}
diff --git a/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx b/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx
index 6a7eb3cb..f8a0bc55 100644
--- a/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx
+++ b/src/lib/pengajuan-tempo/component/informasiPerusahaan.jsx
@@ -4,6 +4,8 @@ import HookFormSelect from '@/core/components/elements/Select/HookFormSelect';
 import odooApi from '~/libs/odooApi';
 import stateApi from '@/lib/address/api/stateApi.js';
 import cityApi from '@/lib/address/api/cityApi';
+import districtApi from '@/lib/address/api/districtApi';
+import subDistrictApi from '@/lib/address/api/subDistrictApi';
 import { Radio, RadioGroup, Stack, Checkbox } from '@chakra-ui/react';
 import { usePengajuanTempoStore } from '../../../../src-migrate/modules/register/stores/usePengajuanTempoStore';
 import useDevice from '@/core/hooks/useDevice';
@@ -11,21 +13,28 @@ import Divider from '@/core/components/elements/Divider/Divider';
 import { getAuth } from '~/libs/auth';
 import addressApi from '@/lib/address/api/addressApi';
 import { toast } from 'react-hot-toast';
+import BottomPopup from '@/core/components/elements/Popup/BottomPopup';
+import { useRouter } from 'next/router';
 const InformasiPerusahaan = ({
   chekValid,
   buttonSubmitClick,
   isKonfirmasi,
 }) => {
   const auth = getAuth();
+  const router = useRouter();
   const { isDesktop, isMobile } = useDevice();
   const { control, watch, setValue, getValues } = useForm();
   const { form, errors, validate, updateForm } = usePengajuanTempoStore();
+  const [states, setState] = useState([]);
+  const [cities, setCities] = useState([]);
+  const [districts, setDistricts] = useState([]);
+  const [subDistricts, setSubDistricts] = useState([]);
+  const [zips, setZips] = useState([]);
   const [industries, setIndustries] = useState([]);
   const [paymentTerm, setPaymentTerm] = useState([]);
   const [selectedCategory, setSelectedCategory] = useState('');
-  const [states, setState] = useState([]);
-  const [cities, setCities] = useState([]);
   const [bersedia, setBersedia] = useState(null);
+  const [changeConfirmation, setChangeConfirmation] = useState(false);
   const category_produk = [
     { id: 2040, name: 'Pengaman, Kesehatan & Keamanan' },
     { id: 2097, name: 'Perkakas Tangan, Listrik & Pneumatic' },
@@ -64,7 +73,9 @@ const InformasiPerusahaan = ({
 
   const watchState = watch('state');
   useEffect(() => {
-    // updateForm('city', '');
+    setValue('city', '');
+    setValue('district', '');
+    setValue('subDistrict', '');
     if (watchState) {
       updateForm('state', `${watchState}`);
       validate();
@@ -81,12 +92,79 @@ const InformasiPerusahaan = ({
   }, [watchState]);
 
   const watchCity = watch('city');
+
   useEffect(() => {
     if (watchCity) {
       updateForm('city', `${watchCity}`);
       validate();
+      const loadDistricts = async () => {
+        let dataDistricts = await districtApi({ cityId: watchCity });
+        dataDistricts = dataDistricts.map((district) => ({
+          value: district.id,
+          label: district.name,
+        }));
+        setDistricts(dataDistricts);
+      };
+      loadDistricts();
     }
-  }, [watchCity]);
+  }, [watchCity, setValue]);
+
+  const watchDistrict = watch('district');
+  useEffect(() => {
+    setValue('subDistrict', '');
+    if (watchDistrict) {
+      updateForm('district', `${watchDistrict}`);
+      validate();
+      const loadSubDistricts = async () => {
+        let dataSubDistricts = await subDistrictApi({
+          districtId: watchDistrict,
+        });
+        dataSubDistricts = dataSubDistricts.map((district) => ({
+          value: district.id,
+          label: district.name,
+        }));
+        setSubDistricts(dataSubDistricts);
+      };
+      loadSubDistricts();
+    }
+  }, [watchDistrict, setValue]);
+
+  const watchsubDistrict = watch('subDistrict');
+
+  useEffect(() => {
+    let kelurahan = '';
+
+    if (watchsubDistrict) {
+      updateForm('subDistrict', `${watchsubDistrict}`);
+      validate();
+      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}`
+        );
+
+        const result = await response.json();
+        const dataZips = result.result.map((zip) => ({
+          value: parseInt(zip.kodepos),
+          label: zip.kodepos,
+        }));
+        setZips(dataZips);
+      };
+      loadZip();
+    }
+  }, [watchsubDistrict, setValue, subDistricts]);
+
+  const watchZip = watch('zip');
+  useEffect(() => {
+    if (watchZip) {
+      updateForm('zip', `${watchZip}`);
+      validate();
+    }
+  }, [watchZip]);
 
   useEffect(() => {
     const loadIndustries = async () => {
@@ -115,10 +193,10 @@ const InformasiPerusahaan = ({
   useEffect(() => {
     const loadPaymentTerm = async () => {
       const dataPaymentTerm = [
-        { id: 24, name: 'Tempo 14 Hari' },
-        { id: 25, name: 'Tempo 30 Hari' },
         { id: 29, name: 'Tempo 7 Hari' },
+        { id: 24, name: 'Tempo 14 Hari' },
         { id: 32, name: 'Tempo 21 Hari' },
+        { id: 25, name: 'Tempo 30 Hari' },
       ];
       setPaymentTerm(
         dataPaymentTerm?.map((o) => ({
@@ -157,15 +235,7 @@ const InformasiPerusahaan = ({
     updateForm('estimasi', formattedValue.replace(/^Rp\s*/, ''));
     validate();
   };
-  const onChangeTempoDuration = (e) => {
-    updateForm('tempoDuration', `${e}`);
-    validate();
-  };
 
-  const onChangeTempoLimit = (e) => {
-    updateForm('tempoLimit', `${e}`);
-    validate();
-  };
   const [isCustom, setIsCustom] = React.useState(false);
   const [tempoLimitValueEx, setTempoLimitValueEx] = React.useState('');
   const handleCheckboxBersediaChange = (value) => {
@@ -178,6 +248,16 @@ const InformasiPerusahaan = ({
     updateForm('bersedia', `${value}`);
     validate();
   };
+  const handleCheckboxPortalChange = (value) => {
+    // if (value === 'bersedia') {
+    //   setBersedia(true);
+    // } else if (value === 'tidakBersedia') {
+    //   setBersedia(false);
+    // }
+    // updateForm('bersedia', `${value === 'bersedia'}`);
+    updateForm('portal', `${value}`);
+    validate();
+  };
   const [selectedIds, setSelectedIds] = useState(
     form.categoryProduk ? form.categoryProduk.split(',').map(Number) : [] // Parse string menjadi array angka
   );
@@ -217,6 +297,8 @@ const InformasiPerusahaan = ({
   const streetRef = useRef(null);
   const stateRef = useRef(null);
   const cityRef = useRef(null);
+  const districtRef = useRef(null);
+  const subDistrictRef = useRef(null);
   const zipRef = useRef(null);
   const mobileRef = useRef(null);
   const bankNameRef = useRef(null);
@@ -225,55 +307,10 @@ const InformasiPerusahaan = ({
   const estimasiRef = useRef(null);
   const tempoDurationRef = useRef(null);
   const bersediaRef = useRef(null);
+  const portalRef = useRef(null);
   const categoryProdukRef = useRef(null);
   const tempoLimitRef = useRef(null);
 
-  useEffect(() => {
-    const options = {
-      behavior: 'smooth',
-      block: 'center',
-    };
-
-    const loadIndustries = async () => {
-      const watchZip = form.zip?.trim(); // Menghapus spasi berlebih
-
-      // Validasi: hanya eksekusi jika watchZip valid (contoh: minimal 5 karakter)
-      if (watchZip && watchZip.length >= 5) {
-        const loadZip = async () => {
-          try {
-            const response = await fetch(
-              `https://alamat.thecloudalert.com/api/cari/index/?keyword=${watchZip}`
-            );
-
-            const result = await response.json();
-
-            if (!result.result.length > 0) {
-              toast.error('Alamat pos salah');
-              updateForm('zip', ''); // Reset form.zip jika salah
-              validate(); // Memanggil validasi formulir
-              return false;
-            } else {
-              updateForm('zip', watchZip);
-              validate();
-              return true; // Jika valid
-            }
-          } catch (error) {
-            toast.error('Terjadi kesalahan saat memeriksa alamat pos.');
-            console.error('Error:', error);
-            return false;
-          }
-        };
-
-        const isValidZip = await loadZip();
-        if (!isValidZip) {
-          zipRef.current.scrollIntoView(options);
-        }
-      }
-    };
-
-    loadIndustries();
-  }, [form.zip]);
-
   useEffect(() => {
     const options = {
       behavior: 'smooth',
@@ -301,6 +338,14 @@ const InformasiPerusahaan = ({
           cityRef.current.scrollIntoView(options);
           return;
         }
+        if (errors.district && districtRef.current) {
+          districtRef.current.scrollIntoView(options);
+          return;
+        }
+        if (errors.subDistrict && subDistrictRef.current) {
+          subDistrictRef.current.scrollIntoView(options);
+          return;
+        }
         if (errors.zip && zipRef.current) {
           zipRef.current.scrollIntoView(options);
           return;
@@ -333,6 +378,10 @@ const InformasiPerusahaan = ({
           bersediaRef.current.scrollIntoView(options);
           return;
         }
+        if (errors.portal && portalRef.current) {
+          portalRef.current.scrollIntoView(options);
+          return;
+        }
         if (errors.categoryProduk && categoryProdukRef.current) {
           categoryProdukRef.current.scrollIntoView(options);
           return;
@@ -355,6 +404,15 @@ const InformasiPerusahaan = ({
     if (form.city) {
       setValue('city', parseInt(form.city));
     }
+    if (form.district) {
+      setValue('district', parseInt(form.district));
+    }
+    if (form.subDistrict) {
+      setValue('subDistrict', parseInt(form.subDistrict));
+    }
+    if (form.zip) {
+      setValue('zip', parseInt(form.zip));
+    }
     if (form.tempoDuration) {
       setValue('tempoDuration', parseInt(form.tempoDuration));
     }
@@ -383,14 +441,31 @@ const InformasiPerusahaan = ({
         if (dataProfile.name) {
           updateForm('name', dataProfile.name);
         }
+        if (dataProfile.stateId.id) {
+          updateForm('state', `${dataProfile.stateId.id}`);
+        }
+        if (dataProfile.city.id) {
+          updateForm('city', `${dataProfile.city.id}`);
+        }
+        if (dataProfile.district.id) {
+          updateForm('district', `${dataProfile.district.id}`);
+        }
+        if (dataProfile.subDistrict.id) {
+          updateForm('subDistrict', `${dataProfile.subDistrict.id}`);
+        }
         if (dataProfile.alamatBisnis) {
           updateForm('street', dataProfile.alamatBisnis);
         }
         if (dataProfile.zip) {
           updateForm('zip', dataProfile.zip);
         }
-        if (dataProfile.phone) {
-          updateForm('mobile', dataProfile.phone.replace(/\D/g, ''));
+        if (dataProfile.mobile) {
+          updateForm('mobile', dataProfile.mobile.replace(/\D/g, ''));
+        } else {
+          setChangeConfirmation(true);
+        }
+        if (!dataProfile.email) {
+          setChangeConfirmation(true);
         }
       } catch (error) {
         console.error('Error loading profile:', error);
@@ -402,7 +477,7 @@ const InformasiPerusahaan = ({
     if (auth?.parentId) {
       loadProfile();
     }
-  }, [auth?.parentId, updateForm]);
+  }, [auth?.parentId]);
   useEffect(() => {
     const loadProfile = async () => {
       try {
@@ -410,6 +485,8 @@ const InformasiPerusahaan = ({
         setValue('industryId', parseInt(dataProfile.industryId));
         setValue('state', parseInt(dataProfile.stateId.id));
         setValue('city', parseInt(dataProfile.city.id));
+        setValue('district', parseInt(dataProfile.district.id));
+        setValue('subDistrict', parseInt(dataProfile.subDistrict.id));
       } catch (error) {
         console.error('Error loading profile:', error);
       }
@@ -419,8 +496,46 @@ const InformasiPerusahaan = ({
       loadProfile();
     }
   }, [auth?.parentId, setValue]);
+
+  const handleLengkapiData = () => {
+    router.push('/my/profile');
+  };
+
   return (
     <>
+      <BottomPopup
+        active={changeConfirmation}
+        close={() => {
+          toast.error(
+            'Mohon lengkapi data perusahaan sebelum melakukan pengajuan tempo'
+          );
+        }}
+        title='Data Perusahaan Anda Belum Lengkap'
+      >
+        <div className='leading-7 text-gray_r-12/80'>
+          Mohon lengkapi data perusahaan sebelum melakukan pengajuan tempo
+        </div>
+        <div className='flex mt-6 gap-x-4 md:justify-end'>
+          <button
+            className='btn-solid-red flex-1 md:flex-none'
+            type='button'
+            onClick={handleLengkapiData}
+          >
+            Lengkapi Data
+          </button>
+          <button
+            className='btn-light flex-1 md:flex-none'
+            type='button'
+            onClick={() => {
+              toast.error(
+                'Mohon lengkapi data perusahaan sebelum melakukan pengajuan tempo'
+              );
+            }}
+          >
+            Batal
+          </button>
+        </div>
+      </BottomPopup>
       {isDesktop && (
         <div className=''>
           <h1 className={`font-bold ${isKonfirmasi ? 'text-xl' : ''}`}>
@@ -563,13 +678,71 @@ const InformasiPerusahaan = ({
                         </div>
                       )}
                     </div>
-                    <div className='w-1/3'>
+                    <div className='w-1/3' ref={districtRef}>
+                      <Controller
+                        name='district'
+                        control={control}
+                        render={(props) => (
+                          <HookFormSelect
+                            {...props}
+                            options={districts}
+                            disabled={!watchState || !watchCity}
+                            placeholder='Kecamatan'
+                          />
+                        )}
+                      />
+                      {chekValid && (
+                        <div className='text-caption-2 text-danger-500 mt-1'>
+                          {errors.district}
+                        </div>
+                      )}
+                    </div>
+                    <div className='w-1/3' ref={subDistrictRef}>
+                      <Controller
+                        name='subDistrict'
+                        control={control}
+                        render={(props) => (
+                          <HookFormSelect
+                            {...props}
+                            options={subDistricts}
+                            disabled={!watchDistrict}
+                            placeholder='Kelurahan'
+                          />
+                        )}
+                      />
+                      {chekValid && (
+                        <div className='text-caption-2 text-danger-500 mt-1'>
+                          {errors.district}
+                        </div>
+                      )}
+                    </div>
+                    <div className='w-1/3' ref={zipRef}>
+                      <Controller
+                        name='zip'
+                        control={control}
+                        render={(props) => (
+                          <HookFormSelect
+                            {...props}
+                            options={zips}
+                            disabled={!watchsubDistrict}
+                            placeholder='Zip'
+                          />
+                        )}
+                      />
+                      {chekValid && (
+                        <div className='text-caption-2 text-danger-500 mt-1'>
+                          {errors.district}
+                        </div>
+                      )}
+                    </div>
+                    {/* <div className='w-1/3'>
                       <input
                         id='zip'
                         name='zip'
                         ref={zipRef}
                         placeholder='Kode Pos'
                         type='number'
+                        disabled={!watchsubDistrict}
                         value={form.zip}
                         className='form-input'
                         onChange={handleInputChange}
@@ -579,7 +752,7 @@ const InformasiPerusahaan = ({
                           {errors.zip}
                         </div>
                       )}
-                    </div>
+                    </div> */}
                   </div>
                 </div>
               </div>
@@ -712,9 +885,9 @@ const InformasiPerusahaan = ({
 
               <div className='flex flex-row  justify-between items-start'>
                 <div className='w-2/5 text-nowrap'>
-                  <label className='form-label '>
+                  <label className='form-label text-wrap'>
                     Estimasi Pembelian pertahun{' '}
-                    <span className=' opacity-60'>(Opsional)</span>
+                    <span className=' opacity-60 '>(Opsional)</span>
                   </label>
                 </div>
                 <div className='w-3/5'>
@@ -799,14 +972,38 @@ const InformasiPerusahaan = ({
               <div className='flex flex-row justify-between items-start'>
                 <div className='w-2/5'>
                   <label className='form-label  text-wrap '>
-                    Apakah bersedia transaksi via website?
+                    Apakah terdapat vendor portal pada perusahaan anda?
                   </label>
-                  {!isKonfirmasi && (
-                    <span className='text-xs opacity-60'>
-                      Pilih produk bisa lebih dari 1
-                    </span>
+                </div>
+                <div className='w-3/5 flex flex-col justify-start'>
+                  <div className='flex gap-x-4' ref={portalRef}>
+                    <RadioGroup
+                      onChange={handleCheckboxPortalChange}
+                      value={form.portal}
+                    >
+                      <Stack direction='row'>
+                        <Radio colorScheme='red' value='ada'>
+                          Ya, ada
+                        </Radio>
+                        <Radio colorScheme='red' value='tidak'>
+                          Tidak ada
+                        </Radio>
+                      </Stack>
+                    </RadioGroup>
+                  </div>
+                  {chekValid && (
+                    <div className='text-caption-2 text-danger-500 mt-1'>
+                      {errors.portal}
+                    </div>
                   )}
                 </div>
+              </div>
+              <div className='flex flex-row justify-between items-start'>
+                <div className='w-2/5'>
+                  <label className='form-label  text-wrap '>
+                    Apakah bersedia transaksi via website?
+                  </label>
+                </div>
                 <div className='w-3/5 flex flex-col justify-start'>
                   <div className='flex gap-x-4' ref={bersediaRef}>
                     <RadioGroup
@@ -822,28 +1019,6 @@ const InformasiPerusahaan = ({
                         </Radio>
                       </Stack>
                     </RadioGroup>
-                    {/* <Checkbox
-                  name='bersedia'
-                  borderColor='gray.600'
-                  colorScheme='red'
-                  isChecked={bersedia === true} // Checked when bersedia is true
-                  onChange={() => handleCheckboxBersediaChange('bersedia')}
-                  value={true}
-                  size='md'
-                >
-                  Saya bersedia
-                </Checkbox>
-                <Checkbox
-                  name='bersedia'
-                  borderColor='gray.600'
-                  colorScheme='red'
-                  isChecked={bersedia === false} // Checked when bersedia is false
-                  onChange={() => handleCheckboxBersediaChange('tidakBersedia')}
-                  value={false}
-                  size='md'
-                >
-                  Tidak bersedia
-                </Checkbox> */}
                   </div>
                   {chekValid && (
                     <div className='text-caption-2 text-danger-500 mt-1'>
@@ -1027,6 +1202,25 @@ const InformasiPerusahaan = ({
                         </div>
                       )}
                     </div>
+                    <div className='w-1/3' ref={districtRef}>
+                      <Controller
+                        name='district'
+                        control={control}
+                        render={(props) => (
+                          <HookFormSelect
+                            {...props}
+                            options={districts}
+                            disabled={!watchCity}
+                            placeholder='Kecamatan'
+                          />
+                        )}
+                      />
+                      {chekValid && (
+                        <div className='text-caption-2 text-danger-500 mt-1'>
+                          {errors.district}
+                        </div>
+                      )}
+                    </div>
                     <div className='w-1/3'>
                       <input
                         id='zip'
diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index dc8307c8..8a7f4f71 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -108,7 +108,7 @@ const Tempo = () => {
             <div className='flex flex-col mb-6 items-start justify-start'>
               <h1 className='text-title-sm font-semibold'>Pembayaran Tempo</h1>
               <p className='flex flex-row gap-2 w-full'>
-                Jenis Tempo Pembayaran Anda adalah{' '}
+                Status Detail Tempo Pembayaran Anda adalah{' '}
                 <Skeleton
                   isLoaded={!isLoading}
                   h='fit'
@@ -175,7 +175,7 @@ const Tempo = () => {
                 {getLabel()}
               </span>
             </div>
-            {tempo.length > 0 && !tempo.paymentTerm ? (
+            {auth?.tempoProgres == 'review' && !tempo.paymentTerm ? (
               <div className='flex justify-center'>
                 <Image
                   src='/images/ICON-DOKUMEN-VERIFIKASI.png'
@@ -265,12 +265,12 @@ const Tempo = () => {
                         <td>
                           {invoice.amountResidual > 0 ? (
                             new Date() > getDueDate(invoice.invoiceDateDue) ? (
-                              <div className='inline-flex items-center rounded-md bg-red-50 px-2 py-1 text-xs font-medium text-red-700 ring-1 ring-inset ring-red-600/20'>
+                              <div className='badge-solid-red h-fit mx-auto'>
                                 Jatuh Tempo
                               </div>
                             ) : (
-                              <div className='badge-solid-red h-fit mx-auto'>
-                                Belum Lunas
+                              <div className=' h-fit mx-auto inline-flex items-center rounded-md bg-red-50 px-2 py-1 text-xs font-medium text-red-700 ring-1 ring-inset ring-red-600/20'>
+                                Belum Jatuh Tempo
                               </div>
                             )
                           ) : (
@@ -308,7 +308,7 @@ const Tempo = () => {
           <div className='flex flex-col gap-y-4 '>
             <div className='flex flex-col items-center justify-center'>
               <p className='flex flex-row w-full text-sm gap-2 items-center justify-start'>
-                Jenis Tempo Pembayaran Anda adalah{' '}
+                Status Detail Tempo Pembayaran Anda adalah{' '}
                 <Skeleton
                   isLoaded={!isLoading}
                   h='fit'
@@ -377,18 +377,20 @@ const Tempo = () => {
           </div>
         </div>
         <div className='p-4 flex flex-col gap-y-4'>
-          <form className='flex gap-x-3' onSubmit={handleSubmit}>
-            <input
-              type='text'
-              className='form-input'
-              placeholder='Cari Invoice...'
-              value={inputQuery}
-              onChange={(e) => setInputQuery(e.target.value)}
-            />
-            <button className='btn-light bg-transparent px-3' type='submit'>
-              <MagnifyingGlassIcon className='w-6' />
-            </button>
-          </form>
+          {!invoices.isLoading && invoices.data?.invoices?.length != 0 && (
+            <form className='flex gap-x-3' onSubmit={handleSubmit}>
+              <input
+                type='text'
+                className='form-input'
+                placeholder='Cari Invoice...'
+                value={inputQuery}
+                onChange={(e) => setInputQuery(e.target.value)}
+              />
+              <button className='btn-light bg-transparent px-3' type='submit'>
+                <MagnifyingGlassIcon className='w-6' />
+              </button>
+            </form>
+          )}
 
           {invoices.isLoading && (
             <div className='flex justify-center my-4'>
@@ -397,9 +399,15 @@ const Tempo = () => {
           )}
 
           {!invoices.isLoading && invoices.data?.invoices?.length === 0 && (
-            <Alert type='info' className='text-center'>
-              Tidak ada invoice
-            </Alert>
+            // <Alert type='info' className='text-center'>
+            //   Tidak ada invoice
+            // </Alert>
+            <Image
+              src='/images/ICON-DOKUMEN-VERIFIKASI.png'
+              alt='Registrasi Tempo'
+              width={isMobile ? 300 : 600}
+              height={isMobile ? 300 : 550}
+            />
           )}
 
           {invoices.data?.invoices?.map((invoice, index) => (
-- 
cgit v1.2.3