awatertrevi/infisical
1
0
Fork 0
mirror of https://github.com/awatertrevi/infisical.git synced 2026-10-19 16:01:44 +00:00
Code Issues Packages Projects Releases Wiki Activity

improvement: simplify email design, refactor link/button to re-usable components and improve design

Browse Source
This commit is contained in:
Scott Wilson
2025-07-30 18:14:35 -07:00
parent 5ffd42378a
commit 4a55ecbe12
28 changed files with 184 additions and 250 deletions
Download Patch File Download Diff File Expand all files Collapse all files
backend/src/services/smtp/emails/OrganizationInvitationTemplate.tsx
+9 -10
View File
@@ -1,7 +1,9 @@
import { Button, Heading, Link, Section, Text } from "@react-email/components";
import { Heading, Section, Text } from "@react-email/components";
import React from "react";
import { BaseButton } from "./BaseButton";
import { BaseEmailWrapper, BaseEmailWrapperProps } from "./BaseEmailWrapper";
import { BaseLink } from "./BaseLink";
interface OrganizationInvitationTemplateProps extends Omit<BaseEmailWrapperProps, "preview" | "title"> {
metadata?: string;
@@ -36,15 +38,13 @@ export const OrganizationInvitationTemplate = ({
<br />
<strong>{organizationName}</strong> on <strong>Infisical</strong>
</Heading>
<Section className="px-[24px] mt-[36px] pt-[12px] pb-[8px] border text-center border-solid border-gray-200 rounded-md bg-gray-50">
<Section className="px-[24px] mb-[28px] mt-[36px] pt-[12px] pb-[8px] border text-center border-solid border-gray-200 rounded-md bg-gray-50">
<Text className="text-black text-[14px] leading-[24px]">
{inviterFirstName && inviterUsername ? (
<>
<strong>{inviterFirstName}</strong> (
<Link href={`mailto:${inviterUsername}`} className="text-slate-700 no-underline">
{inviterUsername}
</Link>
) has invited you to collaborate on <strong>{organizationName}</strong>.
<BaseLink href={`mailto:${inviterUsername}`}>{inviterUsername}</BaseLink>) has invited you to collaborate
on <strong>{organizationName}</strong>.
</>
) : (
<>
@@ -53,13 +53,12 @@ export const OrganizationInvitationTemplate = ({
)}
</Text>
</Section>
<Section className="text-center mt-[28px]">
<Button
<Section className="text-center">
<BaseButton
href={`${callback_url}?token=${token}${metadata ? `&metadata=${metadata}` : ""}&to=${encodeURIComponent(email)}&organization_id=${organizationId}`}
className="rounded-md p-3 px-[28px] my-[8px] text-center text-[16px] bg-[#EBF852] border-solid border border-[#d1e309] text-black font-medium"
>
Accept Invite
</Button>
</BaseButton>
</Section>
<Section className="mt-[24px] bg-gray-50 pt-[2px] pb-[16px] border border-solid border-gray-200 px-[24px] rounded-md text-gray-800">
<Text className="mb-[0px]">