Give feedback when someone wants to register

backend/src/app.py

@@ -147,7 +147,7 @@ def register():
         )
         db.session.add(new_user)
         db.session.commit()
-        ret = {'message': 'Account erstellt für den Account {}'.format(
+        ret = {'message': 'Account erstellt für den Account {}. Du kannst dich nun einloggen'.format(
             new_user.username
         )}
         return ret, 200

frontend/src/components/pages/Register.js

@@ -11,6 +11,9 @@ export default function Login() {
   const [password, setPassword] = useState("");
 
   const [message, setMessage] = useState("");
+  const [errorMessage, setErrorMessage] = useState("");
+
+  const [isStatusOk, setIsStatusOk] = useState("");
 
   const onSubmitClick = (e) => {
     e.preventDefault();
@@ -22,16 +25,19 @@ export default function Login() {
       method: "post",
       body: JSON.stringify(opts),
     }).then((response) => {
-      console.log(response);
       if (response.status === 409) {
         /* 
         then is needed twice to get rid of the javascript Promise thing
         */
+        setIsStatusOk(false);
         response.json().then((resp2) => {
-          setMessage(resp2.message);
+          setErrorMessage(resp2.message);
         });
       } else if (response.status === 200) {
-        //TODO  redirect to login #77 or #74
+        response.json().then((resp) => {
+          setMessage(resp.message);
+        });
+        setIsStatusOk(true);
       }
     });
   };
@@ -55,7 +61,7 @@ export default function Login() {
             onChange={handleUsernameChange}
             InputName="username"
           />
-          <p className="errorMessage">{message}</p>
+          {!isStatusOk && <p className="errorMessage">{errorMessage}</p>}
           <InputField
             LabelName="Passwort"
             InputType="password"
@@ -65,6 +71,8 @@ export default function Login() {
           <br />
           <SubmitField onClick={onSubmitClick} LabelName="Registrieren" />
         </form>
+
+        {isStatusOk && <p>{message}</p>}
       </div>
       <Footer />
     </>