Files
the-biergarten-app/src/pages/users/confirm.tsx
2023-12-01 18:18:43 -05:00

74 lines
2.1 KiB
TypeScript

import useConfirmUser from '@/hooks/auth/useConfirmUser';
import createErrorToast from '@/util/createErrorToast';
import Head from 'next/head';
import { FC, useState } from 'react';
import { toast } from 'react-hot-toast';
const ConfirmUserPage: FC = () => {
const { needsToLogin, tokenInvalid } = useConfirmUser();
const [confirmationResent, setConfirmationResent] = useState(false);
const onClick = async () => {
const resentConfirmationLoadingToast = toast.loading(
'Resending your confirmation email.',
);
try {
const response = await fetch('/api/users/resend-confirmation', {
method: 'POST',
});
if (!response.ok) {
throw new Error('Something went wrong.');
}
toast.remove(resentConfirmationLoadingToast);
toast.success('Sent a new confirmation email.');
setConfirmationResent(true);
} catch (err) {
createErrorToast(err);
}
};
return (
<>
<Head>
<title>Confirm User | The Biergarten App</title>
</Head>
<div className="flex h-full flex-col items-center justify-center space-y-4">
{needsToLogin && (
<p className="text-center text-xl font-bold">
Please login to confirm your account.
</p>
)}
{!needsToLogin && tokenInvalid && !confirmationResent && (
<>
<p className="text-center text-2xl font-bold">
Your confirmation token is invalid or is expired.
</p>
<button
className="btn btn-outline btn-sm normal-case"
onClick={onClick}
type="button"
>
Click here to request a new token.
</button>
</>
)}
{!needsToLogin && tokenInvalid && confirmationResent && (
<>
<p className="text-center text-2xl font-bold">
Resent your confirmation link.
</p>
<p className="font-xl text-center">Please check your email.</p>
</>
)}
</div>
</>
);
};
export default ConfirmUserPage;