src/pages/employee/EmployeeList.jsx

@@ -18,7 +18,7 @@ import {
   VIEW_ALL_EMPLOYEES,
   VIEW_TEAM_MEMBERS,
 } from "../../utils/constants";
-import { clearCacheKey } from "../../slices/apiDataManager";
+import { clearCacheKey, useSelectedProject } from "../../slices/apiDataManager";
 import { useHasUserPermission } from "../../hooks/useHasUserPermission";
 import SuspendEmp from "../../components/Employee/SuspendEmp"; // Keep if you use SuspendEmp
 import {
@@ -38,9 +38,10 @@ import usePagination from "../../hooks/usePagination";
 import { setProjectId } from "../../slices/localVariablesSlice";
 
 const EmployeeList = () => {
-  const selectedProjectId = useSelector(
+  // const selectedProjectId = useSelector(
-    (store) => store.localVariables.projectId
+  //   (store) => store.localVariables.projectId
-  );
+  // );
+  const selectedProjectId = useSelectedProject();
   const { projectNames, loading: projectLoading, fetchData } = useProjectName();
 
   const dispatch = useDispatch();
@@ -78,11 +79,11 @@ const EmployeeList = () => {
     }
   );
 
-  useEffect(() => {
+useEffect(() => {
-    if (selectedProjectId === null) {
+  if (!selectedProjectId  && projectNames?.length > 0) {
-      dispatch(setProjectId(projectNames[0]?.id));
+    dispatch(setProjectId(projectNames[0].id));
-    }
+  }
-  }, [selectedProjectId]);
+}, [selectedProjectId, projectNames, dispatch]);
   const navigate = useNavigate();
 
   const applySearchFilter = (data, text) => {
@@ -176,10 +177,12 @@ const EmployeeList = () => {
   useEffect(() => {
     if (!loading && Array.isArray(employees)) {
       const sorted = [...employees].sort((a, b) => {
-        const nameA = `${a.firstName || ""}${a.middleName || ""}${a.lastName || ""
+        const nameA = `${a.firstName || ""}${a.middleName || ""}${
-          }`.toLowerCase();
+          a.lastName || ""
-        const nameB = `${b.firstName || ""}${b.middleName || ""}${b.lastName || ""
+        }`.toLowerCase();
-          }`.toLowerCase();
+        const nameB = `${b.firstName || ""}${b.middleName || ""}${
+          b.lastName || ""
+        }`.toLowerCase();
         return nameA?.localeCompare(nameB);
       });
 
@@ -218,10 +221,10 @@ const EmployeeList = () => {
         recallEmployeeData(
           showInactive,
           showAllEmployees ? null : selectedProjectId
-        ); // Use selectedProjectId here
+        );
       }
     },
-    [employees, showInactive, showAllEmployees, selectedProjectId] // Add all relevant dependencies
+    [employees, showInactive, showAllEmployees, selectedProjectId]
   );
 
   useEffect(() => {
@@ -256,24 +259,18 @@ const EmployeeList = () => {
           />
         </GlobalModel>
       )}
-
+        {IsDeleteModalOpen && (
-      {IsDeleteModalOpen && (
         <ConfirmModal
           isOpen={IsDeleteModalOpen}
           type="delete"
-          header={
+          header="Suspend Employee"
-            selectedEmpFordelete?.isActive
+          message="Are you sure you want suspend?"
-              ? "Suspend Employee"
-              : "Reactivate Employee"
-          }
-          message={`Are you sure you want to ${selectedEmpFordelete?.isActive ? "suspend" : "reactivate"
-            } this employee?`}
           onSubmit={(id) =>
-            suspendEmployee({
+              suspendEmployee({
-              employeeId: id,
+                employeeId:id ,
-              active: !selectedEmpFordelete.isActive,
+                active: !selectedEmpFordelete.isActive,
-            })
+              })
-          }
+            }
           onClose={() => setIsDeleteModalOpen(false)}
           loading={employeeLodaing}
           paramData={selectedEmpFordelete.id}
@@ -499,8 +496,9 @@ const EmployeeList = () => {
                         Status
                       </th>
                       <th
-                        className={`sorting_disabled  ${!Manage_Employee && "d-none"
+                        className={`sorting_disabled  ${
-                          }`}
+                          !Manage_Employee && "d-none"
+                        }`}
                         rowSpan="1"
                         colSpan="1"
                         style={{ width: "50px" }}
@@ -520,9 +518,9 @@ const EmployeeList = () => {
                     )}
                     {/* Conditional messages for no data or no search results */}
                     {!loading &&
-                      displayData?.length === 0 &&
+                    displayData?.length === 0 &&
-                      searchText &&
+                    searchText &&
-                      !showAllEmployees ? (
+                    !showAllEmployees ? (
                       <tr>
                         <td colSpan={8}>
                           <small className="muted">
@@ -532,14 +530,14 @@ const EmployeeList = () => {
                       </tr>
                     ) : null}
                     {!loading &&
-                      displayData?.length === 0 &&
+                    displayData?.length === 0 &&
-                      (!searchText || showAllEmployees) ? (
+                    (!searchText || showAllEmployees) ? (
                       <tr>
                         <td
                           colSpan={8}
                           style={{ paddingTop: "20px", textAlign: "center" }}
                         >
-                          No Data Found
+                         No team members assigned yet
                         </td>
                       </tr>
                     ) : null}
@@ -558,7 +556,9 @@ const EmployeeList = () => {
                               <div className="d-flex flex-column">
                                 <a
                                   onClick={() =>
-                                    navigate(`/employee/${item.id}`)
+                                    navigate(
+                                      `/employee/${item.id}?for=attendance`
+                                    )
                                   }
                                   className="text-heading text-truncate cursor-pointer"
                                 >
@@ -594,9 +594,10 @@ const EmployeeList = () => {
                               {item.jobRole || "Not Assign Yet"}
                             </span>
                           </td>
-
                           <td className=" d-none  d-md-table-cell">
-                            {moment(item.joiningDate)?.format("DD-MMM-YYYY")}
+                            {item.joiningDate
+                              ? moment(item.joiningDate).format("DD-MMM-YYYY")
+                              : "NA"}
                           </td>
                           <td>
                             {showInactive ? (
@@ -625,56 +626,47 @@ const EmployeeList = () => {
                                   <i className="bx bx-dots-vertical-rounded bx-md"></i>
                                 </button>
                                 <div className="dropdown-menu dropdown-menu-end">
-                                  {/* View always visible */}
                                   <button
-                                    onClick={() => navigate(`/employee/${item.id}`)}
+                                    onClick={() =>
+                                      navigate(`/employee/${item.id}`)
+                                    }
                                     className="dropdown-item py-1"
                                   >
                                     <i className="bx bx-detail bx-sm"></i> View
                                   </button>
-
+                                  <button
-                                  {/* If ACTIVE employee */}
+                                    className="dropdown-item py-1"
-                                  {item.isActive && (
+                                    onClick={() => {
+                                      handleEmployeeModel(item.id);
+                                    }}
+                                  >
+                                    <i className="bx bx-edit bx-sm"></i> Edit
+                                  </button>
+                                  {!item.isSystem && (
                                     <>
                                       <button
                                         className="dropdown-item py-1"
-                                        onClick={() => handleEmployeeModel(item.id)}
+                                        onClick={() =>
+                                          handleOpenDelete(item)
+                                        }
                                       >
-                                        <i className="bx bx-edit bx-sm"></i> Edit
+                                        <i className="bx bx-task-x bx-sm"></i>{" "}
+                                        Suspend
                                       </button>
-
-                                      {/* Suspend only when active */}
-                                      {item.isActive && (
-                                        <button
-                                          className="dropdown-item py-1"
-                                          onClick={() => handleOpenDelete(item)}
-                                        >
-                                          <i className="bx bx-task-x bx-sm"></i> Suspend
-                                        </button>
-                                      )}
-
                                       <button
                                         className="dropdown-item py-1"
                                         type="button"
                                         data-bs-toggle="modal"
                                         data-bs-target="#managerole-modal"
-                                        onClick={() => setEmpForManageRole(item.id)}
+                                        onClick={() =>
+                                          setEmpForManageRole(item.id)
+                                        }
                                       >
-                                        <i className="bx bx-cog bx-sm"></i> Manage Role
+                                        <i className="bx bx-cog bx-sm"></i>{" "}
+                                        Manage Role
                                       </button>
-
                                     </>
                                   )}
-
-                                  {/* If INACTIVE employee AND inactive toggle is ON */}
-                                  {!item.isActive && showInactive && (
-                                    <button
-                                      className="dropdown-item py-1"
-                                      onClick={() => handleOpenDelete(item)}
-                                    >
-                                      <i className="bx bx-refresh bx-sm me-1"></i> Re-activate
-                                    </button>
-                                  )}
                                 </div>
                               </div>
                             </td>
@@ -691,8 +683,9 @@ const EmployeeList = () => {
                   <nav aria-label="Page">
                     <ul className="pagination pagination-sm justify-content-end py-1">
                       <li
-                        className={`page-item ${currentPage === 1 ? "disabled" : ""
+                        className={`page-item ${
-                          }`}
+                          currentPage === 1 ? "disabled" : ""
+                        }`}
                       >
                         <button
                           className="page-link btn-xs"
@@ -705,8 +698,9 @@ const EmployeeList = () => {
                       {[...Array(totalPages)]?.map((_, index) => (
                         <li
                           key={index}
-                          className={`page-item ${currentPage === index + 1 ? "active" : ""
+                          className={`page-item ${
-                            }`}
+                            currentPage === index + 1 ? "active" : ""
+                          }`}
                         >
                           <button
                             className="page-link"
@@ -718,8 +712,9 @@ const EmployeeList = () => {
                       ))}
 
                       <li
-                        className={`page-item ${currentPage === totalPages ? "disabled" : ""
+                        className={`page-item ${
-                          }`}
+                          currentPage === totalPages ? "disabled" : ""
+                        }`}
                       >
                         <button
                           className="page-link"