Merge branch 'pramod_Enhancement#76_ImproveEmpl_ListView' into Feature_Task_Management

src/components/common/Avatar.jsx

@@ -1,5 +1,11 @@
 import React, { useState, useEffect } from "react";
 
+const Avatar = ({ firstName, lastName }) => {
+  // Combine firstName and lastName to create a unique string for hashing
+  const fullName = `${firstName} ${lastName}`;
+
+  const [bgClass, setBgClass] = useState("");
+
   // A simple hash function to generate a deterministic value from the name
   function hashString(str) {
     let hash = 0;
@@ -10,13 +16,6 @@ function hashString(str) {
     return hash;
   }
 
-const Avatar = ({ firstName, lastName, size='sm' }) => {
-  // Combine firstName and lastName to create a unique string for hashing
-  const fullName = `${firstName} ${lastName}`;
-
-  const [bgClass, setBgClass] = useState("");
-
-  // Function to generate the avatar text
   function generateAvatarText(firstName, lastName) {
     if (!firstName) return "";
     if (!lastName || lastName.trim() === "") {
@@ -50,15 +49,15 @@ const Avatar = ({ firstName, lastName, size='sm' }) => {
   }, [fullName]); // Re-run if the fullName changes
 
   return (
+    <>
       <div className="avatar-wrapper p-1">
         <div className={`avatar avatar-${size} me-2`}>
-        <span
+          <span className={`avatar-initial rounded-circle ${bgClass}`}>
-          className={`avatar-initial rounded-circle ${bgClass}`}
-        >
             {generateAvatarText(firstName, lastName)}
           </span>
         </div>
       </div>
+    </>
   );
 };
 

src/pages/employee/EmployeeList.jsx

@@ -53,8 +53,15 @@ const EmployeeList = () =>
     setCurrentPage(1);
 
     if (!loading && Array.isArray(employees)) {
-      setEmployeeList(employees);
+      // Sort by full name (firstName + lastName)
-      setFilteredData(employees);
+      const sorted = [...employees].sort((a, b) => {
+        const nameA = `${a.firstName || ""}${a.lastName || ""}`.toLowerCase();
+        const nameB = `${b.firstName || ""}${b.lastName || ""}`.toLowerCase();
+        return nameA.localeCompare(nameB);
+      });
+  
+      setEmployeeList(sorted);
+      setFilteredData(sorted);
     }
   }, [loading, employees, selectedProject]);
 
@@ -343,7 +350,6 @@ const EmployeeList = () =>
                     {currentItems &&
                       !loading &&
                       currentItems
-                        .sort((a, b) => b.id - a.id)
                         .map((item) => (
                           <tr className="odd" key={item.id}>
                             <td className="sorting_1" colSpan={2}>