From 9f362db60c427087a51e695175eaf279f70a1c91 Mon Sep 17 00:00:00 2001
From: Carina Wollendorfer <30310907+CarinaWolli@users.noreply.github.com>
Date: Fri, 28 Oct 2022 11:53:06 +0200
Subject: [PATCH] add attendee's email as dynamic text variable (#5258)

Co-authored-by: CarinaWolli <wollencarina@gmail.com>
---
 apps/web/public/static/locales/en/common.json |  4 ++-
 .../workflows/api/scheduleEmailReminders.ts   |  1 +
 .../ee/workflows/api/scheduleSMSReminders.ts  |  1 +
 .../components/v2/AddVariablesDropdown.tsx    | 27 ++++++++++---------
 .../lib/reminders/emailReminderManager.ts     |  1 +
 .../lib/reminders/smsReminderManager.ts       |  1 +
 .../lib/reminders/templates/customTemplate.ts |  4 ++-
 7 files changed, 24 insertions(+), 15 deletions(-)

diff --git a/apps/web/public/static/locales/en/common.json b/apps/web/public/static/locales/en/common.json
index ddd9c157a9..439830059a 100644
--- a/apps/web/public/static/locales/en/common.json
+++ b/apps/web/public/static/locales/en/common.json
@@ -1336,5 +1336,7 @@
   "limit_future_bookings_description":"Limit how far in the future this event can be booked",
   "no_event_types": "No event types setup",
   "no_event_types_description": "{{name}} has not setup any event types for you to book.",
-  "number_sms_notifications": "Phone number (SMS\u00a0notifications)"
+  "number_sms_notifications": "Phone number (SMS\u00a0notifications)",
+  "attendee_email_workflow": "Attendee email",
+  "attendee_email_info": "The person booking's email"
 }
