From c9c634cceb179f1d82fcb0d73c48335ee6780fa8 Mon Sep 17 00:00:00 2001 From: Hariom Balhara Date: Mon, 18 Sep 2023 21:28:07 +0530 Subject: [PATCH] Support firstName and lastName query params (#11420) --- .../manage-booking-questions.e2e.ts | 19 +++++++++++++++++++ .../BookEventForm/BookEventForm.tsx | 8 ++++++++ 2 files changed, 27 insertions(+) diff --git a/apps/web/playwright/manage-booking-questions.e2e.ts b/apps/web/playwright/manage-booking-questions.e2e.ts index 088219f1e9..4091acfa1a 100644 --- a/apps/web/playwright/manage-booking-questions.e2e.ts +++ b/apps/web/playwright/manage-booking-questions.e2e.ts @@ -153,6 +153,25 @@ test.describe("Manage Booking Questions", () => { }); }); }); + + await test.step("Verify that we can prefill name field with firstName,lastName query params", async () => { + const searchParams = new URLSearchParams(); + searchParams.append("firstName", "John"); + searchParams.append("lastName", "Doe"); + await doOnFreshPreviewWithSearchParams(searchParams, page, context, async (page) => { + await selectFirstAvailableTimeSlotNextMonth(page); + await expectSystemFieldsToBeThereOnBookingPage({ + page, + isFirstAndLastNameVariant: true, + values: { + name: { + firstName: "John", + lastName: "Doe", + }, + }, + }); + }); + }); }); }); diff --git a/packages/features/bookings/Booker/components/BookEventForm/BookEventForm.tsx b/packages/features/bookings/Booker/components/BookEventForm/BookEventForm.tsx index 4b093855cc..b22574e3ed 100644 --- a/packages/features/bookings/Booker/components/BookEventForm/BookEventForm.tsx +++ b/packages/features/bookings/Booker/components/BookEventForm/BookEventForm.tsx @@ -473,8 +473,16 @@ function useInitialFormValues({ view: rescheduleUid ? "reschedule" : "booking", }); + // Routing Forms don't support Split full name(because no Form Builder in there), so user needs to create two fields in there themselves. If they name these fields, `firstName` and `lastName`, we can prefill the Booking Form with them + // Once we support formBuilder in Routing Forms, we should be able to forward JSON form of name field value to Booking Form and prefill it there without having these two query params separately. + const firstNameQueryParam = searchParams?.get("firstName"); + const lastNameQueryParam = searchParams?.get("lastName"); + const parsedQuery = await querySchema.parseAsync({ ...routerQuery, + name: + searchParams?.get("name") || + (firstNameQueryParam ? `${firstNameQueryParam} ${lastNameQueryParam}` : null), // `guest` because we need to support legacy URL with `guest` query param support // `guests` because the `name` of the corresponding bookingField is `guests` guests: searchParams?.getAll("guests") || searchParams?.getAll("guest"),