import { FormEvent, useState } from "react"; import Head from "next/head"; import Image from "next/image"; import Link from "next/link"; import Button from "@app/components/basic/buttons/Button"; import InputField from "@app/components/basic/InputField"; import { EmailServiceSetupModal } from "@app/components/v2"; import { usePopUp } from "@app/hooks"; import { useSendPasswordResetEmail } from "@app/hooks/api"; import { useFetchServerStatus } from "@app/hooks/api/serverDetails"; export default function VerifyEmail() { const [loading, setLoading] = useState(false); const [email, setEmail] = useState(""); const [step, setStep] = useState(1); const { data: serverDetails } = useFetchServerStatus(); const { handlePopUpToggle, popUp, handlePopUpOpen } = usePopUp(["setUpEmail"] as const); const { mutateAsync } = useSendPasswordResetEmail(); /** * This function sends the verification email and forwards a user to the next step. */ const sendVerificationEmail = async () => { if (email) { await mutateAsync({ email }); setStep(2); } }; const onSubmit = (e: FormEvent) => { e.preventDefault(); setLoading(true); if (serverDetails?.emailConfigured) { sendVerificationEmail(); } else { handlePopUpOpen("setUpEmail"); setLoading(false); } }; return (
Login
long logo
{step === 1 && (

Forgot your password?

You will need your emergency kit. Enter your email to start account recovery.

)} {step === 2 && (

Look for an email in your inbox.

An email with instructions has been sent to {email}.

)} handlePopUpToggle("setUpEmail", isOpen)} />
); }