From 52131aa3dd339e153c96f38080565a0ca858f3b7 Mon Sep 17 00:00:00 2001 From: cami Date: Thu, 22 Jul 2021 19:55:06 +0200 Subject: [PATCH 1/2] Refactoring.. - use STATES instead of multiple different variables - add check if password is correct - --- frontend/src/App.js | 2 +- frontend/src/components/Navbar.js | 16 +++++-- frontend/src/components/pages/Study.js | 60 +++++++++--------------- frontend/src/components/pages/Umfrage.js | 4 +- 4 files changed, 36 insertions(+), 46 deletions(-) diff --git a/frontend/src/App.js b/frontend/src/App.js index 415c951..26c93dc 100644 --- a/frontend/src/App.js +++ b/frontend/src/App.js @@ -9,10 +9,10 @@ import Privacy from "./components/pages/Privacy"; import Login from "./components/pages/Login"; import Register from "./components/pages/Register"; import Manual from "./components/pages/Manual"; -import Secret from "./components/pages/Secret"; import Umfrage from "./components/pages/Umfrage"; import PrivateRoute from "./auth/PrivateRoute"; import Study from "./components/pages/Study"; +import Secret from "./components/pages/Secret" function App() { return ( diff --git a/frontend/src/components/Navbar.js b/frontend/src/components/Navbar.js index a30ce29..5f8b68a 100644 --- a/frontend/src/components/Navbar.js +++ b/frontend/src/components/Navbar.js @@ -44,11 +44,17 @@ function Navbar() { Startseite -
  • - - Studie - -
    • + {isLoggedIn && ( +
  • + + Studie + +
    • + )}
  • Über diff --git a/frontend/src/components/pages/Study.js b/frontend/src/components/pages/Study.js index 071ebd8..54b8f8b 100644 --- a/frontend/src/components/pages/Study.js +++ b/frontend/src/components/pages/Study.js @@ -15,6 +15,15 @@ import { authFetch } from "../../auth/AuthProvider"; export default function Study() { const _logger = useRef(0); const [serverUsername, setServerUsername] = useState(""); + const [genPassword, setGenPassword] = useState(""); + const STATES = { + START: "start", + NORMAL: "normal", + PHONE: "phone", + STANDING: "standing", + END: "end", + }; + const [state, setState] = useState(STATES.START); useEffect(() => { _logger.current = new Logger({ @@ -44,12 +53,6 @@ export default function Study() { password = tmp_password; }; - const [isStepStart, setIsStepStart] = useState(true); - const [isStepNormal, setIsStepNormal] = useState(false); - const [isStepPhone, setIsStepPhone] = useState(false); - const [isStepStanding, setIsStepStanding] = useState(false); - const [isStepEnd, setIsStepEnd] = useState(false); - const handleLoggerOff = () => { _logger.current.stop(); console.log("Logger ausgeschaltet"); @@ -75,15 +78,9 @@ export default function Study() { }; const checkIfUsernameIsCorrect = () => { - if (serverUsername === username) { - return true; - } else { - return false; - } + return serverUsername === username; }; - const [genPassword, setGenPassword] = useState(""); - const receiveRandomPassword = () => { fetch("/api/rcv_pw", { method: "get", @@ -97,43 +94,31 @@ export default function Study() { }; const checkIfPasswordIsCorrect = () => { - if (genPassword === password) { - return true; - } else { - return false; - } + return genPassword === password; }; const checkIfValuesAreCorrect = () => { console.log(checkIfPasswordIsCorrect()); - if (checkIfPasswordIsCorrect() && checkIfUsernameIsCorrect()) { - return true; - } else { - alert("Passt nicht"); - return false; - } + return checkIfPasswordIsCorrect() && checkIfUsernameIsCorrect(); }; const handleClickAtStepStart = () => { receiveRandomPassword(); - setIsStepStart(false); - setIsStepNormal(true); + setState(STATES.NORMAL); handleLoggerOn(); }; const handleClickAtStepNormal = () => { if (checkIfValuesAreCorrect()) { receiveRandomPassword(); - setIsStepNormal(false); - setIsStepPhone(true); + setState(STATES.PHONE); } }; const handleClickAtStepPhone = () => { if (checkIfValuesAreCorrect()) { receiveRandomPassword(); - setIsStepPhone(false); - setIsStepStanding(true); + setState(STATES.STANDING); } else { console.log("Passwort und Benutzername stimmen nicht."); } @@ -141,8 +126,7 @@ export default function Study() { const handleClickAtStepStanding = () => { if (checkIfValuesAreCorrect()) { - setIsStepStanding(false); - setIsStepEnd(true); + setState(STATES.END); handleLoggerOff(); } else { console.log("Passwort und Benutzername stimmen nicht."); @@ -241,7 +225,7 @@ export default function Study() { onChange={handlePasswordChange} InputType="password" InputName="Passwort" - InputPlaceHolder="Benutzername" + InputPlaceHolder="Passwort" onPaste={handleOnPasteEvent} />

    Studie

    - {isStepStart ? study_start : null} - {isStepNormal ? study_normal : null} - {isStepPhone ? study_phone : null} - {isStepStanding ? study_standing : null} - {isStepEnd ? study_end : null} + {state === STATES.START ? study_start : null} + {state === STATES.NORMAL ? study_normal : null} + {state === STATES.PHONE ? study_phone : null} + {state === STATES.STANDING ? study_standing : null} + {state === STATES.END ? study_end : null}