diff --git a/src/components/App.js b/src/components/App.js index 528aa6a..26cae86 100644 --- a/src/components/App.js +++ b/src/components/App.js @@ -8,6 +8,7 @@ import * as Colors from "material-ui/colors"; import SideBar from "components/SideBar"; import ControlMap from "components/ControlMap"; +import TopBar from "components/TopBar"; export type AppProps = { config: Config @@ -42,12 +43,13 @@ class App extends React.Component { return this.props.config.controls[this.state.selectedControl]; } - // render() { return (
+ {false && }
diff --git a/src/components/TopBar.js b/src/components/TopBar.js new file mode 100644 index 0000000..9fe4243 --- /dev/null +++ b/src/components/TopBar.js @@ -0,0 +1,42 @@ +// @flow +import React from "react"; + +import AppBar from "material-ui/AppBar"; +import Toolbar from "material-ui/Toolbar"; +import Typography from "material-ui/Typography"; +import { CircularProgress } from "material-ui/Progress"; + +export type TopBarProps = { + title: string, + connected: boolean +}; + +export type TopBarState = { + +}; + +export default class TopBar extends React.Component { + constructor(props: TopBarProps) { + super(props); + } + + render() { + return ( + + + {this.renderConnectionIndicator()} + {this.props.title} + + + ); + } + + renderConnectionIndicator() { + if (this.props.connected) { + return (); + } + return ( + + ); + } +}