From a91d811d06e3315ace276ac90fe903facc2ce643 Mon Sep 17 00:00:00 2001 From: Luke Vella Date: Wed, 28 Aug 2024 09:24:58 +0100 Subject: [PATCH 1/8] =?UTF-8?q?=F0=9F=92=84=20Updated=20email=20templates?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../templates/_components/email-layout.tsx | 80 ++++--------------- .../_components/notification-email.tsx | 7 +- .../_components/styled-components.tsx | 16 ++-- .../emails/src/templates/finalized-host.tsx | 14 +++- .../src/templates/finalized-participant.tsx | 16 ++-- packages/emails/src/templates/login.tsx | 32 ++++---- packages/emails/src/templates/new-comment.tsx | 3 +- .../new-participant-confirmation.tsx | 11 ++- .../emails/src/templates/new-participant.tsx | 4 +- packages/emails/src/templates/new-poll.tsx | 48 ++++++----- packages/emails/src/templates/register.tsx | 14 +++- 11 files changed, 114 insertions(+), 131 deletions(-) diff --git a/packages/emails/src/templates/_components/email-layout.tsx b/packages/emails/src/templates/_components/email-layout.tsx index 4f7a652922f..d7934d9ab89 100644 --- a/packages/emails/src/templates/_components/email-layout.tsx +++ b/packages/emails/src/templates/_components/email-layout.tsx @@ -4,98 +4,48 @@ import { Head, Html, Img, - Link, Preview, } from "@react-email/components"; import { EmailContext } from "./email-context"; -import { fontFamily, Section, Text } from "./styled-components"; +import { fontFamily } from "./styled-components"; export interface EmailLayoutProps { preview: string; - recipientName?: string; footNote?: React.ReactNode; ctx: EmailContext; } const containerStyles = { - maxWidth: "600px", + maxWidth: "500px", margin: "0 auto", background: "white", fontFamily, - padding: 16, - border: "1px solid #E2E8F0", - borderRadius: 5, -}; - -const sectionStyles = { - marginTop: "16px", - marginBottom: "16px", -}; - -const linkStyles = { - color: "#64748B", - marginRight: "8px", + padding: "24px", }; export const EmailLayout = ({ preview, - recipientName, children, - footNote, ctx, }: React.PropsWithChildren) => { - const { logoUrl, baseUrl } = ctx; + const { logoUrl } = ctx; return ( {preview} - + - Rallly -
- {recipientName ? Hi {recipientName}, : null} - {children} - {footNote ? ( - - {footNote} - - ) : null} -
-
- - Home - -  •  - - Twitter - -  •  - - Github - -  •  - - Contact - -
+ Rallly Logo + {children} diff --git a/packages/emails/src/templates/_components/notification-email.tsx b/packages/emails/src/templates/_components/notification-email.tsx index ecb54450a62..bd9b7e5c349 100644 --- a/packages/emails/src/templates/_components/notification-email.tsx +++ b/packages/emails/src/templates/_components/notification-email.tsx @@ -1,3 +1,5 @@ +import { Section } from "@react-email/section"; + import { EmailContext } from "./email-context"; import { EmailLayout } from "./email-layout"; import { Button, Link, Text } from "./styled-components"; @@ -26,7 +28,6 @@ export const NotificationEmail = ({ return ( If you would like to stop receiving updates you can{" "} @@ -39,9 +40,9 @@ export const NotificationEmail = ({ preview={preview} > {children} - +
- +
); }; diff --git a/packages/emails/src/templates/_components/styled-components.tsx b/packages/emails/src/templates/_components/styled-components.tsx index d4c7cc8c314..da439d34bcd 100644 --- a/packages/emails/src/templates/_components/styled-components.tsx +++ b/packages/emails/src/templates/_components/styled-components.tsx @@ -23,7 +23,7 @@ export const Text = ( margin: "16px 0", fontFamily, fontSize: small ? "14px" : "16px", - color: light ? "#64748B" : "#334155", + color: light ? "#4B5563" : "#111827", lineHeight: "1.5", ...props.style, }} @@ -65,20 +65,16 @@ export const Link = (props: LinkProps) => { export const Heading = ( props: React.ComponentProps, ) => { - const { as = "h3" } = props; + const { as = "h1" } = props; const fontSize = { - h1: "32px", - h2: "24px", - h3: "20px", - h4: "16px", - h5: "14px", - h6: "12px", + h1: "24px", + h2: "20px", + h3: "18px", }; return ( { return ( - + + Final date booked! {title} has been booked for: @@ -73,9 +79,9 @@ export const FinalizeHostEmail = ({ We've notified participants and sent them calendar invites. - +
- +
); }; diff --git a/packages/emails/src/templates/finalized-participant.tsx b/packages/emails/src/templates/finalized-participant.tsx index 6dfffa6d916..123f9df85af 100644 --- a/packages/emails/src/templates/finalized-participant.tsx +++ b/packages/emails/src/templates/finalized-participant.tsx @@ -2,7 +2,12 @@ import { Column, Row, Section } from "@react-email/components"; import { defaultEmailContext, EmailContext } from "./_components/email-context"; import { EmailLayout } from "./_components/email-layout"; -import { borderColor, Button, Text } from "./_components/styled-components"; +import { + borderColor, + Button, + Heading, + Text, +} from "./_components/styled-components"; export interface FinalizeParticipantEmailProps { date: string; @@ -30,12 +35,13 @@ export const FinalizeParticipantEmail = ({ ctx = defaultEmailContext, }: FinalizeParticipantEmailProps) => { return ( - + + Final date booked! {hostName} has booked {title} for the following date: -
+
Please find attached a calendar invite for this event. - +
- +
); }; diff --git a/packages/emails/src/templates/login.tsx b/packages/emails/src/templates/login.tsx index 972f0e389d3..f5c00ac574b 100644 --- a/packages/emails/src/templates/login.tsx +++ b/packages/emails/src/templates/login.tsx @@ -1,3 +1,5 @@ +import { Hr, Section } from "@react-email/components"; + import { defaultEmailContext, EmailContext } from "./_components/email-context"; import { EmailLayout } from "./_components/email-layout"; import { @@ -5,6 +7,7 @@ import { Card, Domain, Heading, + primaryColor, Text, trackingWide, } from "./_components/styled-components"; @@ -17,7 +20,6 @@ interface LoginEmailProps { } export const LoginEmail = ({ - name = "Guest", code = "123456", magicLink = "https://rallly.co", ctx = defaultEmailContext, @@ -32,28 +34,26 @@ export const LoginEmail = ({ replying to this email. } - recipientName={name} preview="Use this link to log in on this device." > - - To log in to your account, please choose one of the following options: + Login + Enter this one-time 6-digit verification code: + + {code} - - Option 1: Magic Link - Click this magic link to log in on this device. +
- This link will expire in 15 minutes. - - - Option 2: Verification Code - Enter this one-time 6-digit verification code. - - {code} - This code will expire in 15 minutes. - +
); }; diff --git a/packages/emails/src/templates/new-comment.tsx b/packages/emails/src/templates/new-comment.tsx index a36cc7438c6..59aa15e6e9a 100644 --- a/packages/emails/src/templates/new-comment.tsx +++ b/packages/emails/src/templates/new-comment.tsx @@ -2,7 +2,7 @@ import { defaultEmailContext } from "./_components/email-context"; import NotificationEmail, { NotificationBaseProps, } from "./_components/notification-email"; -import { Text } from "./_components/styled-components"; +import { Heading, Text } from "./_components/styled-components"; export interface NewCommentEmailProps extends NotificationBaseProps { authorName: string; @@ -25,6 +25,7 @@ export const NewCommentEmail = ({ disableNotificationsUrl={disableNotificationsUrl} preview="Go to your poll to see what they said." > + New Comment {authorName} has commented on {title}. diff --git a/packages/emails/src/templates/new-participant-confirmation.tsx b/packages/emails/src/templates/new-participant-confirmation.tsx index 0fc2f49e439..313709d337c 100644 --- a/packages/emails/src/templates/new-participant-confirmation.tsx +++ b/packages/emails/src/templates/new-participant-confirmation.tsx @@ -1,6 +1,12 @@ import { defaultEmailContext, EmailContext } from "./_components/email-context"; import { EmailLayout } from "./_components/email-layout"; -import { Button, Domain, Section, Text } from "./_components/styled-components"; +import { + Button, + Domain, + Heading, + Section, + Text, +} from "./_components/styled-components"; interface NewParticipantConfirmationEmailProps { name: string; @@ -28,6 +34,7 @@ export const NewParticipantConfirmationEmail = ({ recipientName={name} preview="To edit your response use the link below" > + Poll Response Confirmation Your response to {title} has been submitted. @@ -35,7 +42,7 @@ export const NewParticipantConfirmationEmail = ({ While the poll is still open you can change your response using the link below. -
+
diff --git a/packages/emails/src/templates/new-participant.tsx b/packages/emails/src/templates/new-participant.tsx index 09b4cee2174..e053a0f0c7a 100644 --- a/packages/emails/src/templates/new-participant.tsx +++ b/packages/emails/src/templates/new-participant.tsx @@ -2,7 +2,7 @@ import { defaultEmailContext } from "./_components/email-context"; import NotificationEmail, { NotificationBaseProps, } from "./_components/notification-email"; -import { Text } from "./_components/styled-components"; +import { Heading, Text } from "./_components/styled-components"; export interface NewParticipantEmailProps extends NotificationBaseProps { participantName: string; @@ -25,10 +25,12 @@ export const NewParticipantEmail = ({ disableNotificationsUrl={disableNotificationsUrl} preview="Go to your poll to see the new response." > + New Response {participantName} has responded to{" "} {title}. + Go to your poll to see the new response. ); }; diff --git a/packages/emails/src/templates/new-poll.tsx b/packages/emails/src/templates/new-poll.tsx index 3133816a911..fcfb9bf250e 100644 --- a/packages/emails/src/templates/new-poll.tsx +++ b/packages/emails/src/templates/new-poll.tsx @@ -1,6 +1,15 @@ +import { Section } from "@react-email/components"; +import { Hr } from "@react-email/hr"; + import { defaultEmailContext, EmailContext } from "./_components/email-context"; import { EmailLayout } from "./_components/email-layout"; -import { Button, Card, Link, Text } from "./_components/styled-components"; +import { + Button, + Card, + Heading, + Link, + Text, +} from "./_components/styled-components"; export interface NewPollEmailProps { title: string; @@ -25,7 +34,7 @@ const ShareLink = ({ href={`mailto:?subject=${encodeURIComponent( `Availability for ${title}`, )}&body=${encodeURIComponent( - `Hi all,\nI'm trying to find the best date for ${title}.\nCan you please use the link below to choose your preferred dates:\n${participantLink}\nThank you.\n${name}`, + `Hi all,\n\nI'm trying to find the best date for ${title}.\n\nCan you please use the link below to choose your preferred dates:\n\n${participantLink}\n\nThank you.\n\n${name}`, )}`} > {children} @@ -51,41 +60,36 @@ export const NewPollEmail = ({ wasn't you, please ignore this email. } - recipientName={name} preview="Share your participant link to start collecting responses." > + New Poll Created Your poll has been successfully created! Here are the details: - - - Title: {title} -
- Invite Link:{" "} - {participantLink} - - - - Share via email - - - + + Title: {title} +
+ Invite Link:{" "} + {participantLink} + + + + Share via email + + To invite participants to your poll, simply share the{" "} Invite Link above with them. They'll be able to vote on their preferred meeting times and dates. +
If you need to make any changes to your poll, or if you want to see the results so far, just click on the button below: - +
- +
); }; diff --git a/packages/emails/src/templates/register.tsx b/packages/emails/src/templates/register.tsx index 9a4c5bfb4d0..8dffac2689d 100644 --- a/packages/emails/src/templates/register.tsx +++ b/packages/emails/src/templates/register.tsx @@ -28,13 +28,21 @@ export const RegisterEmail = ({ } preview={`Your 6-digit code is: ${code}`} > + Verify your email address Please use the following 6-digit verification code to verify your email: - + {code} - - This code is valid for 15 minutes + + This code is valid for 15 minutes ); }; From 19899e73cc85f85891742c17b257d292b87ed669 Mon Sep 17 00:00:00 2001 From: Luke Vella Date: Wed, 28 Aug 2024 17:59:44 +0100 Subject: [PATCH 2/8] Update --- .../templates/_components/email-layout.tsx | 2 +- .../_components/styled-components.tsx | 24 ++++++++++++++----- packages/emails/src/templates/login.tsx | 4 +--- 3 files changed, 20 insertions(+), 10 deletions(-) diff --git a/packages/emails/src/templates/_components/email-layout.tsx b/packages/emails/src/templates/_components/email-layout.tsx index d7934d9ab89..eef5f56c8e8 100644 --- a/packages/emails/src/templates/_components/email-layout.tsx +++ b/packages/emails/src/templates/_components/email-layout.tsx @@ -21,7 +21,7 @@ const containerStyles = { margin: "0 auto", background: "white", fontFamily, - padding: "24px", + padding: "32px 8px", }; export const EmailLayout = ({ diff --git a/packages/emails/src/templates/_components/styled-components.tsx b/packages/emails/src/templates/_components/styled-components.tsx index da439d34bcd..5c45ea30a3b 100644 --- a/packages/emails/src/templates/_components/styled-components.tsx +++ b/packages/emails/src/templates/_components/styled-components.tsx @@ -11,6 +11,8 @@ import { import { EmailContext } from "./email-context"; +export const lightTextColor = "#6B7280"; +export const darkTextColor = "#111827"; export const borderColor = "#E2E8F0"; export const Text = ( props: TextProps & { light?: boolean; small?: boolean }, @@ -23,7 +25,7 @@ export const Text = ( margin: "16px 0", fontFamily, fontSize: small ? "14px" : "16px", - color: light ? "#4B5563" : "#111827", + color: light ? lightTextColor : darkTextColor, lineHeight: "1.5", ...props.style, }} @@ -46,6 +48,11 @@ export const Button = (props: React.ComponentProps) => { borderRadius: "4px", padding: "12px 14px", fontFamily, + boxSizing: "border-box", + display: "block", + width: "100%", + maxWidth: "100%", + textAlign: "center", fontSize: "16px", color: "white", }} @@ -62,15 +69,20 @@ export const Link = (props: LinkProps) => { ); }; +const fontSize = { + h1: "20px", + h2: "20px", + h3: "18px", + h4: "16px", + h5: "14px", + h6: "12px", +}; + export const Heading = ( props: React.ComponentProps, ) => { const { as = "h1" } = props; - const fontSize = { - h1: "24px", - h2: "20px", - h3: "18px", - }; + return ( Date: Wed, 28 Aug 2024 20:01:04 +0100 Subject: [PATCH 3/8] Update logo --- apps/web/src/utils/emails.ts | 10 ++++++---- .../emails/src/templates/_components/email-context.tsx | 2 +- .../emails/src/templates/_components/email-layout.tsx | 6 +++--- 3 files changed, 10 insertions(+), 8 deletions(-) diff --git a/apps/web/src/utils/emails.ts b/apps/web/src/utils/emails.ts index 130c574712e..8d320fa5f74 100644 --- a/apps/web/src/utils/emails.ts +++ b/apps/web/src/utils/emails.ts @@ -1,11 +1,11 @@ import { EmailClient, SupportedEmailProviders } from "@rallly/emails"; +import { env } from "@/env"; import { absoluteUrl } from "@/utils/absolute-url"; - -const env = process.env["NODE" + "_ENV"]; +import { isSelfHosted } from "@/utils/constants"; export const emailClient = new EmailClient({ - openPreviews: env === "development", + openPreviews: env.NODE_ENV === "development", provider: { name: (process.env.EMAIL_PROVIDER as SupportedEmailProviders) ?? "smtp", }, @@ -18,7 +18,9 @@ export const emailClient = new EmailClient({ }, }, context: { - logoUrl: absoluteUrl("/logo.png"), + logoUrl: isSelfHosted + ? absoluteUrl("/logo.png") + : "https://rallly-public.s3.amazonaws.com/images/rallly-logo-mark.png", baseUrl: absoluteUrl(""), domain: absoluteUrl("").replace(/(^\w+:|^)\/\//, ""), }, diff --git a/packages/emails/src/templates/_components/email-context.tsx b/packages/emails/src/templates/_components/email-context.tsx index 34159783a05..2d0eb5b23a9 100644 --- a/packages/emails/src/templates/_components/email-context.tsx +++ b/packages/emails/src/templates/_components/email-context.tsx @@ -5,7 +5,7 @@ export type EmailContext = { }; export const defaultEmailContext = { - logoUrl: "https://rallly.co/logo.png", + logoUrl: "https://rallly-public.s3.amazonaws.com/images/rallly-logo-mark.png", baseUrl: "https://rallly.co", domain: "rallly.co", }; diff --git a/packages/emails/src/templates/_components/email-layout.tsx b/packages/emails/src/templates/_components/email-layout.tsx index eef5f56c8e8..34607254f15 100644 --- a/packages/emails/src/templates/_components/email-layout.tsx +++ b/packages/emails/src/templates/_components/email-layout.tsx @@ -17,7 +17,7 @@ export interface EmailLayoutProps { } const containerStyles = { - maxWidth: "500px", + maxWidth: "480px", margin: "0 auto", background: "white", fontFamily, @@ -38,8 +38,8 @@ export const EmailLayout = ({ Date: Thu, 29 Aug 2024 09:29:14 +0100 Subject: [PATCH 4/8] More updates --- .../templates/_components/email-layout.tsx | 13 +++- .../_components/notification-email.tsx | 24 +++---- .../_components/styled-components.tsx | 8 +-- packages/emails/src/templates/login.tsx | 47 ++++++------- packages/emails/src/templates/new-poll.tsx | 68 +++---------------- packages/emails/src/templates/register.tsx | 49 +++++++------ 6 files changed, 83 insertions(+), 126 deletions(-) diff --git a/packages/emails/src/templates/_components/email-layout.tsx b/packages/emails/src/templates/_components/email-layout.tsx index 34607254f15..82a49df40e8 100644 --- a/packages/emails/src/templates/_components/email-layout.tsx +++ b/packages/emails/src/templates/_components/email-layout.tsx @@ -5,14 +5,14 @@ import { Html, Img, Preview, + Section, } from "@react-email/components"; import { EmailContext } from "./email-context"; -import { fontFamily } from "./styled-components"; +import { darkTextColor, fontFamily, Link, Text } from "./styled-components"; export interface EmailLayoutProps { preview: string; - footNote?: React.ReactNode; ctx: EmailContext; } @@ -22,6 +22,7 @@ const containerStyles = { background: "white", fontFamily, padding: "32px 8px", + color: darkTextColor, }; export const EmailLayout = ({ @@ -46,6 +47,14 @@ export const EmailLayout = ({ alt="Rallly Logo" /> {children} +
+ + Powered by{" "} + + rallly.co + + +
diff --git a/packages/emails/src/templates/_components/notification-email.tsx b/packages/emails/src/templates/_components/notification-email.tsx index bd9b7e5c349..60d8a0d33c4 100644 --- a/packages/emails/src/templates/_components/notification-email.tsx +++ b/packages/emails/src/templates/_components/notification-email.tsx @@ -17,7 +17,6 @@ export interface NotificationEmailProps extends NotificationBaseProps { } export const NotificationEmail = ({ - name, pollUrl, disableNotificationsUrl, preview, @@ -26,23 +25,18 @@ export const NotificationEmail = ({ }: React.PropsWithChildren) => { const { domain } = ctx; return ( - - If you would like to stop receiving updates you can{" "} - - turn notifications off - - . - - } - preview={preview} - > + {children} -
+
+ + If you would like to stop receiving updates you can{" "} + + turn notifications off + + . + ); }; diff --git a/packages/emails/src/templates/_components/styled-components.tsx b/packages/emails/src/templates/_components/styled-components.tsx index 5c45ea30a3b..eeaf2ccc435 100644 --- a/packages/emails/src/templates/_components/styled-components.tsx +++ b/packages/emails/src/templates/_components/styled-components.tsx @@ -11,8 +11,8 @@ import { import { EmailContext } from "./email-context"; -export const lightTextColor = "#6B7280"; -export const darkTextColor = "#111827"; +export const lightTextColor = "#4B5563"; +export const darkTextColor = "#1F2937"; export const borderColor = "#E2E8F0"; export const Text = ( props: TextProps & { light?: boolean; small?: boolean }, @@ -71,8 +71,8 @@ export const Link = (props: LinkProps) => { const fontSize = { h1: "20px", - h2: "20px", - h3: "18px", + h2: "18px", + h3: "16px", h4: "16px", h5: "14px", h6: "12px", diff --git a/packages/emails/src/templates/login.tsx b/packages/emails/src/templates/login.tsx index 1f9dc7ee68e..4cf6ea96994 100644 --- a/packages/emails/src/templates/login.tsx +++ b/packages/emails/src/templates/login.tsx @@ -4,6 +4,7 @@ import { defaultEmailContext, EmailContext } from "./_components/email-context"; import { EmailLayout } from "./_components/email-layout"; import { Button, + Card, Domain, Heading, Text, @@ -23,35 +24,35 @@ export const LoginEmail = ({ ctx = defaultEmailContext, }: LoginEmailProps) => { return ( - - You're receiving this email because a request was made to login - to . If this wasn't you, let us know by - replying to this email. - - } - preview="Use this link to log in on this device." - > + Login Enter this one-time 6-digit verification code: - - {code} - -
+ + + {code} + + + This code is valid for 15 minutes + + +
- This code will expire in 15 minutes.
+ + You're receiving this email because a request was made to login to{" "} + . If this wasn't you, let us know by replying + to this email. + ); }; diff --git a/packages/emails/src/templates/new-poll.tsx b/packages/emails/src/templates/new-poll.tsx index fcfb9bf250e..e1222c07fd6 100644 --- a/packages/emails/src/templates/new-poll.tsx +++ b/packages/emails/src/templates/new-poll.tsx @@ -1,6 +1,3 @@ -import { Section } from "@react-email/components"; -import { Hr } from "@react-email/hr"; - import { defaultEmailContext, EmailContext } from "./_components/email-context"; import { EmailLayout } from "./_components/email-layout"; import { @@ -19,77 +16,28 @@ export interface NewPollEmailProps { ctx: EmailContext; } -const ShareLink = ({ - title, - participantLink, - name, - children, -}: React.PropsWithChildren<{ - name: string; - title: string; - participantLink: string; -}>) => { - return ( - - {children} - - ); -}; - export const NewPollEmail = ({ title = "Untitled Poll", - name = "John", adminLink = "https://rallly.co/admin/abcdefg123", participantLink = "https://rallly.co/invite/wxyz9876", ctx = defaultEmailContext, }: NewPollEmailProps) => { - const { baseUrl, domain } = ctx; return ( - You are receiving this email because a new poll was created with this - email address on {domain}. If this - wasn't you, please ignore this email. - - } preview="Share your participant link to start collecting responses." > New Poll Created - Your poll has been successfully created! Here are the details: - - - Title: {title} -
- Invite Link:{" "} - {participantLink} - - - - Share via email - - - - To invite participants to your poll, simply share the{" "} - Invite Link above with them. They'll be able to - vote on their preferred meeting times and dates. - -
- - If you need to make any changes to your poll, or if you want to see the - results so far, just click on the button below: + Your meeting poll titled {`"${title}"`} is ready! Share + it using the link below: -
- -
+ + + {participantLink} + + + ); }; diff --git a/packages/emails/src/templates/register.tsx b/packages/emails/src/templates/register.tsx index 8dffac2689d..232d840a317 100644 --- a/packages/emails/src/templates/register.tsx +++ b/packages/emails/src/templates/register.tsx @@ -1,6 +1,9 @@ +import { Section } from "@react-email/section"; + import { defaultEmailContext, EmailContext } from "./_components/email-context"; import { EmailLayout } from "./_components/email-layout"; import { + Card, Domain, Heading, Text, @@ -17,32 +20,34 @@ export const RegisterEmail = ({ ctx = defaultEmailContext, }: RegisterEmailProps) => { return ( - - You're receiving this email because a request was made to - register an account on . If this wasn't you, - please ignore this email. - - } - preview={`Your 6-digit code is: ${code}`} - > + Verify your email address Please use the following 6-digit verification code to verify your email: - - {code} - - This code is valid for 15 minutes + + + {code} + + + This code is valid for 15 minutes + + +
+ + You're receiving this email because a request was made to + register an account on . If this wasn't you, + please ignore this email. + +
); }; From f6eae51f645473bbdaa005e0abfe6654280461b8 Mon Sep 17 00:00:00 2001 From: Luke Vella Date: Thu, 29 Aug 2024 22:31:43 +0100 Subject: [PATCH 5/8] Fix types --- .../emails/src/templates/finalized-host.tsx | 1 - .../src/templates/finalized-participant.tsx | 1 - .../templates/new-participant-confirmation.tsx | 18 +++++------------- 3 files changed, 5 insertions(+), 15 deletions(-) diff --git a/packages/emails/src/templates/finalized-host.tsx b/packages/emails/src/templates/finalized-host.tsx index 24887261e9f..8fb22628d7f 100644 --- a/packages/emails/src/templates/finalized-host.tsx +++ b/packages/emails/src/templates/finalized-host.tsx @@ -23,7 +23,6 @@ export interface FinalizeHostEmailProps { } export const FinalizeHostEmail = ({ - name = "Guest", title = "Untitled Poll", pollUrl = "https://rallly.co", day = "12", diff --git a/packages/emails/src/templates/finalized-participant.tsx b/packages/emails/src/templates/finalized-participant.tsx index 123f9df85af..73fc37b844d 100644 --- a/packages/emails/src/templates/finalized-participant.tsx +++ b/packages/emails/src/templates/finalized-participant.tsx @@ -24,7 +24,6 @@ export interface FinalizeParticipantEmailProps { } export const FinalizeParticipantEmail = ({ - name = "Guest", title = "Untitled Poll", hostName = "Host", pollUrl = "https://rallly.co", diff --git a/packages/emails/src/templates/new-participant-confirmation.tsx b/packages/emails/src/templates/new-participant-confirmation.tsx index 313709d337c..662117a2f36 100644 --- a/packages/emails/src/templates/new-participant-confirmation.tsx +++ b/packages/emails/src/templates/new-participant-confirmation.tsx @@ -16,24 +16,12 @@ interface NewParticipantConfirmationEmailProps { } export const NewParticipantConfirmationEmail = ({ title = "Untitled Poll", - name = "John", editSubmissionUrl = "https://rallly.co", ctx = defaultEmailContext, }: NewParticipantConfirmationEmailProps) => { const { domain } = ctx; return ( - - You are receiving this email because a response was submitted on{" "} - . If this wasn't you, please ignore this - email. - - } - recipientName={name} - preview="To edit your response use the link below" - > + Poll Response Confirmation Your response to {title} has been submitted. @@ -47,6 +35,10 @@ export const NewParticipantConfirmationEmail = ({ Review response on {domain}
+ + You are receiving this email because a response was submitted on{" "} + . If this wasn't you, please ignore this email. + ); }; From ebb002fd681d28ae391e7d315abd262b5804eef1 Mon Sep 17 00:00:00 2001 From: Luke Vella Date: Thu, 29 Aug 2024 22:48:48 +0100 Subject: [PATCH 6/8] Update --- apps/web/src/env.ts | 9 +++++++++ apps/web/src/utils/emails.ts | 7 +++---- .../emails/src/templates/_components/email-context.tsx | 2 ++ packages/emails/src/templates/login.tsx | 4 ++-- 4 files changed, 16 insertions(+), 6 deletions(-) diff --git a/apps/web/src/env.ts b/apps/web/src/env.ts index f621462eb2a..c26e2327946 100644 --- a/apps/web/src/env.ts +++ b/apps/web/src/env.ts @@ -49,6 +49,12 @@ export const env = createEnv({ * Example: "user@example.com, *@example.com, *@*.example.com" */ ALLOWED_EMAILS: z.string().optional(), + /** + * Email addresses for support and no-reply emails. + */ + SUPPORT_EMAIL: z.string().email(), + NOREPLY_EMAIL: z.string().email().optional(), + NOREPLY_EMAIL_NAME: z.string().default("Rallly"), }, /* * Environment variables available on the client (and server). @@ -90,6 +96,9 @@ export const env = createEnv({ NEXT_PUBLIC_POSTHOG_API_KEY: process.env.NEXT_PUBLIC_POSTHOG_API_KEY, NEXT_PUBLIC_POSTHOG_API_HOST: process.env.NEXT_PUBLIC_POSTHOG_API_HOST, NEXT_PUBLIC_SELF_HOSTED: process.env.NEXT_PUBLIC_SELF_HOSTED, + SUPPORT_EMAIL: process.env.SUPPORT_EMAIL, + NOREPLY_EMAIL: process.env.NOREPLY_EMAIL, + NOREPLY_EMAIL_NAME: process.env.NOREPLY_EMAIL_NAME, }, skipValidation: !!process.env.SKIP_ENV_VALIDATION, }); diff --git a/apps/web/src/utils/emails.ts b/apps/web/src/utils/emails.ts index 8d320fa5f74..1fa5aa57456 100644 --- a/apps/web/src/utils/emails.ts +++ b/apps/web/src/utils/emails.ts @@ -11,10 +11,8 @@ export const emailClient = new EmailClient({ }, mail: { from: { - name: (process.env.NOREPLY_EMAIL_NAME as string) || "Rallly", - address: - (process.env.NOREPLY_EMAIL as string) || - (process.env.SUPPORT_EMAIL as string), + name: env.NOREPLY_EMAIL_NAME, + address: env.NOREPLY_EMAIL || env.SUPPORT_EMAIL, }, }, context: { @@ -23,5 +21,6 @@ export const emailClient = new EmailClient({ : "https://rallly-public.s3.amazonaws.com/images/rallly-logo-mark.png", baseUrl: absoluteUrl(""), domain: absoluteUrl("").replace(/(^\w+:|^)\/\//, ""), + supportEmail: env.SUPPORT_EMAIL, }, }); diff --git a/packages/emails/src/templates/_components/email-context.tsx b/packages/emails/src/templates/_components/email-context.tsx index 2d0eb5b23a9..966d5c46834 100644 --- a/packages/emails/src/templates/_components/email-context.tsx +++ b/packages/emails/src/templates/_components/email-context.tsx @@ -2,10 +2,12 @@ export type EmailContext = { logoUrl: string; baseUrl: string; domain: string; + supportEmail: string; }; export const defaultEmailContext = { logoUrl: "https://rallly-public.s3.amazonaws.com/images/rallly-logo-mark.png", baseUrl: "https://rallly.co", domain: "rallly.co", + supportEmail: "support@rallly.co", }; diff --git a/packages/emails/src/templates/login.tsx b/packages/emails/src/templates/login.tsx index 4cf6ea96994..32a993735f0 100644 --- a/packages/emails/src/templates/login.tsx +++ b/packages/emails/src/templates/login.tsx @@ -50,8 +50,8 @@ export const LoginEmail = ({
You're receiving this email because a request was made to login to{" "} - . If this wasn't you, let us know by replying - to this email. + . If this wasn't you contact{" "} + {ctx.supportEmail}. ); From e2f84eff930000c699b4950f889828155ee5a59a Mon Sep 17 00:00:00 2001 From: Luke Vella Date: Fri, 30 Aug 2024 09:04:30 +0100 Subject: [PATCH 7/8] Increase font size --- packages/emails/src/templates/_components/email-layout.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/emails/src/templates/_components/email-layout.tsx b/packages/emails/src/templates/_components/email-layout.tsx index 82a49df40e8..e9cf91c211f 100644 --- a/packages/emails/src/templates/_components/email-layout.tsx +++ b/packages/emails/src/templates/_components/email-layout.tsx @@ -47,8 +47,8 @@ export const EmailLayout = ({ alt="Rallly Logo" /> {children} -
- +
+ Powered by{" "} rallly.co From 3ac076544a1d7410b85bf9ee5f7a7c4af85ad31a Mon Sep 17 00:00:00 2001 From: Luke Vella Date: Fri, 30 Aug 2024 09:10:18 +0100 Subject: [PATCH 8/8] Use correct image for self-hosted --- apps/web/public/images/rallly-logo-mark.png | Bin 0 -> 841 bytes apps/web/src/utils/emails.ts | 2 +- 2 files changed, 1 insertion(+), 1 deletion(-) create mode 100644 apps/web/public/images/rallly-logo-mark.png diff --git a/apps/web/public/images/rallly-logo-mark.png b/apps/web/public/images/rallly-logo-mark.png new file mode 100644 index 0000000000000000000000000000000000000000..13ef1b7510499c1103a24e14a1bcb1da197e747c GIT binary patch literal 841 zcmV-P1GfB$P)%k+1DqdAqv38I8q7NBqC*@*D zpwKHsO1s=HVgvB@CvDYe{0n<7@(|dR@Qi;RJ&Ws;ARMO_0LQ5Xz;P-kKo>Uq zUiY`Pb<9c$@VZxrdKLRjSE*lh0XO!%iScT7WdsD_ANTtmb=^2Kl~4%*A>r@o;AZO+ z3@E*TnD9$T8Z~RB7O*lraDnFBhXJJ(uugcrA@bU^T`#48yuvf36Od2nMef5BKE~6)8o9XN&~|>unK5$~qE?49}R) zfMzo;V623q!!yPLf*Xw>k79l#R6-fTGl_4I2*W?!8G7AcdM`ml-JGzL@a}I9axs-s z^>z3`%%999JY(%Dz!Fx@gxmR;uM`ATitvopI$#Y6tH?DxW4#hIkdS+LCX-S)g@i)F zGnw@Q2_zI2p2@TsT0=si;hD_4!59gJhi7tWheITkB0Q7Zdcab`;sXiQD@%CBN+q~1 z{^?7j^}8&nx5nT&wE#FyEdY*F3y6Bc#@>5b;QflI=OP8Do5pe6FIEM9A(fJm?<1<; zF96430hPWR+!R4X7jP6Jd=vU}4{pwaDM$=Nu(Kn?9)U{Ns%FGg&-!!D%-Qb%AvK{M Ts3c+X00000NkvXXu0mjf>)Uo9 literal 0 HcmV?d00001 diff --git a/apps/web/src/utils/emails.ts b/apps/web/src/utils/emails.ts index 1fa5aa57456..11e6376f371 100644 --- a/apps/web/src/utils/emails.ts +++ b/apps/web/src/utils/emails.ts @@ -17,7 +17,7 @@ export const emailClient = new EmailClient({ }, context: { logoUrl: isSelfHosted - ? absoluteUrl("/logo.png") + ? absoluteUrl("/images/rallly-logo-mark.png") : "https://rallly-public.s3.amazonaws.com/images/rallly-logo-mark.png", baseUrl: absoluteUrl(""), domain: absoluteUrl("").replace(/(^\w+:|^)\/\//, ""),