fix(FE): create hooks for formik error list and integrate alert error list for finance and master data modules

src/components/pages/master-data/fcr/form/FcrForm.tsx

@@ -26,6 +26,8 @@ import {
 } from '@/types/api/master-data/fcr';
 import { FcrApi } from '@/services/api/master-data';
 import { cn } from '@/lib/helper';
+import AlertErrorList from '@/components/helper/form/FormErrors';
+import { useFormikErrorList } from '@/services/hooks/useFormikErrorList';
 
 interface FcrFormProps {
   type?: 'add' | 'edit' | 'detail';
@@ -158,6 +160,9 @@ const FcrForm = ({ type = 'add', initialValues }: FcrFormProps) => {
     formikSetValues(formikInitialValues);
   }, [formikSetValues, formikInitialValues]);
 
+  // ===== Formik Error List =====
+  const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik);
+
   return (
     <>
       <section className='w-full max-w-5xl'>
@@ -179,7 +184,7 @@ const FcrForm = ({ type = 'add', initialValues }: FcrFormProps) => {
         </header>
 
         <form
-          onSubmit={formik.handleSubmit}
+          onSubmit={handleFormSubmit}
           onReset={formik.handleReset}
           className='w-full mt-8 flex flex-col gap-6'
         >
@@ -294,6 +299,8 @@ const FcrForm = ({ type = 'add', initialValues }: FcrFormProps) => {
             )}
           </div>
 
+          <AlertErrorList formErrorList={formErrorList} onClose={close} />
+
           <div className='flex flex-row justify-between gap-2 flex-wrap'>
             {type !== 'add' && (
               <div className='flex flex-row justify-start gap-2'>
@@ -349,7 +356,7 @@ const FcrForm = ({ type = 'add', initialValues }: FcrFormProps) => {
                   type='submit'
                   color='primary'
                   isLoading={formik.isSubmitting}
-                  disabled={!formik.isValid || formik.isSubmitting}
+                  disabled={formik.isSubmitting}
                   className='px-4'
                 >
                   Submit