From 0c0cac28fdea32404f1f5a6d3718751f3591a487 Mon Sep 17 00:00:00 2001 From: Dilpreet Singh Date: Fri, 19 Jul 2024 18:00:41 +0530 Subject: [PATCH] fix: multiple getSchedule requests on email change in booker (#15616) * fix: multiple getSchedule requests on email change in booker * fix: use debounce for formEmail --------- Co-authored-by: Udit Takkar <53316345+Udit-takkar@users.noreply.github.com> Co-authored-by: Amit Sharma <74371312+Amit91848@users.noreply.github.com> Co-authored-by: Keith Williams --- packages/platform/atoms/booker/BookerWebWrapper.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/platform/atoms/booker/BookerWebWrapper.tsx b/packages/platform/atoms/booker/BookerWebWrapper.tsx index 68727a3b78..b32ff954cd 100644 --- a/packages/platform/atoms/booker/BookerWebWrapper.tsx +++ b/packages/platform/atoms/booker/BookerWebWrapper.tsx @@ -19,6 +19,7 @@ import { useBookerStore, useInitializeBookerStore } from "@calcom/features/booki import { useEvent, useScheduleForEvent } from "@calcom/features/bookings/Booker/utils/event"; import { useBrandColors } from "@calcom/features/bookings/Booker/utils/use-brand-colors"; import { DEFAULT_LIGHT_BRAND_COLOR, DEFAULT_DARK_BRAND_COLOR } from "@calcom/lib/constants"; +import { useDebounce } from "@calcom/lib/hooks/useDebounce"; import { useRouterQuery } from "@calcom/lib/hooks/useRouterQuery"; import { BookerLayouts } from "@calcom/prisma/zod-utils"; @@ -116,6 +117,7 @@ export const BookerWebWrapper = (props: BookerWebWrapperAtomProps) => { * Prioritize dateSchedule load * Component will render but use data already fetched from here, and no duplicate requests will be made * */ + const debouncedFormEmail = useDebounce(bookerForm.formEmail, 600); const schedule = useScheduleForEvent({ prefetchNextMonth, username: props.username, @@ -125,7 +127,7 @@ export const BookerWebWrapper = (props: BookerWebWrapperAtomProps) => { month: props.month, duration: props.duration, selectedDate, - bookerEmail: bookerForm.formEmail, + bookerEmail: debouncedFormEmail, }); const bookings = useBookings({ event,