backend/src/app.py

@@ -103,7 +103,7 @@ def login():
         ret = {'access_token': guard.encode_jwt_token(user)}
         return ret, 200
     except flask_praetorian.exceptions.AuthenticationError:
-        ret = {'message': "Benutzername und Passwort stimmen nicht überein"}
+        ret = {'message': "Benutzername und Passwort stimmen nicht überein oder das Konto existiert noch nicht."}
         return ret, 401
 
 

frontend/src/components/pages/Login.js

@@ -66,7 +66,7 @@ export default function Login() {
               InputPlaceHolder="Passwort"
             />
             <br />
-            <ErrorMessage message={errorMessage}/>
+            <ErrorMessage message={errorMessage} />
             <SubmitField onClick={onSubmitClick} LabelName="Einloggen" />
           </form>
         ) : (

frontend/src/components/pages/Register.js

@@ -6,6 +6,8 @@ import InputField from "../InputField";
 import SubmitField from "../SubmitField";
 import "../Input.css";
 import ErrorMessage from "../ErrorMessage";
+import { login, useAuth } from "../../auth/AuthProvider";
+import { Redirect } from "react-router-dom";
 
 export default function Login() {
   const [username, setUsername] = useState("");
@@ -16,6 +18,8 @@ export default function Login() {
 
   const [isStatusOk, setIsStatusOk] = useState("");
 
+  const [isLoggedIn] = useAuth();
+
   const onSubmitClick = (e) => {
     e.preventDefault();
     let opts = {
@@ -37,6 +41,14 @@ export default function Login() {
       } else if (response.status === 200) {
         response.json().then((resp) => {
           setMessage(resp.message);
+          fetch("/api/login", {
+            method: "post",
+            body: JSON.stringify(opts),
+          }).then((response) => {
+            response.json().then((token) => {
+              login(token);
+            });
+          });
         });
         setIsStatusOk(true);
       }
@@ -73,7 +85,7 @@ export default function Login() {
           <SubmitField onClick={onSubmitClick} LabelName="Registrieren" />
         </form>
 
-        {isStatusOk && <p>{message}</p>}
+        {isLoggedIn && <Redirect to="/umfrage" />}
       </div>
       <Footer />
     </>

frontend/src/components/pages/Umfrage.js

@@ -7,6 +7,7 @@ import InputField from "../InputField";
 import SubmitField from "../SubmitField";
 import { authFetch } from "../../auth/AuthProvider";
 import ErrorMessage from "../ErrorMessage";
+import { Link } from "react-router-dom";
 
 export default function Umfrage() {
   /* values from survey */
@@ -116,6 +117,9 @@ export default function Umfrage() {
     <>
       <div className="sitePage">
         <h1> Umfrage</h1>
+        <p>
+          Super, die Registrierung hat funktioniert! Du bist nun eingeloggt und ich erfasse deine Tastaturanschläge und die Mausbewegungen. Wenn du dich wieder abmelden möchtest, kannst du das <Link to="/logout">hier</Link> machen.
+        </p>
         <p>
           Damit ich etwas über die Studienteilnehmenden erfahre, möchte ich hier
           eine kurze Erhebung einiger wichtiger Daten machen. Die Daten werden