use maizzle for email templating, starting with reset password email
This commit is contained in:
@ -1,26 +1,27 @@
|
||||
import type { BlitzPage } from "blitz";
|
||||
import { Routes, useMutation } from "blitz";
|
||||
|
||||
import BaseLayout from "../../core/layouts/base-layout";
|
||||
import BaseLayout from "app/core/layouts/base-layout";
|
||||
import { AuthForm as Form, FORM_ERROR } from "../components/auth-form";
|
||||
import { LabeledTextField } from "../components/labeled-text-field";
|
||||
import { ForgotPassword } from "../validations";
|
||||
import forgotPassword from "../../auth/mutations/forgot-password";
|
||||
import forgotPassword from "app/auth/mutations/forgot-password";
|
||||
|
||||
const ForgotPasswordPage: BlitzPage = () => {
|
||||
const [forgotPasswordMutation, { isSuccess }] = useMutation(forgotPassword);
|
||||
const [forgotPasswordMutation, { isSuccess, reset }] = useMutation(forgotPassword);
|
||||
|
||||
return (
|
||||
<Form
|
||||
texts={{
|
||||
title: isSuccess ? "Request submitted" : "Forgot your password?",
|
||||
subtitle: "",
|
||||
submit: isSuccess ? "" : "Send reset password instructions",
|
||||
submit: isSuccess ? "" : "Send reset password link",
|
||||
}}
|
||||
schema={ForgotPassword}
|
||||
initialValues={{ email: "" }}
|
||||
onSubmit={async (values) => {
|
||||
try {
|
||||
reset();
|
||||
await forgotPasswordMutation(values);
|
||||
} catch (error: any) {
|
||||
return {
|
||||
@ -30,7 +31,9 @@ const ForgotPasswordPage: BlitzPage = () => {
|
||||
}}
|
||||
>
|
||||
{isSuccess ? (
|
||||
<p>If your email is in our system, you will receive instructions to reset your password shortly.</p>
|
||||
<p className="text-center">
|
||||
If your email is in our system, you will receive instructions to reset your password shortly.
|
||||
</p>
|
||||
) : (
|
||||
<LabeledTextField name="email" label="Email" />
|
||||
)}
|
||||
@ -40,6 +43,6 @@ const ForgotPasswordPage: BlitzPage = () => {
|
||||
|
||||
ForgotPasswordPage.redirectAuthenticatedTo = Routes.Messages();
|
||||
|
||||
ForgotPasswordPage.getLayout = (page) => <BaseLayout title="Forgot Your Password?">{page}</BaseLayout>;
|
||||
ForgotPasswordPage.getLayout = (page) => <BaseLayout title="Reset password">{page}</BaseLayout>;
|
||||
|
||||
export default ForgotPasswordPage;
|
||||
|
@ -56,7 +56,7 @@ const ResetPasswordPage: BlitzPage = () => {
|
||||
|
||||
ResetPasswordPage.redirectAuthenticatedTo = Routes.Messages();
|
||||
|
||||
ResetPasswordPage.getLayout = (page) => <BaseLayout title="Reset Your Password">{page}</BaseLayout>;
|
||||
ResetPasswordPage.getLayout = (page) => <BaseLayout title="Reset password">{page}</BaseLayout>;
|
||||
|
||||
export const getServerSideProps: GetServerSideProps = async (context) => {
|
||||
if (!context.query.token) {
|
||||
|
@ -55,6 +55,6 @@ const SignIn: BlitzPage = () => {
|
||||
|
||||
SignIn.redirectAuthenticatedTo = Routes.Messages();
|
||||
|
||||
SignIn.getLayout = (page) => <BaseLayout title="Sign In">{page}</BaseLayout>;
|
||||
SignIn.getLayout = (page) => <BaseLayout title="Sign in">{page}</BaseLayout>;
|
||||
|
||||
export default SignIn;
|
||||
|
@ -55,6 +55,6 @@ SignUp.redirectAuthenticatedTo = ({ session }) => {
|
||||
return Routes.Messages();
|
||||
};
|
||||
|
||||
SignUp.getLayout = (page) => <BaseLayout title="Sign Up">{page}</BaseLayout>;
|
||||
SignUp.getLayout = (page) => <BaseLayout title="Sign up">{page}</BaseLayout>;
|
||||
|
||||
export default SignUp;
|
||||
|
Reference in New Issue
Block a user