From d6ede238658d90315a5dc5b864f20037e8a776f6 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Tue, 22 Oct 2024 11:24:43 +0700
Subject: <iman> update & add section dokumen

---
 src/lib/pengajuan-tempo/component/Dokumen.jsx | 441 ++++++++++++++++++++++++++
 1 file changed, 441 insertions(+)
 create mode 100644 src/lib/pengajuan-tempo/component/Dokumen.jsx

(limited to 'src/lib/pengajuan-tempo/component/Dokumen.jsx')

diff --git a/src/lib/pengajuan-tempo/component/Dokumen.jsx b/src/lib/pengajuan-tempo/component/Dokumen.jsx
new file mode 100644
index 00000000..65220b27
--- /dev/null
+++ b/src/lib/pengajuan-tempo/component/Dokumen.jsx
@@ -0,0 +1,441 @@
+import React, { useState, useEffect, useMemo, useRef } from 'react';
+import { Controller, set, useForm } from 'react-hook-form';
+import { usePengajuanTempoStoreDokumen } from '../../../../src-migrate/modules/register/stores/usePengajuanTempoStore';
+import ProgressBar from '@ramonak/react-progress-bar';
+import { UseToastOptions } from '@chakra-ui/react';
+import { toast } from 'react-hot-toast';
+import getFileBase64 from '@/core/utils/getFileBase64';
+const Dokumen = ({ chekValid, buttonSubmitClick }) => {
+  const { control, watch } = useForm();
+  const {
+    formDokumen,
+    errorsDokumen,
+    validateDokumen,
+    updateFormDokumen,
+    getJumlahDokumenDiisi,
+  } = usePengajuanTempoStoreDokumen();
+
+  // const handleInputChange = (event) => {
+  //   const { name, value } = event.target;
+  //   updateFormDokumen(name, value);
+  //   validateDokumen();
+  // };
+  const handleInputChange = async (event) => {
+    let fileBase64 = '';
+    const { name } = event.target;
+    const file = event.target.files?.[0];
+    console.log('file', file);
+    // Allowed file extensions
+    const allowedExtensions = ['pdf', 'png', 'jpg', 'jpeg'];
+    let fileExtension = '';
+    if (file) {
+      fileExtension = file.name.split('.').pop()?.toLowerCase(); // Extract file extension
+
+      // Check if the file extension is allowed
+      if (!fileExtension || !allowedExtensions.includes(fileExtension)) {
+        toast.error(
+          'Format file yang diijinkan adalah .pdf, .png, .jpg, atau .jpeg',
+          { duration: 4000 }
+        );
+
+        event.target.value = '';
+        return;
+      }
+
+      // Check for file size
+      if (file.size > 2000000) {
+        toast.error('Maksimal ukuran file adalah 2MB', { duration: 4000 });
+
+        event.target.value = '';
+        return;
+      }
+
+      // Convert file to Base64
+      fileBase64 = await getFileBase64(file);
+      updateFormDokumen(name, file.name, fileExtension, fileBase64);
+      validateDokumen();
+    }
+  };
+
+  const isFormValid = useMemo(
+    () => Object.keys(errorsDokumen).length === 0,
+    [errorsDokumen]
+  );
+  console.log('formDokumen', formDokumen?.dokumenNib?.name);
+  const dokumenNibRef = useRef(null);
+  const dokumenNpwpRef = useRef(null);
+  const dokumenSppkpRef = useRef(null);
+  const dokumenAktaPerubahanRef = useRef(null);
+  const dokumenKtpDirutRef = useRef(null);
+  const dokumenAktaPendirianRef = useRef(null);
+  const dokumenLaporanKeuanganRef = useRef(null);
+  const dokumenFotoKantorRef = useRef(null);
+  const dokumenTempatBekerjaRef = useRef(null);
+
+  useEffect(() => {
+    const loadIndustries = async () => {
+      if (!isFormValid) {
+        const options = {
+          behavior: 'smooth',
+          block: 'center',
+        };
+        if (errorsDokumen.dokumenNib && dokumenNibRef.current) {
+          dokumenNibRef.current.scrollIntoView(options);
+          return;
+        }
+        if (errorsDokumen.dokumenNpwp && dokumenNpwpRef.current) {
+          dokumenNpwpRef.current.scrollIntoView(options);
+          return;
+        }
+        if (errorsDokumen.dokumenSppkp && dokumenSppkpRef.current) {
+          dokumenSppkpRef.current.scrollIntoView(options);
+          return;
+        }
+        if (
+          errorsDokumen.dokumenAktaPerubahan &&
+          dokumenAktaPerubahanRef.current
+        ) {
+          dokumenAktaPerubahanRef.current.scrollIntoView(options);
+          return;
+        }
+        if (errorsDokumen.dokumenKtpDirut && dokumenKtpDirutRef.current) {
+          dokumenKtpDirutRef.current.scrollIntoView(options);
+          return;
+        }
+        if (
+          errorsDokumen.dokumenAktaPendirian &&
+          dokumenAktaPendirianRef.current
+        ) {
+          dokumenAktaPendirianRef.current.scrollIntoView(options);
+          return;
+        }
+        if (
+          errorsDokumen.dokumenLaporanKeuangan &&
+          dokumenLaporanKeuanganRef.current
+        ) {
+          dokumenLaporanKeuanganRef.current.scrollIntoView(options);
+          return;
+        }
+        if (errorsDokumen.dokumenFotoKantor && dokumenFotoKantorRef.current) {
+          dokumenFotoKantorRef.current.scrollIntoView(options);
+          return;
+        }
+        if (
+          errorsDokumen.dokumenTempatBekerja &&
+          dokumenTempatBekerjaRef.current
+        ) {
+          dokumenTempatBekerjaRef.current.scrollIntoView(options);
+          return;
+        }
+      }
+    };
+    loadIndustries();
+  }, [buttonSubmitClick, chekValid]);
+
+  useEffect(() => {
+    validateDokumen();
+  }, [buttonSubmitClick]);
+  return (
+    <>
+      <div className='flex justify-start'>
+        <h1 className='font-bold'>Dokumen</h1>
+      </div>
+      <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-10 '>
+            <div className='w-full grid grid-cols-2 gap-5'>
+              <div>
+                <label className='form-label  text-nowrap'>
+                  NIB (SIUP/TDP/SKDP)
+                </label>
+                <span className='text-xs opacity-60'>
+                  Pastikan dokumen yang anda upload sudah benar
+                </span>
+              </div>
+              <div className=''>
+                <input
+                  // value={formDokumen?.dokumenNib?.name}
+                  id='dokumenNib'
+                  name='dokumenNib'
+                  type='file'
+                  ref={dokumenNibRef}
+                  className='form-input'
+                  aria-invalid={errorsDokumen.dokumenNib}
+                  onChange={handleInputChange}
+                  accept='.pdf,.png,.jpg,.jpeg'
+                />
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenNib}
+                  </div>
+                )}
+              </div>
+            </div>
+            <div className='w-full grid grid-cols-2 gap-5'>
+              <div>
+                <label className='form-label  text-nowrap'>
+                  NPWP Perusahaan
+                </label>
+                <span className='text-xs opacity-60'>
+                  Pastikan dokumen yang anda upload sudah benar
+                </span>
+              </div>
+              <div className=''>
+                <input
+                  // value={formDokumen.dokumenNpwp}
+                  id='dokumenNpwp'
+                  name='dokumenNpwp'
+                  type='file'
+                  ref={dokumenNpwpRef}
+                  className='form-input'
+                  aria-invalid={errorsDokumen.dokumenNpwp}
+                  onChange={handleInputChange}
+                  accept='.pdf,.png,.jpg,.jpeg'
+                />
+                {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'>
+              <div>
+                <label className='form-label  text-nowrap'>SPPKP</label>
+                <span className='text-xs opacity-60'>
+                  Pastikan dokumen yang anda upload sudah benar
+                </span>
+              </div>
+              <div className=''>
+                <input
+                  // value={formDokumen.dokumenSppkp}
+                  id='dokumenSppkp'
+                  name='dokumenSppkp'
+                  type='file'
+                  ref={dokumenSppkpRef}
+                  className='form-input'
+                  aria-invalid={errorsDokumen.dokumenSppkp}
+                  onChange={handleInputChange}
+                  accept='.pdf,.png,.jpg,.jpeg'
+                />
+                {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'>
+              <div>
+                <label className='form-label  text-nowrap'>
+                  Akta Perubahan <span className=' opacity-60'>(Opsional)</span>
+                </label>
+                <span className='text-xs opacity-60'>
+                  Pastikan dokumen yang anda upload sudah benar
+                </span>
+              </div>
+              <div className=''>
+                <input
+                  // value={formDokumen.dokumenAktaPerubahan}
+                  id='dokumenAktaPerubahan'
+                  name='dokumenAktaPerubahan'
+                  type='file'
+                  ref={dokumenAktaPerubahanRef}
+                  className='form-input'
+                  aria-invalid={errorsDokumen.dokumenAktaPerubahan}
+                  onChange={handleInputChange}
+                  accept='.pdf,.png,.jpg,.jpeg'
+                />
+                {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'>
+              <div>
+                <label className='form-label  text-nowrap'>
+                  KTP Dirut/Direktur{' '}
+                  <span className=' opacity-60'>(Opsional)</span>
+                </label>
+                <span className='text-xs opacity-60'>
+                  Pastikan dokumen yang anda upload sudah benar
+                </span>
+              </div>
+              <div className=''>
+                <input
+                  // value={formDokumen.dokumenKtpDirut}
+                  id='dokumenKtpDirut'
+                  name='dokumenKtpDirut'
+                  type='file'
+                  ref={dokumenKtpDirutRef}
+                  className='form-input'
+                  aria-invalid={errorsDokumen.dokumenKtpDirut}
+                  onChange={handleInputChange}
+                  accept='.pdf,.png,.jpg,.jpeg'
+                />
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenKtpDirut}
+                  </div>
+                )}
+              </div>
+            </div>
+          </div>
+          <div className='w-px bg-gray-300'></div>
+          <div className='kolom kanan w-full grid grid-rows-2 gap-10 '>
+            <div className='w-full grid grid-cols-2 gap-5'>
+              <div>
+                <label className='form-label  text-nowrap'>
+                  Akta Pendirian <span className=' opacity-60'>(Opsional)</span>
+                </label>
+                <span className='text-xs opacity-60'>
+                  Pastikan dokumen yang anda upload sudah benar
+                </span>
+              </div>
+              <div className=''>
+                <input
+                  // value={formDokumen.dokumenAktaPendirian}
+                  id='dokumenAktaPendirian'
+                  name='dokumenAktaPendirian'
+                  type='file'
+                  ref={dokumenAktaPendirianRef}
+                  className='form-input'
+                  aria-invalid={errorsDokumen.dokumenAktaPendirian}
+                  onChange={handleInputChange}
+                  accept='.pdf,.png,.jpg,.jpeg'
+                />
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenAktaPendirian}
+                  </div>
+                )}
+              </div>
+            </div>
+            <div className='w-full grid grid-cols-2 gap-5'>
+              <div>
+                <label className='form-label  text-nowrap'>
+                  Laporan Keuangan
+                  <span className=' opacity-60'>(Opsional)</span>
+                </label>
+                <span className='text-xs opacity-60'>
+                  Pastikan dokumen yang anda upload sudah benar
+                </span>
+              </div>
+              <div className=''>
+                <input
+                  // value={formDokumen.dokumenLaporanKeuangan}
+                  id='dokumenLaporanKeuangan'
+                  name='dokumenLaporanKeuangan'
+                  type='file'
+                  ref={dokumenLaporanKeuanganRef}
+                  className='form-input'
+                  aria-invalid={errorsDokumen.dokumenLaporanKeuangan}
+                  onChange={handleInputChange}
+                  accept='.pdf,.png,.jpg,.jpeg'
+                />
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenLaporanKeuangan}
+                  </div>
+                )}
+              </div>
+            </div>
+            <div className='w-full grid grid-cols-2 gap-5'>
+              <div>
+                <label className='form-label  text-nowrap'>
+                  Foto Kantor (Tampak Depan)
+                </label>
+                <span className='text-xs opacity-60'>
+                  Pastikan dokumen yang anda upload sudah benar
+                </span>
+              </div>
+              <div className=''>
+                <input
+                  // value={formDokumen.dokumenFotoKantor}
+                  id='dokumenFotoKantor'
+                  name='dokumenFotoKantor'
+                  type='file'
+                  ref={dokumenFotoKantorRef}
+                  className='form-input'
+                  aria-invalid={errorsDokumen.dokumenFotoKantor}
+                  onChange={handleInputChange}
+                  accept='.pdf,.png,.jpg,.jpeg'
+                />
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenFotoKantor}
+                  </div>
+                )}
+              </div>
+            </div>
+            <div className='w-full grid grid-cols-2 gap-5'>
+              <div>
+                <label className='form-label  text-nowrap'>
+                  Tempat Bekerja
+                </label>
+                <span className='text-xs opacity-60'>
+                  Pastikan dokumen yang anda upload sudah benar
+                </span>
+              </div>
+              <div className=''>
+                <input
+                  // value={formDokumen.dokumenTempatBekerja}
+                  id='dokumenTempatBekerja'
+                  name='dokumenTempatBekerja'
+                  type='file'
+                  ref={dokumenTempatBekerjaRef}
+                  className='form-input'
+                  aria-invalid={errorsDokumen.dokumenTempatBekerja}
+                  onChange={handleInputChange}
+                  accept='.pdf,.png,.jpg,.jpeg'
+                />
+                {chekValid && (
+                  <div className='text-caption-2 text-danger-500 mt-1'>
+                    {errorsDokumen.dokumenTempatBekerja}
+                  </div>
+                )}
+              </div>
+            </div>
+            <div></div>
+          </div>
+        </div>
+      </form>
+      <div className='w-1/2 mt-8 flex gap-3 flex-col'>
+        <div className='flex justify-between'>
+          <p className='font-bold'>Upload Progress</p>
+          <p>
+            <span className='text-red-500 font-bold'>
+              {parseInt((getJumlahDokumenDiisi() / 9) * 100)} %
+            </span>
+            <span className='ml-2 opacity-60'>
+              {getJumlahDokumenDiisi() > 5
+                ? getJumlahDokumenDiisi() == 9
+                  ? 'Selesai'
+                  : 'Sedikit Lagi'
+                : ''}
+            </span>
+          </p>
+        </div>
+        {/* 50 keatas baru muncul kata kata sedikit lagi */}
+        <ProgressBar
+          completed={getJumlahDokumenDiisi()}
+          bgColor='#ef4444'
+          labelAlignment='outside'
+          isLabelVisible={false}
+          baseBgColor='#E5E7EB'
+          labelColor='#e80909'
+          labelSize='0'
+          maxCompleted={9}
+        />
+        <span className='opacity-75'>
+          Tingkatin sedikit lagi agar pengajuan tempo kamu dapat kami proses
+          dengan cepat
+        </span>
+      </div>
+    </>
+  );
+};
+
+export default Dokumen;
-- 
cgit v1.2.3


