admin/marco.pms.web
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

Project dropdown should only include active ,On Hold and In Progress Projects only show in Projects page.

Browse Source
This commit is contained in:
Kartik Sharma 2025-07-23 10:52:30 +05:30
parent 3bd2a17c97
commit 6ce2860457
1 changed files with 45 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

75
src/components/Layout/Header.jsx
View File

@ -1,4 +1,3 @@
import getGreetingMessage from "../../utils/greetingHandler";
import {
cacheData,
@ -28,9 +27,19 @@ const Header = () => {
const navigate = useNavigate();
const HasManageProjectPermission = useHasUserPermission(MANAGE_PROJECT);
const isDirectoryPath = /^\/directory$/.test(location.pathname);
const isProjectPath = /^\/projects$/.test(location.pathname);
const isDashboard = /^\/dashboard$/.test(location.pathname) || /^\/$/.test(location.pathname) ;
const isDirectoryPath = /^\/directory$/.test(location.pathname);
const isProjectPath = /^\/projects$/.test(location.pathname);
const isDashboard =
/^\/dashboard$/.test(location.pathname) || /^\/$/.test(location.pathname);
// Define the specific project status IDs you want to filter by
const allowedProjectStatusIds = [
"603e994b-a27f-4e5d-a251-f3d69b0498ba", // On Hold
"cdad86aa-8a56-4ff4-b633-9c629057dfef", // In Progress
"ef1c356e-0fe0-42df-a5d3-8daee355492d", // Inactive
"b74da4c2-d07e-46f2-9919-e75e49b12731", // Active
];
const getRole = (roles, joRoleId) => {
if (!Array.isArray(roles)) return "User";
let role = roles.find((role) => role.id === joRoleId);
@ -38,7 +47,7 @@ const Header = () => {
};
const handleLogout = (e) => {
e.preventDefault();
e.preventDefault();
logout();
};
@ -83,11 +92,20 @@ const Header = () => {
(store) => store.localVariables.projectId
);
// Conditional filtering for projectsForDropdown
// If on Dashboard, show all projects. Otherwise, filter by allowedProjectStatusIds.
const projectsForDropdown = isDashboard
? projectNames // On dashboard, show all projects
: projectNames?.filter(project =>
allowedProjectStatusIds.includes(project.projectStatusId)
);
// Determine the display text for the project dropdown
let displayText = "All Projects";
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
);
@ -101,22 +119,20 @@ const Header = () => {
useEffect(() => {
if (
projectNames &&
projectNames && // Use the original projectNames for initial setting to ensure all are considered for initial state if needed
projectNames.length > 0 &&
selectedProject === undefined &&
!getCachedData("hasReceived")
) {
if(isDashboard){
dispatch(setProjectId(null));
}else{
dispatch(setProjectId(projectNames[0]?.id));
if (isDashboard) {
dispatch(setProjectId(null)); // Always set to null for "All Projects" on Dashboard initial load
} 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)); // Fallback to null if no allowed projects
}
}
}, [projectNames, selectedProject, dispatch]);
/** Check if current page is project details page or directory page */
// const isProjectPath = /^\/projects\/[a-f0-9-]{36}$/.test(location.pathname);
}, [projectNames, selectedProject, dispatch, isDashboard]);
const handler = useCallback(
@ -160,15 +176,16 @@ const Header = () => {
};
}, [handler, newProjectHandler]);
const handleProjectChange =(project)=>{
if(isProjectPath){
dispatch(setProjectId(project))
navigate("/projects/details")
} else{
dispatch(setProjectId(project))
}
}
const handleProjectChange = (project) => {
dispatch(setProjectId(project)); // Always set the projectId
if (isProjectPath && project !== null) {
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
};
console.log("Kartik sharma", projectNames);
return (
<nav
className="layout-navbar container-fluid mb-3 navbar navbar-expand-xl navbar-detached align-items-center bg-navbar-theme"
@ -191,7 +208,7 @@ const Header = () => {
<i className="rounded-circle bx bx-building-house bx-sm-lg bx-md me-2"></i>
<div className="btn-group">
<button
className={`btn btn-sm-sm btn-xl ${projectNames.length > 0 ? "dropdown-toggle" : ""
className={`btn btn-sm-sm btn-xl ${projectsForDropdown && projectsForDropdown.length > 0 ? "dropdown-toggle" : ""
} px-1`}
type="button"
data-bs-toggle="dropdown"
@ -200,29 +217,28 @@ const Header = () => {
{displayText}
</button>
{projectNames.length > 0 && (
{projectsForDropdown && projectsForDropdown.length > 0 && (
<ul
className="dropdown-menu"
style={{ overflow: "auto", maxHeight: "300px" }}
>
{isDashboard && (
<li>
<button
className="dropdown-item"
onClick={() => dispatch(setProjectId(null))}
onClick={() => handleProjectChange(null)} // Set projectId to null for "All Projects"
>
All Projects
</button>
</li>
)}
{[...projectNames]
{[...projectsForDropdown] // Sort the conditionally filtered list
.sort((a, b) => a?.name?.localeCompare(b.name))
.map((project) => (
<li key={project?.id}>
<button
className="dropdown-item"
onClick={()=>handleProjectChange(project?.id)}
onClick={() => handleProjectChange(project?.id)}
>
{project?.name}
{project?.shortName && (
@ -239,7 +255,6 @@ const Header = () => {
</div>
)}
<ul className="navbar-nav flex-row align-items-center ms-md-auto">
<li className="nav-item dropdown-shortcuts navbar-dropdown dropdown me-2 me-xl-0">
<a