src/hooks/useEmployees.js

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

src/pages/employee/EmployeeList.jsx

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