From acee071ea98505b42918f4d7cdc15252ae78f705 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Tue, 22 Oct 2024 15:28:40 +0700
Subject: <iman> update fix dokumen

---
 src/lib/pengajuan-tempo/component/Dokumen.jsx | 311 +++++++++++++++++---------
 1 file changed, 208 insertions(+), 103 deletions(-)

(limited to 'src/lib/pengajuan-tempo/component/Dokumen.jsx')

diff --git a/src/lib/pengajuan-tempo/component/Dokumen.jsx b/src/lib/pengajuan-tempo/component/Dokumen.jsx
index 65220b27..42c6c47f 100644
--- a/src/lib/pengajuan-tempo/component/Dokumen.jsx
+++ b/src/lib/pengajuan-tempo/component/Dokumen.jsx
@@ -24,7 +24,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick }) => {
     let fileBase64 = '';
     const { name } = event.target;
     const file = event.target.files?.[0];
-    console.log('file', file);
     // Allowed file extensions
     const allowedExtensions = ['pdf', 'png', 'jpg', 'jpeg'];
     let fileExtension = '';
@@ -61,7 +60,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick }) => {
     () => Object.keys(errorsDokumen).length === 0,
     [errorsDokumen]
   );
-  console.log('formDokumen', formDokumen?.dokumenNib?.name);
   const dokumenNibRef = useRef(null);
   const dokumenNpwpRef = useRef(null);
   const dokumenSppkpRef = useRef(null);
