1import AppBar from '@material-ui/core/AppBar';
 2import CssBaseline from '@material-ui/core/CssBaseline';
 3import { createMuiTheme, ThemeProvider } from '@material-ui/core/styles';
 4import { makeStyles } from '@material-ui/styles';
 5import Toolbar from '@material-ui/core/Toolbar';
 6import React from 'react';
 7import { Route, Switch } from 'react-router';
 8import { Link } from 'react-router-dom';
 9
10import BugQuery from './bug/BugQuery';
11import ListQuery from './list/ListQuery';
12
13const theme = createMuiTheme({
14  palette: {
15    primary: {
16      main: '#263238',
17    },
18  },
19});
20
21const useStyles = makeStyles(theme => ({
22  offset: theme.mixins.toolbar,
23  appTitle: {
24    ...theme.typography.h6,
25    color: 'white',
26    textDecoration: 'none',
27    flexGrow: 1,
28  },
29}));
30
31export default function App() {
32  const classes = useStyles();
33
34  return (
35    <ThemeProvider theme={theme}>
36      <CssBaseline />
37      <AppBar position="fixed" color="primary">
38        <Toolbar>
39          <Link to="/" className={classes.appTitle}>
40            git-bug webui
41          </Link>
42        </Toolbar>
43      </AppBar>
44      <div className={classes.offset} />
45      <Switch>
46        <Route path="/" exact component={ListQuery} />
47        <Route path="/bug/:id" exact component={BugQuery} />
48      </Switch>
49    </ThemeProvider>
50  );
51}