diff --git a/src/app/auth/login/page.tsx b/src/app/auth/login/page.tsx index 348555bf..afb03f72 100644 --- a/src/app/auth/login/page.tsx +++ b/src/app/auth/login/page.tsx @@ -20,7 +20,7 @@ export default async function Page(props: { }) { const searchParams = await props.searchParams; const getUser = cache(verifySession); - const user = await getUser(); + const user = await getUser({ skipCheckVerifyEmail: true }); const isInvite = searchParams?.redirect?.includes("/invite"); diff --git a/src/app/auth/signup/page.tsx b/src/app/auth/signup/page.tsx index 242bf10b..debd7c58 100644 --- a/src/app/auth/signup/page.tsx +++ b/src/app/auth/signup/page.tsx @@ -6,7 +6,7 @@ import { Mail } from "lucide-react"; import Link from "next/link"; import { redirect } from "next/navigation"; import { cache } from "react"; -import { getTranslations } from 'next-intl/server'; +import { getTranslations } from "next-intl/server"; export const dynamic = "force-dynamic"; @@ -15,7 +15,7 @@ export default async function Page(props: { }) { const searchParams = await props.searchParams; const getUser = cache(verifySession); - const user = await getUser(); + const user = await getUser({ skipCheckVerifyEmail: true }); const t = await getTranslations(); const env = pullEnv(); @@ -56,10 +56,10 @@ export default async function Page(props: {

- {t('inviteAlready')} + {t("inviteAlready")}

- {t('inviteAlreadyDescription')} + {t("inviteAlreadyDescription")}

@@ -72,7 +72,7 @@ export default async function Page(props: { />

- {t('signupQuestion')}{" "} + {t("signupQuestion")}{" "} - {t('login')} + {t("login")}

diff --git a/src/app/auth/verify-email/VerifyEmailForm.tsx b/src/app/auth/verify-email/VerifyEmailForm.tsx index cbe1e5fb..e9761eef 100644 --- a/src/app/auth/verify-email/VerifyEmailForm.tsx +++ b/src/app/auth/verify-email/VerifyEmailForm.tsx @@ -10,7 +10,7 @@ import { CardContent, CardDescription, CardHeader, - CardTitle, + CardTitle } from "@/components/ui/card"; import { Form, @@ -19,21 +19,21 @@ import { FormField, FormItem, FormLabel, - FormMessage, + FormMessage } from "@/components/ui/form"; import { Input } from "@/components/ui/input"; import { InputOTP, InputOTPGroup, - InputOTPSlot, + InputOTPSlot } from "@/components/ui/input-otp"; import { AxiosResponse } from "axios"; import { VerifyEmailResponse } from "@server/routers/auth"; -import { Loader2 } from "lucide-react"; +import { ArrowRight, IdCard, Loader2 } from "lucide-react"; import { Alert, AlertDescription } from "../../../components/ui/alert"; import { toast } from "@app/hooks/useToast"; import { useRouter } from "next/navigation"; -import { formatAxiosError } from "@app/lib/api";; +import { formatAxiosError } from "@app/lib/api"; import { createApiClient } from "@app/lib/api"; import { useEnvContext } from "@app/hooks/useEnvContext"; import { cleanRedirect } from "@app/lib/cleanRedirect"; @@ -46,7 +46,7 @@ export type VerifyEmailFormProps = { export default function VerifyEmailForm({ email, - redirect, + redirect }: VerifyEmailFormProps) { const router = useRouter(); const t = useTranslations(); @@ -58,19 +58,34 @@ export default function VerifyEmailForm({ const api = createApiClient(useEnvContext()); + function logout() { + api.post("/auth/logout") + .catch((e) => { + console.error(t("logoutError"), e); + toast({ + title: t("logoutError"), + description: formatAxiosError(e, t("logoutError")) + }); + }) + .then(() => { + router.push("/auth/login"); + router.refresh(); + }); + } + const FormSchema = z.object({ - email: z.string().email({ message: t('emailInvalid') }), + email: z.string().email({ message: t("emailInvalid") }), pin: z.string().min(8, { - message: t('verificationCodeLengthRequirements'), - }), + message: t("verificationCodeLengthRequirements") + }) }); const form = useForm>({ resolver: zodResolver(FormSchema), defaultValues: { email: email, - pin: "", - }, + pin: "" + } }); async function onSubmit(data: z.infer) { @@ -78,19 +93,17 @@ export default function VerifyEmailForm({ const res = await api .post>("/auth/verify-email", { - code: data.pin, + code: data.pin }) .catch((e) => { - setError(formatAxiosError(e, t('errorOccurred'))); - console.error(t('emailErrorVerify'), e); + setError(formatAxiosError(e, t("errorOccurred"))); + console.error(t("emailErrorVerify"), e); setIsSubmitting(false); }); if (res && res.data?.data?.valid) { setError(null); - setSuccessMessage( - t('emailVerified') - ); + setSuccessMessage(t("emailVerified")); setTimeout(() => { if (redirect) { const safe = cleanRedirect(redirect); @@ -107,16 +120,16 @@ export default function VerifyEmailForm({ setIsResending(true); const res = await api.post("/auth/verify-email/request").catch((e) => { - setError(formatAxiosError(e, t('errorOccurred'))); - console.error(t('verificationCodeErrorResend'), e); + setError(formatAxiosError(e, t("errorOccurred"))); + console.error(t("verificationCodeErrorResend"), e); }); if (res) { setError(null); toast({ variant: "default", - title: t('verificationCodeResend'), - description: t('verificationCodeResendDescription'), + title: t("verificationCodeResend"), + description: t("verificationCodeResendDescription") }); } @@ -127,40 +140,26 @@ export default function VerifyEmailForm({
- {t('emailVerify')} + {t("emailVerify")} - {t('emailVerifyDescription')} + {t("emailVerifyDescription")} +

+ {email} +

- ( - - {t('email')} - - - - - - )} - /> - ( - {t('verificationCode')}
- - {t('verificationCodeEmailSent')} - )} /> +
+ +
+ {error && ( {error} @@ -222,29 +231,26 @@ export default function VerifyEmailForm({ type="submit" className="w-full" disabled={isSubmitting} + form="verify-email-form" > {isSubmitting && ( )} - {t('submit')} + {t("submit")} + + + - -
- -
); }