src/hooks/useEmployees.js

@@ -112,20 +112,18 @@ export const useEmployeesByProject = (projectId) => {
 };
 
 // EmployeeList.jsx
-export const useEmployeesAllOrByProjectId = (showAllEmployees ,projectId,
+export const useEmployeesAllOrByProjectId = (projectId, showInactive) => {
-      showInactive) => {
+  const isAllEmployees = !projectId && projectId !== undefined;
 
-
+  const queryKey = isAllEmployees
-const queryKey = showAllEmployees
+    ? ['allEmployees', showInactive]
-  ? ['allEmployees', showInactive]
+    : ['projectEmployees', projectId];
-  : ['projectEmployees', projectId, showInactive];
 
   const queryFn = async () => {
-  if (showAllEmployees) {
+  if (isAllEmployees) {
       const res = await EmployeeRepository.getAllEmployeeList(showInactive);
       return res.data;
     } else {
-       if (!projectId) return [];
       const res = await EmployeeRepository.getEmployeeListByproject(projectId);
       return res.data;
     }
@@ -139,7 +137,7 @@ const queryKey = showAllEmployees
   } = useQuery({
     queryKey,
     queryFn,
-    enabled:typeof showInactive === "boolean" && (showAllEmployees || !!projectId), 
+    enabled: isAllEmployees || !!projectId, 
   });
 
   return {

src/pages/employee/EmployeeList.jsx

@@ -51,7 +51,7 @@ const EmployeeList = () => {
 
   const { employees, loading, setLoading, error, recallEmployeeData } =
     useEmployeesAllOrByProjectId(
-      showAllEmployees ,selectedProjectId,
+      showAllEmployees ? null : selectedProjectId,
       showInactive
     );
 
@@ -153,7 +153,13 @@ const EmployeeList = () => {
     }
   };
 
-
+  const handleToggle = (e) => {
+    setShowInactive(e.target.checked);
+    recallEmployeeData(
+      e.target.checked,
+      showAllEmployees ? null : selectedProjectId
+    ); // Use selectedProjectId here
+  };
 
   const handleAllEmployeesToggle = (e) => {
     const isChecked = e.target.checked;
@@ -334,7 +340,7 @@ const EmployeeList = () => {
                             role="switch"
                             id="inactiveEmployeesCheckbox"
                             checked={showInactive}
-                            onChange={()=> setShowInactive(e.target.checked)}
+                            onChange={handleToggle}
                           />
                           <label
                             className="form-check-label ms-0"