src/components/Layout/Header.jsx

@@ -33,9 +33,11 @@ const Header = () => {
     /^\/dashboard$/.test(location.pathname) || /^\/$/.test(location.pathname);
 
   // Define the specific project status IDs you want to filter by
+  // Changed to explicitly include only 'Active', 'On Hold', 'In Progress'
   const allowedProjectStatusIds = [
     "603e994b-a27f-4e5d-a251-f3d69b0498ba", // On Hold
     "cdad86aa-8a56-4ff4-b633-9c629057dfef", // In Progress
+    "ef1c356e-0fe0-42df-a5d3-8daee355492d", // Inactive - Removed as per requirement
     "b74da4c2-d07e-46f2-9919-e75e49b12731", // Active
   ];
 
@@ -66,6 +68,7 @@ const Header = () => {
           window.location.href = "/auth/login";
         })
         .catch((error) => {
+          // Even if logout API fails, clear local storage and redirect
           localStorage.removeItem("jwtToken");
           localStorage.removeItem("refreshToken");
           localStorage.removeItem("user");
@@ -91,10 +94,9 @@ const Header = () => {
   );
 
   // Conditional filtering for projectsForDropdown
-  // This list will be shown in the dropdown for regular users (without MANAGE_PROJECT permission)
+  // If on Dashboard, show all projects. Otherwise, filter by allowedProjectStatusIds.
-  // On Dashboard, it will contain all projects. On other pages, only allowed statuses.
   const projectsForDropdown = isDashboard
-    ? projectNames // On dashboard, show all projects for selection if managing permission is given
+    ? projectNames // On dashboard, show all projects
     : projectNames?.filter(project =>
         allowedProjectStatusIds.includes(project.projectStatusId)
       );
@@ -104,9 +106,11 @@ const Header = () => {
   if (selectedProject === null) {
     displayText = "All Projects";
   } else if (selectedProject) {
+    // Find the selected project from the full projectNames list
     const selectedProjectObj = projectNames?.find(
       (p) => p?.id === selectedProject
     );
+    // Fallback to selectedProject ID if name not found during loading or mismatch
     displayText = selectedProjectObj ? selectedProjectObj.name : selectedProject;
   } else if (projectLoading) {
     displayText = "Loading...";
@@ -121,22 +125,15 @@ const Header = () => {
       selectedProject === undefined &&
       !getCachedData("hasReceived")
     ) {
-      if (isDashboard && HasManageProjectPermission) {
+      if (isDashboard) {
-        dispatch(setProjectId(null)); // "All Projects" default for managers on dashboard
+        dispatch(setProjectId(null)); // Always set to null for "All Projects" on Dashboard initial load
-      } else if (isDashboard && !HasManageProjectPermission) {
-        // If regular user on dashboard, and only one project, select that one
-        if (projectNames.length === 1) {
-          dispatch(setProjectId(projectNames[0].id));
-        } else {
-          dispatch(setProjectId(null)); // If multiple projects, default to "All Projects" for regular users on dashboard
-        }
       } else {
         // If not dashboard, set to the first project that matches the allowed statuses if available
         const firstAllowedProject = projectNames.find(project => allowedProjectStatusIds.includes(project.projectStatusId));
-        dispatch(setProjectId(firstAllowedProject?.id || null));
+        dispatch(setProjectId(firstAllowedProject?.id || null)); // Fallback to null if no allowed projects
       }
     }
-  }, [projectNames, selectedProject, dispatch, isDashboard, HasManageProjectPermission]);
+  }, [projectNames, selectedProject, dispatch, isDashboard]);
 
 
   const handler = useCallback(
@@ -181,27 +178,17 @@ const Header = () => {
   }, [handler, newProjectHandler]);
 
   const handleProjectChange = (project) => {
-    dispatch(setProjectId(project));
+    dispatch(setProjectId(project)); // Always set the projectId
 
     if (isProjectPath && project !== null) {
-      navigate("/projects/details");
+      navigate("/projects/details"); // Navigate only if on /projects and a specific project is selected
     }
+    // No navigation if on dashboard or if "All Projects" is selected
   };
 
   // Determine if the dropdown should be shown
-  const shouldShowDropdown = (() => {
+  const shouldShowDropdown =
-    if (HasManageProjectPermission) {
+    isDashboard || (projectsForDropdown && projectsForDropdown.length > 1);
-      // Managers always see the dropdown if there's more than one project (total)
-      return projectNames && projectNames.length > 1;
-    } else {
-      // Regular users only see the dropdown if they have more than one *assigned* project
-      return projectsForDropdown && projectsForDropdown.length > 1;
-    }
-  })();
-
-  // Determine if "All Projects" option should be displayed in the dropdown
-  const shouldShowAllProjectsOption = HasManageProjectPermission || (isDashboard && projectsForDropdown && projectsForDropdown.length > 1);
-
 
   return (
     <nav
@@ -224,6 +211,7 @@ const Header = () => {
           <div className="align-items-center">
             <i className="rounded-circle bx bx-building-house bx-sm-lg bx-md me-2"></i>
             <div className="btn-group">
+              {/* Conditionally render the button based on shouldShowDropdown */}
               {shouldShowDropdown ? (
                 <button
                   className={`btn btn-sm-sm btn-xl ${projectsForDropdown && projectsForDropdown.length > 0 ? "dropdown-toggle" : ""
@@ -235,7 +223,7 @@ const Header = () => {
                   {displayText}
                 </button>
               ) : (
-                // If only one project, or no dropdown needed, just display its name
+                // If only one project, just display its name without a dropdown
                 <span className="btn btn-sm-sm btn-xl px-1">
                   {projectsForDropdown && projectsForDropdown.length === 1
                     ? projectsForDropdown[0].name
@@ -243,22 +231,23 @@ const Header = () => {
                 </span>
               )}
 
-              {shouldShowDropdown && (
+              {/* Only render the dropdown menu if shouldShowDropdown is true */}
+              {shouldShowDropdown && projectsForDropdown && projectsForDropdown.length > 0 && (
                 <ul
                   className="dropdown-menu"
                   style={{ overflow: "auto", maxHeight: "300px" }}
                 >
-                  {shouldShowAllProjectsOption && (
+                  {isDashboard && (
                     <li>
                       <button
                         className="dropdown-item"
-                        onClick={() => handleProjectChange(null)}
+                        onClick={() => handleProjectChange(null)} // Set projectId to null for "All Projects"
                       >
                         All Projects
                       </button>
                     </li>
                   )}
-                  {[...projectsForDropdown]
+                  {[...projectsForDropdown] // Sort the conditionally filtered list
                     .sort((a, b) => a?.name?.localeCompare(b.name))
                     .map((project) => (
                       <li key={project?.id}>