@@ -142,7 +140,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick }) => {
       </div>
       <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-10 '>
+          <div className='kolom-kiri w-full grid grid-rows-2 gap-7 '>
             <div className='w-full grid grid-cols-2 gap-5'>
               <div>
                 <label className='form-label  text-nowrap'>
@@ -153,17 +151,29 @@ const Dokumen = ({ chekValid, buttonSubmitClick }) => {
                 </span>
               </div>
               <div className=''>
-                <input
-                  // value={formDokumen?.dokumenNib?.name}
-                  id='dokumenNib'
-                  name='dokumenNib'
-                  type='file'
-                  ref={dokumenNibRef}
-                  className='form-input'
-                  aria-invalid={errorsDokumen.dokumenNib}
-                  onChange={handleInputChange}
-                  accept='.pdf,.png,.jpg,.jpeg'
-                />
+                <div className='flex flex-col items-start'>
+                  <label
+                    htmlFor='dokumenNib'
+                    className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                  >
+                    Upload Dokumen
+                  </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'
+                  />
+                  <span className='mt-2 text-gray-600'>
+                    {formDokumen?.dokumenNib?.name}
+                  </span>
+                </div>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
                     {errorsDokumen.dokumenNib}
@@ -181,17 +191,29 @@ const Dokumen = ({ chekValid, buttonSubmitClick }) => {
                 </span>
               </div>
               <div className=''>
-                <input
-                  // value={formDokumen.dokumenNpwp}
-                  id='dokumenNpwp'
-                  name='dokumenNpwp'
-                  type='file'
-                  ref={dokumenNpwpRef}
-                  className='form-input'
-                  aria-invalid={errorsDokumen.dokumenNpwp}
-                  onChange={handleInputChange}
-                  accept='.pdf,.png,.jpg,.jpeg'
-                />
+                <div className='flex flex-col items-start'>
+                  <label
+                    htmlFor='dokumenNpwp'
+                    className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                  >
+                    Upload Dokumen
+                  </label>
+                  <input
+                    // value={formDokumen.dokumenNpwp}
+                    id='dokumenNpwp'
+                    name='dokumenNpwp'
+                    type='file'
+                    ref={dokumenNpwpRef}
+                    title=' '
+                    className='hidden'
+                    aria-invalid={errorsDokumen.dokumenNpwp}
+                    onChange={handleInputChange}
+                    accept='.pdf,.png,.jpg,.jpeg'
+                  />
+                  <span className='mt-2 text-gray-600'>
+                    {formDokumen?.dokumenNpwp?.name}
+                  </span>
+                </div>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
                     {errorsDokumen.dokumenNpwp}
@@ -207,17 +229,29 @@ const Dokumen = ({ chekValid, buttonSubmitClick }) => {
                 </span>
               </div>
               <div className=''>
-                <input
-                  // value={formDokumen.dokumenSppkp}
-                  id='dokumenSppkp'
-                  name='dokumenSppkp'
-                  type='file'
-                  ref={dokumenSppkpRef}
-                  className='form-input'
-                  aria-invalid={errorsDokumen.dokumenSppkp}
-                  onChange={handleInputChange}
-                  accept='.pdf,.png,.jpg,.jpeg'
-                />
+                <div className='flex flex-col items-start'>
+                  <label
+                    htmlFor='dokumenSppkp'
+                    className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                  >
+                    Upload Dokumen
+                  </label>
+                  <input
+                    // value={formDokumen.dokumenSppkp}
+                    id='dokumenSppkp'
+                    name='dokumenSppkp'
+                    type='file'
+                    ref={dokumenSppkpRef}
+                    className='hidden'
+                    aria-invalid={errorsDokumen.dokumenSppkp}
+                    onChange={handleInputChange}
+                    accept='.pdf,.png,.jpg,.jpeg'
+                  />
+                  <span className='mt-2 text-gray-600'>
+                    {formDokumen?.dokumenSppkp?.name}
+                  </span>
+                </div>
+
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
                     {errorsDokumen.dokumenSppkp}
@@ -235,17 +269,28 @@ const Dokumen = ({ chekValid, buttonSubmitClick }) => {
                 </span>
               </div>
               <div className=''>
-                <input
-                  // value={formDokumen.dokumenAktaPerubahan}
-                  id='dokumenAktaPerubahan'
-                  name='dokumenAktaPerubahan'
-                  type='file'
-                  ref={dokumenAktaPerubahanRef}
-                  className='form-input'
-                  aria-invalid={errorsDokumen.dokumenAktaPerubahan}
-                  onChange={handleInputChange}
-                  accept='.pdf,.png,.jpg,.jpeg'
-                />
+                <div className='flex flex-col items-start'>
+                  <label
+                    htmlFor='dokumenAktaPerubahan'
+                    className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                  >
+                    Upload Dokumen
+                  </label>
+                  <input
+                    // value={formDokumen.dokumenAktaPerubahan}
+                    id='dokumenAktaPerubahan'
+                    name='dokumenAktaPerubahan'
+                    type='file'
+                    ref={dokumenAktaPerubahanRef}
+                    className='hidden'
+                    aria-invalid={errorsDokumen.dokumenAktaPerubahan}
+                    onChange={handleInputChange}
+                    accept='.pdf,.png,.jpg,.jpeg'
+                  />
+                  <span className='mt-2 text-gray-600'>
+                    {formDokumen?.dokumenAktaPerubahan?.name}
+                  </span>
+                </div>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
                     {errorsDokumen.dokumenAktaPerubahan}
@@ -264,17 +309,29 @@ const Dokumen = ({ chekValid, buttonSubmitClick }) => {
                 </span>
               </div>
               <div className=''>
-                <input
-                  // value={formDokumen.dokumenKtpDirut}
-                  id='dokumenKtpDirut'
-                  name='dokumenKtpDirut'
-                  type='file'
-                  ref={dokumenKtpDirutRef}
-                  className='form-input'
-                  aria-invalid={errorsDokumen.dokumenKtpDirut}
-                  onChange={handleInputChange}
-                  accept='.pdf,.png,.jpg,.jpeg'
-                />
+                <div className='flex flex-col items-start'>
+                  <label
+                    htmlFor='dokumenKtpDirut'
+                    className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                  >
+                    Upload Dokumen
+                  </label>
+                  <input
+                    // value={formDokumen.dokumenKtpDirut}
+                    id='dokumenKtpDirut'
+                    name='dokumenKtpDirut'
+                    type='file'
+                    ref={dokumenKtpDirutRef}
+                    className='hidden'
+                    aria-invalid={errorsDokumen.dokumenKtpDirut}
+                    onChange={handleInputChange}
+                    accept='.pdf,.png,.jpg,.jpeg'
+                  />
+                  <span className='mt-2 text-gray-600'>
+                    {formDokumen?.dokumenKtpDirut?.name}
+                  </span>
+                </div>
+
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
                     {errorsDokumen.dokumenKtpDirut}
@@ -295,17 +352,29 @@ const Dokumen = ({ chekValid, buttonSubmitClick }) => {
                 </span>
               </div>
               <div className=''>
-                <input
-                  // value={formDokumen.dokumenAktaPendirian}
-                  id='dokumenAktaPendirian'
-                  name='dokumenAktaPendirian'
-                  type='file'
-                  ref={dokumenAktaPendirianRef}
-                  className='form-input'
-                  aria-invalid={errorsDokumen.dokumenAktaPendirian}
-                  onChange={handleInputChange}
-                  accept='.pdf,.png,.jpg,.jpeg'
-                />
+                <div className='flex flex-col items-start'>
+                  <label
+                    htmlFor='dokumenAktaPendirian'
+                    className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                  >
+                    Upload Dokumen
+                  </label>
+                  <input
+                    // value={formDokumen.dokumenAktaPendirian}
+                    id='dokumenAktaPendirian'
+                    name='dokumenAktaPendirian'
+                    type='file'
+                    ref={dokumenAktaPendirianRef}
+                    className='hidden'
+                    aria-invalid={errorsDokumen.dokumenAktaPendirian}
+                    onChange={handleInputChange}
+                    accept='.pdf,.png,.jpg,.jpeg'
+                  />
+                  <span className='mt-2 text-gray-600'>
+                    {formDokumen?.dokumenAktaPendirian?.name}
+                  </span>
+                </div>
+
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
                     {errorsDokumen.dokumenAktaPendirian}
@@ -324,17 +393,29 @@ const Dokumen = ({ chekValid, buttonSubmitClick }) => {
                 </span>
               </div>
               <div className=''>
-                <input
-                  // value={formDokumen.dokumenLaporanKeuangan}
-                  id='dokumenLaporanKeuangan'
-                  name='dokumenLaporanKeuangan'
-                  type='file'
-                  ref={dokumenLaporanKeuanganRef}
-                  className='form-input'
-                  aria-invalid={errorsDokumen.dokumenLaporanKeuangan}
-                  onChange={handleInputChange}
-                  accept='.pdf,.png,.jpg,.jpeg'
-                />
+                <div className='flex flex-col items-start'>
+                  <label
+                    htmlFor='dokumenLaporanKeuangan'
+                    className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                  >
+                    Upload Dokumen
+                  </label>
+                  <input
+                    // value={formDokumen.dokumenLaporanKeuangan}
+                    id='dokumenLaporanKeuangan'
+                    name='dokumenLaporanKeuangan'
+                    type='file'
+                    ref={dokumenLaporanKeuanganRef}
+                    className='hidden'
+                    aria-invalid={errorsDokumen.dokumenLaporanKeuangan}
+                    onChange={handleInputChange}
+                    accept='.pdf,.png,.jpg,.jpeg'
+                  />
+                  <span className='mt-2 text-gray-600'>
+                    {formDokumen?.dokumenLaporanKeuangan?.name}
+                  </span>
+                </div>
+
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
                     {errorsDokumen.dokumenLaporanKeuangan}
@@ -352,17 +433,29 @@ const Dokumen = ({ chekValid, buttonSubmitClick }) => {
                 </span>
               </div>
               <div className=''>
-                <input
-                  // value={formDokumen.dokumenFotoKantor}
-                  id='dokumenFotoKantor'
-                  name='dokumenFotoKantor'
-                  type='file'
-                  ref={dokumenFotoKantorRef}
-                  className='form-input'
-                  aria-invalid={errorsDokumen.dokumenFotoKantor}
-                  onChange={handleInputChange}
-                  accept='.pdf,.png,.jpg,.jpeg'
-                />
+                <div className='flex flex-col items-start'>
+                  <label
+                    htmlFor='dokumenFotoKantor'
+                    className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                  >
+                    Upload Dokumen
+                  </label>
+                  <input
+                    // value={formDokumen.dokumenFotoKantor}
+                    id='dokumenFotoKantor'
+                    name='dokumenFotoKantor'
+                    type='file'
+                    ref={dokumenFotoKantorRef}
+                    className='hidden'
+                    aria-invalid={errorsDokumen.dokumenFotoKantor}
+                    onChange={handleInputChange}
+                    accept='.pdf,.png,.jpg,.jpeg'
+                  />
+                  <span className='mt-2 text-gray-600'>
+                    {formDokumen?.dokumenFotoKantor?.name}
+                  </span>
+                </div>
+
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
                     {errorsDokumen.dokumenFotoKantor}
@@ -380,17 +473,29 @@ const Dokumen = ({ chekValid, buttonSubmitClick }) => {
                 </span>
               </div>
               <div className=''>
-                <input
-                  // value={formDokumen.dokumenTempatBekerja}
-                  id='dokumenTempatBekerja'
-                  name='dokumenTempatBekerja'
-                  type='file'
-                  ref={dokumenTempatBekerjaRef}
-                  className='form-input'
-                  aria-invalid={errorsDokumen.dokumenTempatBekerja}
-                  onChange={handleInputChange}
-                  accept='.pdf,.png,.jpg,.jpeg'
-                />
+                <div className='flex flex-col items-start'>
+                  <label
+                    htmlFor='dokumenTempatBekerja'
+                    className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                  >
+                    Upload Dokumen
+                  </label>
+                  <input
+                    // value={formDokumen.dokumenTempatBekerja}
+                    id='dokumenTempatBekerja'
+                    name='dokumenTempatBekerja'
+                    type='file'
+                    ref={dokumenTempatBekerjaRef}
+                    className='hidden'
+                    aria-invalid={errorsDokumen.dokumenTempatBekerja}
+                    onChange={handleInputChange}
+                    accept='.pdf,.png,.jpg,.jpeg'
+                  />
+                  <span className='mt-2 text-gray-600'>
+                    {formDokumen?.dokumenTempatBekerja?.name}
+                  </span>
+                </div>
+
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
                     {errorsDokumen.dokumenTempatBekerja}
@@ -410,7 +515,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick }) => {
               {parseInt((getJumlahDokumenDiisi() / 9) * 100)} %
             </span>
             <span className='ml-2 opacity-60'>
-              {getJumlahDokumenDiisi() > 5
+              {getJumlahDokumenDiisi() >= 4
                 ? getJumlahDokumenDiisi() == 9
                   ? 'Selesai'
                   : 'Sedikit Lagi'
-- 
cgit v1.2.3


From c19c7eee924b70d25cb47d40fd7c8e00d5efa867 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Wed, 23 Oct 2024 17:07:37 +0700
Subject: <iman> update pengajuan tempo section konfirmasi

---
 src/lib/pengajuan-tempo/component/Dokumen.jsx | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

(limited to 'src/lib/pengajuan-tempo/component/Dokumen.jsx')

diff --git a/src/lib/pengajuan-tempo/component/Dokumen.jsx b/src/lib/pengajuan-tempo/component/Dokumen.jsx
index 42c6c47f..bb88f80b 100644
--- a/src/lib/pengajuan-tempo/component/Dokumen.jsx
+++ b/src/lib/pengajuan-tempo/component/Dokumen.jsx
@@ -5,7 +5,7 @@ import ProgressBar from '@ramonak/react-progress-bar';
 import { UseToastOptions } from '@chakra-ui/react';
 import { toast } from 'react-hot-toast';
 import getFileBase64 from '@/core/utils/getFileBase64';
-const Dokumen = ({ chekValid, buttonSubmitClick }) => {
+const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   const { control, watch } = useForm();
   const {
     formDokumen,
@@ -135,9 +135,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick }) => {
   }, [buttonSubmitClick]);
   return (
     <>
-      <div className='flex justify-start'>
-        <h1 className='font-bold'>Dokumen</h1>
-      </div>
+      <h1 className={`font-bold ${isKonfirmasi ? 'text-xl' : ''}`}>Dokumen</h1>
       <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 '>
-- 
cgit v1.2.3


From f751fa6d398a8aab96380c832da927c60c6ccbe4 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 4 Nov 2024 16:10:09 +0700
Subject: <iman> update pengajuan tempo mobile view fix

---
 src/lib/pengajuan-tempo/component/Dokumen.jsx | 734 ++++++++++++++++++++------
 1 file changed, 571 insertions(+), 163 deletions(-)

(limited to 'src/lib/pengajuan-tempo/component/Dokumen.jsx')

diff --git a/src/lib/pengajuan-tempo/component/Dokumen.jsx b/src/lib/pengajuan-tempo/component/Dokumen.jsx
index bb88f80b..0873df66 100644
--- a/src/lib/pengajuan-tempo/component/Dokumen.jsx
+++ b/src/lib/pengajuan-tempo/component/Dokumen.jsx
@@ -5,6 +5,7 @@ import ProgressBar from '@ramonak/react-progress-bar';
 import { UseToastOptions } from '@chakra-ui/react';
 import { toast } from 'react-hot-toast';
 import getFileBase64 from '@/core/utils/getFileBase64';
+import useDevice from '@/core/hooks/useDevice';
 const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   const { control, watch } = useForm();
   const {
@@ -14,7 +15,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
     updateFormDokumen,
     getJumlahDokumenDiisi,
   } = usePengajuanTempoStoreDokumen();
-
+  const { isDesktop, isMobile } = useDevice();
   // const handleInputChange = (event) => {
   //   const { name, value } = event.target;
   //   updateFormDokumen(name, value);
@@ -135,26 +136,440 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   }, [buttonSubmitClick]);
   return (
     <>
-      <h1 className={`font-bold ${isKonfirmasi ? 'text-xl' : ''}`}>Dokumen</h1>
-      <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'>
-              <div>
+      {isDesktop && (
+        <div>
+          <h1 className={`font-bold ${isKonfirmasi ? 'text-xl' : ''}`}>
+            Dokumen
+          </h1>
+          <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'>
+                  <div>
+                    <label className='form-label  text-nowrap'>
+                      NIB (SIUP/TDP/SKDP)
+                    </label>
+                    <span className='text-xs opacity-60'>
+                      Pastikan dokumen yang anda upload sudah benar
+                    </span>
+                  </div>
+                  <div className=''>
+                    <div className='flex flex-col items-start'>
+                      <label
+                        htmlFor='dokumenNib'
+                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                      >
+                        Upload Dokumen
+                      </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'
+                      />
+                      <span className='mt-2 text-gray-600'>
+                        {formDokumen?.dokumenNib?.name}
+                      </span>
+                    </div>
+                    {chekValid && (
+                      <div className='text-caption-2 text-danger-500 mt-1'>
+                        {errorsDokumen.dokumenNib}
+                      </div>
+                    )}
+                  </div>
+                </div>
+                <div className='w-full grid grid-cols-2 gap-5'>
+                  <div>
+                    <label className='form-label  text-nowrap'>
+                      NPWP Perusahaan
+                    </label>
+                    <span className='text-xs opacity-60'>
+                      Pastikan dokumen yang anda upload sudah benar
+                    </span>
+                  </div>
+                  <div className=''>
+                    <div className='flex flex-col items-start'>
+                      <label
+                        htmlFor='dokumenNpwp'
+                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                      >
+                        Upload Dokumen
+                      </label>
+                      <input
+                        // value={formDokumen.dokumenNpwp}
+                        id='dokumenNpwp'
+                        name='dokumenNpwp'
+                        type='file'
+                        ref={dokumenNpwpRef}
+                        title=' '
+                        className='hidden'
+                        aria-invalid={errorsDokumen.dokumenNpwp}
+                        onChange={handleInputChange}
+                        accept='.pdf,.png,.jpg,.jpeg'
+                      />
+                      <span className='mt-2 text-gray-600'>
+                        {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'>
+                  <div>
+                    <label className='form-label  text-nowrap'>SPPKP</label>
+                    <span className='text-xs opacity-60'>
+                      Pastikan dokumen yang anda upload sudah benar
+                    </span>
+                  </div>
+                  <div className=''>
+                    <div className='flex flex-col items-start'>
+                      <label
+                        htmlFor='dokumenSppkp'
+                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                      >
+                        Upload Dokumen
+                      </label>
+                      <input
+                        // value={formDokumen.dokumenSppkp}
+                        id='dokumenSppkp'
+                        name='dokumenSppkp'
+                        type='file'
+                        ref={dokumenSppkpRef}
+                        className='hidden'
+                        aria-invalid={errorsDokumen.dokumenSppkp}
+                        onChange={handleInputChange}
+                        accept='.pdf,.png,.jpg,.jpeg'
+                      />
+                      <span className='mt-2 text-gray-600'>
+                        {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'>
+                  <div>
+                    <label className='form-label  text-nowrap'>
+                      Akta Perubahan{' '}
+                      <span className=' opacity-60'>(Opsional)</span>
+                    </label>
+                    <span className='text-xs opacity-60'>
+                      Pastikan dokumen yang anda upload sudah benar
+                    </span>
+                  </div>
+                  <div className=''>
+                    <div className='flex flex-col items-start'>
+                      <label
+                        htmlFor='dokumenAktaPerubahan'
+                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                      >
+                        Upload Dokumen
+                      </label>
+                      <input
+                        // value={formDokumen.dokumenAktaPerubahan}
+                        id='dokumenAktaPerubahan'
+                        name='dokumenAktaPerubahan'
+                        type='file'
+                        ref={dokumenAktaPerubahanRef}
+                        className='hidden'
+                        aria-invalid={errorsDokumen.dokumenAktaPerubahan}
+                        onChange={handleInputChange}
+                        accept='.pdf,.png,.jpg,.jpeg'
+                      />
+                      <span className='mt-2 text-gray-600'>
+                        {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'>
+                  <div>
+                    <label className='form-label  text-nowrap'>
+                      KTP Dirut/Direktur{' '}
+                      <span className=' opacity-60'>(Opsional)</span>
+                    </label>
+                    <span className='text-xs opacity-60'>
+                      Pastikan dokumen yang anda upload sudah benar
+                    </span>
+                  </div>
+                  <div className=''>
+                    <div className='flex flex-col items-start'>
+                      <label
+                        htmlFor='dokumenKtpDirut'
+                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                      >
+                        Upload Dokumen
+                      </label>
+                      <input
+                        // value={formDokumen.dokumenKtpDirut}
+                        id='dokumenKtpDirut'
+                        name='dokumenKtpDirut'
+                        type='file'
+                        ref={dokumenKtpDirutRef}
+                        className='hidden'
+                        aria-invalid={errorsDokumen.dokumenKtpDirut}
+                        onChange={handleInputChange}
+                        accept='.pdf,.png,.jpg,.jpeg'
+                      />
+                      <span className='mt-2 text-gray-600'>
+                        {formDokumen?.dokumenKtpDirut?.name}
+                      </span>
+                    </div>
+
+                    {chekValid && (
+                      <div className='text-caption-2 text-danger-500 mt-1'>
+                        {errorsDokumen.dokumenKtpDirut}
+                      </div>
+                    )}
+                  </div>
+                </div>
+              </div>
+              <div className='w-px bg-gray-300'></div>
+              <div className='kolom kanan w-full grid grid-rows-2 gap-10 '>
+                <div className='w-full grid grid-cols-2 gap-5'>
+                  <div>
+                    <label className='form-label  text-nowrap'>
+                      Akta Pendirian{' '}
+                      <span className=' opacity-60'>(Opsional)</span>
+                    </label>
+                    <span className='text-xs opacity-60'>
+                      Pastikan dokumen yang anda upload sudah benar
+                    </span>
+                  </div>
+                  <div className=''>
+                    <div className='flex flex-col items-start'>
+                      <label
+                        htmlFor='dokumenAktaPendirian'
+                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                      >
+                        Upload Dokumen
+                      </label>
+                      <input
+                        // value={formDokumen.dokumenAktaPendirian}
+                        id='dokumenAktaPendirian'
+                        name='dokumenAktaPendirian'
+                        type='file'
+                        ref={dokumenAktaPendirianRef}
+                        className='hidden'
+                        aria-invalid={errorsDokumen.dokumenAktaPendirian}
+                        onChange={handleInputChange}
+                        accept='.pdf,.png,.jpg,.jpeg'
+                      />
+                      <span className='mt-2 text-gray-600'>
+                        {formDokumen?.dokumenAktaPendirian?.name}
+                      </span>
+                    </div>
+
+                    {chekValid && (
+                      <div className='text-caption-2 text-danger-500 mt-1'>
+                        {errorsDokumen.dokumenAktaPendirian}
+                      </div>
+                    )}
+                  </div>
+                </div>
+                <div className='w-full grid grid-cols-2 gap-5'>
+                  <div>
+                    <label className='form-label  text-nowrap'>
+                      Laporan Keuangan
+                      <span className=' opacity-60'>(Opsional)</span>
+                    </label>
+                    <span className='text-xs opacity-60'>
+                      Pastikan dokumen yang anda upload sudah benar
+                    </span>
+                  </div>
+                  <div className=''>
+                    <div className='flex flex-col items-start'>
+                      <label
+                        htmlFor='dokumenLaporanKeuangan'
+                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                      >
+                        Upload Dokumen
+                      </label>
+                      <input
+                        // value={formDokumen.dokumenLaporanKeuangan}
+                        id='dokumenLaporanKeuangan'
+                        name='dokumenLaporanKeuangan'
+                        type='file'
+                        ref={dokumenLaporanKeuanganRef}
+                        className='hidden'
+                        aria-invalid={errorsDokumen.dokumenLaporanKeuangan}
+                        onChange={handleInputChange}
+                        accept='.pdf,.png,.jpg,.jpeg'
+                      />
+                      <span className='mt-2 text-gray-600'>
+                        {formDokumen?.dokumenLaporanKeuangan?.name}
+                      </span>
+                    </div>
+
+                    {chekValid && (
+                      <div className='text-caption-2 text-danger-500 mt-1'>
+                        {errorsDokumen.dokumenLaporanKeuangan}
+                      </div>
+                    )}
+                  </div>
+                </div>
+                <div className='w-full grid grid-cols-2 gap-5'>
+                  <div>
+                    <label className='form-label  text-nowrap'>
+                      Foto Kantor (Tampak Depan)
+                    </label>
+                    <span className='text-xs opacity-60'>
+                      Pastikan dokumen yang anda upload sudah benar
+                    </span>
+                  </div>
+                  <div className=''>
+                    <div className='flex flex-col items-start'>
+                      <label
+                        htmlFor='dokumenFotoKantor'
+                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                      >
+                        Upload Dokumen
+                      </label>
+                      <input
+                        // value={formDokumen.dokumenFotoKantor}
+                        id='dokumenFotoKantor'
+                        name='dokumenFotoKantor'
+                        type='file'
+                        ref={dokumenFotoKantorRef}
+                        className='hidden'
+                        aria-invalid={errorsDokumen.dokumenFotoKantor}
+                        onChange={handleInputChange}
+                        accept='.pdf,.png,.jpg,.jpeg'
+                      />
+                      <span className='mt-2 text-gray-600'>
+                        {formDokumen?.dokumenFotoKantor?.name}
+                      </span>
+                    </div>
+
+                    {chekValid && (
+                      <div className='text-caption-2 text-danger-500 mt-1'>
+                        {errorsDokumen.dokumenFotoKantor}
+                      </div>
+                    )}
+                  </div>
+                </div>
+                <div className='w-full grid grid-cols-2 gap-5'>
+                  <div>
+                    <label className='form-label  text-nowrap'>
+                      Tempat Bekerja
+                    </label>
+                    <span className='text-xs opacity-60'>
+                      Pastikan dokumen yang anda upload sudah benar
+                    </span>
+                  </div>
+                  <div className=''>
+                    <div className='flex flex-col items-start'>
+                      <label
+                        htmlFor='dokumenTempatBekerja'
+                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                      >
+                        Upload Dokumen
+                      </label>
+                      <input
+                        // value={formDokumen.dokumenTempatBekerja}
+                        id='dokumenTempatBekerja'
+                        name='dokumenTempatBekerja'
+                        type='file'
+                        ref={dokumenTempatBekerjaRef}
+                        className='hidden'
+                        aria-invalid={errorsDokumen.dokumenTempatBekerja}
+                        onChange={handleInputChange}
+                        accept='.pdf,.png,.jpg,.jpeg'
+                      />
+                      <span className='mt-2 text-gray-600'>
+                        {formDokumen?.dokumenTempatBekerja?.name}
+                      </span>
+                    </div>
+
+                    {chekValid && (
+                      <div className='text-caption-2 text-danger-500 mt-1'>
+                        {errorsDokumen.dokumenTempatBekerja}
+                      </div>
+                    )}
+                  </div>
+                </div>
+                <div></div>
+              </div>
+            </div>
+          </form>
+          <div className='w-1/2 mt-8 flex gap-3 flex-col'>
+            <div className='flex justify-between'>
+              <p className='font-bold'>Upload Progress</p>
+              <p>
+                <span className='text-red-500 font-bold'>
+                  {parseInt((getJumlahDokumenDiisi() / 9) * 100)} %
+                </span>
+                <span className='ml-2 opacity-60'>
+                  {getJumlahDokumenDiisi() >= 4
+                    ? getJumlahDokumenDiisi() == 9
+                      ? 'Selesai'
+                      : 'Sedikit Lagi'
+                    : ''}
+                </span>
+              </p>
+            </div>
+            {/* 50 keatas baru muncul kata kata sedikit lagi */}
+            <ProgressBar
+              completed={getJumlahDokumenDiisi()}
+              bgColor='#ef4444'
+              labelAlignment='outside'
+              isLabelVisible={false}
+              baseBgColor='#E5E7EB'
+              labelColor='#e80909'
+              labelSize='0'
+              maxCompleted={9}
+              height='14  px'
+            />
+            <span className='opacity-75'>
+              Tingkatin sedikit lagi agar pengajuan tempo kamu dapat kami proses
+              dengan cepat
+            </span>
+          </div>
+        </div>
+      )}
+      {isMobile && (
+        <div>
+          <h1
+            className={`font-bold py-4 mt-8 ${
+              isKonfirmasi ? 'text-xl' : 'text-xl'
+            }`}
+          >
+            Dokumen
+          </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'>
                 <label className='form-label  text-nowrap'>
                   NIB (SIUP/TDP/SKDP)
                 </label>
-                <span className='text-xs opacity-60'>
-                  Pastikan dokumen yang anda upload sudah benar
-                </span>
-              </div>
-              <div className=''>
-                <div className='flex flex-col items-start'>
+                <div className='flex flex-row gap-2'>
                   <label
                     htmlFor='dokumenNib'
-                    className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                    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'
                   >
-                    Upload Dokumen
+                    {formDokumen?.dokumenNib?.name
+                      ? 'Sudah Upload'
+                      : 'Upload Dokumen'}
                   </label>
                   <input
                     // value={formDokumen?.dokumenNib?.name}
@@ -168,33 +583,32 @@ 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 truncate'>
                     {formDokumen?.dokumenNib?.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.dokumenNib}
                   </div>
                 )}
               </div>
-            </div>
-            <div className='w-full grid grid-cols-2 gap-5'>
-              <div>
+
+              <div className='w-full flex flex-col gap-2'>
                 <label className='form-label  text-nowrap'>
                   NPWP Perusahaan
                 </label>
-                <span className='text-xs opacity-60'>
-                  Pastikan dokumen yang anda upload sudah benar
-                </span>
-              </div>
-              <div className=''>
-                <div className='flex flex-col items-start'>
+                <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'
+                    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'
                   >
-                    Upload Dokumen
+                    {formDokumen?.dokumenNpwp?.name
+                      ? 'Sudah Upload'
+                      : 'Upload Dokumen'}
                   </label>
                   <input
                     // value={formDokumen.dokumenNpwp}
@@ -208,292 +622,286 @@ 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 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>
-            <div className='w-full grid grid-cols-2 gap-5'>
-              <div>
+
+              <div className='w-full flex flex-col gap-2'>
                 <label className='form-label  text-nowrap'>SPPKP</label>
-                <span className='text-xs opacity-60'>
-                  Pastikan dokumen yang anda upload sudah benar
-                </span>
-              </div>
-              <div className=''>
-                <div className='flex flex-col items-start'>
+                <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'
+                    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'
                   >
-                    Upload Dokumen
+                    {formDokumen?.dokumenSppkp?.name
+                      ? 'Sudah Upload'
+                      : 'Upload Dokumen'}
                   </label>
                   <input
-                    // value={formDokumen.dokumenSppkp}
+                    // value={formDokumen.dokumenNpwp}
                     id='dokumenSppkp'
                     name='dokumenSppkp'
                     type='file'
                     ref={dokumenSppkpRef}
+                    title=' '
                     className='hidden'
                     aria-invalid={errorsDokumen.dokumenSppkp}
                     onChange={handleInputChange}
                     accept='.pdf,.png,.jpg,.jpeg'
                   />
-                  <span className='mt-2 text-gray-600'>
+                  <span className='mt-2 text-gray-600 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>
-            <div className='w-full grid grid-cols-2 gap-5'>
-              <div>
+
+              <div className='w-full flex flex-col gap-2'>
                 <label className='form-label  text-nowrap'>
                   Akta Perubahan <span className=' opacity-60'>(Opsional)</span>
                 </label>
-                <span className='text-xs opacity-60'>
-                  Pastikan dokumen yang anda upload sudah benar
-                </span>
-              </div>
-              <div className=''>
-                <div className='flex flex-col items-start'>
+                <div className='flex flex-row gap-2'>
                   <label
                     htmlFor='dokumenAktaPerubahan'
-                    className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                    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'
                   >
-                    Upload Dokumen
+                    {formDokumen?.dokumenAktaPerubahan?.name
+                      ? 'Sudah Upload'
+                      : 'Upload Dokumen'}
                   </label>
                   <input
-                    // value={formDokumen.dokumenAktaPerubahan}
+                    // value={formDokumen.dokumenNpwp}
                     id='dokumenAktaPerubahan'
                     name='dokumenAktaPerubahan'
                     type='file'
                     ref={dokumenAktaPerubahanRef}
+                    title=' '
                     className='hidden'
                     aria-invalid={errorsDokumen.dokumenAktaPerubahan}
                     onChange={handleInputChange}
                     accept='.pdf,.png,.jpg,.jpeg'
                   />
-                  <span className='mt-2 text-gray-600'>
+                  <span className='mt-2 text-gray-600 truncate'>
                     {formDokumen?.dokumenAktaPerubahan?.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.dokumenAktaPerubahan}
                   </div>
                 )}
               </div>
-            </div>
-            <div className='w-full grid grid-cols-2 gap-5'>
-              <div>
+
+              <div className='w-full flex flex-col gap-2'>
                 <label className='form-label  text-nowrap'>
                   KTP Dirut/Direktur{' '}
                   <span className=' opacity-60'>(Opsional)</span>
                 </label>
-                <span className='text-xs opacity-60'>
-                  Pastikan dokumen yang anda upload sudah benar
-                </span>
-              </div>
-              <div className=''>
-                <div className='flex flex-col items-start'>
+                <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'
+                    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'
                   >
-                    Upload Dokumen
+                    {formDokumen?.dokumenKtpDirut?.name
+                      ? 'Sudah Upload'
+                      : 'Upload Dokumen'}
                   </label>
                   <input
-                    // value={formDokumen.dokumenKtpDirut}
+                    // value={formDokumen.dokumenNpwp}
                     id='dokumenKtpDirut'
                     name='dokumenKtpDirut'
                     type='file'
                     ref={dokumenKtpDirutRef}
+                    title=' '
                     className='hidden'
                     aria-invalid={errorsDokumen.dokumenKtpDirut}
                     onChange={handleInputChange}
                     accept='.pdf,.png,.jpg,.jpeg'
                   />
-                  <span className='mt-2 text-gray-600'>
+                  <span className='mt-2 text-gray-600 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>
-          </div>
-          <div className='w-px bg-gray-300'></div>
-          <div className='kolom kanan w-full grid grid-rows-2 gap-10 '>
-            <div className='w-full grid grid-cols-2 gap-5'>
-              <div>
+
+              <div className='w-full flex flex-col gap-2'>
                 <label className='form-label  text-nowrap'>
                   Akta Pendirian <span className=' opacity-60'>(Opsional)</span>
                 </label>
-                <span className='text-xs opacity-60'>
-                  Pastikan dokumen yang anda upload sudah benar
-                </span>
-              </div>
-              <div className=''>
-                <div className='flex flex-col items-start'>
+                <div className='flex flex-row gap-2'>
                   <label
                     htmlFor='dokumenAktaPendirian'
-                    className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                    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'
                   >
-                    Upload Dokumen
+                    {formDokumen?.dokumenAktaPendirian?.name
+                      ? 'Sudah Upload'
+                      : 'Upload Dokumen'}
                   </label>
                   <input
-                    // value={formDokumen.dokumenAktaPendirian}
+                    // value={formDokumen.dokumenNpwp}
                     id='dokumenAktaPendirian'
                     name='dokumenAktaPendirian'
                     type='file'
                     ref={dokumenAktaPendirianRef}
+                    title=' '
                     className='hidden'
                     aria-invalid={errorsDokumen.dokumenAktaPendirian}
                     onChange={handleInputChange}
                     accept='.pdf,.png,.jpg,.jpeg'
                   />
-                  <span className='mt-2 text-gray-600'>
+                  <span className='mt-2 text-gray-600 truncate'>
                     {formDokumen?.dokumenAktaPendirian?.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.dokumenAktaPendirian}
                   </div>
                 )}
               </div>
-            </div>
-            <div className='w-full grid grid-cols-2 gap-5'>
-              <div>
+
+              <div className='w-full flex flex-col gap-2'>
                 <label className='form-label  text-nowrap'>
-                  Laporan Keuangan
+                  Laporan Keuangan{' '}
                   <span className=' opacity-60'>(Opsional)</span>
                 </label>
-                <span className='text-xs opacity-60'>
-                  Pastikan dokumen yang anda upload sudah benar
-                </span>
-              </div>
-              <div className=''>
-                <div className='flex flex-col items-start'>
+                <div className='flex flex-row gap-2'>
                   <label
                     htmlFor='dokumenLaporanKeuangan'
-                    className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                    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'
                   >
-                    Upload Dokumen
+                    {formDokumen?.dokumenLaporanKeuangan?.name
+                      ? 'Sudah Upload'
+                      : 'Upload Dokumen'}
                   </label>
                   <input
-                    // value={formDokumen.dokumenLaporanKeuangan}
+                    // value={formDokumen.dokumenNpwp}
                     id='dokumenLaporanKeuangan'
                     name='dokumenLaporanKeuangan'
                     type='file'
                     ref={dokumenLaporanKeuanganRef}
+                    title=' '
                     className='hidden'
                     aria-invalid={errorsDokumen.dokumenLaporanKeuangan}
                     onChange={handleInputChange}
                     accept='.pdf,.png,.jpg,.jpeg'
                   />
-                  <span className='mt-2 text-gray-600'>
+                  <span className='mt-2 text-gray-600 truncate'>
                     {formDokumen?.dokumenLaporanKeuangan?.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.dokumenLaporanKeuangan}
                   </div>
                 )}
               </div>
-            </div>
-            <div className='w-full grid grid-cols-2 gap-5'>
-              <div>
+
+              <div className='w-full flex flex-col gap-2'>
                 <label className='form-label  text-nowrap'>
                   Foto Kantor (Tampak Depan)
                 </label>
-                <span className='text-xs opacity-60'>
-                  Pastikan dokumen yang anda upload sudah benar
-                </span>
-              </div>
-              <div className=''>
-                <div className='flex flex-col items-start'>
+                <div className='flex flex-row gap-2'>
                   <label
                     htmlFor='dokumenFotoKantor'
-                    className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                    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'
                   >
-                    Upload Dokumen
+                    {formDokumen?.dokumenFotoKantor?.name
+                      ? 'Sudah Upload'
+                      : 'Upload Dokumen'}
                   </label>
                   <input
-                    // value={formDokumen.dokumenFotoKantor}
+                    // value={formDokumen.dokumenNpwp}
                     id='dokumenFotoKantor'
                     name='dokumenFotoKantor'
                     type='file'
                     ref={dokumenFotoKantorRef}
+                    title=' '
                     className='hidden'
                     aria-invalid={errorsDokumen.dokumenFotoKantor}
                     onChange={handleInputChange}
                     accept='.pdf,.png,.jpg,.jpeg'
                   />
-                  <span className='mt-2 text-gray-600'>
+                  <span className='mt-2 text-gray-600 truncate'>
                     {formDokumen?.dokumenFotoKantor?.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.dokumenFotoKantor}
                   </div>
                 )}
               </div>
-            </div>
-            <div className='w-full grid grid-cols-2 gap-5'>
-              <div>
+
+              <div className='w-full flex flex-col gap-2'>
                 <label className='form-label  text-nowrap'>
                   Tempat Bekerja
                 </label>
-                <span className='text-xs opacity-60'>
-                  Pastikan dokumen yang anda upload sudah benar
-                </span>
-              </div>
-              <div className=''>
-                <div className='flex flex-col items-start'>
+                <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'
+                    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'
                   >
-                    Upload Dokumen
+                    {formDokumen?.dokumenTempatBekerja?.name
+                      ? 'Sudah Upload'
+                      : 'Upload Dokumen'}
                   </label>
                   <input
-                    // value={formDokumen.dokumenTempatBekerja}
+                    // value={formDokumen.dokumenNpwp}
                     id='dokumenTempatBekerja'
                     name='dokumenTempatBekerja'
                     type='file'
                     ref={dokumenTempatBekerjaRef}
+                    title=' '
                     className='hidden'
                     aria-invalid={errorsDokumen.dokumenTempatBekerja}
                     onChange={handleInputChange}
                     accept='.pdf,.png,.jpg,.jpeg'
                   />
-                  <span className='mt-2 text-gray-600'>
+                  <span className='mt-2 text-gray-600 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}
@@ -501,42 +909,42 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 )}
               </div>
             </div>
-            <div></div>
-          </div>
-        </div>
-      </form>
-      <div className='w-1/2 mt-8 flex gap-3 flex-col'>
-        <div className='flex justify-between'>
-          <p className='font-bold'>Upload Progress</p>
-          <p>
-            <span className='text-red-500 font-bold'>
-              {parseInt((getJumlahDokumenDiisi() / 9) * 100)} %
-            </span>
-            <span className='ml-2 opacity-60'>
-              {getJumlahDokumenDiisi() >= 4
-                ? getJumlahDokumenDiisi() == 9
-                  ? 'Selesai'
-                  : 'Sedikit Lagi'
-                : ''}
+          </form>
+          <div className='w-full mt-8 flex gap-3 flex-col'>
+            <div className='flex justify-between'>
+              <p className='font-bold'>Upload Progress</p>
+              <p>
+                <span className='text-red-500 font-bold'>
+                  {parseInt((getJumlahDokumenDiisi() / 9) * 100)} %
+                </span>
+                <span className='ml-2 opacity-60'>
+                  {getJumlahDokumenDiisi() >= 4
+                    ? getJumlahDokumenDiisi() == 9
+                      ? 'Selesai'
+                      : 'Sedikit Lagi'
+                    : ''}
+                </span>
+              </p>
+            </div>
+            {/* 50 keatas baru muncul kata kata sedikit lagi */}
+            <ProgressBar
+              completed={getJumlahDokumenDiisi()}
+              bgColor='#ef4444'
+              labelAlignment='outside'
+              isLabelVisible={false}
+              baseBgColor='#E5E7EB'
+              labelColor='#e80909'
+              labelSize='0'
+              maxCompleted={9}
+              height='10px'
+            />
+            <span className='opacity-75 text-xs text-red-500'>
+              Tingkatin sedikit lagi agar pengajuan tempo kamu dapat kami proses
+              dengan cepat
             </span>
-          </p>
+          </div>
         </div>
-        {/* 50 keatas baru muncul kata kata sedikit lagi */}
-        <ProgressBar
-          completed={getJumlahDokumenDiisi()}
-          bgColor='#ef4444'
-          labelAlignment='outside'
-          isLabelVisible={false}
-          baseBgColor='#E5E7EB'
-          labelColor='#e80909'
-          labelSize='0'
-          maxCompleted={9}
-        />
-        <span className='opacity-75'>
-          Tingkatin sedikit lagi agar pengajuan tempo kamu dapat kami proses
-          dengan cepat
-        </span>
-      </div>
+      )}
     </>
   );
 };
