blob: 5a4cd29e405f99debc184f9990a8810af56cf5e9 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
|
import classNames from "classnames";
import React from 'react';
import Mailto from "react-mailto";
import {Link, withRouter} from "react-router-dom";
import {userIsLoggedIn} from "../../auth/index";
import Login from "../../containers/auth/Login";
import Logout from "../../containers/auth/Logout";
import ProfileName from "../../containers/auth/ProfileName";
import "./Navbar.css";
const NavItem = withRouter(props => <NavItemWithoutRoute {...props}/>);
const NavItemWithoutRoute = ({route, location, children}) => (
<li className={classNames("nav-item", location.pathname === route ? "active" : undefined)}>
{children}
</li>
);
const Navbar = () => (
<nav className="navbar fixed-top navbar-toggleable-md navbar-light bg-faded">
<div className="container">
<button className="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse"
data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span className="navbar-toggler-icon"/>
</button>
<Link className="navbar-brand opendc-brand" to="/">
<img src="/img/logo.png" alt="OpenDC Logo"/>
</Link>
<div className="collapse navbar-collapse" id="navbarSupportedContent">
<ul className="navbar-nav mr-auto">
<NavItem route="/simulations">
<Link className="nav-link simulations" title="Simulations"
to="/simulations">Simulations</Link>
</NavItem>
<NavItem route="email">
<Mailto className="nav-link support" title="Support" email="opendc.tudelft@gmail.com"
headers={{subject: "OpenDC Support"}}>
Support
</Mailto>
</NavItem>
</ul>
<ul className="navbar-nav">
{userIsLoggedIn() ?
[
<NavItem route="/profile">
<Link className="username nav-link" title="My Profile" to="/profile">
<ProfileName/>
</Link>
</NavItem>,
<NavItem route="logout">
<Logout/>
</NavItem>
] :
<NavItem route="login">
<Login visible={true}/>
</NavItem>
}
</ul>
</div>
</div>
</nav>
);
export default Navbar;
|