96f2835bab
* feat: add password reset functionality with email template and credentials config * feat: add authentication configuration options and improve development setup * feat: add password-based authentication and signup control flags * feat: update auth form to support name field * fix: prevent password icon from overlaying the input text --------- Co-authored-by: Henry <henry_ball@hotmail.co.uk>
109 lines
3.0 KiB
TypeScript
109 lines
3.0 KiB
TypeScript
import { Body } from "@react-email/body";
|
|
import { Button } from "@react-email/button";
|
|
import { Container } from "@react-email/container";
|
|
import { Head } from "@react-email/head";
|
|
import { Heading } from "@react-email/heading";
|
|
import { Hr } from "@react-email/hr";
|
|
import { Html } from "@react-email/html";
|
|
import { Link } from "@react-email/link";
|
|
import { Preview } from "@react-email/preview";
|
|
import { Text } from "@react-email/text";
|
|
import { env } from "next-runtime-env";
|
|
|
|
export const ResetPasswordTemplate = ({
|
|
resetPasswordUrl,
|
|
resetPasswordToken,
|
|
}: {
|
|
resetPasswordUrl?: string;
|
|
resetPasswordToken?: string;
|
|
}) => (
|
|
<Html>
|
|
<Head />
|
|
<Preview>Reset your Kan password</Preview>
|
|
<Body style={{ backgroundColor: "white" }}>
|
|
<Container
|
|
style={{
|
|
fontFamily:
|
|
'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif',
|
|
margin: "auto",
|
|
paddingLeft: "0.75rem",
|
|
paddingRight: "0.75rem",
|
|
}}
|
|
>
|
|
<Heading
|
|
style={{
|
|
marginTop: "2.5rem",
|
|
marginBottom: "2.5rem",
|
|
fontSize: "24px",
|
|
fontWeight: "bold",
|
|
color: "#232323",
|
|
}}
|
|
>
|
|
kan.bn
|
|
</Heading>
|
|
<Heading
|
|
style={{ fontSize: "24px", fontWeight: "bold", color: "#232323" }}
|
|
>
|
|
Reset your Kan password
|
|
</Heading>
|
|
<Text
|
|
style={{
|
|
fontSize: "0.875rem",
|
|
marginBottom: "2rem",
|
|
color: "#232323",
|
|
}}
|
|
>
|
|
Click the button below to reset your password.
|
|
</Text>
|
|
<Button
|
|
target="_blank"
|
|
href={resetPasswordUrl}
|
|
style={{
|
|
marginBottom: "2rem",
|
|
borderRadius: "0.375rem",
|
|
backgroundColor: "#282828",
|
|
paddingLeft: "1.5rem",
|
|
paddingRight: "1.5rem",
|
|
paddingTop: "1rem",
|
|
paddingBottom: "1rem",
|
|
fontSize: "0.875rem",
|
|
fontWeight: "500",
|
|
lineHeight: "1",
|
|
color: "white",
|
|
}}
|
|
>
|
|
Reset your password
|
|
</Button>
|
|
<Text
|
|
style={{
|
|
marginBottom: "1rem",
|
|
fontSize: "0.875rem",
|
|
color: "#7e7e7e",
|
|
}}
|
|
>
|
|
If you didn't try to reset your password, you can safely ignore this email.
|
|
</Text>
|
|
<Hr
|
|
style={{
|
|
marginTop: "2.5rem",
|
|
marginBottom: "2rem",
|
|
borderWidth: "1px",
|
|
}}
|
|
/>
|
|
<Text style={{ color: "#7e7e7e" }}>
|
|
<Link
|
|
href={env("NEXT_PUBLIC_BASE_URL")}
|
|
target="_blank"
|
|
style={{ color: "#7e7e7e", textDecoration: "underline" }}
|
|
>
|
|
Kan
|
|
</Link>
|
|
, the open source Trello alternative.
|
|
</Text>
|
|
</Container>
|
|
</Body>
|
|
</Html>
|
|
);
|
|
|
|
export default ResetPasswordTemplate;
|