-- 
cgit v1.2.3


From 6bbf1dbd94355f34f58f4b72f134f3dbeac776aa Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Sat, 23 Nov 2024 11:55:59 +0700
Subject: <iman> update tempo

---
 src/lib/pengajuan-tempo/component/Dokumen.jsx | 110 +++++++++++++++++---------
 1 file changed, 71 insertions(+), 39 deletions(-)

(limited to 'src/lib/pengajuan-tempo/component/Dokumen.jsx')

diff --git a/src/lib/pengajuan-tempo/component/Dokumen.jsx b/src/lib/pengajuan-tempo/component/Dokumen.jsx
index 0873df66..8391de4a 100644
--- a/src/lib/pengajuan-tempo/component/Dokumen.jsx
+++ b/src/lib/pengajuan-tempo/component/Dokumen.jsx
@@ -43,8 +43,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
       }
 
       // Check for file size
-      if (file.size > 2000000) {
-        toast.error('Maksimal ukuran file adalah 2MB', { duration: 4000 });
+      if (file.size > 500000) {
+        toast.error('Maksimal ukuran file adalah 500Kb', { duration: 4000 });
 
         event.target.value = '';
         return;
@@ -72,6 +72,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   const dokumenTempatBekerjaRef = useRef(null);
 
   useEffect(() => {
+    // window.scrollTo({
+    //   top: 0,
+    //   behavior: 'smooth',
+    // });
     const loadIndustries = async () => {
       if (!isFormValid) {
         const options = {
@@ -79,6 +83,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
           block: 'center',
         };
         if (errorsDokumen.dokumenNib && dokumenNibRef.current) {
+          console.log('errorsDokumen', errorsDokumen);
           dokumenNibRef.current.scrollIntoView(options);
           return;
         }
@@ -144,7 +149,10 @@ 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'>
+                <div
+                  className='w-full grid grid-cols-2 gap-5'
+                  ref={dokumenNibRef}
+                >
                   <div>
                     <label className='form-label  text-nowrap'>
                       NIB (SIUP/TDP/SKDP)
@@ -167,7 +175,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                         name='dokumenNib'
                         type='file'
                         title=' '
-                        ref={dokumenNibRef}
                         className='hidden'
                         aria-invalid={errorsDokumen.dokumenNib}
                         onChange={handleInputChange}
@@ -184,7 +191,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     )}
                   </div>
                 </div>
-                <div className='w-full grid grid-cols-2 gap-5'>
+                <div
+                  className='w-full grid grid-cols-2 gap-5'
+                  ref={dokumenNpwpRef}
+                >
                   <div>
                     <label className='form-label  text-nowrap'>
                       NPWP Perusahaan
@@ -206,7 +216,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                         id='dokumenNpwp'
                         name='dokumenNpwp'
                         type='file'
-                        ref={dokumenNpwpRef}
                         title=' '
                         className='hidden'
                         aria-invalid={errorsDokumen.dokumenNpwp}
@@ -224,7 +233,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     )}
                   </div>
                 </div>
-                <div className='w-full grid grid-cols-2 gap-5'>
+                <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'>
@@ -244,7 +256,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                         id='dokumenSppkp'
                         name='dokumenSppkp'
                         type='file'
-                        ref={dokumenSppkpRef}
                         className='hidden'
                         aria-invalid={errorsDokumen.dokumenSppkp}
                         onChange={handleInputChange}
@@ -262,7 +273,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     )}
                   </div>
                 </div>
