Show remote server hostname

components/server-info/index.js

@@ -0,0 +1,32 @@
+
+const os = require('os');
+
+const React = require('react');
+
+const r = require('r-dom');
+
+const { connect } = require('react-redux');
+
+const localHostname = os.hostname();
+const { username: localUsername } = os.userInfo();
+
+class ServerInfo extends React.Component {
+	render() {
+		const { username, hostname } = this.props.serverInfo;
+
+		const server = `${username}@${hostname}`;
+		const local = `${localUsername}@${localHostname}`;
+
+		return r.div({
+			className: 'server-info',
+		}, [
+			hostname && (server !== local) && r.span(server),
+		]);
+	}
+}
+
+module.exports = connect(
+	state => ({
+		serverInfo: state.pulse.serverInfo,
+	}),
+)(ServerInfo);

index.css

@@ -177,12 +177,21 @@ div[tabindex="-1"]:focus {
 	opacity: 1;
 }
 
+.server-info {
+	position: absolute;
+	bottom: 0;
+	right: 0;
+	padding: 1rem;
+	pointer-events: none;
+	opacity: 0.5;
+}
+
 .log {
 	position: absolute;
 	bottom: 0;
 	left: 0;
 	padding: 1rem;
-	overflow: auto;
+	overflow: hidden;
 	pointer-events: none;
 }
 

renderer.js

@@ -12,6 +12,7 @@ const Graph = require('./components/graph');
 const Cards = require('./components/cards');
 const Preferences = require('./components/preferences');
 const Log = require('./components/log');
+const ServerInfo = require('./components/server-info');
 const { HotKeys } = require('./components/hot-keys');
 const { MenuProvider } = require('./components/menu');
 const Modals = require('./components/modals');
@@ -28,6 +29,7 @@ const Root = () => r(ReduxProvider, {
 	r(Graph, { ref: graphRef, ...actions }),
 	r(Cards, { ref: cardsRef }),
 	r(Preferences, { ref: preferencesRef }),
+	r(ServerInfo),
 	r(Log),
 ]))));