From ca7a78dcdab4a940cf535661a312f08cdb29d2c7 Mon Sep 17 00:00:00 2001 From: Carina Wollendorfer <30310907+CarinaWolli@users.noreply.github.com> Date: Thu, 4 Aug 2022 04:52:05 -0400 Subject: [PATCH] Improve design of workflow reminder email (#3685) --- .../workflows/api/scheduleEmailReminders.ts | 1 + .../lib/reminders/emailReminderManager.ts | 4 +-- .../lib/reminders/smsReminderManager.ts | 1 + .../templates/emailReminderTemplate.ts | 26 ++++++++++++++----- .../trpc/server/routers/viewer/workflows.tsx | 3 +++ 5 files changed, 26 insertions(+), 9 deletions(-) diff --git a/packages/features/ee/workflows/api/scheduleEmailReminders.ts b/packages/features/ee/workflows/api/scheduleEmailReminders.ts index e95145f924..ddf4b21529 100644 --- a/packages/features/ee/workflows/api/scheduleEmailReminders.ts +++ b/packages/features/ee/workflows/api/scheduleEmailReminders.ts @@ -98,6 +98,7 @@ async function handler(req: NextApiRequest, res: NextApiResponse) { case WorkflowTemplates.REMINDER: emailContent = emailReminderTemplate( reminder.booking?.startTime.toISOString() || "", + reminder.booking?.endTime.toISOString() || "", reminder.booking?.eventType?.title || "", timeZone || "", attendeeName || "", diff --git a/packages/features/ee/workflows/lib/reminders/emailReminderManager.ts b/packages/features/ee/workflows/lib/reminders/emailReminderManager.ts index 2b7cd71b34..055b0ef05c 100644 --- a/packages/features/ee/workflows/lib/reminders/emailReminderManager.ts +++ b/packages/features/ee/workflows/lib/reminders/emailReminderManager.ts @@ -39,7 +39,7 @@ export const scheduleEmailReminder = async ( workflowStepId: number, template: WorkflowTemplates ) => { - const { startTime } = evt; + const { startTime, endTime } = evt; const uid = evt.uid as string; const currentDate = dayjs(); const timeUnit: timeUnitLowerCase | undefined = @@ -71,7 +71,7 @@ export const scheduleEmailReminder = async ( switch (template) { case WorkflowTemplates.REMINDER: - emailContent = emailReminderTemplate(startTime, evt.title, timeZone, attendeeName, name); + emailContent = emailReminderTemplate(startTime, endTime, evt.title, timeZone, attendeeName, name); break; case WorkflowTemplates.CUSTOM: const variables: VariablesType = { diff --git a/packages/features/ee/workflows/lib/reminders/smsReminderManager.ts b/packages/features/ee/workflows/lib/reminders/smsReminderManager.ts index 3834c69bcd..dfab44c213 100644 --- a/packages/features/ee/workflows/lib/reminders/smsReminderManager.ts +++ b/packages/features/ee/workflows/lib/reminders/smsReminderManager.ts @@ -30,6 +30,7 @@ export type BookingInfo = { timeZone: string; }; startTime: string; + endTime: string; title: string; location?: string | null; additionalNotes?: string | null; diff --git a/packages/features/ee/workflows/lib/reminders/templates/emailReminderTemplate.ts b/packages/features/ee/workflows/lib/reminders/templates/emailReminderTemplate.ts index f3c18b6d3b..7dc80f234c 100644 --- a/packages/features/ee/workflows/lib/reminders/templates/emailReminderTemplate.ts +++ b/packages/features/ee/workflows/lib/reminders/templates/emailReminderTemplate.ts @@ -1,27 +1,39 @@ +import { WorkflowActions } from ".prisma/client"; import dayjs from "@calcom/dayjs"; const emailReminderTemplate = ( startTime: string, + endTime: string, eventName: string, timeZone: string, attendee: string, name: string ) => { - const emailSubject = `Reminder: ${eventName} on ${dayjs(startTime) + const emailSubject = `Reminder: ${eventName} - ${dayjs(startTime) .tz(timeZone) - .format("YYYY MMM D")} at ${dayjs(startTime).tz(timeZone).format("h:mmA")} ${timeZone}.`; + .format("ddd, MMM D, YYYY")} ${dayjs(startTime).tz(timeZone).format("H:mmA")}`; - const templateBodyText = `Hi ${name}, this is a reminder that your meeting (${eventName}) with ${attendee} is on ${dayjs( + const templateBodyText = `Hi ${name},this is a reminder that your meeting (${eventName}) with ${attendee} is on ${dayjs( startTime ) .tz(timeZone) .format("YYYY MMM D")} at ${dayjs(startTime).tz(timeZone).format("h:mmA")} ${timeZone}.`; - const templateBodyHtml = `Hi ${name},

This is a reminder that your meeting (${eventName}) with ${attendee} is on ${dayjs( - startTime - ) + const introHtml = `Hi ${name},

This is a reminder about your upcoming event.

`; + + const eventHtml = `
Event:
${eventName}

`; + + const dateTimeHtml = `
Date & Time:
${dayjs(startTime) .tz(timeZone) - .format("YYYY MMM D")} at ${dayjs(startTime).tz(timeZone).format("h:mmA")} ${timeZone}.`; + .format("ddd, MMM D, YYYY H:mmA")} - ${dayjs(endTime) + .tz(timeZone) + .format("H:mmA")} (${timeZone})

`; + + const attendeeHtml = `
Attendees:
You & ${attendee}

`; + + const endingHtml = `This reminder was triggered by a Workflow in Cal.

_

Scheduling by Cal.com`; + + const templateBodyHtml = introHtml + eventHtml + dateTimeHtml + attendeeHtml + endingHtml; const emailBody = { text: templateBodyText, html: templateBodyHtml }; diff --git a/packages/trpc/server/routers/viewer/workflows.tsx b/packages/trpc/server/routers/viewer/workflows.tsx index cf21dfd115..dd78d7ac42 100644 --- a/packages/trpc/server/routers/viewer/workflows.tsx +++ b/packages/trpc/server/routers/viewer/workflows.tsx @@ -348,6 +348,7 @@ export const workflowsRouter = createProtectedRouter() } : { name: "", email: "", timeZone: "", language: { locale: "" } }, startTime: booking.startTime.toISOString(), + endTime: booking.endTime.toISOString(), title: booking.title, language: { locale: booking?.user?.locale || "" }, }; @@ -505,6 +506,7 @@ export const workflowsRouter = createProtectedRouter() } : { name: "", email: "", timeZone: "", language: { locale: "" } }, startTime: booking.startTime.toISOString(), + endTime: booking.endTime.toISOString(), title: booking.title, language: { locale: booking?.user?.locale || "" }, }; @@ -604,6 +606,7 @@ export const workflowsRouter = createProtectedRouter() } : { name: "", email: "", timeZone: "", language: { locale: "" } }, startTime: booking.startTime.toISOString(), + endTime: booking.endTime.toISOString(), title: booking.title, language: { locale: booking?.user?.locale || "" }, };