-                <div className='w-full grid grid-cols-2 gap-5'>
+                <div
+                  className='w-full grid grid-cols-2 gap-5'
+                  ref={dokumenAktaPerubahanRef}
+                >
                   <div>
                     <label className='form-label  text-nowrap'>
                       Akta Perubahan{' '}
@@ -285,7 +299,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                         id='dokumenAktaPerubahan'
                         name='dokumenAktaPerubahan'
                         type='file'
-                        ref={dokumenAktaPerubahanRef}
                         className='hidden'
                         aria-invalid={errorsDokumen.dokumenAktaPerubahan}
                         onChange={handleInputChange}
@@ -302,7 +315,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     )}
                   </div>
                 </div>
-                <div className='w-full grid grid-cols-2 gap-5'>
+                <div
+                  className='w-full grid grid-cols-2 gap-5'
+                  ref={dokumenKtpDirutRef}
+                >
                   <div>
                     <label className='form-label  text-nowrap'>
                       KTP Dirut/Direktur{' '}
@@ -325,7 +341,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                         id='dokumenKtpDirut'
                         name='dokumenKtpDirut'
                         type='file'
-                        ref={dokumenKtpDirutRef}
                         className='hidden'
                         aria-invalid={errorsDokumen.dokumenKtpDirut}
                         onChange={handleInputChange}
