mirror of
https://github.com/documenso/documenso.git
synced 2025-11-16 09:41:35 +10:00
feat(template): add initial signing invite email template
This commit is contained in:
Ephraim Atta-Duncan
115
packages/lib/mail/template.tsx
Normal file
115
packages/lib/mail/template.tsx
Normal file
@ -0,0 +1,115 @@
|
|||||||
|
import * as React from 'react';
|
||||||
|
|
||||||
|
import {
|
||||||
|
Body,
|
||||||
|
Button,
|
||||||
|
Container,
|
||||||
|
Head,
|
||||||
|
Heading,
|
||||||
|
Html,
|
||||||
|
Img,
|
||||||
|
Link,
|
||||||
|
Preview,
|
||||||
|
Section,
|
||||||
|
Tailwind,
|
||||||
|
Text,
|
||||||
|
render,
|
||||||
|
} from '@react-email/components';
|
||||||
|
|
||||||
|
interface DocumensoSigningInviteEmailProps {
|
||||||
|
username?: string;
|
||||||
|
userImage?: string;
|
||||||
|
invitedByUsername?: string;
|
||||||
|
invitedByEmail?: string;
|
||||||
|
teamName?: string;
|
||||||
|
teamImage?: string;
|
||||||
|
signingLink?: string;
|
||||||
|
inviteFromIp?: string;
|
||||||
|
inviteFromLocation?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export const DocumensoSigningInviteEmail = ({
|
||||||
|
signingLink = 'https://documenso.com',
|
||||||
|
}: DocumensoSigningInviteEmailProps) => {
|
||||||
|
return (
|
||||||
|
<Html>
|
||||||
|
<Head />
|
||||||
|
<Preview>Sign Document</Preview>
|
||||||
|
<Tailwind>
|
||||||
|
<Body className="mx-auto my-auto font-sans">
|
||||||
|
<Section className="bg-white">
|
||||||
|
<Container className="mx-auto mb-[10px] mt-[40px] w-[600px] rounded-lg border-2 border-solid border-[#eaeaea] p-[20px] backdrop-blur-sm">
|
||||||
|
<Section>
|
||||||
|
<Section>
|
||||||
|
<Img
|
||||||
|
src={`http://localhost:3000/static/logo.png`}
|
||||||
|
alt="Documenso Logo"
|
||||||
|
width={120}
|
||||||
|
/>
|
||||||
|
</Section>
|
||||||
|
|
||||||
|
<Section className="mt-4 flex items-center justify-center">
|
||||||
|
<Section className="flex justify-center">
|
||||||
|
<Img src={`http://localhost:3000/static/document.png`} alt="Documenso" />
|
||||||
|
</Section>
|
||||||
|
|
||||||
|
<Heading className="mx-0 mb-0 text-center text-[18px] font-semibold text-[#27272A]">
|
||||||
|
Thilo Konzok has invited you to sign “Document.pdf”
|
||||||
|
</Heading>
|
||||||
|
<Text className="my-1 text-center text-[16px] text-[#AFAFAF]">
|
||||||
|
Continue by signing the document.
|
||||||
|
</Text>
|
||||||
|
<Section className="mb-[24px] mt-[32px] text-center">
|
||||||
|
<Button
|
||||||
|
pX={20}
|
||||||
|
pY={12}
|
||||||
|
className="rounded bg-[#A2E771] px-10 text-center text-[14px] font-medium text-black no-underline"
|
||||||
|
href={signingLink}
|
||||||
|
>
|
||||||
|
Sign Document
|
||||||
|
</Button>
|
||||||
|
</Section>
|
||||||
|
</Section>
|
||||||
|
</Section>
|
||||||
|
</Container>
|
||||||
|
<Container className="mx-auto w-[600px]">
|
||||||
|
<Section>
|
||||||
|
<Text className="text-[18px] leading-[24px] text-black">
|
||||||
|
Thilo Konzok{' '}
|
||||||
|
<span className="font-semibold text-[#AFAFAF]">(thilo@konzok.com)</span>
|
||||||
|
</Text>
|
||||||
|
<Text className="mb-[80px] text-[16px] leading-[28px] text-[#AFAFAF]">
|
||||||
|
Hi,
|
||||||
|
<br />
|
||||||
|
Please sign the attached document. Magna magna adipisicing dolore minim et aliquip
|
||||||
|
ipsum esse ut nulla ad sint irure.
|
||||||
|
<br /> - Thilo
|
||||||
|
</Text>
|
||||||
|
|
||||||
|
<Text className="my-[40px] text-[14px] text-[#AFAFAF]">
|
||||||
|
This document was sent using{' '}
|
||||||
|
<Link className="text-[#7AC455] underline" href="https://documenso.com">
|
||||||
|
Documenso.
|
||||||
|
</Link>
|
||||||
|
</Text>
|
||||||
|
|
||||||
|
<Text className="my-[40px] text-[14px] text-[#AFAFAF]">
|
||||||
|
Documenso
|
||||||
|
<br />
|
||||||
|
2261 Market Street, #5211, San Francisco, CA 94114, USA
|
||||||
|
</Text>
|
||||||
|
</Section>
|
||||||
|
</Container>
|
||||||
|
</Section>
|
||||||
|
</Body>
|
||||||
|
</Tailwind>
|
||||||
|
</Html>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default DocumensoSigningInviteEmail;
|
||||||
|
|
||||||
|
export const emailHtml = render(<DocumensoSigningInviteEmail />);
|
||||||
|
export const emailText = render(<DocumensoSigningInviteEmail />, {
|
||||||
|
plainText: true,
|
||||||
|
});
|
||||||
@ -10,17 +10,18 @@
|
|||||||
"universal/",
|
"universal/",
|
||||||
"next-auth/"
|
"next-auth/"
|
||||||
],
|
],
|
||||||
"scripts": {
|
"scripts": {},
|
||||||
},
|
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@documenso/prisma": "*",
|
"@documenso/prisma": "*",
|
||||||
"@pdf-lib/fontkit": "^1.1.1",
|
|
||||||
"@next-auth/prisma-adapter": "^1.0.6",
|
"@next-auth/prisma-adapter": "^1.0.6",
|
||||||
|
"@pdf-lib/fontkit": "^1.1.1",
|
||||||
|
"@react-email/components": "^0.0.7",
|
||||||
|
"@react-email/render": "^0.0.7",
|
||||||
"@upstash/redis": "^1.20.6",
|
"@upstash/redis": "^1.20.6",
|
||||||
"bcrypt": "^5.1.0",
|
"bcrypt": "^5.1.0",
|
||||||
"pdf-lib": "^1.17.1",
|
|
||||||
"next": "13.4.1",
|
"next": "13.4.1",
|
||||||
"next-auth": "^4.22.1",
|
"next-auth": "^4.22.1",
|
||||||
|
"pdf-lib": "^1.17.1",
|
||||||
"stripe": "^12.7.0"
|
"stripe": "^12.7.0"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
|||||||
@ -1,6 +1,8 @@
|
|||||||
import nodemailer from 'nodemailer';
|
import nodemailer from 'nodemailer';
|
||||||
import nodemailerSendgrid from 'nodemailer-sendgrid';
|
import nodemailerSendgrid from 'nodemailer-sendgrid';
|
||||||
|
|
||||||
|
import { emailHtml, emailText } from '../../mail/template';
|
||||||
|
|
||||||
export const sendMail = async ({ email }: { email: string }) => {
|
export const sendMail = async ({ email }: { email: string }) => {
|
||||||
let transporter;
|
let transporter;
|
||||||
|
|
||||||
@ -33,7 +35,7 @@ export const sendMail = async ({ email }: { email: string }) => {
|
|||||||
from: 'Documenso <hi@documenso.com>',
|
from: 'Documenso <hi@documenso.com>',
|
||||||
to: email,
|
to: email,
|
||||||
subject: 'Welcome to Documenso!',
|
subject: 'Welcome to Documenso!',
|
||||||
text: 'Welcome to Documenso!',
|
text: emailText,
|
||||||
html: '<p>Welcome to Documenso!</p>',
|
html: emailHtml,
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user