added validation for address, user can't add more than 500 characters.

src/components/Activities/CheckCheckOutForm.jsx

@@ -12,7 +12,7 @@ import {checkIfCurrentDate} from "../../utils/dateUtils";
 
 const schema = z.object({
   markTime: z.string().nonempty({message:"Time is required"}), 
-  description:z.string().optional()
+  description:z.string().max(200,"description should less than 200 chracters").optional()
 });
 
 const CheckCheckOutmodel = ({modeldata,closeModal,handleSubmitForm,}) => {
@@ -29,7 +29,8 @@ const CheckCheckOutmodel = ({modeldata,closeModal,handleSubmitForm,}) => {
     reset,
     setValue,
   } = useForm({
-    resolver: zodResolver(schema),
+    resolver: zodResolver( schema ),
+    mode:"onChange"
   });
 
   const onSubmit = ( data ) =>
@@ -84,7 +85,8 @@ const CheckCheckOutmodel = ({modeldata,closeModal,handleSubmitForm,}) => {
           rows="3"
           name="description"
           className="form-control"
-          {...register("description")}
+          {...register( "description" )}
+          maxLength={200}
         />
         {errors.description && (
           <p className="text-danger">{errors.description.message}</p>

src/components/Employee/ManageEmployee.jsx

@@ -121,6 +121,7 @@ const ManageEmployee = () => {
     register,
     control,
     handleSubmit,
+    watch,
     formState: { errors },
     reset,
     getValues,
@@ -144,8 +145,11 @@ const ManageEmployee = () => {
       PhoneNumber: currentEmployee?.phoneNumber || "",
       JobRoleId: currentEmployee?.jobRoleId || "",
     },
+    mode: "onChange",
   });
 
+  const AadharNumberValue = watch("AadharNumber") || "";
+
   const onSubmit = (data) => {
     setLoading(true);
 
@@ -338,6 +342,7 @@ const ManageEmployee = () => {
                       {...register("PhoneNumber")}
                       className="form-control form-control-sm"
                       placeholder="Phone Number"
+                      inputMode="numeric"
                     />
                     {errors.PhoneNumber && (
                       <div
@@ -429,7 +434,8 @@ const ManageEmployee = () => {
                       placeholder="Current Address"
                       aria-label="Current Address"
                       aria-describedby="basic-icon-default-message2"
-                      {...register("CurrentAddress")}
+                      {...register( "CurrentAddress" )}
+                      maxLength={500}
                     ></textarea>
                     {errors.CurrentAddress && (
                       <div
@@ -451,7 +457,8 @@ const ManageEmployee = () => {
                       placeholder="Permanent Address"
                       aria-label="Permanent Address"
                       aria-describedby="basic-icon-default-message2"
-                      {...register("PermanentAddress")}
+                      {...register( "PermanentAddress" )}
+                      maxLength={500}
                     ></textarea>
                     {errors.PermanentAddress && (
                       <div
@@ -474,7 +481,7 @@ const ManageEmployee = () => {
                     <div className="form-text text-start">Role</div>
                     <div className="input-group input-group-merge ">
                       <select
-                        className="form-select form-select-sm "
+                        className="form-select form-select-sm"
                         {...register("JobRoleId")}
                         id="JobRoleId"
                         aria-label=""
@@ -507,6 +514,7 @@ const ManageEmployee = () => {
                       {...register("EmergencyContactPerson")}
                       className="form-control form-control-sm"
                       id="EmergencyContactPerson"
+                      maxLength={50}
                       placeholder="Contact Person"
                     />
                     {errors.EmergencyContactPerson && (
@@ -528,6 +536,7 @@ const ManageEmployee = () => {
                       className="form-control form-control-sm phone-mask"
                       id="EmergencyPhoneNumber"
                       placeholder="Phone Number"
+                      inputMode="numeric"
                     />
                     {errors.EmergencyPhoneNumber && (
                       <div
@@ -549,6 +558,8 @@ const ManageEmployee = () => {
                       className="form-control form-control-sm"
                       id="AadharNumber"
                       placeholder="AADHAR Number"
+                      maxLength={12}
+                      inputMode="numeric"
                     />
                     {errors.AadharNumber && (
                       <div className="danger-text text-start">
@@ -565,6 +576,7 @@ const ManageEmployee = () => {
                       className="form-control form-control-sm"
                       id="PanNumber"
                       placeholder="PAN Number"
+                      maxLength={10}
                     />
                     {errors.PanNumber && (
                       <div

src/components/Project/ManageProjectInfo.jsx

@@ -62,7 +62,9 @@ const ManageProjectInfo = ( {project,handleSubmitForm, onClose} ) =>
      endDate: formatDate(project?.endDate ) || currentDate,
      projectStatusId: String(project?.projectStatusId || "0"),
    
-   }
+   },
+   mode:"onChange"
+
  })
   
   useEffect( () =>
@@ -210,7 +212,7 @@ const ManageProjectInfo = ( {project,handleSubmitForm, onClose} ) =>
                   name="projectAddress"
                   className="form-control"
                   {...register( "projectAddress" )}
-                  
+                  maxLength={500}
                 />
               </div>
               {errors.projectAddress && <div className="danger-text text-start" style={{fontSize:"12px"}}>{errors.projectAddress.message}</div>}