99 lines
3.2 KiB
JavaScript

import React from "react";
import {hasUserPermission} from "../../utils/authUtils";
import {useHasUserPermission} from "../../hooks/useHasUserPermission";
import { VIEW_PROJECT_INFRA} from "../../utils/constants";
const ProjectNav = ( {onPillClick, activePill} ) =>
{
const HasViewInfraStructure = useHasUserPermission( VIEW_PROJECT_INFRA )
return (
<div className="col-md-12">
<div className="nav-align-top">
<ul className="nav nav-pills flex-column flex-sm-row mb-6">
<li className="nav-item">
<a
className={`nav-link ${activePill === "profile" ? "active" : ""}`}
href="#"
onClick={(e) => {
e.preventDefault(); // Prevent page reload
onPillClick("profile");
}}
>
<i className="bx bx-user bx-sm me-1_5"></i> Profile
</a>
</li>
<li className="nav-item">
<a
className={`nav-link ${activePill === "teams" ? "active" : ""}`}
href="#"
onClick={(e) => {
e.preventDefault(); // Prevent page reload
onPillClick("teams");
}}
>
<i className="bx bx-group bx-sm me-1_5"></i> Teams
</a>
</li>
<li className={`nav-item ${!HasViewInfraStructure && 'd-none'} `}>
<a
className={`nav-link ${activePill === "infra" ? "active" : ""}`}
href="#"
onClick={(e) => {
e.preventDefault(); // Prevent page reload
onPillClick("infra");
}}
>
<i className="bx bx-grid-alt bx-sm me-1_5"></i> Infrastructure
</a>
</li>
<li className="nav-item">
<a
className={`nav-link ${
activePill === "workplan" ? "active" : ""
}`}
href="#"
onClick={(e) => {
e.preventDefault(); // Prevent page reload
onPillClick("workplan");
}}
>
<i className="bx bx-link bx-sm me-1_5"></i> Work Plan
</a>
</li>
<li className="nav-item">
<a
className={`nav-link ${
activePill === "imagegallary" ? "active" : ""
}`}
href="#"
onClick={(e) => {
e.preventDefault(); // Prevent page reload
onPillClick("imagegallary");
}}
>
<i className="bx bx-link bx-sm me-1_5"></i> Image Gallary
</a>
</li>
<li className="nav-item">
<a
className={`nav-link ${
activePill === "activities" ? "active" : ""
}`}
href="#"
onClick={(e) => {
e.preventDefault(); // Prevent page reload
onPillClick("activities");
}}
>
<i className="bx bx-link bx-sm me-1_5"></i> Activities
</a>
</li>
</ul>
</div>
</div>
);
};
export default ProjectNav;