diff --git a/apps/marketing/src/components/(marketing)/single-player-mode/create-single-player-document.action.ts b/apps/marketing/src/components/(marketing)/single-player-mode/create-single-player-document.action.ts index f2bc074ea..1e779fcfc 100644 --- a/apps/marketing/src/components/(marketing)/single-player-mode/create-single-player-document.action.ts +++ b/apps/marketing/src/components/(marketing)/single-player-mode/create-single-player-document.action.ts @@ -177,9 +177,7 @@ export const createSinglePlayerDocument = async ( }, ); - // Todo: Handle `downloadLink` const template = createElement(DocumentSelfSignedEmailTemplate, { - downloadLink: `${process.env.NEXT_PUBLIC_MARKETING_URL}/single-player-mode/${documentToken}`, documentName: documentName, assetBaseUrl: process.env.NEXT_PUBLIC_WEBAPP_URL || 'http://localhost:3000', }); @@ -197,6 +195,7 @@ export const createSinglePlayerDocument = async ( subject: 'Document signed', html: render(template), text: render(template, { plainText: true }), + attachments: [{ content: Buffer.from(pdfBytes), filename: documentName }], }); return documentToken; diff --git a/apps/web/public/static/user-plus.png b/apps/web/public/static/user-plus.png new file mode 100644 index 000000000..081976f59 Binary files /dev/null and b/apps/web/public/static/user-plus.png differ diff --git a/packages/email/static/user-plus.png b/packages/email/static/user-plus.png new file mode 100644 index 000000000..081976f59 Binary files /dev/null and b/packages/email/static/user-plus.png differ diff --git a/packages/email/template-components/template-document-completed.tsx b/packages/email/template-components/template-document-completed.tsx index a36f79bc4..9c9255879 100644 --- a/packages/email/template-components/template-document-completed.tsx +++ b/packages/email/template-components/template-document-completed.tsx @@ -1,7 +1,9 @@ -import { Button, Column, Img, Row, Section, Tailwind, Text } from '@react-email/components'; +import { Button, Column, Img, Section, Tailwind, Text } from '@react-email/components'; import * as config from '@documenso/tailwind-config'; +import TemplateDocumentImage from './template-document-image'; + export interface TemplateDocumentCompletedProps { downloadLink: string; documentName: string; @@ -27,27 +29,20 @@ export const TemplateDocumentCompleted = ({ }, }} > -
- - + - - Documenso +
+
+ + + + Completed + - - - -
- -
- - - Completed - +
“{documentName}” was signed by all signers @@ -66,10 +61,13 @@ export const TemplateDocumentCompleted = ({ Review */}
diff --git a/packages/email/template-components/template-document-image.tsx b/packages/email/template-components/template-document-image.tsx new file mode 100644 index 000000000..d18140024 --- /dev/null +++ b/packages/email/template-components/template-document-image.tsx @@ -0,0 +1,28 @@ +import { Column, Img, Row, Section } from '@react-email/components'; + +export interface TemplateDocumentImageProps { + assetBaseUrl: string; + className?: string; +} + +export const TemplateDocumentImage = ({ assetBaseUrl, className }: TemplateDocumentImageProps) => { + const getAssetUrl = (path: string) => { + return new URL(path, assetBaseUrl).toString(); + }; + + return ( +
+ + + + + Documenso + + + + +
+ ); +}; + +export default TemplateDocumentImage; diff --git a/packages/email/template-components/template-document-invite.tsx b/packages/email/template-components/template-document-invite.tsx index fcfba406d..10c298cdd 100644 --- a/packages/email/template-components/template-document-invite.tsx +++ b/packages/email/template-components/template-document-invite.tsx @@ -1,7 +1,9 @@ -import { Button, Column, Img, Row, Section, Tailwind, Text } from '@react-email/components'; +import { Button, Section, Tailwind, Text } from '@react-email/components'; import * as config from '@documenso/tailwind-config'; +import TemplateDocumentImage from './template-document-image'; + export interface TemplateDocumentInviteProps { inviterName: string; inviterEmail: string; @@ -16,10 +18,6 @@ export const TemplateDocumentInvite = ({ signDocumentLink, assetBaseUrl, }: TemplateDocumentInviteProps) => { - const getAssetUrl = (path: string) => { - return new URL(path, assetBaseUrl).toString(); - }; - return ( -
- - - - - Documenso - - - - -
+
diff --git a/packages/email/template-components/template-document-pending.tsx b/packages/email/template-components/template-document-pending.tsx index f9fc8648a..be7735064 100644 --- a/packages/email/template-components/template-document-pending.tsx +++ b/packages/email/template-components/template-document-pending.tsx @@ -1,7 +1,9 @@ -import { Column, Img, Row, Section, Tailwind, Text } from '@react-email/components'; +import { Column, Img, Section, Tailwind, Text } from '@react-email/components'; import * as config from '@documenso/tailwind-config'; +import TemplateDocumentImage from './template-document-image'; + export interface TemplateDocumentPendingProps { documentName: string; assetBaseUrl: string; @@ -25,27 +27,20 @@ export const TemplateDocumentPending = ({ }, }} > -
- - + - - Documenso +
+
+ + + + Waiting for others + - - - -
- -
- - - Waiting for others - +
“{documentName}” has been signed diff --git a/packages/email/template-components/template-document-self-signed.tsx b/packages/email/template-components/template-document-self-signed.tsx index 751ea7f72..7d1668a09 100644 --- a/packages/email/template-components/template-document-self-signed.tsx +++ b/packages/email/template-components/template-document-self-signed.tsx @@ -1,15 +1,15 @@ -import { Button, Img, Section, Tailwind, Text } from '@react-email/components'; +import { Button, Column, Img, Link, Section, Tailwind, Text } from '@react-email/components'; import * as config from '@documenso/tailwind-config'; +import TemplateDocumentImage from './template-document-image'; + export interface TemplateDocumentSelfSignedProps { - downloadLink: string; documentName: string; assetBaseUrl: string; } export const TemplateDocumentSelfSigned = ({ - downloadLink, documentName, assetBaseUrl, }: TemplateDocumentSelfSignedProps) => { @@ -27,39 +27,56 @@ export const TemplateDocumentSelfSigned = ({ }, }} > + +
-
- Documenso -
+
+ + + + Completed + + +
- - - Completed - - - + You have signed “{documentName}” - - Check out our plans to access the full suite of features. + + Create a{' '} + + free account + {' '} + to access your signed documents at any time.
+ + -
diff --git a/packages/email/template-components/template-forgot-password.tsx b/packages/email/template-components/template-forgot-password.tsx index 45560a026..128001822 100644 --- a/packages/email/template-components/template-forgot-password.tsx +++ b/packages/email/template-components/template-forgot-password.tsx @@ -1,7 +1,9 @@ -import { Button, Img, Section, Tailwind, Text } from '@react-email/components'; +import { Button, Section, Tailwind, Text } from '@react-email/components'; import * as config from '@documenso/tailwind-config'; +import TemplateDocumentImage from './template-document-image'; + export type TemplateForgotPasswordProps = { resetPasswordLink: string; assetBaseUrl: string; @@ -11,10 +13,6 @@ export const TemplateForgotPassword = ({ resetPasswordLink, assetBaseUrl, }: TemplateForgotPasswordProps) => { - const getAssetUrl = (path: string) => { - return new URL(path, assetBaseUrl).toString(); - }; - return ( -
-
- Documenso -
+ +
Forgot your password? diff --git a/packages/email/template-components/template-reset-password.tsx b/packages/email/template-components/template-reset-password.tsx index ee2e8e7b1..36bc93098 100644 --- a/packages/email/template-components/template-reset-password.tsx +++ b/packages/email/template-components/template-reset-password.tsx @@ -1,7 +1,9 @@ -import { Img, Section, Tailwind, Text } from '@react-email/components'; +import { Section, Tailwind, Text } from '@react-email/components'; import * as config from '@documenso/tailwind-config'; +import TemplateDocumentImage from './template-document-image'; + export interface TemplateResetPasswordProps { userName: string; userEmail: string; @@ -9,10 +11,6 @@ export interface TemplateResetPasswordProps { } export const TemplateResetPassword = ({ assetBaseUrl }: TemplateResetPasswordProps) => { - const getAssetUrl = (path: string) => { - return new URL(path, assetBaseUrl).toString(); - }; - return ( -
-
- Documenso -
+ +
Password updated! diff --git a/packages/email/templates/document-self-signed.tsx b/packages/email/templates/document-self-signed.tsx index 3a16f707e..fb3dda8fc 100644 --- a/packages/email/templates/document-self-signed.tsx +++ b/packages/email/templates/document-self-signed.tsx @@ -20,7 +20,6 @@ import TemplateFooter from '../template-components/template-footer'; export type DocumentSelfSignedTemplateProps = TemplateDocumentSelfSignedProps; export const DocumentSelfSignedEmailTemplate = ({ - downloadLink = 'https://documenso.com', documentName = 'Open Source Pledge.pdf', assetBaseUrl = 'http://localhost:3002', }: DocumentSelfSignedTemplateProps) => { @@ -54,7 +53,6 @@ export const DocumentSelfSignedEmailTemplate = ({ />