Password validation works but password is not shown in generated password thing

frontend/src/components/GeneratedPassword.js

@@ -1,23 +1,14 @@
-import React, { useEffect, useState } from "react";
+import React from "react";
 import "../App.css";
 
 export default function GeneratedPassword() {
-  const [genPassword, setGenPassword] = useState("");
 
+  const genPassword = "PASSWORT_MANUELL"
   const handleOnCopyEvent = (e) => {
     e.preventDefault();
     return false;
   };
 
-  useEffect(() => {
-    fetch("/api/protected/rcv_pw", {
-      method: "get",
-    }).then((response) => {
-      response.json().then((resp) => {
-        setGenPassword(resp.password);
-      });
-    });
-  }, []);
   return (
     <>
       <p onCopy={handleOnCopyEvent}>

frontend/src/components/pages/Study.js

@@ -70,36 +70,64 @@ export default function Study() {
 
   const handleOnPasteEvent = (e) => {
     e.preventDefault();
+    console.log("paste not allowed");
     return false;
   };
 
   const checkIfUsernameIsCorrect = () => {
-    console.log("serverUsername", serverUsername);
-    console.log("username", username);
     if (serverUsername === username) {
-      console.log("Passt soweit");
       return true;
     } else {
-      console.log("Passt gar nicht");
       return false;
     }
   };
 
+  const _genPassword = useRef(null);
+
+  const receiveRandomPassword = () => {
+    fetch("/api/rcv_pw", {
+      method: "get",
+    }).then((response) => {
+      response.json().then((resp) => {
+        _genPassword.current = resp.random_password;
+        console.log(_genPassword.current)
+      });
+    });
+  };
+
+  const checkIfPasswordIsCorrect = () => {
+    if (_genPassword.current === password) {
+      return true;
+    } else {
+      return false;
+    }
+  };
 
   const checkIfValuesAreCorrect = () => {
     checkIfUsernameIsCorrect();
+    checkIfPasswordIsCorrect();
+    console.log(checkIfPasswordIsCorrect());
+    if (checkIfPasswordIsCorrect() && checkIfUsernameIsCorrect) {
+      return true;
+    } else {
+      alert("Passt nicht")
+      return false;
+    }
   };
 
   const handleClickAtStepStart = () => {
     setIsStepStart(false);
     setIsStepNormal(true);
     handleLoggerOn();
+    receiveRandomPassword();
   };
 
   const handleClickAtStepNormal = () => {
-    checkIfValuesAreCorrect();
-    setIsStepNormal(false);
-    setIsStepPhone(true);
+    if (checkIfValuesAreCorrect()){
+      receiveRandomPassword();
+      setIsStepNormal(false);
+      setIsStepPhone(true);
+    }
   };
 
   const handleClickAtStepPhone = () => {