From ee2dbe0f7b01bb52822dcf5b775c61db5f09faef Mon Sep 17 00:00:00 2001
From: uwap <me@uwap.name>
Date: Sat, 10 Nov 2018 04:52:44 +0100
Subject: [PATCH] Add Github and Feedback link

---
 src/components/App.js    |  3 +--
 src/components/TopBar.js | 20 +++++++++++++++++---
 2 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/src/components/App.js b/src/components/App.js
index 4adddcf..99b47f8 100644
--- a/src/components/App.js
+++ b/src/components/App.js
@@ -147,8 +147,7 @@ class App extends React.PureComponent<AppProps & Classes, AppState> {
         state: this.state.mqttState,
         changeState: this.changeState
       }}>
-        <TopBar title={`${this.props.config.space.name} Map`}
-          connected={this.state.mqttConnected}
+        <TopBar connected={this.state.mqttConnected}
           onSearch={(s) => this.setState({ search: s })} />
         <SideBar open={this.state.drawerOpened}
           control={this.state.selectedControl}
diff --git a/src/components/TopBar.js b/src/components/TopBar.js
index 43d52e5..0510711 100644
--- a/src/components/TopBar.js
+++ b/src/components/TopBar.js
@@ -3,14 +3,14 @@ import React from "react";
 
 import AppBar from "@material-ui/core/AppBar";
 import Toolbar from "@material-ui/core/Toolbar";
-import Typography from "@material-ui/core/Typography";
 import CircularProgress from "@material-ui/core/CircularProgress";
 import InputBase from "@material-ui/core/InputBase";
 import { fade } from "@material-ui/core/styles/colorManipulator";
 import { withStyles } from "@material-ui/core/styles";
+import Tooltip from "@material-ui/core/Tooltip";
+import IconButton from "@material-ui/core/IconButton";
 
 export type TopBarProps = {
-  title: string,
   connected: boolean,
   onSearch: string => void
 };
@@ -85,13 +85,27 @@ const RawSearch = (props: SearchBarProps & Classes) => (
 
 const Search = withStyles(searchStyles)(RawSearch);
 
+const openOnGithub = () => window.open(
+  "https://github.com/uwap/mqtt-control-map", "_blank");
+
+const sendFeedback = () => window.open("mailto:mail+feedback@uwap.name");
+
 const TopBar = (props: TopBarProps) => (
   <AppBar position="static">
     <Toolbar>
       {renderConnectionIndicator(props.connected)}
       <Search onSearch={props.onSearch} />
       <span style={{flex: 1}}></span>
-      <Typography variant="title">{props.title}</Typography>
+      <Tooltip title="Github">
+        <IconButton onClick={openOnGithub} style={{ fontSize: "28px" }}>
+          <i className="mdi mdi-github-circle"></i>
+        </IconButton>
+      </Tooltip>
+      <Tooltip title="Send me feedback">
+        <IconButton onClick={sendFeedback} style={{ fontSize: "28px" }}>
+          <i className="mdi mdi-email-plus"></i>
+        </IconButton>
+      </Tooltip>
     </Toolbar>
   </AppBar>
 );