Fix up logic on login

src/components/AuthMenu.js

@@ -11,10 +11,16 @@ class AuthMenu extends Component {
         email: ""
     }
 
-    this.handleAccountCreation = this.handleAccountCreation.bind(this)
     this.handleInputChange = this.handleInputChange.bind(this)
+
+    this.handleEmailRequestForAccountCreation = this.handleEmailRequestForAccountCreation.bind(this)
+
     this.handlePasswordForLogin = this.handlePasswordForLogin.bind(this)
-    this.handleEmailRequest = this.handleEmailRequest.bind(this)
+    this.handlePasswordForAccountCreation = this.handlePasswordForAccountCreation.bind(this)
+
+    this.handleLogin = this.handleLogin.bind(this)
+    this.handleCreateAccount = this.handleCreateAccount.bind(this)
+
     this.authMenu = this.authMenu.bind(this)
 
   }
@@ -30,6 +36,13 @@ class AuthMenu extends Component {
     });
   }
 
+  handleEmailRequestForAccountCreation() {
+    this.setState(state => ({
+      where_in_auth_menu: "requestEmail",
+      auth_menu_visible: true,
+    }));
+  }
+
   handlePasswordForLogin() {
     this.setState(state => ({
       where_in_auth_menu: "requestPasswordForLogin",
@@ -37,25 +50,32 @@ class AuthMenu extends Component {
     }));
   }
 
-  handleEmailRequest() {
+  handlePasswordForAccountCreation() {
-    this.setState(state => ({
-      where_in_auth_menu: "requestEmail",
-      auth_menu_visible: true,
-    }));
-  }
-
-  handleAccountCreation() {
     this.setState(state => ({
       where_in_auth_menu: "requestPasswordForCreation",
       auth_menu_visible: true,
     }));
   }
 
+  handleLogin() {
+    this.setState(state => ({
+      where_in_auth_menu: "requestPasswordForCreation",
+      auth_menu_visible: true,
+    }));
+  }
+
+  handleCreateAccount() {
+    this.setState(state => ({
+      where_in_auth_menu: "requestPasswordForCreation",
+      auth_menu_visible: true,
+    }));
+  }
 
   authMenu() {
     if (!this.props.auth_menu_visible) {
         return null;
     }
+    const { username, password, email } = this.state;
     switch(this.state.where_in_auth_menu) {
       case 'requestUsername':
         return (
@@ -65,12 +85,13 @@ class AuthMenu extends Component {
                 type="text"
                 placeholder="Username"
                 name="username"
+                value={username}
                 onChange={this.handleInputChange}
             ></input>
               <i className="users icon"></i>
             </div>
             <div className="fluid ui buttons">
-              <button onClick={this.handleEmailRequest} className="blue ui button">Sign Up</button>
+              <button onClick={this.handleEmailRequestForAccountCreation} className="blue ui button">Sign Up</button>
               <div className="or"></div>
               <button onClick={this.handlePasswordForLogin} className="ui teal button">Sign In</button>
             </div>
@@ -81,14 +102,15 @@ class AuthMenu extends Component {
           <div className="ui menu dropdown" style={{display: "inline"}}>
             <div className="ui left icon input">
               <input
-                type="text"
+                type={"password"}
                 placeholder="Password"
                 name="password"
+                value={password}
                 onChange={this.handleInputChange}
               ></input>
               <i className="lock icon"></i>
             </div>
-            <button onClick={this.handleLogInAttempt} className="fluid ui positive button">Log In</button>
+            <button onClick={this.handleLogin} className="fluid ui positive button">Log In</button>
           </div>
         )
       case 'requestEmail':
@@ -98,25 +120,29 @@ class AuthMenu extends Component {
               <input
                 type="text"
                 placeholder="email@address.tld"
-                name="email">
+                name="email"
+                value={email}
                 onChange={this.handleInputChange}
               ></input>
               <i className="mail icon"></i>
             </div>
-            <button onClick={this.handleAccountCreation} className="fluid ui teal button">Next</button>
+            <button onClick={this.handlePasswordForAccountCreation} className="fluid ui teal button">Next</button>
           </div>
         )
       case 'requestPasswordForCreation':
         return (
           <div className="ui menu dropdown" style={{display: "inline"}}>
             <div className="ui left icon input">
-              <input type="text"
+              <input
-                 placeholder="Password"
+                type={"password"}
-                 name="password"
+                placeholder="Password"
+                name="password"
+                value={password}
+                onChange={this.handleInputChange}
               ></input>
               <i className="lock icon"></i>
             </div>
-            <button onClick={this.handleLogInAttempt} className="fluid ui positive button">Create Account!</button>
+            <button onClick={this.handleCreateAccount} className="fluid ui positive button">Create Account!</button>
           </div>
         )
       default: