<iman> add error handling

1 files changed, 38 insertions, 48 deletions

diff --git a/src/lib/auth/components/CompanyProfile.jsx b/src/lib/auth/components/CompanyProfile.jsx
index ee9c1f58..6d5790b4 100644
--- a/src/lib/auth/components/CompanyProfile.jsx
+++ b/src/lib/auth/components/CompanyProfile.jsx
@@ -7,62 +7,25 @@ import { useEffect, useState } from 'react';
 import { Controller, useForm } from 'react-hook-form';
 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';
 
 const CompanyProfile = () => {
   const [changeConfirmation, setChangeConfirmation] = useState(false);
   const auth = useAuth();
   const [isOpen, setIsOpen] = useState(false);
   const toggle = () => setIsOpen(!isOpen);
-  const { register, setValue, control, handleSubmit } = useForm({
-    defaultValues: {
-      industry: '',
-      companyType: '',
-      name: '',
-      taxName: '',
-      npwp: '',
-      alamat_wajib_pajak: '',
-      alamat_bisnis: '',
-    },
+  const {
+    register,
+    formState: { errors },
+    setValue,
+    control,
+    handleSubmit,
+  } = useForm({
+    resolver: yupResolver(validationSchema),
+    defaultValues,
   });
 
-  const formatNpwp = (value) => {
-    try {
-      const cleaned = ('' + value).replace(/\D/g, '');
-      let match;
-      if (cleaned.length <= 15) {
-        match = cleaned.match(
-          /(\d{0,2})?(\d{0,3})?(\d{0,3})?(\d{0,1})?(\d{0,3})?(\d{0,3})$/
-        );
-      } else {
-        match = cleaned.match(
-          /(\d{0,3})?(\d{0,3})?(\d{0,3})?(\d{0,1})?(\d{0,3})?(\d{0,3})$/
-        );
-      }
-
-      if (match) {
-        return [
-          match[1],
-          match[2] ? '.' : '',
-          match[2],
-          match[3] ? '.' : '',
-          match[3],
-          match[4] ? '.' : '',
-          match[4],
-          match[5] ? '-' : '',
-          match[5],
-          match[6] ? '.' : '',
-          match[6],
-        ].join('');
-      }
-
-      // If match is null, return the original cleaned string or handle as needed
-      return cleaned;
-    } catch (error) {
-      // Handle error or return a default value
-      console.error('Error formatting NPWP:', error);
-      return value;
-    }
-  };
   const [industries, setIndustries] = useState([]);
   useEffect(() => {
     const loadIndustries = async () => {
@@ -91,6 +54,7 @@ const CompanyProfile = () => {
   useEffect(() => {
     const loadProfile = async () => {
       const dataProfile = await addressApi({ id: auth.parentId });
+      console.log('dataProfile', dataProfile);
       setValue('name', dataProfile.name);
       setValue('industry', dataProfile.industryId);
       setValue('companyType', dataProfile.companyTypeId);
@@ -103,6 +67,7 @@ const CompanyProfile = () => {
   }, [auth, setValue]);
 
   const onSubmitHandler = async (values) => {
+    console.log('values', values);
     if (changeConfirmation) {
       const data = {
         ...values,
@@ -222,6 +187,9 @@ const CompanyProfile = () => {
                 type='text'
                 className='form-input mt-3'
               />
+              <div className='text-caption-2 text-danger-500 mt-1'>
+                {errors.taxName?.message}
+              </div>
             </div>
             <div>
               <label>Alamat Wajib Pajak</label>
@@ -230,6 +198,9 @@ const CompanyProfile = () => {
                 type='text'
                 className='form-input mt-3'
               />
+              <div className='text-caption-2 text-danger-500 mt-1'>
+                {errors.alamat_wajib_pajak?.message}
+              </div>
             </div>
             <div>
               <label>Alamat Bisnis</label>
@@ -238,6 +209,9 @@ const CompanyProfile = () => {
                 type='text'
                 className='form-input mt-3'
               />
+              <div className='text-caption-2 text-danger-500 mt-1'>
+                {errors.alamat_bisnis?.message}
+              </div>
             </div>
             <div>
               <label>Nomor NPWP</label>
@@ -259,3 +233,19 @@ const CompanyProfile = () => {
 };
 
 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'),
+});
+
+const defaultValues = {
+  industry: '',
+  companyType: '',
+  name: '',
+  taxName: '',
+  npwp: '',
+  alamat_wajib_pajak: '',
+  alamat_bisnis: '',
+};