Merged in Feature/switch-account (pull request #402)

Feature/switch account

1 files changed, 101 insertions, 24 deletions

diff --git a/src/lib/auth/components/CompanyProfile.jsx b/src/lib/auth/components/CompanyProfile.jsx
index 220d5be1..410d6a23 100644
--- a/src/lib/auth/components/CompanyProfile.jsx
+++ b/src/lib/auth/components/CompanyProfile.jsx
@@ -9,9 +9,14 @@ import { toast } from 'react-hot-toast';
 import BottomPopup from '@/core/components/elements/Popup/BottomPopup';
 import { yupResolver } from '@hookform/resolvers/yup';
 import * as Yup from 'yup';
+import SwitchAccount from '@/lib/auth/components/SwitchAccount';
+import { Checkbox } from '@chakra-ui/react';
 
 const CompanyProfile = () => {
   const [changeConfirmation, setChangeConfirmation] = useState(false);
+  const [changeType, setChangeType] = useState(false);
+  const [isChecked, setIsChecked] = useState(false);
+  const [company_type, setCompany_type] = useState('nonpkp');
   const auth = useAuth();
   const [isOpen, setIsOpen] = useState(false);
   const toggle = () => setIsOpen(!isOpen);
@@ -53,14 +58,18 @@ const CompanyProfile = () => {
 
   useEffect(() => {
     const loadProfile = async () => {
-      const dataProfile = await addressApi({ id: auth.parentId });
-      setValue('name', dataProfile.name);
-      setValue('industry', dataProfile.industryId);
-      setValue('companyType', dataProfile.companyTypeId);
-      setValue('taxName', dataProfile.taxName);
-      setValue('npwp', dataProfile.npwp);
-      setValue('alamat_wajib_pajak', dataProfile.alamatWajibPajak);
-      setValue('alamat_bisnis', dataProfile.alamatBisnis);
+      const dataProfile = await addressApi({
+        id: auth.parentId ? auth.parentId : auth.parent_id,
+      });
+      setCompany_type(dataProfile?.companyType);
+      setValue('name', dataProfile?.name);
+      setValue('industry', dataProfile?.industryId);
+      setValue('companyType', dataProfile?.companyTypeId);
+      setValue('taxName', dataProfile?.taxName);
+      setValue('npwp', dataProfile?.npwp);
+      setValue('alamat_wajib_pajak', dataProfile?.alamatWajibPajak);
+      setValue('alamat_bisnis', dataProfile?.alamatBisnis);
+      setValue('company_type', dataProfile?.companyType);
       setValue('email_bisnis', dataProfile.email);
       setValue('mobile_bisnis', dataProfile.mobile);
     };
@@ -97,10 +106,49 @@ const CompanyProfile = () => {
     setChangeConfirmation(false);
     handleSubmit(onSubmitHandler)();
   };
+  const handleConfirmSubmitType = () => {
+    setChangeType(false);
+    setIsChecked(true);
+    setIsOpen(!isOpen);
+  };
+  const handleChange = async () => {
+    if (isChecked) {
+      setIsChecked(!isChecked);
+      setIsOpen(!isOpen);
+    } else {
+      setIsChecked(!isChecked);
+      setChangeType(true);
+    }
+  };
 
   return (
     <>
       <BottomPopup
+        active={changeType}
+        close={() => setChangeType(false)} // Menutup popup
+        title='Ubah type akun'
+      >
+        <div className='leading-7 text-gray_r-12/80'>
+          Anda akan mengubah type akun anda?
+        </div>
+        <div className='flex mt-6 gap-x-4 md:justify-end'>
+          <button
+            className='btn-solid-red flex-1 md:flex-none'
+            type='button'
+            onClick={handleConfirmSubmitType}
+          >
+            Yakin
+          </button>
+          <button
+            className='btn-light flex-1 md:flex-none'
+            type='button'
+            onClick={() => setChangeType(false)}
+          >
+            Batal
+          </button>
+        </div>
+      </BottomPopup>
+      <BottomPopup
         active={changeConfirmation}
         close={() => setChangeConfirmation(true)}
         title='Ubah profil Bisnis'
@@ -125,25 +173,37 @@ const CompanyProfile = () => {
           </button>
         </div>
       </BottomPopup>
-      <button
-        type='button'
-        onClick={toggle}
-        className='p-4 flex items-center text-left w-full'
-      >
+      <div className='p-4 flex-row items-center text-left w-full'>
+        {company_type === 'nonpkp' && (
+          <div className='text-sm mb-2 flex items-center'>
+            <Checkbox
+              borderColor='gray.600'
+              colorScheme='red'
+              size='lg'
+              isChecked={isChecked}
+              onChange={handleChange}
+            />
+            <p className='ml-2'>Ubah ke akun PKP</p>
+          </div>
+        )}
         <div>
-          <div className='font-semibold mb-2'>Informasi Usaha</div>
+          <div className='font-semibold mb-2 flex flex-row gap-x-2'>
+            <h2>Informasi Usaha</h2>
+            <div className='badge-red'>{company_type.toUpperCase()}</div>
+          </div>
           <div className='text-gray_r-11'>
             Dibawah ini adalah data usaha yang anda masukkan, periksa kembali
             data usaha anda.
           </div>
         </div>
-        <div className='ml-auto p-2 bg-gray_r-3 rounded'>
-          {!isOpen && <ChevronDownIcon className='w-6' />}
-          {isOpen && <ChevronUpIcon className='w-6' />}
-        </div>
-      </button>
-
-      {isOpen && (
+        {/* <button
+          onClick={toggle}
+          className='btn-yellow w-full sm:w-fit sm:ml-auto min-w-[92px]'
+        >
+          Ubah
+        </button> */}
+      </div>
+      {!isOpen && (
         <form
           className='p-4 border-t border-gray_r-6'
           onSubmit={(e) => {
@@ -264,6 +324,7 @@ const CompanyProfile = () => {
           </button>
         </form>
       )}
+      {isOpen && <SwitchAccount company_type={company_type} />}
     </>
   );
 };
@@ -272,14 +333,30 @@ export default CompanyProfile;
 
 const validationSchema = Yup.object().shape({
   alamat_bisnis: Yup.string().required('Harus di-isi'),
-  alamat_wajib_pajak: Yup.string().required('Harus di-isi'),
-  taxName: Yup.string().required('Harus di-isi'),
-  npwp: Yup.string().required('Harus di-isi'),
   name: Yup.string().required('Harus di-isi'),
   email_bisnis: Yup.string().required('Harus di-isi'),
   mobile_bisnis: Yup.string().required('Harus di-isi'),
   industry: Yup.string().required('Harus di-pilih'),
   companyType: Yup.string().required('Harus di-pilih'),
+  taxName: Yup.string(),
+  npwp: Yup.string(),
+  alamat_wajib_pajak: Yup.string(),
+  company_type: Yup.string(),
+  taxName: Yup.string().when('company_type', {
+    is: (company_type) => company_type !== 'Non PKP',
+    then: Yup.string().required('Harus di-isi'),
+    otherwise: Yup.string().notRequired(),
+  }),
+  npwp: Yup.string().when('company_type', {
+    is: (company_type) => company_type !== 'Non PKP',
+    then: Yup.string().required('Harus di-isi'),
+    otherwise: Yup.string().notRequired(),
+  }),
+  alamat_wajib_pajak: Yup.string().when('company_type', {
+    is: (company_type) => company_type !== 'Non PKP',
+    then: Yup.string().required('Harus di-isi'),
+    otherwise: Yup.string().notRequired(),
+  }),
 });
 
 const defaultValues = {