diff --git a/media_commons_booking_app/src/client/routes/booking/formPages/UserSectionPage.tsx b/media_commons_booking_app/src/client/routes/booking/formPages/UserSectionPage.tsx
index 91406e6c..8880450b 100644
--- a/media_commons_booking_app/src/client/routes/booking/formPages/UserSectionPage.tsx
+++ b/media_commons_booking_app/src/client/routes/booking/formPages/UserSectionPage.tsx
@@ -1,8 +1,9 @@
-import React, { useContext, useState } from 'react';
+import React, { useContext } from 'react';
 
 import { BookingContext } from '../bookingProvider';
 import { DatabaseContext } from '../../components/Provider';
 import FormInput from '../components/FormInput';
+import { Inputs } from '../../../../types';
 import Loading from '../../../utils/Loading';
 import { useNavigate } from 'react-router-dom';
 import useSubmitBooking from '../hooks/useSubmitBooking';
@@ -14,7 +15,7 @@ export default function UserSectionPage() {
 
   const [registerEvent, loading] = useSubmitBooking();
 
-  const handleSubmit = async (data) => {
+  const handleSubmit = async (data: Inputs) => {
     if (!bookingCalendarInfo) return;
     if (!userEmail && data.missingEmail) {
       setUserEmail(data.missingEmail);
diff --git a/media_commons_booking_app/src/client/routes/booking/hooks/useSubmitBooking.tsx b/media_commons_booking_app/src/client/routes/booking/hooks/useSubmitBooking.tsx
index 7e90f7ec..71893b57 100644
--- a/media_commons_booking_app/src/client/routes/booking/hooks/useSubmitBooking.tsx
+++ b/media_commons_booking_app/src/client/routes/booking/hooks/useSubmitBooking.tsx
@@ -1,5 +1,5 @@
+import { Booking, Inputs, RoomSetting } from '../../../../types';
 import { INSTANT_APPROVAL_ROOMS, TableNames } from '../../../../policy';
-import { Inputs, RoomSetting } from '../../../../types';
 import { useContext, useMemo, useState } from 'react';
 
 import { BookingContext } from '../bookingProvider';
@@ -7,7 +7,10 @@ import { DatabaseContext } from '../../components/Provider';
 import { formatDate } from '@fullcalendar/core';
 import { serverFunctions } from '../../../utils/serverFunctions';
 
-export default function useSubmitBooking(): [(any) => Promise<void>, boolean] {
+export default function useSubmitBooking(): [
+  (x: Inputs) => Promise<void>,
+  boolean
+] {
   const { liaisonUsers, userEmail, reloadBookings, reloadBookingStatuses } =
     useContext(DatabaseContext);
   const { bookingCalendarInfo, department, role, selectedRooms } =
@@ -43,15 +46,16 @@ export default function useSubmitBooking(): [(any) => Promise<void>, boolean] {
     }
   };
 
-  const sendApprovalEmail = (recipient, contents) => {
+  const sendApprovalEmail = (recipients: string[], contents: Booking) => {
     var subject = 'Approval Request';
-
-    serverFunctions.sendHTMLEmail(
-      'approval_email',
-      contents,
-      recipient,
-      subject,
-      ''
+    recipients.forEach((recipient) =>
+      serverFunctions.sendHTMLEmail(
+        'approval_email',
+        contents,
+        recipient,
+        subject,
+        ''
+      )
     );
   };
 
@@ -127,7 +131,7 @@ export default function useSubmitBooking(): [(any) => Promise<void>, boolean] {
       const getApprovalUrl = serverFunctions.approvalUrl(calendarEventId);
       const getRejectedUrl = serverFunctions.rejectUrl(calendarEventId);
       Promise.all([getApprovalUrl, getRejectedUrl]).then((values) => {
-        const userEventInputs = {
+        const userEventInputs: Booking = {
           calendarEventId: calendarEventId,
           roomId: selectedRoomIds,
           email: email,
diff --git a/media_commons_booking_app/src/client/routes/components/Provider.tsx b/media_commons_booking_app/src/client/routes/components/Provider.tsx
index bc5f335b..2f8f2f3c 100644
--- a/media_commons_booking_app/src/client/routes/components/Provider.tsx
+++ b/media_commons_booking_app/src/client/routes/components/Provider.tsx
@@ -14,6 +14,11 @@ import React, { createContext, useEffect, useMemo, useState } from 'react';
 import { TableNames } from '../../../policy';
 import { serverFunctions } from '../../utils/serverFunctions';
 
+type LiaisonTypeExtended = LiaisonType & {
+  emailDev: string;
+  emailStaging: string;
+};
+
 export interface DatabaseContextType {
   adminUsers: AdminUser[];
   bannedUsers: Ban[];
@@ -153,7 +158,11 @@ export const DatabaseProvider = ({ children }) => {
   const fetchLiaisonUsers = async () => {
     const liaisons = await serverFunctions
       .getAllActiveSheetRows(TableNames.LIAISONS)
-      .then((rows) => JSON.parse(rows) as LiaisonType[]);
+      .then((rows) => {
+        return (JSON.parse(rows) as LiaisonTypeExtended[])
+          .map(chooseLiaisonEmailForBranch)
+          .filter((x) => x.email.length > 0);
+      });
     setLiaisonUsers(liaisons);
   };
 
@@ -193,3 +202,18 @@ export const DatabaseProvider = ({ children }) => {
     </DatabaseContext.Provider>
   );
 };
+
+const chooseLiaisonEmailForBranch = (liaison: LiaisonTypeExtended) => {
+  const liaisonForBranch = liaison;
+  switch (process.env.BRANCH_NAME) {
+    case 'development':
+      liaisonForBranch.email = liaison.emailDev;
+      break;
+    case 'staging':
+      liaisonForBranch.email = liaison.emailStaging;
+      break;
+  }
+  delete liaisonForBranch.emailDev;
+  delete liaisonForBranch.emailStaging;
+  return liaisonForBranch;
+};
diff --git a/media_commons_booking_app/src/server/emails.ts b/media_commons_booking_app/src/server/emails.ts
index 01147b10..fdd73bdd 100644
--- a/media_commons_booking_app/src/server/emails.ts
+++ b/media_commons_booking_app/src/server/emails.ts
@@ -1,3 +1,5 @@
+import { Booking } from '../types';
+
 export const sendTextEmail = (
   targetEmail: string,
   title: string,
@@ -8,7 +10,7 @@ export const sendTextEmail = (
 
 export const sendHTMLEmail = (
   templateName: string,
-  contents: any,
+  contents: Booking,
   targetEmail: string,
   title: string,
   body