mirror of
https://github.com/documenso/documenso.git
synced 2025-11-13 00:03:33 +10:00
feat: document reminder email template
This commit is contained in:
@ -0,0 +1,79 @@
|
||||
import { useLingui } from '@lingui/react';
|
||||
import { Trans } from '@lingui/react/macro';
|
||||
import type { RecipientRole } from '@prisma/client';
|
||||
import { match } from 'ts-pattern';
|
||||
|
||||
import { RECIPIENT_ROLES_DESCRIPTION } from '@documenso/lib/constants/recipient-roles';
|
||||
|
||||
import { Button, Section, Text } from '../components';
|
||||
import { TemplateDocumentImage } from './template-document-image';
|
||||
|
||||
export interface TemplateDocumentReminderProps {
|
||||
recipientName: string;
|
||||
documentName: string;
|
||||
signDocumentLink: string;
|
||||
assetBaseUrl: string;
|
||||
role: RecipientRole;
|
||||
}
|
||||
|
||||
export const TemplateDocumentReminder = ({
|
||||
recipientName,
|
||||
documentName,
|
||||
signDocumentLink,
|
||||
assetBaseUrl,
|
||||
role,
|
||||
}: TemplateDocumentReminderProps) => {
|
||||
const { _ } = useLingui();
|
||||
|
||||
const { actionVerb } = RECIPIENT_ROLES_DESCRIPTION[role];
|
||||
|
||||
return (
|
||||
<>
|
||||
<TemplateDocumentImage className="mt-6" assetBaseUrl={assetBaseUrl} />
|
||||
|
||||
<Section>
|
||||
{/* Reminder specific text */}
|
||||
<Text className="text-primary mx-auto mb-0 max-w-[80%] text-center text-lg font-semibold">
|
||||
<Trans>
|
||||
Reminder: Please {_(actionVerb).toLowerCase()} your document
|
||||
<br />"{documentName}"
|
||||
</Trans>
|
||||
</Text>
|
||||
|
||||
{/* Addressee */}
|
||||
<Text className="my-1 text-center text-base text-slate-400">
|
||||
<Trans>Hi {recipientName},</Trans>
|
||||
</Text>
|
||||
|
||||
{/* Reminder Call to Action */}
|
||||
<Text className="my-1 text-center text-base text-slate-400">
|
||||
{match(role)
|
||||
.with('SIGNER', () => <Trans>Continue by signing the document.</Trans>)
|
||||
.with('VIEWER', () => <Trans>Continue by viewing the document.</Trans>)
|
||||
.with('APPROVER', () => <Trans>Continue by approving the document.</Trans>)
|
||||
.with('CC', () => '')
|
||||
.with('ASSISTANT', () => <Trans>Continue by assisting with the document.</Trans>)
|
||||
.exhaustive()}
|
||||
</Text>
|
||||
|
||||
{/* Primary Action Button */}
|
||||
<Section className="mb-6 mt-8 text-center">
|
||||
<Button
|
||||
className="bg-documenso-500 inline-flex items-center justify-center rounded-lg px-6 py-3 text-center text-sm font-medium text-black no-underline"
|
||||
href={signDocumentLink}
|
||||
>
|
||||
{match(role)
|
||||
.with('SIGNER', () => <Trans>Sign Document</Trans>)
|
||||
.with('VIEWER', () => <Trans>View Document</Trans>)
|
||||
.with('APPROVER', () => <Trans>Approve Document</Trans>)
|
||||
.with('CC', () => '')
|
||||
.with('ASSISTANT', () => <Trans>Assist Document</Trans>)
|
||||
.exhaustive()}
|
||||
</Button>
|
||||
</Section>
|
||||
</Section>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default TemplateDocumentReminder;
|
||||
89
packages/email/templates/document-reminder.tsx
Normal file
89
packages/email/templates/document-reminder.tsx
Normal file
@ -0,0 +1,89 @@
|
||||
import { useLingui } from '@lingui/react';
|
||||
import type { RecipientRole } from '@prisma/client';
|
||||
|
||||
import { RECIPIENT_ROLES_DESCRIPTION } from '@documenso/lib/constants/recipient-roles';
|
||||
|
||||
import { Body, Container, Head, Hr, Html, Img, Preview, Section, Text } from '../components';
|
||||
import { useBranding } from '../providers/branding';
|
||||
import { TemplateDocumentReminder } from '../template-components/template-document-reminder';
|
||||
import { TemplateFooter } from '../template-components/template-footer';
|
||||
|
||||
export type DocumentReminderEmailTemplateProps = {
|
||||
recipientName: string;
|
||||
documentName: string;
|
||||
signDocumentLink: string;
|
||||
assetBaseUrl?: string;
|
||||
customBody?: string;
|
||||
role: RecipientRole;
|
||||
};
|
||||
|
||||
export const DocumentReminderEmailTemplate = ({
|
||||
recipientName,
|
||||
documentName = 'Open Source Pledge.pdf',
|
||||
signDocumentLink = 'https://documenso.com',
|
||||
assetBaseUrl = 'http://localhost:3002',
|
||||
customBody,
|
||||
role,
|
||||
}: DocumentReminderEmailTemplateProps) => {
|
||||
const { i18n } = useLingui();
|
||||
const branding = useBranding();
|
||||
|
||||
const action = i18n.t(RECIPIENT_ROLES_DESCRIPTION[role].actionVerb).toLowerCase();
|
||||
|
||||
const previewTextString = `Reminder to ${action} ${documentName}`;
|
||||
|
||||
const getAssetUrl = (path: string) => {
|
||||
return new URL(path, assetBaseUrl).toString();
|
||||
};
|
||||
|
||||
return (
|
||||
<Html>
|
||||
<Head />
|
||||
<Preview>{previewTextString}</Preview>
|
||||
|
||||
<Body className="mx-auto my-auto bg-white font-sans">
|
||||
<Section>
|
||||
<Container className="mx-auto mb-2 mt-8 max-w-xl rounded-lg border border-solid border-slate-200 p-4 backdrop-blur-sm">
|
||||
<Section>
|
||||
{branding.brandingEnabled && branding.brandingLogo ? (
|
||||
<Img src={branding.brandingLogo} alt="Branding Logo" className="mb-4 h-6" />
|
||||
) : (
|
||||
<Img
|
||||
src={getAssetUrl('/static/logo.png')}
|
||||
alt="Documenso Logo"
|
||||
className="mb-4 h-6"
|
||||
/>
|
||||
)}
|
||||
|
||||
<TemplateDocumentReminder
|
||||
recipientName={recipientName}
|
||||
documentName={documentName}
|
||||
signDocumentLink={signDocumentLink}
|
||||
assetBaseUrl={assetBaseUrl}
|
||||
role={role}
|
||||
/>
|
||||
</Section>
|
||||
</Container>
|
||||
|
||||
{customBody && (
|
||||
<Container className="mx-auto mt-12 max-w-xl">
|
||||
<Section>
|
||||
<Text className="mt-2 text-base text-slate-400">
|
||||
<pre className="font-sans text-base text-slate-400">{customBody}</pre>
|
||||
</Text>
|
||||
</Section>
|
||||
</Container>
|
||||
)}
|
||||
|
||||
<Hr className="mx-auto mt-12 max-w-xl" />
|
||||
|
||||
<Container className="mx-auto max-w-xl">
|
||||
<TemplateFooter />
|
||||
</Container>
|
||||
</Section>
|
||||
</Body>
|
||||
</Html>
|
||||
);
|
||||
};
|
||||
|
||||
export default DocumentReminderEmailTemplate;
|
||||
@ -3,7 +3,7 @@ import { createElement } from 'react';
|
||||
import { msg } from '@lingui/core/macro';
|
||||
|
||||
import { mailer } from '@documenso/email/mailer';
|
||||
import DocumentInviteEmailTemplate from '@documenso/email/templates/document-invite';
|
||||
import DocumentReminderEmailTemplate from '@documenso/email/templates/document-reminder';
|
||||
import { prisma } from '@documenso/prisma';
|
||||
import type { DocumentReminderInterval } from '@documenso/prisma/client';
|
||||
import { DocumentStatus, RecipientRole, SendStatus, SigningStatus } from '@documenso/prisma/client';
|
||||
@ -118,15 +118,13 @@ export async function run({ io, intervals }: SendReminderHandlerOptions) {
|
||||
const signDocumentLink = `${NEXT_PUBLIC_WEBAPP_URL()}/sign/${recipient.token}`;
|
||||
const assetBaseUrl = NEXT_PUBLIC_WEBAPP_URL() || 'http://localhost:3000';
|
||||
|
||||
const template = createElement(DocumentInviteEmailTemplate, {
|
||||
const template = createElement(DocumentReminderEmailTemplate, {
|
||||
recipientName: recipient.name,
|
||||
documentName: document.title,
|
||||
inviterName: document.user.name || undefined,
|
||||
inviterEmail: document.user.email,
|
||||
assetBaseUrl,
|
||||
signDocumentLink,
|
||||
customBody: emailMessage,
|
||||
role: recipient.role,
|
||||
selfSigner: recipient.email === document.user.email,
|
||||
});
|
||||
|
||||
await io.runTask(`send-reminder-${recipient.id}`, async () => {
|
||||
|
||||
Reference in New Issue
Block a user