Enable 'enter' keystroke support for login page

1 files changed, 18 insertions, 7 deletions

diff --git a/frontend/src/components/login/Index.tsx b/frontend/src/components/login/Index.tsx
index e73e234a..15f2b507 100644
--- a/frontend/src/components/login/Index.tsx
+++ b/frontend/src/components/login/Index.tsx
@@ -20,6 +20,21 @@ const Login = ({ loginConnect }: Props) => {
     wrapperCol: { span: 32 },
   };
 
+  const login = () => {
+    loginConnect(nexusURL, username, password)
+      .then(() => {
+        setAuthenticationFailure(false);
+      })
+      .catch((err) => setAuthenticationFailure(true));
+  };
+
+  const enterPressed = (event) => {
+    let code = event.keyCode || event.which;
+    if (code === 13) {
+      login();
+    }
+  };
+
   return (
     <div className="login">
       {authenticationFailure ? (
@@ -43,25 +58,21 @@ const Login = ({ loginConnect }: Props) => {
           <Input
             placeholder="Username"
             onChange={(e) => setUsername(e.target.value)}
+            onKeyPress={(e) => enterPressed(e)}
           />
         </Form.Item>
         <Form.Item>
           <Input.Password
             placeholder="Password"
             onChange={(e) => setPassword(e.target.value)}
+            onKeyPress={(e) => enterPressed(e)}
           />
         </Form.Item>
         <div className="button">
           <Button
             type="primary"
             icon={<LoginOutlined />}
-            onClick={() =>
-              loginConnect(nexusURL, username, password)
-                .then(() => {
-                  setAuthenticationFailure(false);
-                })
-                .catch((err) => setAuthenticationFailure(true))
-            }
+            onClick={() => login()}
           >
             Login
           </Button>