@@ -345,7 +360,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 </div>
               </div>
               <div className='w-px bg-gray-300'></div>
-              <div className='kolom kanan w-full grid grid-rows-2 gap-10 '>
+              <div
+                className='kolom kanan w-full grid grid-rows-2 gap-10 '
+                ref={dokumenAktaPendirianRef}
+              >
                 <div className='w-full grid grid-cols-2 gap-5'>
                   <div>
                     <label className='form-label  text-nowrap'>
@@ -369,7 +387,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                         id='dokumenAktaPendirian'
                         name='dokumenAktaPendirian'
                         type='file'
-                        ref={dokumenAktaPendirianRef}
                         className='hidden'
                         aria-invalid={errorsDokumen.dokumenAktaPendirian}
                         onChange={handleInputChange}
@@ -387,7 +404,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     )}
                   </div>
                 </div>
-                <div className='w-full grid grid-cols-2 gap-5'>
+                <div
+                  className='w-full grid grid-cols-2 gap-5'
+                  ref={dokumenLaporanKeuanganRef}
+                >
                   <div>
                     <label className='form-label  text-nowrap'>
                       Laporan Keuangan
@@ -410,7 +430,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                         id='dokumenLaporanKeuangan'
                         name='dokumenLaporanKeuangan'
                         type='file'
-                        ref={dokumenLaporanKeuanganRef}
                         className='hidden'
                         aria-invalid={errorsDokumen.dokumenLaporanKeuangan}
                         onChange={handleInputChange}
@@ -428,7 +447,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     )}
                   </div>
                 </div>
-                <div className='w-full grid grid-cols-2 gap-5'>
+                <div
+                  className='w-full grid grid-cols-2 gap-5'
+                  ref={dokumenFotoKantorRef}
+                >
                   <div>
                     <label className='form-label  text-nowrap'>
                       Foto Kantor (Tampak Depan)
@@ -450,7 +472,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                         id='dokumenFotoKantor'
                         name='dokumenFotoKantor'
                         type='file'
-                        ref={dokumenFotoKantorRef}
                         className='hidden'
                         aria-invalid={errorsDokumen.dokumenFotoKantor}
                         onChange={handleInputChange}
@@ -468,7 +489,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     )}
                   </div>
                 </div>
-                <div className='w-full grid grid-cols-2 gap-5'>
+                <div
+                  className='w-full grid grid-cols-2 gap-5'
+                  ref={dokumenTempatBekerjaRef}
+                >
                   <div>
                     <label className='form-label  text-nowrap'>
                       Tempat Bekerja
@@ -490,7 +514,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                         id='dokumenTempatBekerja'
                         name='dokumenTempatBekerja'
                         type='file'
-                        ref={dokumenTempatBekerjaRef}
                         className='hidden'
                         aria-invalid={errorsDokumen.dokumenTempatBekerja}
                         onChange={handleInputChange}
@@ -538,7 +561,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               labelColor='#e80909'
               labelSize='0'
               maxCompleted={9}
-              height='14  px'
+              height='14px'
             />
             <span className='opacity-75'>
               Tingkatin sedikit lagi agar pengajuan tempo kamu dapat kami proses
@@ -558,7 +581,7 @@ 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'>
+              <div className='w-full flex flex-col gap-2' ref={dokumenNibRef}>
                 <label className='form-label  text-nowrap'>
                   NIB (SIUP/TDP/SKDP)
                 </label>
@@ -577,7 +600,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     name='dokumenNib'
                     type='file'
                     title=' '
-                    ref={dokumenNibRef}
                     className='hidden'
                     aria-invalid={errorsDokumen.dokumenNib}
                     onChange={handleInputChange}
@@ -597,7 +619,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 )}
               </div>
 
-              <div className='w-full flex flex-col gap-2'>
+              <div className='w-full flex flex-col gap-2' ref={dokumenNpwpRef}>
                 <label className='form-label  text-nowrap'>
                   NPWP Perusahaan
                 </label>
@@ -615,7 +637,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     id='dokumenNpwp'
                     name='dokumenNpwp'
                     type='file'
-                    ref={dokumenNpwpRef}
                     title=' '
                     className='hidden'
                     aria-invalid={errorsDokumen.dokumenNpwp}
@@ -636,7 +657,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 )}
               </div>
 
-              <div className='w-full flex flex-col gap-2'>
+              <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
@@ -652,7 +673,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     id='dokumenSppkp'
                     name='dokumenSppkp'
                     type='file'
-                    ref={dokumenSppkpRef}
                     title=' '
                     className='hidden'
                     aria-invalid={errorsDokumen.dokumenSppkp}
@@ -673,7 +693,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 )}
               </div>
 
-              <div className='w-full flex flex-col gap-2'>
+              <div
+                className='w-full flex flex-col gap-2'
+                ref={dokumenAktaPerubahanRef}
+              >
                 <label className='form-label  text-nowrap'>
                   Akta Perubahan <span className=' opacity-60'>(Opsional)</span>
                 </label>
@@ -691,7 +714,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     id='dokumenAktaPerubahan'
                     name='dokumenAktaPerubahan'
                     type='file'
-                    ref={dokumenAktaPerubahanRef}
                     title=' '
                     className='hidden'
                     aria-invalid={errorsDokumen.dokumenAktaPerubahan}
@@ -712,7 +734,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 )}
               </div>
 
-              <div className='w-full flex flex-col gap-2'>
+              <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>
@@ -731,7 +756,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     id='dokumenKtpDirut'
                     name='dokumenKtpDirut'
                     type='file'
-                    ref={dokumenKtpDirutRef}
                     title=' '
                     className='hidden'
                     aria-invalid={errorsDokumen.dokumenKtpDirut}
@@ -752,7 +776,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 )}
               </div>
 
-              <div className='w-full flex flex-col gap-2'>
+              <div
+                className='w-full flex flex-col gap-2'
+                ref={dokumenAktaPendirianRef}
+              >
                 <label className='form-label  text-nowrap'>
                   Akta Pendirian <span className=' opacity-60'>(Opsional)</span>
                 </label>
@@ -770,7 +797,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     id='dokumenAktaPendirian'
                     name='dokumenAktaPendirian'
                     type='file'
-                    ref={dokumenAktaPendirianRef}
                     title=' '
                     className='hidden'
                     aria-invalid={errorsDokumen.dokumenAktaPendirian}
@@ -791,7 +817,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 )}
               </div>
 
-              <div className='w-full flex flex-col gap-2'>
+              <div
+                className='w-full flex flex-col gap-2'
+                ref={dokumenLaporanKeuanganRef}
+              >
                 <label className='form-label  text-nowrap'>
                   Laporan Keuangan{' '}
                   <span className=' opacity-60'>(Opsional)</span>
@@ -810,7 +839,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     id='dokumenLaporanKeuangan'
                     name='dokumenLaporanKeuangan'
                     type='file'
