2023-11-30 18:21:08 +04:00

46 lines
1.9 KiB
JavaScript

import './Navigation.css';
import { Navbar } from 'react-bootstrap';
import { Link } from 'react-router-dom';
import PropTypes from 'prop-types';
import 'bootstrap/dist/js/bootstrap.min';
import AdminHeaderComp from './components/AdminHeaderComp/AdminHeaderComp.jsx';
import ProfileHeaderComp from './components/ProfileHeaderComp/ProfileHeaderComp.jsx';
import RegHeaderComp from './components/RegHeaderComp/RegHeaderComp.jsx';
import LoginHeaderComp from './components/LoginHeaderComp/LoginHeaderComp.jsx';
const Navigation = ({ routes }) => {
const indexPageLink = routes.filter((route) => route.index === false).shift();
return (
<header>
<nav className="navbar navbar-expand-lg navbar-light bg-light sticky-top">
<div className="container-fluid">
<Navbar.Brand as={Link} to={indexPageLink?.path ?? '/'}>
<div className = "d-flex"><img className="img-fluid" src="src/assets/Logo.png"></img>
<div className = "LogoText d-none d-sm-block">
Codemonitor
</div>
</div>
</Navbar.Brand>
<button className="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span className="navbar-toggler-icon"></span>
</button>
<div className="navbar-collapse collapse justify-content-end" id="navbarNav">
<div className="navbar-nav">
<RegHeaderComp></RegHeaderComp>
<LoginHeaderComp></LoginHeaderComp>
</div>
</div>
</div>
</nav>
</header>
);
};
Navigation.propTypes = {
routes: PropTypes.array,
};
export default Navigation;