From 9ee0e09a5e16f6f8fb82e3f07b2daaac9cec742d Mon Sep 17 00:00:00 2001
From: Tulir Asokan <tulir@maunium.net>
Date: Thu, 2 Jan 2020 00:46:38 +0200
Subject: [PATCH] Turn login div into form to allow using enter

---
 maubot/management/frontend/src/pages/Login.js | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/maubot/management/frontend/src/pages/Login.js b/maubot/management/frontend/src/pages/Login.js
index ac9829e..640d0df 100644
--- a/maubot/management/frontend/src/pages/Login.js
+++ b/maubot/management/frontend/src/pages/Login.js
@@ -30,7 +30,8 @@ class Login extends Component {
 
     inputChanged = event => this.setState({ [event.target.name]: event.target.value })
 
-    login = async () => {
+    login = async evt => {
+        evt.preventDefault()
         this.setState({ loading: true })
         const resp = await api.login(this.state.username, this.state.password)
         if (resp.token) {
@@ -53,17 +54,17 @@ class Login extends Component {
             </div>
         }
         return <div className="login-wrapper">
-            <div className={`login ${this.state.error && "errored"}`}>
+            <form className={`login ${this.state.error && "errored"}`} onSubmit={this.login}>
                 <h1>Maubot Manager</h1>
                 <input type="text" placeholder="Username" value={this.state.username}
                        name="username" onChange={this.inputChanged}/>
                 <input type="password" placeholder="Password" value={this.state.password}
                        name="password" onChange={this.inputChanged}/>
-                <button onClick={this.login}>
+                <button onClick={this.login} type="submit">
                     {this.state.loading ? <Spinner/> : "Log in"}
                 </button>
                 {this.state.error && <div className="error">{this.state.error}</div>}
-            </div>
+            </form>
         </div>
     }
 }