diff --git a/packages/email/package.json b/packages/email/package.json index c1751dce6..20e214fee 100644 --- a/packages/email/package.json +++ b/packages/email/package.json @@ -17,11 +17,12 @@ }, "dependencies": { "@react-email/components": "^0.0.7", - "nodemailer": "^6.9.3" + "nodemailer": "^6.9.3", + "react-email": "^1.9.4" }, "devDependencies": { - "@documenso/tsconfig": "*", "@documenso/tailwind-config": "*", + "@documenso/tsconfig": "*", "@types/nodemailer": "^6.4.8", "tsup": "^7.1.0" } diff --git a/packages/email/template-components/template-forgot-password.tsx b/packages/email/template-components/template-forgot-password.tsx new file mode 100644 index 000000000..45560a026 --- /dev/null +++ b/packages/email/template-components/template-forgot-password.tsx @@ -0,0 +1,54 @@ +import { Button, Img, Section, Tailwind, Text } from '@react-email/components'; + +import * as config from '@documenso/tailwind-config'; + +export type TemplateForgotPasswordProps = { + resetPasswordLink: string; + assetBaseUrl: string; +}; + +export const TemplateForgotPassword = ({ + resetPasswordLink, + assetBaseUrl, +}: TemplateForgotPasswordProps) => { + const getAssetUrl = (path: string) => { + return new URL(path, assetBaseUrl).toString(); + }; + + return ( + +
+
+ Documenso +
+ + + Forgot your password? + + + + That's okay, it happens! Click the button below to reset your password. + + +
+ +
+
+ + ); +}; + +export default TemplateForgotPassword; diff --git a/packages/email/templates/forgot-password.tsx b/packages/email/templates/forgot-password.tsx new file mode 100644 index 000000000..7043a88f6 --- /dev/null +++ b/packages/email/templates/forgot-password.tsx @@ -0,0 +1,74 @@ +import { + Body, + Container, + Head, + Html, + Img, + Preview, + Section, + Tailwind, +} from '@react-email/components'; + +import config from '@documenso/tailwind-config'; + +import TemplateFooter from '../template-components/template-footer'; +import { + TemplateForgotPassword, + TemplateForgotPasswordProps, +} from '../template-components/template-forgot-password'; + +export type DocumentForgotPasswordTemplateProps = Partial; + +export const DocumentForgotPasswordTemplate = ({ + resetPasswordLink = 'https://documenso.com', + assetBaseUrl = 'http://localhost:3002', +}: DocumentForgotPasswordTemplateProps) => { + const previewText = `Completed Document`; + + const getAssetUrl = (path: string) => { + return new URL(path, assetBaseUrl).toString(); + }; + + return ( + + + {previewText} + + +
+ +
+ Documenso Logo + + +
+ + +
+ + + + +
+ + + + ); +}; + +export default DocumentForgotPasswordTemplate;