diff --git a/src/pages/LoginPage.tsx b/src/pages/LoginPage.tsx index 3cf3e191a..b6e8b4a8c 100644 --- a/src/pages/LoginPage.tsx +++ b/src/pages/LoginPage.tsx @@ -11,12 +11,22 @@ const LoginPage = () => { const [password, setPassword] = useState(""); const [error, setError] = useState(""); const navigate = useNavigate(); + const [loginAttempts, setLoginAttempts] = useState(0); + + const [captcha, setCaptcha] = useState(""); + const [showCaptcha, setShowCaptcha] = useState(false); const handleLogin = async (e: React.FormEvent) => { e.preventDefault(); setError(""); try { + + if(showCaptcha && captcha.toLowerCase() !== "laudenbach") { + setError("Captcha falsch. Bitte versuche es erneut."); + return; + } + const res = await fetch(`${apiBase}/api/login`, { method: "POST", headers: { "Content-Type": "application/json" }, @@ -39,6 +49,12 @@ const LoginPage = () => { setError("Zu viele fehlgeschlagene Login-Versuche. Bitte versuch es später erneut."); } else { setError("Login fehlgeschlagen. Bitte prüfe Benutzername und Passwort."); + const newAttempts = loginAttempts + 1; + setLoginAttempts(newAttempts); + + if(newAttempts >= 3) { + setShowCaptcha(true); + } } } @@ -66,6 +82,17 @@ const LoginPage = () => { onChange={(e) => setPassword(e.target.value)} required /> + {showCaptcha && ( +
{error}
}