verify/register ui improvements (#50)

controller/account.go

@@ -55,16 +55,16 @@ func (self *createAccountHandler) Handle(params identity.CreateAccountParams) mi
 	}
 
 	if _, err := str.CreateAccountRequest(ar, tx); err != nil {
-		logrus.Error(err)
+		logrus.Errorf("error creating account request for '%v': %v", params.Body.Email, err)
 		return identity.NewCreateAccountInternalServerError().WithPayload(rest_model_zrok.ErrorMessage(err.Error()))
 	}
 	if err := tx.Commit(); err != nil {
-		logrus.Error(err)
+		logrus.Errorf("error committing account request for '%v': %v", params.Body.Email, err)
 		return identity.NewCreateAccountInternalServerError().WithPayload(rest_model_zrok.ErrorMessage(err.Error()))
 	}
 
 	if err := sendVerificationEmail(params.Body.Email, token, self.cfg); err != nil {
-		logrus.Error(err)
+		logrus.Errorf("error sending verification email for '%v': %v", params.Body.Email, err)
 		return identity.NewCreateAccountInternalServerError().WithPayload(rest_model_zrok.ErrorMessage(err.Error()))
 	}
 

ui/src/Login.js

@@ -4,7 +4,7 @@ import * as identity from './api/identity';
 const Login = (props) => {
     const [email, setEmail] = useState('');
     const [password, setPassword] = useState('');
-    const [failed, setFailed] = useState();
+    const [message, setMessage] = useState();
 
     const errorMessage = <h2 className={"errorMessage"}>Login Failed!</h2>;
 
@@ -24,7 +24,7 @@ const Login = (props) => {
                     console.log('login succeeded', resp)
                 } else {
                     console.log('login failed')
-                    setFailed(errorMessage);
+                    setMessage(errorMessage);
                 }
             })
             .catch((resp) => {
@@ -36,7 +36,7 @@ const Login = (props) => {
         <div className={"fullscreen"}>
             <img src={"ziggy.svg"} width={200}/>
             <h1>zrok</h1>
-            {failed}
+            {message}
             <form onSubmit={handleSubmit}>
                 <fieldset>
                     <legend>Log In</legend>

ui/src/Register.js

@@ -5,11 +5,32 @@ import * as identity from "./api/identity";
 const Proceed = (props) => {
     const [password, setPassword] = useState('');
     const [confirm, setConfirm] = useState('');
+    const [message, setMessage] = useState();
+
+    const passwordMismatchMessage = <h2 className={"errorMessage"}>Entered passwords do not match!</h2>
+    const registerFailed = <h2 className={"errorMessage"}>Account creation failed!</h2>
 
     const handleSubmit = async e => {
         e.preventDefault();
-        console.log("submit", password, confirm)
+        console.log("handleSubmit");
-    }
+        if(confirm !== password) {
+            setMessage(passwordMismatchMessage);
+        } else {
+            identity.register({body: {"token": props.token, "password": password}})
+                .then(resp => {
+                    if(!resp.error) {
+                        console.log("resp", resp)
+                        setMessage(undefined);
+                    } else {
+                        setMessage(registerFailed);
+                    }
+                })
+                .catch(resp => {
+                    console.log("resp", resp);
+                    setMessage(registerFailed);
+                });
+        }
+    };
 
     return (
         <div className={"fullscreen"}>
@@ -26,6 +47,7 @@ const Proceed = (props) => {
                     </p>
                 </fieldset>
             </form>
+            {message}
         </div>
     )
 }
@@ -67,7 +89,7 @@ const Register = () => {
 
     let step;
     if(!failed) {
-        step = <Proceed email={email}/>
+        step = <Proceed email={email} token={token}/>
     } else {
         step = <Failed />
     }