cezenGIT/MySQL_conf_pbx/test1/reactcezenpbx/src/components/landing-page/navBar.jsx
2025-06-04 14:45:14 +05:30

76 lines
2.2 KiB
JavaScript
Executable File

import "./navStyleImpl.css";
import CezenBanner from "../login-logout/cezenBanar";
import operationsLogo from "../../assets/hammer-spanner-svgrepo-com.svg";
import profileLogo from "../../assets/profile-circle-svgrepo-com.svg";
import NavBarDropDown from "./drop_down/navBarDropDown";
import { useNavigate } from "react-router-dom";
import { useState } from "react";
export default function NavBar() {
const navTo = useNavigate();
return (
<nav className="navigation">
<div>
<CezenBanner className="cezen_banner_top" />
</div>
<div className="nav-item">
<div className="RHS_nav ops">
<div className="RHS_nav_pill">
<img src={operationsLogo} />
<span> operations</span>
</div>
<div className="drop-down pos_operations">
<NavBarDropDown>
{/* css is defined in the NavBarDropDown.css folder*/}
<li
onClick={() => {
navTo("/end-points");
}}
>
End-Points
</li>
<li
onClick={() => {
navTo("/features");
}}
>
Features
</li>
<li>Groups</li>
</NavBarDropDown>
</div>
</div>
<div className="RHS_nav prof">
<div className="RHS_nav_pill">
<img src={profileLogo} />
<span className="profile_text"> profile</span>
</div>
<div className="drop-down pos_profile">
<NavBarDropDown>
{/* css is defined in the NavBarDropDown.css folder*/}
<li
onClick={() => {
navTo("/edit-profile");
}}
>
Edit Profile
</li>
<li
className="log-out"
onClick={() => {
console.log("logout");
navTo("/log-in");
}}
>
Log-Out
</li>
</NavBarDropDown>
</div>
</div>
</div>
</nav>
);
}