-                    ref={dokumenLaporanKeuanganRef}
                     title=' '
                     className='hidden'
                     aria-invalid={errorsDokumen.dokumenLaporanKeuangan}
@@ -831,7 +859,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 )}
               </div>
 
-              <div className='w-full flex flex-col gap-2'>
+              <div
+                className='w-full flex flex-col gap-2'
+                ref={dokumenFotoKantorRef}
+              >
                 <label className='form-label  text-nowrap'>
                   Foto Kantor (Tampak Depan)
                 </label>
@@ -849,7 +880,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     id='dokumenFotoKantor'
                     name='dokumenFotoKantor'
                     type='file'
-                    ref={dokumenFotoKantorRef}
                     title=' '
                     className='hidden'
                     aria-invalid={errorsDokumen.dokumenFotoKantor}
@@ -870,7 +900,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 )}
               </div>
 
-              <div className='w-full flex flex-col gap-2'>
+              <div
+                className='w-full flex flex-col gap-2'
+                ref={dokumenTempatBekerjaRef}
+              >
                 <label className='form-label  text-nowrap'>
                   Tempat Bekerja
                 </label>
@@ -888,7 +921,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     id='dokumenTempatBekerja'
                     name='dokumenTempatBekerja'
                     type='file'
-                    ref={dokumenTempatBekerjaRef}
                     title=' '
                     className='hidden'
                     aria-invalid={errorsDokumen.dokumenTempatBekerja}
-- 
cgit v1.2.3


From 9a49b8d84761781531cb417731cb9ef802f63541 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Wed, 4 Dec 2024 10:59:21 +0700
Subject: <iman> update pengajuan tempo

---
 src/lib/pengajuan-tempo/component/Dokumen.jsx | 70 +++++++++++++++++----------
 1 file changed, 44 insertions(+), 26 deletions(-)

(limited to 'src/lib/pengajuan-tempo/component/Dokumen.jsx')

diff --git a/src/lib/pengajuan-tempo/component/Dokumen.jsx b/src/lib/pengajuan-tempo/component/Dokumen.jsx
index 8391de4a..f05dc9ce 100644
--- a/src/lib/pengajuan-tempo/component/Dokumen.jsx
+++ b/src/lib/pengajuan-tempo/component/Dokumen.jsx
@@ -72,6 +72,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   const dokumenTempatBekerjaRef = useRef(null);
 
   useEffect(() => {
+    validateDokumen();
     // window.scrollTo({
     //   top: 0,
     //   behavior: 'smooth',
@@ -83,7 +84,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
           block: 'center',
         };
         if (errorsDokumen.dokumenNib && dokumenNibRef.current) {
-          console.log('errorsDokumen', errorsDokumen);
           dokumenNibRef.current.scrollIntoView(options);
           return;
         }
@@ -165,9 +165,11 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     <div className='flex flex-col items-start'>
                       <label
                         htmlFor='dokumenNib'
-                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded min-w-40 text-center'
                       >
-                        Upload Dokumen
+                        {formDokumen?.dokumenNib?.name
+                          ? 'Ubah Dokumen'
+                          : 'Upload Dokumen'}
                       </label>
                       <input
                         // value={formDokumen?.dokumenNib?.name}
@@ -207,9 +209,11 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     <div className='flex flex-col items-start'>
                       <label
                         htmlFor='dokumenNpwp'
-                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                        className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
                       >
-                        Upload Dokumen
+                        {formDokumen?.dokumenNpwp?.name
+                          ? 'Ubah Dokumen'
+                          : 'Upload Dokumen'}
                       </label>
                       <input
                         // value={formDokumen.dokumenNpwp}
@@ -247,9 +251,11 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     <div className='flex flex-col items-start'>
                       <label
                         htmlFor='dokumenSppkp'
-                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                        className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
                       >
-                        Upload Dokumen
+                        {formDokumen?.dokumenSppkp?.name.length > 0
+                          ? 'Ubah Dokumen'
+                          : 'Upload Dokumen'}
                       </label>
                       <input
                         // value={formDokumen.dokumenSppkp}
@@ -290,9 +296,11 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     <div className='flex flex-col items-start'>
                       <label
                         htmlFor='dokumenAktaPerubahan'
-                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                        className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
                       >
-                        Upload Dokumen
+                        {formDokumen?.dokumenAktaPerubahan?.name.length > 0
+                          ? 'Ubah Dokumen'
+                          : 'Upload Dokumen'}
                       </label>
                       <input
                         // value={formDokumen.dokumenAktaPerubahan}
@@ -332,9 +340,11 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     <div className='flex flex-col items-start'>
                       <label
                         htmlFor='dokumenKtpDirut'
-                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                        className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
                       >
-                        Upload Dokumen
+                        {formDokumen?.dokumenKtpDirut?.name
+                          ? 'Ubah Dokumen'
+                          : 'Upload Dokumen'}
                       </label>
                       <input
                         // value={formDokumen.dokumenKtpDirut}
@@ -378,9 +388,11 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     <div className='flex flex-col items-start'>
                       <label
                         htmlFor='dokumenAktaPendirian'
-                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                        className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
                       >
-                        Upload Dokumen
+                        {formDokumen?.dokumenAktaPendirian?.name
+                          ? 'Ubah Dokumen'
+                          : 'Upload Dokumen'}
                       </label>
                       <input
                         // value={formDokumen.dokumenAktaPendirian}
@@ -421,9 +433,11 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     <div className='flex flex-col items-start'>
                       <label
                         htmlFor='dokumenLaporanKeuangan'
-                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                        className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
                       >
-                        Upload Dokumen
+                        {formDokumen?.dokumenLaporanKeuangan?.name
+                          ? 'Ubah Dokumen'
+                          : 'Upload Dokumen'}
                       </label>
                       <input
                         // value={formDokumen.dokumenLaporanKeuangan}
@@ -463,9 +477,11 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     <div className='flex flex-col items-start'>
                       <label
                         htmlFor='dokumenFotoKantor'
-                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                        className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
                       >
-                        Upload Dokumen
+                        {formDokumen?.dokumenFotoKantor?.name
+                          ? 'Ubah Dokumen'
+                          : 'Upload Dokumen'}
                       </label>
                       <input
                         // value={formDokumen.dokumenFotoKantor}
@@ -505,9 +521,11 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     <div className='flex flex-col items-start'>
                       <label
                         htmlFor='dokumenTempatBekerja'
-                        className='cursor-pointer bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
+                        className='cursor-pointer min-w-40 text-center bg-gray-200 hover:bg-gray-300 text-gray-700 py-2 px-4 rounded'
                       >
-                        Upload Dokumen
+                        {formDokumen?.dokumenTempatBekerja?.name
+                          ? 'Ubah Dokumen'
+                          : 'Upload Dokumen'}
                       </label>
                       <input
                         // value={formDokumen.dokumenTempatBekerja}
@@ -588,7 +606,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 <div className='flex flex-row gap-2'>
                   <label
                     htmlFor='dokumenNib'
-                    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'
+                    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?.dokumenNib?.name
                       ? 'Sudah Upload'
@@ -626,7 +644,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 <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'
+                    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
                       ? 'Sudah Upload'
@@ -662,7 +680,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 <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'
+                    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
                       ? 'Sudah Upload'
@@ -703,7 +721,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 <div className='flex flex-row gap-2'>
                   <label
                     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'
+                    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
                       ? 'Sudah Upload'
@@ -745,7 +763,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 <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'
+                    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
                       ? 'Sudah Upload'
@@ -828,7 +846,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 <div className='flex flex-row gap-2'>
                   <label
                     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'
+                    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
                       ? 'Sudah Upload'
@@ -910,7 +928,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 <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'
+                    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
                       ? 'Sudah Upload'
-- 
cgit v1.2.3


From e9cd13307f0095dc4edc5048752675d80c551564 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Fri, 6 Dec 2024 17:06:26 +0700
Subject: <iman> pengajuan tempo

---
 src/lib/pengajuan-tempo/component/Dokumen.jsx | 85 +++++++++++++++++++--------
 1 file changed, 59 insertions(+), 26 deletions(-)

(limited to 'src/lib/pengajuan-tempo/component/Dokumen.jsx')

diff --git a/src/lib/pengajuan-tempo/component/Dokumen.jsx b/src/lib/pengajuan-tempo/component/Dokumen.jsx
index f05dc9ce..52217e56 100644
--- a/src/lib/pengajuan-tempo/component/Dokumen.jsx
+++ b/src/lib/pengajuan-tempo/component/Dokumen.jsx
@@ -6,6 +6,7 @@ import { UseToastOptions } from '@chakra-ui/react';
 import { toast } from 'react-hot-toast';
 import getFileBase64 from '@/core/utils/getFileBase64';
 import useDevice from '@/core/hooks/useDevice';
+import imageCompression from 'browser-image-compression';
 const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   const { control, watch } = useForm();
   const {
@@ -44,15 +45,32 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
 
       // Check for file size
       if (file.size > 500000) {
-        toast.error('Maksimal ukuran file adalah 500Kb', { duration: 4000 });
-
-        event.target.value = '';
-        return;
+        try {
+          const toastId = toast.loading('mencoba mengompresi file...');
+          // Compress image file
+          const options = {
+            maxSizeMB: 0.5, // Target size in MB
+            maxWidthOrHeight: 1920, // Adjust as needed
+            useWebWorker: true,
+          };
+          const compressedFile = await imageCompression(file, options);
+          toast.success('berhasil mengompresi file', { duration: 4000 });
+          // Convert compressed file to Base64
+          fileBase64 = await getFileBase64(compressedFile);
+          updateFormDokumen(
+            name,
+            compressedFile.name,
+            fileExtension,
+            fileBase64
+          );
+        } catch (error) {
+          toast.error('Gagal mengompresi file', { duration: 4000 });
+        }
+      } else {
+        // Convert file to Base64
+        fileBase64 = await getFileBase64(file);
+        updateFormDokumen(name, file.name, fileExtension, fileBase64);
       }
-
-      // Convert file to Base64
-      fileBase64 = await getFileBase64(file);
-      updateFormDokumen(name, file.name, fileExtension, fileBase64);
       validateDokumen();
     }
   };
@@ -139,6 +157,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   useEffect(() => {
     validateDokumen();
   }, [buttonSubmitClick]);
