<iman>update pengajuan tempo request

1 files changed, 490 insertions, 174 deletions

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
@@ -169,11 +169,99 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               <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.dokumenTempatBekerja}
+                        aria-invalid={errorsDokumen.dokumenKtpDirut}
                         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?.dokumenKtpDirut?.name}
                       </span>
                     </div>
 
                     {chekValid && (
                       <div className='text-caption-2 text-danger-500 mt-1'>
-                        {errorsDokumen.dokumenTempatBekerja}
+                        {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.dokumenLaporanKeuangan}
+                        onChange={handleInputChange}
+                        accept='.pdf,.png,.jpg,.jpeg'
+                      />
+                      <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.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,13 +1133,53 @@ 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}
               >
                 <label className='form-label  text-nowrap'>
@@ -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'>