/* eslint-disable @next/next/no-img-element */ import {User} from "@/interfaces/user"; import {toast, ToastContainer} from "react-toastify"; import axios from "axios"; import {FormEvent, useState} from "react"; import Head from "next/head"; import useUser from "@/hooks/useUser"; import {Divider} from "primereact/divider"; import Button from "@/components/Low/Button"; import {BsArrowRepeat, BsCheck} from "react-icons/bs"; import Link from "next/link"; import Input from "@/components/Low/Input"; import clsx from "clsx"; import {useRouter} from "next/router"; const EMAIL_REGEX = new RegExp(/^[a-zA-Z0-9]+(?:\.[a-zA-Z0-9]+)*@[a-zA-Z0-9]+(?:\.[a-zA-Z0-9]+)*$/g); export default function Login() { const [email, setEmail] = useState(""); const [password, setPassword] = useState(""); const [rememberPassword, setRememberPassword] = useState(false); const [isLoading, setIsLoading] = useState(false); const router = useRouter(); const {user, mutateUser} = useUser({ redirectTo: "/", redirectIfFound: true, }); const forgotPassword = () => { if (!email || email.length < 0 || !EMAIL_REGEX.test(email)) { toast.error("Please enter your e-mail to reset your password!", {toastId: "forgot-invalid-email"}); return; } axios .post<{ok: boolean}>("/api/reset", {email}) .then((response) => { if (response.data.ok) { toast.success("You should receive an e-mail to reset your password!", {toastId: "forgot-success"}); return; } toast.error("That e-mail address is not connected to an account!", {toastId: "forgot-error"}); }) .catch(() => toast.error("That e-mail address is not connected to an account!", {toastId: "forgot-error"})); }; const login = (e: FormEvent) => { e.preventDefault(); setIsLoading(true); axios .post("/api/login", {email, password}) .then((response) => { toast.success("You have been logged in!", {toastId: "login-successful"}); mutateUser(response.data); }) .catch((e) => { if (e.response.status === 401) { toast.error("Wrong login credentials!", {toastId: "wrong-credentials"}); } else { toast.error("Something went wrong!", {toastId: "server-error"}); } setIsLoading(false); }) .finally(() => setIsLoading(false)); }; const sendEmailVerification = () => { setIsLoading(true); axios .post<{ok: boolean}>("/api/reset/sendVerification", {}) .catch((e) => { console.log(e); toast.error("Something went wrong, please logout and re-login.", {toastId: "send-verify-error"}); }) .finally(() => setIsLoading(false)); }; const logout = async () => { axios.post("/api/logout").finally(() => { setTimeout(() => router.reload(), 500); }); }; return ( <> Login | EnCoach
People smiling looking at a tablet
EnCoach's Logo

Login to your account

with your registered Email Address

{!user && ( <>
setEmail(e)} placeholder="Enter email address" /> setPassword(e)} placeholder="Password" />
setRememberPassword((prev) => !prev)}>
Remember my password
Forgot Password?
Don't have an account?{" "} Sign up )} {user && !user.isVerified && ( <>

Please confirm your account!

An e-mail has been sent to {user.email}, please click the link in it to confirm your account to be able to use the application.

Please refresh this page once it has been verified.
)}
); }