src/components/Employee/ManageEmployee.jsx

@@ -36,7 +36,30 @@ const ManageEmployee = () => {
     FirstName: z.string().min(1, { message: "First Name is required" }),
     MiddleName: z.string().optional(),
     LastName: z.string().min(1, { message: "Last Name is required" }),
-    Email: z.string().optional(),
+    Email: z
+      .string()
+      .optional()
+      .refine(
+        (val) =>
+          !val || /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(val),
+        {
+          message: "Invalid email format",
+        }
+      )
+      .refine(
+        (val) => {
+          if (!val) return true;
+          const [local, domain] = val.split("@");
+          return (
+            val.length <= 320 &&
+            local?.length <= 64 &&
+            domain?.length <= 255
+          );
+        },
+        {
+          message: "Email local or domain part is too long",
+        }
+      ),
     CurrentAddress: z
       .string()
       .min(1, { message: "Current Address is required" })
@@ -86,7 +109,7 @@ const ManageEmployee = () => {
       .refine((val) => !val || /^[A-Z]{5}[0-9]{4}[A-Z]{1}$/.test(val), {
         message: "Invalid PAN number",
       }),
-    PeramnentAddress: z
+    PermanentAddress: z
       .string()
       .min(1, { message: "Permanent Address is required" })
       .max(150, { message: "Address cannot exceed 150 characters" }),
@@ -120,7 +143,7 @@ const ManageEmployee = () => {
       AadharNumber: currentEmployee?.aadharNumber || "",
       Gender: currentEmployee?.gender || "",
       PanNumber: currentEmployee?.panNumber || "",
-      PeramnentAddress: currentEmployee?.peramnentAddress || "",
+      PermanentAddress: currentEmployee?.permanentAddress || "",
       PhoneNumber: currentEmployee?.phoneNumber || "",
       JobRoleId: currentEmployee?.jobRoleId || "",
     },
@@ -191,7 +214,7 @@ const ManageEmployee = () => {
             AadharNumber: currentEmployee.aadharNumber || "",
             Gender: currentEmployee.gender || "",
             PanNumber: currentEmployee.panNumber || "",
-            PeramnentAddress: currentEmployee.peramnentAddress || "",
+            PermanentAddress: currentEmployee.permanentAddress || "",
             PhoneNumber: currentEmployee.phoneNumber || "",
             JobRoleId: currentEmployee.jobRoleId?.toString() || "",
           }
@@ -421,22 +444,22 @@ const ManageEmployee = () => {
                     )}
                   </div>
                   <div className="col-sm-6">
-                    <div className="form-text text-start">Permnant Address</div>
+                    <div className="form-text text-start">Permanent Address</div>
 
                     <textarea
-                      id="PeramnentAddress"
+                      id="PermanentAddress"
                       className="form-control form-control-sm"
-                      placeholder="Permnant Address"
+                      placeholder="Permanent Address"
-                      aria-label="Permnant Address"
+                      aria-label="Permanent Address"
                       aria-describedby="basic-icon-default-message2"
-                      {...register("PeramnentAddress")}
+                      {...register("PermanentAddress")}
                     ></textarea>
-                    {errors.PeramnentAddress && (
+                    {errors.PermanentAddress && (
                       <div
                         className="danger-text text-start"
                         style={{ fontSize: "12px" }}
                       >
-                        {errors.PeramnentAddress.message}
+                        {errors.PermanentAddress.message}
                       </div>
                     )}
                   </div>

src/pages/employee/EmployeeProfile.jsx

@@ -174,7 +174,7 @@ const EmployeeProfile = () => {
                         </li>
                         <li className="d-flex align-items-start test-start mb-2">
                           <span className={`${currentEmployee?.permanentAddress ? "" : "ms-4"}`}>
-                          {currentEmployee?.peramnentAddress}
+                          {currentEmployee?.permanentAddress}
                           </span>
                         </li>