[GREEN] implement validation on kode kbli input

src/components/FormIUMK/FormIUMK2.js

@@ -3,6 +3,7 @@ import PropTypes from 'prop-types'
 
 const FormIUMK2 = ({
   register,
+  errors,
   handleSubmit,
   onSubmit,
   setEmployeeData,
@@ -43,6 +44,7 @@ const FormIUMK2 = ({
           <EmployeeDropdown
             setEmployeeData={setEmployeeData}
             defaultValue={data.karyawan}
+            data-testid="form-iumk-2-dropdown"
           />
         </div>
         <div className="flex flex-col pb-6" data-testid="form-iumk-2-kode-kbli">
@@ -56,9 +58,31 @@ const FormIUMK2 = ({
             name="kbli"
             ref={register({
               required: false,
+              minLength: {
+                value: 5,
+                message:
+                  'Kode KBLI harus terdiri dari 5 angka',
+              },
+              maxLength: {
+                value: 5,
+                message:
+                  'Kode KBLI harus terdiri dari 5 angka',
+              },
+              pattern: {
+                value: /^\d+$/,
+                message: 'Kode KBLI hanya boleh mengandung angka',
+              },              
             })}
             defaultValue={data.kbli}
           />
+          <div>
+            {errors.kbli && (
+              <span role="alert" className="text-popred">
+                {errors.kbli.message}
+              </span>
+            )}
+          </div>
+          <br></br>
         </div>
         <div className="flex flex-col pb-8" data-testid="form-iumk-2-catatan">
           <label className="mb-2 heading-3 text-black">
@@ -91,6 +115,7 @@ const FormIUMK2 = ({
 
 FormIUMK2.propTypes = {
   register: PropTypes.func,
+  errors: PropTypes.object,
   handleSubmit: PropTypes.func,
   onSubmit: PropTypes.func,
   setEmployeeData: PropTypes.func,