2019-07-21 18:05:07 +00:00
|
|
|
import * as React from "react";
|
|
|
|
|
2020-05-19 13:45:27 +00:00
|
|
|
import { Alignment, Navbar, Classes } from "@blueprintjs/core";
|
2019-07-21 18:05:07 +00:00
|
|
|
import { IconNames } from "@blueprintjs/icons";
|
|
|
|
|
|
|
|
import { match, NavLink } from "react-router-dom";
|
2020-05-19 13:45:27 +00:00
|
|
|
import { InstanceDomainPath } from "../../constants";
|
2019-07-21 18:05:07 +00:00
|
|
|
|
2020-05-19 13:45:27 +00:00
|
|
|
interface NavState {
|
2019-07-21 18:05:07 +00:00
|
|
|
aboutIsOpen: boolean;
|
|
|
|
}
|
|
|
|
|
2020-05-19 13:45:27 +00:00
|
|
|
const graphIsActive = (currMatch: match<InstanceDomainPath>, location: Location) =>
|
|
|
|
location.pathname === "/" || location.pathname.startsWith("/instance/");
|
2019-07-21 18:05:07 +00:00
|
|
|
|
2020-05-19 13:45:27 +00:00
|
|
|
class Nav extends React.Component<{}, NavState> {
|
2019-07-21 18:05:07 +00:00
|
|
|
constructor(props: any) {
|
|
|
|
super(props);
|
|
|
|
this.state = { aboutIsOpen: false };
|
|
|
|
}
|
|
|
|
|
|
|
|
public render() {
|
|
|
|
return (
|
2020-06-19 10:46:43 +00:00
|
|
|
<nav role="navigation">
|
|
|
|
<Navbar fixedToTop={true}>
|
|
|
|
<Navbar.Group align={Alignment.LEFT}>
|
2021-07-30 16:53:51 +00:00
|
|
|
<Navbar.Heading>index.community</Navbar.Heading>
|
2020-06-19 10:46:43 +00:00
|
|
|
<Navbar.Divider />
|
|
|
|
<NavLink
|
|
|
|
to="/"
|
|
|
|
className={`${Classes.BUTTON} ${Classes.MINIMAL} bp3-icon-${IconNames.GLOBE_NETWORK}`}
|
|
|
|
isActive={graphIsActive as any}
|
|
|
|
activeClassName="current-navbar-item"
|
|
|
|
>
|
|
|
|
Home
|
|
|
|
</NavLink>
|
|
|
|
<NavLink
|
|
|
|
to="/instances"
|
|
|
|
className={`${Classes.BUTTON} ${Classes.MINIMAL} bp3-icon-${IconNames.TH}`}
|
|
|
|
activeClassName="current-navbar-item"
|
|
|
|
>
|
|
|
|
Instances
|
|
|
|
</NavLink>
|
|
|
|
<NavLink
|
|
|
|
to="/about"
|
|
|
|
className={`${Classes.BUTTON} ${Classes.MINIMAL} bp3-icon-${IconNames.INFO_SIGN}`}
|
|
|
|
activeClassName="current-navbar-item"
|
|
|
|
exact={true}
|
|
|
|
>
|
|
|
|
About
|
|
|
|
</NavLink>
|
|
|
|
</Navbar.Group>
|
|
|
|
<Navbar.Group align={Alignment.RIGHT}>
|
|
|
|
<NavLink
|
|
|
|
to="/admin"
|
|
|
|
className={`${Classes.BUTTON} ${Classes.MINIMAL} bp3-icon-${IconNames.COG}`}
|
|
|
|
activeClassName="current-navbar-item"
|
|
|
|
>
|
|
|
|
Administration
|
|
|
|
</NavLink>
|
|
|
|
</Navbar.Group>
|
|
|
|
</Navbar>
|
|
|
|
</nav>
|
2019-07-21 18:05:07 +00:00
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
export default Nav;
|