diff --git a/packages/features/ee/workflows/api/scheduleEmailReminders.ts b/packages/features/ee/workflows/api/scheduleEmailReminders.ts
index f0361b4782..53b381513f 100644
--- a/packages/features/ee/workflows/api/scheduleEmailReminders.ts
+++ b/packages/features/ee/workflows/api/scheduleEmailReminders.ts
@@ -118,6 +118,7 @@ async function handler(req: NextApiRequest, res: NextApiResponse) {
               eventName: reminder.booking?.eventType?.title || "",
               organizerName: reminder.booking?.user?.name || "",
               attendeeName: reminder.booking?.attendees[0].name,
+              attendeeEmail: reminder.booking?.attendees[0].email,
               eventDate: dayjs(reminder.booking?.startTime).tz(timeZone),
               eventTime: dayjs(reminder.booking?.startTime).tz(timeZone),
               timeZone: timeZone,
diff --git a/packages/features/ee/workflows/api/scheduleSMSReminders.ts b/packages/features/ee/workflows/api/scheduleSMSReminders.ts
index 38098fca4a..c49ae06f20 100644
--- a/packages/features/ee/workflows/api/scheduleSMSReminders.ts
+++ b/packages/features/ee/workflows/api/scheduleSMSReminders.ts
@@ -88,6 +88,7 @@ async function handler(req: NextApiRequest, res: NextApiResponse) {
               eventName: reminder.booking?.eventType?.title,
               organizerName: reminder.booking?.user?.name || "",
               attendeeName: reminder.booking?.attendees[0].name,
+              attendeeEmail: reminder.booking?.attendees[0].email,
               eventDate: dayjs(reminder.booking?.startTime).tz(timeZone),
               eventTime: dayjs(reminder.booking?.startTime).tz(timeZone),
               timeZone: timeZone,
diff --git a/packages/features/ee/workflows/components/v2/AddVariablesDropdown.tsx b/packages/features/ee/workflows/components/v2/AddVariablesDropdown.tsx
index 42cd301c59..eaa6e0be05 100644
--- a/packages/features/ee/workflows/components/v2/AddVariablesDropdown.tsx
+++ b/packages/features/ee/workflows/components/v2/AddVariablesDropdown.tsx
@@ -20,6 +20,7 @@ const variables = [
   "location",
   "organizer_name",
   "attendee_name",
+  "attendee_email",
   "additional_notes",
 ];
 
@@ -28,29 +29,29 @@ export const AddVariablesDropdown = (props: IAddVariablesDropdown) => {
 
   return (
     <Dropdown>
-      <DropdownMenuTrigger className="focus:bg-transparent focus:ring-transparent focus:ring-offset-0 ">
-        <Label className="mb-0">
-          <div className="flex items-center">
-            {t("add_variable")}
-            <Icon.FiChevronDown className="ml-1 h-4 w-4" />
-          </div>
-        </Label>
+      <DropdownMenuTrigger className="pt-[6px] focus:bg-gray-50">
+        <div className="flex items-center ">
+          {t("add_variable")}
+          <Icon.FiChevronDown className="ml-1 h-4 w-4" />
+        </div>
       </DropdownMenuTrigger>
       <DropdownMenuContent className="h-40 overflow-scroll">
-        <div className="p-3">
-          <div className="mb-2 text-xs text-gray-500">{t("add_dynamic_variables").toLocaleUpperCase()}</div>
+        <div className="pt-4 pb-1">
+          <div className="mb-2 px-4 text-left text-xs text-gray-500">
+            {t("add_dynamic_variables").toLocaleUpperCase()}
+          </div>
           {variables.map((variable) => (
-            <DropdownMenuItem key={variable}>
+            <DropdownMenuItem key={variable} className="hover:ring-0">
               <button
                 key={variable}
                 type="button"
-                className="w-full py-2"
+                className="w-full px-4 py-2"
                 onClick={() => props.addVariable(props.isEmailSubject, t(`${variable}_workflow`))}>
-                <div className="md:grid md:grid-cols-2">
+                <div className="sm:grid sm:grid-cols-2">
                   <div className="mr-3 text-left md:col-span-1">
                     {`{${t(`${variable}_workflow`).toUpperCase().replace(/ /g, "_")}}`}
                   </div>
-                  <div className="invisible text-left text-gray-600 md:visible md:col-span-1">
+                  <div className="hidden text-left text-gray-600 sm:col-span-1 sm:flex">
                     {t(`${variable}_info`)}
                   </div>
                 </div>
diff --git a/packages/features/ee/workflows/lib/reminders/emailReminderManager.ts b/packages/features/ee/workflows/lib/reminders/emailReminderManager.ts
index 5f680735e5..186069c9ad 100644
--- a/packages/features/ee/workflows/lib/reminders/emailReminderManager.ts
+++ b/packages/features/ee/workflows/lib/reminders/emailReminderManager.ts
@@ -99,6 +99,7 @@ export const scheduleEmailReminder = async (
         eventName: evt.title || "",
         organizerName: evt.organizer.name,
         attendeeName: evt.attendees[0].name,
+        attendeeEmail: evt.attendees[0].email,
         eventDate: dayjs(startTime).tz(timeZone),
         eventTime: dayjs(startTime).tz(timeZone),
         timeZone: timeZone,
diff --git a/packages/features/ee/workflows/lib/reminders/smsReminderManager.ts b/packages/features/ee/workflows/lib/reminders/smsReminderManager.ts
index 12b6d14a93..4ef0f3e4ee 100644
--- a/packages/features/ee/workflows/lib/reminders/smsReminderManager.ts
+++ b/packages/features/ee/workflows/lib/reminders/smsReminderManager.ts
@@ -76,6 +76,7 @@ export const scheduleSMSReminder = async (
         eventName: evt.title,
         organizerName: evt.organizer.name,
         attendeeName: evt.attendees[0].name,
+        attendeeEmail: evt.attendees[0].email,
         eventDate: dayjs(evt.startTime).tz(timeZone),
         eventTime: dayjs(evt.startTime).tz(timeZone),
         timeZone: timeZone,
diff --git a/packages/features/ee/workflows/lib/reminders/templates/customTemplate.ts b/packages/features/ee/workflows/lib/reminders/templates/customTemplate.ts
index 7f6edb44a9..df8adebac4 100644
--- a/packages/features/ee/workflows/lib/reminders/templates/customTemplate.ts
+++ b/packages/features/ee/workflows/lib/reminders/templates/customTemplate.ts
@@ -6,6 +6,7 @@ export type VariablesType = {
   eventName?: string;
   organizerName?: string;
   attendeeName?: string;
+  attendeeEmail?: string;
   eventDate?: Dayjs;
   eventTime?: Dayjs;
   timeZone?: string;
@@ -31,7 +32,8 @@ const customTemplate = async (text: string, variables: VariablesType, locale: st
     .replaceAll("{EVENT_DATE}", variables.eventDate?.locale(locale).format("dddd, MMMM D, YYYY") || "")
     .replaceAll("{EVENT_TIME}", timeWithTimeZone)
     .replaceAll("{LOCATION}", locationString)
-    .replaceAll("{ADDITIONAL_NOTES}", variables.additionalNotes || "");
+    .replaceAll("{ADDITIONAL_NOTES}", variables.additionalNotes || "")
+    .replaceAll("{ATTENDEE_EMAIL}", variables.attendeeEmail || "");
 
   const customInputvariables = dynamicText.match(/\{(.+?)}/g)?.map((variable) => {
     return variable.replace("{", "").replace("}", "");