From ffdce6f82544cf39c80c2f7c5585c63f9177ad46 Mon Sep 17 00:00:00 2001
From: Thomas Nordquist <xxnerowingerxx@gmail.com>
Date: Sun, 23 Jun 2019 12:29:52 +0200
Subject: [PATCH] Add keyboard events enter/escape to connect/disconnect

---
 .../ConnectionSetup/ConnectionSettings.tsx    | 25 ++++++++++++++++++-
 1 file changed, 24 insertions(+), 1 deletion(-)

diff --git a/app/src/components/ConnectionSetup/ConnectionSettings.tsx b/app/src/components/ConnectionSetup/ConnectionSettings.tsx
index e6d09c1..a42a6f1 100644
--- a/app/src/components/ConnectionSetup/ConnectionSettings.tsx
+++ b/app/src/components/ConnectionSetup/ConnectionSettings.tsx
@@ -26,6 +26,7 @@ import {
   TextField,
 } from '@material-ui/core'
 import ConnectionHealthIndicator from '../helper/ConnectionHealthIndicator'
+import { KeyCodes } from '../../utils/KeyCodes'
 
 interface Props {
   connection: ConnectionOptions
@@ -176,7 +177,7 @@ class ConnectionSettings extends React.Component<Props, State> {
     )
   }
 
-  private onClickConnect = () => {
+  private connect() {
     if (!this.props.connection) {
       return
     }
@@ -187,6 +188,28 @@ class ConnectionSettings extends React.Component<Props, State> {
     }
   }
 
+  private onClickConnect = () => {
+    this.connect()
+  }
+
+  private handleKeyEvent = (event: KeyboardEvent) => {
+    if (event.keyCode === KeyCodes.enter) {
+      this.connect()
+      event.preventDefault()
+    } else if (event.keyCode === KeyCodes.escape) {
+      this.props.actions.disconnect()
+      event.preventDefault()
+    }
+  }
+
+  public componentDidMount() {
+    document.addEventListener('keydown', this.handleKeyEvent, false)
+  }
+
+  public componentWillUnmount() {
+    document.removeEventListener('keydown', this.handleKeyEvent, false)
+  }
+
   public render() {
     const { classes, connection } = this.props