mirror of
https://github.com/documenso/documenso.git
synced 2025-11-15 09:12:02 +10:00
4dd95016b1
## Description Support setting a document language that will control the language used for sending emails to recipients. Additional work has been done to convert all emails to using our i18n implementation so we can later add controls for sending other kinds of emails in a users target language. ## Related Issue N/A ## Changes Made - Added `<Trans>` and `msg` macros to emails - Introduced a new `renderEmailWithI18N` utility in the lib package - Updated all emails to use the `<Tailwind>` component at the top level due to rendering constraints - Updated the `i18n.server.tsx` file to not use a top level await ## Testing Performed - Configured document language and verified emails were sent in the expected language - Created a document from a template and verified that the templates language was transferred to the document
101 lines
3.3 KiB
TypeScript
101 lines
3.3 KiB
TypeScript
import { Trans, msg } from '@lingui/macro';
|
|
import { useLingui } from '@lingui/react';
|
|
|
|
import { formatTeamUrl } from '@documenso/lib/utils/teams';
|
|
|
|
import { Body, Button, Container, Head, Hr, Html, Preview, Section, Text } from '../components';
|
|
import { TemplateFooter } from '../template-components/template-footer';
|
|
import TemplateImage from '../template-components/template-image';
|
|
|
|
export type TeamInviteEmailProps = {
|
|
assetBaseUrl: string;
|
|
baseUrl: string;
|
|
senderName: string;
|
|
teamName: string;
|
|
teamUrl: string;
|
|
token: string;
|
|
};
|
|
|
|
export const TeamInviteEmailTemplate = ({
|
|
assetBaseUrl = 'http://localhost:3002',
|
|
baseUrl = 'https://documenso.com',
|
|
senderName = 'John Doe',
|
|
teamName = 'Team Name',
|
|
teamUrl = 'demo',
|
|
token = '',
|
|
}: TeamInviteEmailProps) => {
|
|
const { _ } = useLingui();
|
|
|
|
const previewText = msg`Accept invitation to join a team on Documenso`;
|
|
|
|
return (
|
|
<Html>
|
|
<Head />
|
|
<Preview>{_(previewText)}</Preview>
|
|
|
|
<Body className="mx-auto my-auto font-sans">
|
|
<Section className="bg-white text-slate-500">
|
|
<Container className="mx-auto mb-2 mt-8 max-w-xl rounded-lg border border-solid border-slate-200 p-2 backdrop-blur-sm">
|
|
<TemplateImage
|
|
assetBaseUrl={assetBaseUrl}
|
|
className="mb-4 h-6 p-2"
|
|
staticAsset="logo.png"
|
|
/>
|
|
|
|
<Section>
|
|
<TemplateImage
|
|
className="mx-auto"
|
|
assetBaseUrl={assetBaseUrl}
|
|
staticAsset="add-user.png"
|
|
/>
|
|
</Section>
|
|
|
|
<Section className="p-2 text-slate-500">
|
|
<Text className="text-center text-lg font-medium text-black">
|
|
<Trans>Join {teamName} on Documenso</Trans>
|
|
</Text>
|
|
|
|
<Text className="my-1 text-center text-base">
|
|
<Trans>You have been invited to join the following team</Trans>
|
|
</Text>
|
|
|
|
<div className="mx-auto my-2 w-fit rounded-lg bg-gray-50 px-4 py-2 text-base font-medium text-slate-600">
|
|
{formatTeamUrl(teamUrl, baseUrl)}
|
|
</div>
|
|
|
|
<Text className="my-1 text-center text-base">
|
|
<Trans>
|
|
by <span className="text-slate-900">{senderName}</span>
|
|
</Trans>
|
|
</Text>
|
|
|
|
<Section className="mb-6 mt-6 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={`${baseUrl}/team/invite/${token}`}
|
|
>
|
|
<Trans>Accept</Trans>
|
|
</Button>
|
|
<Button
|
|
className="ml-4 inline-flex items-center justify-center rounded-lg bg-gray-50 px-6 py-3 text-center text-sm font-medium text-slate-600 no-underline"
|
|
href={`${baseUrl}/team/decline/${token}`}
|
|
>
|
|
<Trans>Decline</Trans>
|
|
</Button>
|
|
</Section>
|
|
</Section>
|
|
</Container>
|
|
|
|
<Hr className="mx-auto mt-12 max-w-xl" />
|
|
|
|
<Container className="mx-auto max-w-xl">
|
|
<TemplateFooter isDocument={false} />
|
|
</Container>
|
|
</Section>
|
|
</Body>
|
|
</Html>
|
|
);
|
|
};
|
|
|
|
export default TeamInviteEmailTemplate;
|