+  console.log('formDokumen', formDokumen);
   return (
     <>
       {isDesktop && (
@@ -155,7 +174,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 >
                   <div>
                     <label className='form-label  text-nowrap'>
-                      NIB (SIUP/TDP/SKDP)
+                      NIB (SIUP/TDP/SKDP){' '}
+                      <span className='text-danger-500 text-xl'>*</span>
                     </label>
                     <span className='text-xs opacity-60'>
                       Pastikan dokumen yang anda upload sudah benar
@@ -286,7 +306,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                   <div>
                     <label className='form-label  text-nowrap'>
                       Akta Perubahan{' '}
-                      <span className=' opacity-60'>(Opsional)</span>
+                      <span className=' opacity-60'>(Opsional)</span>{' '}
                     </label>
                     <span className='text-xs opacity-60'>
                       Pastikan dokumen yang anda upload sudah benar
@@ -330,7 +350,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                   <div>
                     <label className='form-label  text-nowrap'>
                       KTP Dirut/Direktur{' '}
-                      <span className=' opacity-60'>(Opsional)</span>
+                      <span className=' opacity-60'>(Opsional)</span>{' '}
+                      <span className='text-danger-500 text-xl'>*</span>
                     </label>
                     <span className='text-xs opacity-60'>
                       Pastikan dokumen yang anda upload sudah benar
@@ -378,7 +399,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                   <div>
                     <label className='form-label  text-nowrap'>
                       Akta Pendirian{' '}
-                      <span className=' opacity-60'>(Opsional)</span>
+                      <span className=' opacity-60'>(Opsional)</span>{' '}
+                      <span className='text-danger-500 text-xl'>*</span>
                     </label>
                     <span className='text-xs opacity-60'>
                       Pastikan dokumen yang anda upload sudah benar
@@ -511,7 +533,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 >
                   <div>
                     <label className='form-label  text-nowrap'>
-                      Tempat Bekerja
+                      Foto tempat kerja
                     </label>
                     <span className='text-xs opacity-60'>
                       Pastikan dokumen yang anda upload sudah benar
@@ -554,6 +576,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
             </div>
           </form>
           <div className='w-1/2 mt-8 flex gap-3 flex-col'>
+            <span className='opacity-75 text-danger-500 text-sm'>
+              *Jika anda ingin kredit limit lebih dari 25 Juta, harap lampirkan
+              dokumen yang diberi tanda bintang *)
+            </span>
             <div className='flex justify-between'>
               <p className='font-bold'>Upload Progress</p>
               <p>
@@ -601,7 +627,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
             <div className='w-full flex flex-col gap-4'>
               <div className='w-full flex flex-col gap-2' ref={dokumenNibRef}>
                 <label className='form-label  text-nowrap'>
-                  NIB (SIUP/TDP/SKDP)
+                  NIB (SIUP/TDP/SKDP){' '}
+                  <span className='text-danger-500 text-xl'>*</span>
                 </label>
                 <div className='flex flex-row gap-2'>
                   <label
@@ -609,7 +636,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     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?.dokumenNib?.name
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -647,7 +674,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     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
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -683,7 +710,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     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
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -724,7 +751,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     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
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -758,7 +785,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               >
                 <label className='form-label  text-nowrap'>
                   KTP Dirut/Direktur{' '}
-                  <span className=' opacity-60'>(Opsional)</span>
+                  <span className=' opacity-60'>(Opsional)</span>{' '}
+                  <span className='text-danger-500 text-xl'>*</span>
                 </label>
                 <div className='flex flex-row gap-2'>
                   <label
@@ -766,7 +794,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     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
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -799,7 +827,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 ref={dokumenAktaPendirianRef}
               >
                 <label className='form-label  text-nowrap'>
-                  Akta Pendirian <span className=' opacity-60'>(Opsional)</span>
+                  Akta Pendirian <span className=' opacity-60'>(Opsional)</span>{' '}
+                  <span className='text-danger-500 text-xl'>*</span>
                 </label>
                 <div className='flex flex-row gap-2'>
                   <label
@@ -807,7 +836,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     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?.dokumenAktaPendirian?.name
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -849,7 +878,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     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
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -890,7 +919,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     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?.dokumenFotoKantor?.name
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -923,7 +952,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 ref={dokumenTempatBekerjaRef}
               >
                 <label className='form-label  text-nowrap'>
-                  Tempat Bekerja
+                  Foto tempat kerja
                 </label>
                 <div className='flex flex-row gap-2'>
                   <label
@@ -931,7 +960,7 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     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
-                      ? 'Sudah Upload'
+                      ? 'Ubah Dokumen'
                       : 'Upload Dokumen'}
                   </label>
                   <input
@@ -961,6 +990,10 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
             </div>
           </form>
           <div className='w-full mt-8 flex gap-3 flex-col'>
+            <span className='opacity-75 text-danger-500 text-xs'>
+              *Jika anda ingin kredit limit lebih dari 25 Juta, harap lampirkan
+              dokumen yang diberi tanda bintang *)
+            </span>
             <div className='flex justify-between'>
               <p className='font-bold'>Upload Progress</p>
               <p>
-- 
cgit v1.2.3


From f2451beed670dc697aa2026b2df6ad1ad1e90da2 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 9 Dec 2024 15:00:45 +0700
Subject: <iman> update pengajuan tempo

---
 src/lib/pengajuan-tempo/component/Dokumen.jsx | 1 -
 1 file changed, 1 deletion(-)

(limited to 'src/lib/pengajuan-tempo/component/Dokumen.jsx')

diff --git a/src/lib/pengajuan-tempo/component/Dokumen.jsx b/src/lib/pengajuan-tempo/component/Dokumen.jsx
index 52217e56..264732dc 100644
--- a/src/lib/pengajuan-tempo/component/Dokumen.jsx
+++ b/src/lib/pengajuan-tempo/component/Dokumen.jsx
@@ -157,7 +157,6 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   useEffect(() => {
     validateDokumen();
   }, [buttonSubmitClick]);
-  console.log('formDokumen', formDokumen);
   return (
     <>
       {isDesktop && (
-- 
cgit v1.2.3


From 0f84963214ee6dc5b5a44d945540826a66bec9e0 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Wed, 11 Dec 2024 11:51:45 +0700
Subject: <iman> update pengajuan tempo

---
 src/lib/pengajuan-tempo/component/Dokumen.jsx | 36 +++++++++++++--------------
 1 file changed, 18 insertions(+), 18 deletions(-)

(limited to 'src/lib/pengajuan-tempo/component/Dokumen.jsx')

diff --git a/src/lib/pengajuan-tempo/component/Dokumen.jsx b/src/lib/pengajuan-tempo/component/Dokumen.jsx
index 264732dc..d74e85be 100644
--- a/src/lib/pengajuan-tempo/component/Dokumen.jsx
+++ b/src/lib/pengajuan-tempo/component/Dokumen.jsx
@@ -176,8 +176,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       NIB (SIUP/TDP/SKDP){' '}
                       <span className='text-danger-500 text-xl'>*</span>
                     </label>
-                    <span className='text-xs opacity-60'>
-                      Pastikan dokumen yang anda upload sudah benar
+                    <span className='text-xs opacity-60 text-red-500'>
+                      Format: pdf, jpeg, jpg, png. max file size 2MB
                     </span>
                   </div>
                   <div className=''>
@@ -220,8 +220,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     <label className='form-label  text-nowrap'>
                       NPWP Perusahaan
                     </label>
-                    <span className='text-xs opacity-60'>
-                      Pastikan dokumen yang anda upload sudah benar
+                    <span className='text-xs opacity-60 text-red-500'>
+                      Format: pdf, jpeg, jpg, png. max file size 2MB
                     </span>
                   </div>
                   <div className=''>
@@ -262,8 +262,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 >
                   <div>
                     <label className='form-label  text-nowrap'>SPPKP</label>
-                    <span className='text-xs opacity-60'>
-                      Pastikan dokumen yang anda upload sudah benar
+                    <span className='text-xs opacity-60 text-red-500'>
+                      Format: pdf, jpeg, jpg, png. max file size 2MB
                     </span>
                   </div>
                   <div className=''>
@@ -307,8 +307,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       Akta Perubahan{' '}
                       <span className=' opacity-60'>(Opsional)</span>{' '}
                     </label>
-                    <span className='text-xs opacity-60'>
-                      Pastikan dokumen yang anda upload sudah benar
+                    <span className='text-xs opacity-60 text-red-500'>
+                      Format: pdf, jpeg, jpg, png. max file size 2MB
                     </span>
                   </div>
                   <div className=''>
@@ -352,8 +352,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       <span className=' opacity-60'>(Opsional)</span>{' '}
                       <span className='text-danger-500 text-xl'>*</span>
                     </label>
-                    <span className='text-xs opacity-60'>
-                      Pastikan dokumen yang anda upload sudah benar
+                    <span className='text-xs opacity-60 text-red-500'>
+                      Format: pdf, jpeg, jpg, png. max file size 2MB
                     </span>
                   </div>
                   <div className=''>
@@ -401,8 +401,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       <span className=' opacity-60'>(Opsional)</span>{' '}
                       <span className='text-danger-500 text-xl'>*</span>
                     </label>
-                    <span className='text-xs opacity-60'>
-                      Pastikan dokumen yang anda upload sudah benar
+                    <span className='text-xs opacity-60 text-red-500'>
+                      Format: pdf, jpeg, jpg, png. max file size 2MB
                     </span>
                   </div>
                   <div className=''>
@@ -446,8 +446,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                       Laporan Keuangan
                       <span className=' opacity-60'>(Opsional)</span>
                     </label>
-                    <span className='text-xs opacity-60'>
-                      Pastikan dokumen yang anda upload sudah benar
+                    <span className='text-xs opacity-60 text-red-500'>
+                      Format: pdf, jpeg, jpg, png. max file size 2MB
                     </span>
                   </div>
                   <div className=''>
@@ -490,8 +490,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     <label className='form-label  text-nowrap'>
                       Foto Kantor (Tampak Depan)
                     </label>
-                    <span className='text-xs opacity-60'>
-                      Pastikan dokumen yang anda upload sudah benar
+                    <span className='text-xs opacity-60 text-red-500'>
+                      Format: pdf, jpeg, jpg, png. max file size 2MB
                     </span>
                   </div>
                   <div className=''>
@@ -534,8 +534,8 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                     <label className='form-label  text-nowrap'>
                       Foto tempat kerja
                     </label>
-                    <span className='text-xs opacity-60'>
-                      Pastikan dokumen yang anda upload sudah benar
+                    <span className='text-xs opacity-60 text-red-500'>
+                      Format: pdf, jpeg, jpg, png. max file size 2MB
                     </span>
                   </div>
                   <div className=''>
-- 
cgit v1.2.3


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/pengajuan-tempo/component/Dokumen.jsx | 664 +++++++++++++++++++-------
 1 file changed, 490 insertions(+), 174 deletions(-)

(limited to 'src/lib/pengajuan-tempo/component/Dokumen.jsx')

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'>
-- 
cgit v1.2.3


From 68e1d6e55b6d38d86c2b3332268fb508de0a2db8 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Thu, 16 Jan 2025 09:13:04 +0700
Subject: <iman> comment compres file

---
 src/lib/pengajuan-tempo/component/Dokumen.jsx | 45 ++++++++++++++-------------
 1 file changed, 23 insertions(+), 22 deletions(-)

(limited to 'src/lib/pengajuan-tempo/component/Dokumen.jsx')

diff --git a/src/lib/pengajuan-tempo/component/Dokumen.jsx b/src/lib/pengajuan-tempo/component/Dokumen.jsx
index 00bb715a..f986d47a 100644
--- a/src/lib/pengajuan-tempo/component/Dokumen.jsx
+++ b/src/lib/pengajuan-tempo/component/Dokumen.jsx
@@ -44,28 +44,29 @@ const Dokumen = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
       }
 
       // Check for file size
-      if (file.size > 500000) {
-        try {
-          const toastId = toast.loading('mencoba mengompresi file...');
-          // Compress image file
-          const options = {
-            maxSizeMB: 0.5, // Target size in MB
-            maxWidthOrHeight: 1920, // Adjust as needed
-            useWebWorker: true,
-          };
-          const compressedFile = await imageCompression(file, options);
-          toast.success('berhasil mengompresi file', { duration: 4000 });
-          // Convert compressed file to Base64
-          fileBase64 = await getFileBase64(compressedFile);
-          updateFormDokumen(
-            name,
-            compressedFile.name,
-            fileExtension,
-            fileBase64
-          );
-        } catch (error) {
-          toast.error('Gagal mengompresi file', { duration: 4000 });
-        }
+      if (file.size > 2000000) {
+        // try {
+        //   const toastId = toast.loading('mencoba mengompresi file...');
+        //   // Compress image file
+        //   const options = {
+        //     maxSizeMB: 0.5, // Target size in MB
+        //     maxWidthOrHeight: 1920, // Adjust as needed
+        //     useWebWorker: true,
+        //   };
+        //   const compressedFile = await imageCompression(file, options);
+        //   toast.success('berhasil mengompresi file', { duration: 4000 });
+        //   // Convert compressed file to Base64
+        //   fileBase64 = await getFileBase64(compressedFile);
+        //   updateFormDokumen(
+        //     name,
+        //     compressedFile.name,
+        //     fileExtension,
+        //     fileBase64
+        //   );
+        // } catch (error) {
+        //   toast.error('Gagal mengompresi file', { duration: 4000 });
+        // }
+        toast.error('Max File Upload 2MB', { duration: 4000 });
       } else {
         // Convert file to Base64
         fileBase64 = await getFileBase64(file);
-- 
cgit v1.2.3

