pangolin_mirror/pangolin
1
0
Fork 0
mirror of https://github.com/fosrl/pangolin.git synced 2026-02-08 05:56:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

improve verify email redirect flow

Browse Source
This commit is contained in:
Milo Schwartz
2024-11-28 00:11:13 -05:00
parent c2cbd7e1a1
commit 5bbf32f6a6
18 changed files with 145 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
server/emails/sendEmail.ts
View File

@@ -21,9 +21,7 @@ export async function sendEmail(
return;
}
logger.debug("Rendering email templatee...")
const emailHtml = await render(template);
logger.debug("Done rendering email templatee")
const options = {
from: opts.from,

14
server/emails/templates/SendInviteLink.tsx
View File

@@ -33,9 +33,17 @@ export const SendInviteLink = ({
<Html>
<Head />
<Preview>{previewText}</Preview>
<Tailwind>
<Tailwind config={{
theme: {
extend: {
colors: {
primary: "#F97317"
}
}
}
}}>
<Body className="font-sans">
<Container className="bg-white border border-solid border-gray-200 p-6 max-w-lg mx-auto my-8">
<Container className="bg-white border border-solid border-gray-200 p-6 max-w-lg mx-auto my-8 rounded-lg">
<Heading className="text-2xl font-semibold text-gray-800 text-center">
You're invited to join a Fossorial organization
</Heading>
@@ -58,7 +66,7 @@ export const SendInviteLink = ({
<Section className="text-center my-6">
<Button
href={inviteLink}
className="rounded-md bg-gray-600 px-[12px] py-[12px] text-center font-semibold text-white cursor-pointer"
className="rounded-lg bg-primary px-[12px] py-[9px] text-center font-semibold text-white cursor-pointer"
>
Accept invitation to {orgName}
</Button>

29
server/emails/templates/VerifyEmailCode.tsx
View File

@@ -14,11 +14,13 @@ import * as React from "react";
interface VerifyEmailProps {
username?: string;
verificationCode: string;
verifyLink: string;
}
export const VerifyEmail = ({
username,
verificationCode,
verifyLink,
}: VerifyEmailProps) => {
const previewText = `Verify your email, ${username}`;
@@ -26,21 +28,34 @@ export const VerifyEmail = ({
<Html>
<Head />
<Preview>{previewText}</Preview>
<Tailwind>
<Tailwind
config={{
theme: {
extend: {
colors: {
primary: "#F97317",
},
},
},
}}
>
<Body className="font-sans">
<Container className="bg-white border border-solid border-gray-200 p-6 max-w-lg mx-auto my-8">
<Container className="bg-white border border-solid border-gray-200 p-6 max-w-lg mx-auto my-8 rounded-lg">
<Heading className="text-2xl font-semibold text-gray-800 text-center">
Verify Your Email
Please verify your email
</Heading>
<Text className="text-base text-gray-700 mt-4">
Hi {username || "there"},
</Text>
<Text className="text-base text-gray-700 mt-2">
You’ve requested to verify your email. Please use
the verification code below:
You’ve requested to verify your email. Please{" "}
<a href={verifyLink} className="text-primary">
click here
</a>{" "}
to verify your email, then enter the following code:
</Text>
<Section className="text-center my-6">
<Text className="inline-block bg-gray-100 text-xl font-bold text-gray-900 py-2 px-4 border border-gray-300 rounded-md">
<Text className="inline-block bg-primary text-xl font-bold text-white py-2 px-4 border border-gray-300 rounded-xl">
{verificationCode}
</Text>
</Section>
@@ -59,3 +74,5 @@ export const VerifyEmail = ({
</Html>
);
};
export default VerifyEmail;

2
server/routers/auth/login.ts
View File

@@ -139,7 +139,7 @@ export async function login(
success: true,
error: false,
message: "Email verification code sent",
status: HttpCode.ACCEPTED,
status: HttpCode.OK,
});
}

17
server/routers/auth/sendEmailVerificationCode.ts
View File

@@ -13,11 +13,18 @@ export async function sendEmailVerificationCode(
): Promise<void> {
const code = await generateEmailVerificationCode(userId, email);
await sendEmail(VerifyEmail({ username: email, verificationCode: code }), {
to: email,
from: config.email?.no_reply,
subject: "Verify your email address",
});
await sendEmail(
VerifyEmail({
username: email,
verificationCode: code,
verifyLink: `${config.app.base_url}/auth/verify-email`,
}),
{
to: email,
from: config.email?.no_reply,
subject: "Verify your email address",
},
);
}
async function generateEmailVerificationCode(