-
-
Notifications
You must be signed in to change notification settings - Fork 13
/
AppBarComponent.tsx
47 lines (44 loc) · 1.4 KB
/
AppBarComponent.tsx
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
import { AppBar, Grid, Toolbar } from "@material-ui/core";
import React from "react";
import { getProjectId } from "../../backend/localStorage";
import { path } from "../../history";
import theme from "../../types/theme";
import Logo from "./Logo";
import NavigationButtons from "./NavigationButtons";
import ProjectNameButton from "./ProjectNameButton";
import UserMenu from "./UserMenu";
export interface AppBarComponentProps {
currentTab: path;
}
/** An app bar shown at the top of almost every page of The Combine */
export default function AppBarComponent(props: AppBarComponentProps) {
return (
<div className="NavigationBar" style={{ marginBottom: theme.spacing(12) }}>
<AppBar position="fixed" style={{ zIndex: theme.zIndex.drawer + 1 }}>
<Toolbar>
<Grid
container
justify="space-between"
spacing={2}
alignItems="center"
>
<Grid item xs>
<Logo />
{getProjectId() !== "" && (
<NavigationButtons currentTab={props.currentTab} />
)}
</Grid>
<Grid item xs>
{getProjectId() !== "" && (
<ProjectNameButton currentTab={props.currentTab} />
)}
</Grid>
<Grid item>
<UserMenu />
</Grid>
</Grid>
</Toolbar>
</AppBar>
</div>
);
}