Merged in feat/sw-2857-refactor-booking-flow-url-updates (pull request #2302)

feat(SW-2857): Refactor booking flow url updates * Add support for removing parameters when using initial values in serializeSearchParams * Don't manually write search params in rate store * Booking is already from live search params so no need * Fix input type in serializeBookingSearchParams Approved-by: Linus Flood
2025-06-09 09:16:22 +00:00
parent 879a383b61
commit bff34b034e
12 changed files with 189 additions and 189 deletions
--- a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/RateSummary/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/RateSummary/index.tsx
@@ -1,5 +1,5 @@
 "use client"
-import { useRouter } from "next/navigation"
+import { useRouter, useSearchParams } from "next/navigation"
 import { useSession } from "next-auth/react"
 import { useState, useTransition } from "react"
 import { useIntl } from "react-intl"
@@ -32,7 +32,6 @@ export default function RateSummary() {
    isFetchingPackages,
    rateSummary,
    roomsAvailability,
-    searchParams,
  } = useRatesStore((state) => ({
    bookingCode: state.booking.bookingCode,
    bookingRooms: state.booking.rooms,
@@ -43,7 +42,6 @@ export default function RateSummary() {
    isFetchingPackages: state.rooms.some((room) => room.isFetchingPackages),
    rateSummary: state.rateSummary,
    roomsAvailability: state.roomsAvailability,
-    searchParams: state.searchParams,
  }))
  const { data: session } = useSession()
  const isUserLoggedIn = isValidClientSession(session)
@@ -51,7 +49,7 @@ export default function RateSummary() {
  const [isSubmitting, setIsSubmitting] = useState(false)
  const intl = useIntl()
  const router = useRouter()
-  const params = new URLSearchParams(searchParams)
+  const params = useSearchParams()
  const [_, startTransition] = useTransition()

  if (!roomsAvailability) {
--- a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsHeader/RoomPackageFilter/Form/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsHeader/RoomPackageFilter/Form/index.tsx
@@ -38,6 +38,9 @@ export default function Form({ close }: { close: () => void }) {
  })

  async function getFilteredRates(packages: PackageEnum[]) {
+    const bookingCode = bookingRoom.rateCode
+      ? bookingRoom.bookingCode
+      : booking.bookingCode
    const filterRates = await utils.hotel.availability.selectRate.room.fetch({
      booking: {
        fromDate: booking.fromDate,
@@ -46,9 +49,7 @@ export default function Form({ close }: { close: () => void }) {
        toDate: booking.toDate,
        room: {
          ...bookingRoom,
-          bookingCode: bookingRoom.rateCode
-            ? bookingRoom.bookingCode
-            : booking.bookingCode,
+          bookingCode: bookingCode ?? undefined,
          packages,
        },
      },
--- a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsHeader/RoomPackageFilter/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomsHeader/RoomPackageFilter/index.tsx
@@ -33,6 +33,10 @@ export default function RoomPackageFilter() {

  async function deleteSelectedPackage(code: PackageEnum) {
    removeSelectedPackage(code)
+    const bookingCode = bookingRoom.rateCode
+      ? bookingRoom.bookingCode
+      : booking.bookingCode
+
    const filterRates = await utils.hotel.availability.selectRate.room.fetch({
      booking: {
        fromDate: booking.fromDate,
@@ -41,9 +45,7 @@ export default function RoomPackageFilter() {
        toDate: booking.toDate,
        room: {
          ...bookingRoom,
-          bookingCode: bookingRoom.rateCode
-            ? bookingRoom.bookingCode
-            : booking.bookingCode,
+          bookingCode: bookingCode ?? undefined,
          packages: selectedPackages
            .filter((pkg) => pkg.code !== code)
            .map((pkg) => pkg.code),
--- a/apps/scandic-web/providers/RatesProvider.tsx
+++ b/apps/scandic-web/providers/RatesProvider.tsx
@@ -22,39 +22,41 @@ export default function RatesProvider({
  const searchParams = useSearchParams()
  const intl = useIntl()

-  const store = useMemo(
-    () =>
-      createRatesStore({
-        booking,
-        hotelType,
-        labels: {
-          accessibilityRoom: intl.formatMessage({
-            defaultMessage: "Accessible room",
-          }),
-          allergyRoom: intl.formatMessage({
-            defaultMessage: "Allergy-friendly room",
-          }),
-          petRoom: intl.formatMessage({
-            defaultMessage: "Pet-friendly room",
-          }),
-        },
-        pathname,
-        roomCategories,
-        roomsAvailability,
-        searchParams: new URLSearchParams(searchParams),
-        vat,
-      }),
-    [
+  const modifyRateIndex = searchParams.has("modifyRateIndex")
+    ? Number(searchParams.get("modifyRateIndex"))
+    : undefined
+
+  const store = useMemo(() => {
+    return createRatesStore({
      booking,
      hotelType,
-      intl,
+      labels: {
+        accessibilityRoom: intl.formatMessage({
+          defaultMessage: "Accessible room",
+        }),
+        allergyRoom: intl.formatMessage({
+          defaultMessage: "Allergy-friendly room",
+        }),
+        petRoom: intl.formatMessage({
+          defaultMessage: "Pet-friendly room",
+        }),
+      },
      pathname,
      roomCategories,
      roomsAvailability,
-      searchParams,
      vat,
-    ]
-  )
+      initialActiveRoom: modifyRateIndex,
+    })
+  }, [
+    booking,
+    hotelType,
+    intl,
+    pathname,
+    roomCategories,
+    roomsAvailability,
+    modifyRateIndex,
+    vat,
+  ])

  return <RatesContext.Provider value={store}>{children}</RatesContext.Provider>
 }
--- a/apps/scandic-web/stores/select-rate/helpers.ts
+++ b/apps/scandic-web/stores/select-rate/helpers.ts
@@ -45,9 +45,9 @@ export function findProduct(
 }

 export function findProductInRoom(
-  rateCode: string | undefined,
+  rateCode: string | undefined | null,
  room: RoomConfiguration,
-  counterRateCode = ""
+  counterRateCode: string | undefined | null
 ) {
  if (!rateCode) {
    return null
@@ -55,7 +55,7 @@ export function findProductInRoom(

  if (room.campaign.length) {
    const campaignProduct = room.campaign.find((product) =>
-      findProduct(rateCode, product, counterRateCode)
+      findProduct(rateCode, product, counterRateCode || "")
    )
    if (campaignProduct) {
      return campaignProduct
@@ -63,7 +63,7 @@ export function findProductInRoom(
  }
  if (room.code.length) {
    const codeProduct = room.code.find((product) =>
-      findProduct(rateCode, product, counterRateCode)
+      findProduct(rateCode, product, counterRateCode || "")
    )
    if (codeProduct) {
      return codeProduct
@@ -79,7 +79,7 @@ export function findProductInRoom(
  }
  if (room.regular.length) {
    const regularProduct = room.regular.find((product) =>
-      findProduct(rateCode, product, counterRateCode)
+      findProduct(rateCode, product, counterRateCode || "")
    )
    if (regularProduct) {
      return regularProduct
@@ -88,9 +88,9 @@ export function findProductInRoom(
 }

 export function findSelectedRate(
-  rateCode: string | undefined,
-  counterRateCode: string | undefined,
-  roomTypeCode: string | undefined,
+  rateCode: string | undefined | null,
+  counterRateCode: string | undefined | null,
+  roomTypeCode: string | undefined | null,
  rooms: RoomConfiguration[] | AvailabilityError
 ) {
  if (!Array.isArray(rooms)) {
@@ -109,17 +109,6 @@ export function findSelectedRate(
  })
 }

-export function clearRoomSelectionFromUrl(
-  roomIdx: number,
-  searchParams: URLSearchParams
-) {
-  searchParams.delete(`room[${roomIdx}].bookingCode`)
-  searchParams.delete(`room[${roomIdx}].counterratecode`)
-  searchParams.delete(`room[${roomIdx}].ratecode`)
-  searchParams.delete(`room[${roomIdx}].roomtype`)
-  return searchParams
-}
-
 export function findDefaultCurrency(
  roomsAvailability: (RoomsAvailability | AvailabilityError)[] | undefined
 ) {
--- a/apps/scandic-web/stores/select-rate/index.ts
+++ b/apps/scandic-web/stores/select-rate/index.ts
@@ -5,9 +5,9 @@ import { create, useStore } from "zustand"
 import { REDEMPTION } from "@/constants/booking"

 import { RatesContext } from "@/contexts/Rates"
+import { serializeBookingSearchParams } from "@/utils/url"

 import {
-  clearRoomSelectionFromUrl,
  findDefaultCurrency,
  findProductInRoom,
  findSelectedRate,
@@ -27,9 +27,16 @@ export function createRatesStore({
  pathname,
  roomCategories,
  roomsAvailability,
-  searchParams,
+  initialActiveRoom,
  vat,
 }: InitialState) {
+  function updateUrl(booking: RatesState["booking"]) {
+    const searchParams = serializeBookingSearchParams(booking, {
+      initialSearchParams: new URLSearchParams(window.location.search),
+    })
+    window.history.replaceState({}, "", `${pathname}?${searchParams}`)
+  }
+
  const packageOptions = [
    {
      code: RoomPackageCodeEnum.ACCESSIBILITY_ROOM,
@@ -73,13 +80,8 @@ export function createRatesStore({
      )

      if (!selectedRoom) {
-        const updatedSearchParams = clearRoomSelectionFromUrl(idx, searchParams)
-        searchParams = updatedSearchParams
-        window.history.replaceState(
-          {},
-          "",
-          `${pathname}?${updatedSearchParams}`
-        )
+        booking.rooms[idx] = roomWithoutSelection(room)
+        updateUrl(booking)
        continue
      }

@@ -108,8 +110,8 @@ export function createRatesStore({
  }

  let activeRoom = rateSummary.length
-  if (searchParams.has("modifyRateIndex")) {
-    activeRoom = Number(searchParams.get("modifyRateIndex"))
+  if (initialActiveRoom) {
+    activeRoom = initialActiveRoom
  } else if (rateSummary.length === booking.rooms.length) {
    // Finds the first unselected room and sets that to active
    // if no unselected rooms it will return -1 and close all rooms
@@ -128,13 +130,11 @@ export function createRatesStore({
      packageOptions,
      hotelType,
      isRedemptionBooking,
-      pathname,
      rateSummary,
      roomConfigurations,
      roomCategories,
      roomsPackages,
      roomsAvailability,
-      searchParams,
      vat,
      defaultCurrency,
      rooms: booking.rooms.map((room, idx) => {
@@ -266,23 +266,14 @@ export function createRatesStore({
                      BookingCodeFilterEnum.Discounted
                  }

-                  const searchParams = state.searchParams
                  if (filteredSelectedPackages.length) {
-                    searchParams.set(
-                      `room[${idx}].packages`,
-                      filteredSelectedPackages.map((pkg) => pkg.code).join(",")
-                    )
+                    state.booking.rooms[idx].packages =
+                      filteredSelectedPackages.map((pkg) => pkg.code)
                  } else {
-                    searchParams.delete(`room[${idx}].packages`)
+                    state.booking.rooms[idx].packages = null
                  }

-                  state.searchParams = searchParams
-
-                  window.history.replaceState(
-                    {},
-                    "",
-                    `${state.pathname}?${searchParams}`
-                  )
+                  updateUrl(state.booking)
                })
              )
            },
@@ -300,36 +291,8 @@ export function createRatesStore({
                      BookingCodeFilterEnum.Discounted
                  }

-                  const searchParams = state.searchParams
-                  searchParams.delete(`room[${idx}].packages`)
-
-                  state.searchParams = searchParams
-
-                  window.history.replaceState(
-                    {},
-                    "",
-                    `${state.pathname}?${searchParams}`
-                  )
-                })
-              )
-            },
-            removeSelectedRoom() {
-              return set(
-                produce((state: RatesState) => {
-                  state.rateSummary[idx] = null
-
-                  const searchParams = state.searchParams
-                  searchParams.delete(`room[${idx}].counterratecode`)
-                  searchParams.delete(`room[${idx}].ratecode`)
-                  searchParams.delete(`room[${idx}].roomtype`)
-
-                  state.searchParams = searchParams
-
-                  window.history.replaceState(
-                    {},
-                    "",
-                    `${state.pathname}?${searchParams}`
-                  )
+                  state.booking.rooms[idx].packages = null
+                  updateUrl(state.booking)
                })
              )
            },
@@ -408,43 +371,33 @@ export function createRatesStore({
                  state.rooms[idx].bookingRoom.bookingCode =
                    selectedRate.product.bookingCode

-                  const searchParams = new URLSearchParams(state.searchParams)
                  const counterratecode = isMemberRate
                    ? productRateCode
                    : memberRateCode
                  if (counterratecode) {
-                    searchParams.set(
-                      `room[${idx}].counterratecode`,
-                      counterratecode
-                    )
+                    state.booking.rooms[idx].counterRateCode = counterratecode
                  } else {
-                    if (searchParams.has(`room[${idx}].counterratecode`)) {
-                      searchParams.delete(`room[${idx}].counterratecode`)
-                    }
+                    state.booking.rooms[idx].counterRateCode = null
                  }

                  const rateCode = isMemberRate
                    ? memberRateCode
                    : productRateCode
                  if (rateCode) {
-                    searchParams.set(`room[${idx}].ratecode`, rateCode)
+                    state.booking.rooms[idx].rateCode = rateCode
                  }

                  if (selectedRate.product.bookingCode) {
-                    searchParams.set(
-                      `room[${idx}].bookingCode`,
+                    state.booking.rooms[idx].bookingCode =
                      selectedRate.product.bookingCode
-                    )
                  } else {
-                    if (searchParams.has(`room[${idx}].bookingCode`)) {
-                      searchParams.delete(`room[${idx}].bookingCode`)
+                    if (state.booking.rooms[idx].bookingCode) {
+                      state.booking.rooms[idx].bookingCode = null
                    }
                  }

-                  searchParams.set(
-                    `room[${idx}].roomtype`,
+                  state.booking.rooms[idx].roomTypeCode =
                    selectedRate.roomTypeCode
-                  )

                  if (state.rateSummary.length === state.booking.rooms.length) {
                    state.activeRoom = -1
@@ -452,13 +405,7 @@ export function createRatesStore({
                    state.activeRoom = idx + 1
                  }

-                  state.searchParams = searchParams
-
-                  window.history.replaceState(
-                    {},
-                    "",
-                    `${state.pathname}?${searchParams}`
-                  )
+                  updateUrl(state.booking)
                })
              )
            },
@@ -479,23 +426,13 @@ export function createRatesStore({
                      BookingCodeFilterEnum.Discounted
                  }

-                  const searchParams = state.searchParams
                  if (selectedPackages.length) {
-                    searchParams.set(
-                      `room[${idx}].packages`,
-                      selectedPackages.join(",")
-                    )
+                    state.booking.rooms[idx].packages = selectedPackages
                  } else {
-                    searchParams.delete(`room[${idx}].packages`)
+                    state.booking.rooms[idx].packages = null
                  }

-                  state.searchParams = searchParams
-
-                  window.history.replaceState(
-                    {},
-                    "",
-                    `${state.pathname}?${searchParams}`
-                  )
+                  updateUrl(state.booking)
                })
              )
            },
@@ -519,36 +456,27 @@ export function createRatesStore({
                        rateSummaryRoom.packages =
                          state.rooms[idx].selectedPackages
                      } else {
-                        const searchParams = clearRoomSelectionFromUrl(
-                          idx,
-                          state.searchParams
+                        state.booking.rooms[idx] = roomWithoutSelection(
+                          state.booking.rooms[idx]
                        )
-                        state.searchParams = searchParams
+
                        state.rateSummary[idx] = null
                        state.rooms[idx].selectedRate = null

-                        window.history.replaceState(
-                          {},
-                          "",
-                          `${pathname}?${searchParams}`
-                        )
+                        updateUrl(state.booking)
                      }
                    }
                  } else {
                    state.rooms[idx].rooms = []
                    if (state.rateSummary[idx]) {
-                      const searchParams = clearRoomSelectionFromUrl(
-                        idx,
-                        state.searchParams
+                      state.booking.rooms[idx] = roomWithoutSelection(
+                        state.booking.rooms[idx]
                      )
-                      state.searchParams = searchParams
+
                      state.rateSummary[idx] = null
                      state.rooms[idx].selectedRate = null
-                      window.history.replaceState(
-                        {},
-                        "",
-                        `${pathname}?${searchParams}`
-                      )
+
+                      updateUrl(state.booking)
                    }
                  }
                })
@@ -587,3 +515,15 @@ export function useRatesStore<T>(selector: (store: RatesState) => T) {

  return useStore(store, selector)
 }
+
+function roomWithoutSelection(
+  room: RatesState["booking"]["rooms"][number]
+): RatesState["booking"]["rooms"][number] {
+  return {
+    ...room,
+    rateCode: null,
+    counterRateCode: null,
+    roomTypeCode: null,
+    bookingCode: null,
+  }
+}
--- a/apps/scandic-web/types/components/bookingWidget/guestsRoomsPicker.ts
+++ b/apps/scandic-web/types/components/bookingWidget/guestsRoomsPicker.ts
@@ -1,11 +1,14 @@
-import type { Child, Room } from "../hotelReservation/selectRate/selectRate"
+import type { Child } from "../hotelReservation/selectRate/selectRate"

 export type ChildBed = {
  label: string
  value: number
 }

-export type GuestsRoom = Required<Pick<Room, "adults" | "childrenInRoom">>
+export type GuestsRoom = {
+  adults: number
+  childrenInRoom: Child[]
+}

 export type GuestsRoomPickerProps = {
  index: number
--- a/apps/scandic-web/types/components/hotelReservation/selectRate/selectRate.ts
+++ b/apps/scandic-web/types/components/hotelReservation/selectRate/selectRate.ts
@@ -14,12 +14,12 @@ export interface Child {

 export interface Room {
  adults: number
-  bookingCode?: string
  childrenInRoom?: Child[]
-  counterRateCode?: string
-  packages?: PackageEnum[]
-  rateCode?: string
-  roomTypeCode?: string
+  bookingCode?: string | null
+  counterRateCode?: string | null
+  packages?: PackageEnum[] | null
+  rateCode?: string | null
+  roomTypeCode?: string | null
 }

 export type SelectRateBooking = {
--- a/apps/scandic-web/types/stores/rates.ts
+++ b/apps/scandic-web/types/stores/rates.ts
@@ -27,7 +27,6 @@ interface Actions {
  modifyRate: () => void
  removeSelectedPackage: (code: PackageEnum) => void
  removeSelectedPackages: () => void
-  removeSelectedRoom: () => void
  selectFilter: (filter: BookingCodeFilterEnum) => void
  selectPackages: (codes: PackageEnum[]) => void
  selectRate: (rate: SelectedRate, isUserLoggedIn: boolean) => void
@@ -58,14 +57,12 @@ export interface RatesState {
  hotelType: string | undefined
  isRedemptionBooking: boolean
  packageOptions: DefaultFilterOptions[]
-  pathname: string
  rateSummary: Array<Rate | null>
  rooms: SelectedRoom[]
  roomCategories: Room[]
  roomConfigurations: RoomConfiguration[][]
  roomsPackages: Package[][]
  roomsAvailability: (RoomsAvailability | AvailabilityError)[] | undefined
-  searchParams: URLSearchParams
  vat: number
  defaultCurrency: CurrencyEnum
 }
@@ -73,14 +70,10 @@ export interface RatesState {
 export interface InitialState
  extends Pick<
    RatesState,
-    | "booking"
-    | "hotelType"
-    | "pathname"
-    | "roomCategories"
-    | "roomsAvailability"
-    | "searchParams"
-    | "vat"
+    "booking" | "hotelType" | "roomCategories" | "roomsAvailability" | "vat"
  > {
+  initialActiveRoom?: number
+  pathname: string
  labels: {
    accessibilityRoom: string
    allergyRoom: string
--- a/apps/scandic-web/utils/searchParams.test.ts
+++ b/apps/scandic-web/utils/searchParams.test.ts
@@ -450,6 +450,53 @@ describe("Serialize search params", () => {
      "city=stockholm&hotel=456&filter[0]=1831&filter[1]=1383&packages=ABC"
    )
  })
+
+  test("with initial search params and removing existing parameter", () => {
+    const initialSearchParams = new URLSearchParams(
+      "city=stockholm&hotel=123&filters=123,456,789"
+    )
+    const obj = {
+      hotel: null,
+      filters: ["123", "789"],
+    }
+    const result = serializeSearchParams(obj, {
+      initialSearchParams,
+      typeHints: {
+        filters: "COMMA_SEPARATED_ARRAY",
+      },
+    })
+
+    expect(decodeURIComponent(result.toString())).toEqual(
+      "city=stockholm&filters=123,789"
+    )
+  })
+
+  test("with initial search params and removing values in array", () => {
+    const initialSearchParams = new URLSearchParams(
+      "room[0].adults=1&room[0].rateCode=ABC&room[1].adults=2&room[2].adults=3&room[3].adults=4"
+    )
+    const obj = {
+      room: [
+        {
+          adults: 1,
+          rateCode: null,
+        },
+        {
+          adults: 3,
+        },
+        {
+          adults: 4,
+        },
+      ],
+    }
+    const result = serializeSearchParams(obj, {
+      initialSearchParams,
+    })
+
+    expect(decodeURIComponent(result.toString())).toEqual(
+      "room[0].adults=1&room[1].adults=3&room[2].adults=4"
+    )
+  })
 })

 describe("Parse serialized search params", () => {
--- a/apps/scandic-web/utils/searchParams.ts
+++ b/apps/scandic-web/utils/searchParams.ts
@@ -150,7 +150,11 @@ type SerializeOptions = {
 * @param obj - The object to serialize
 * @param options.keyRenameMap - Optional mapping of keys to rename, ie { "oldKey": "newKey" }
 * @param options.typeHints - Optional type hints to force certain keys to be treated as comma separated arrays
+ * @param options.initialSearchParams - Optional initial URL search parameters to merge with the serialized object
 * @returns URLSearchParams - The serialized URL search parameters
+ *
+ * To force a key to be removed when merging with initialSearchParams, set its value to `null` in the object.
+ * Arrays are not merged, they will always replace existing values.
 */
 export function serializeSearchParams(
  obj: Record<string, any>,
@@ -173,23 +177,31 @@ export function serializeSearchParams(
      const value = obj[key]

      const renamedKey = keyRenameMap[key] || key
+      const paramKey = prefix ? `${prefix}.${renamedKey}` : renamedKey
+
+      if (value === null) {
+        params.delete(paramKey)
+        continue
+      }

      if (Array.isArray(value)) {
        if (typeHints[key] === "COMMA_SEPARATED_ARRAY") {
-          const paramKey = prefix ? `${prefix}.${renamedKey}` : renamedKey
          params.set(paramKey, value.join(","))
          continue
        }

+        // If an array value already exists (from initialSearchParams),
+        // we need to first remove it since it can't be merged.
+        deleteAllKeysStartingWith(params, renamedKey)
        value.forEach((item, index) => {
          const indexedKey = `${renamedKey}[${index}]`
-          const paramKey = prefix ? `${prefix}.${indexedKey}` : indexedKey
-          buildParams(item, paramKey)
+          const arrayKey = prefix ? `${prefix}.${indexedKey}` : indexedKey
+
+          buildParams(item, arrayKey)
        })
        continue
      }

-      const paramKey = prefix ? `${prefix}.${renamedKey}` : renamedKey
      if (typeof value === "object" && value !== null) {
        buildParams(value, paramKey)
        continue
@@ -207,3 +219,12 @@ export function serializeSearchParams(
 function isRecord(value: unknown): value is Record<string, unknown> {
  return typeof value === "object" && value !== null
 }
+
+function deleteAllKeysStartingWith(searchParams: URLSearchParams, key: string) {
+  const keysToDelete = Array.from(searchParams.keys()).filter(
+    (k) => k.startsWith(key) || k === key
+  )
+  for (const k of keysToDelete) {
+    searchParams.delete(k)
+  }
+}
--- a/apps/scandic-web/utils/url.ts
+++ b/apps/scandic-web/utils/url.ts
@@ -238,7 +238,11 @@ const reversedKeyRenameMap = Object.fromEntries(
  Object.entries(keyRenameMap).map(([key, value]) => [value, key])
 )
 export function serializeBookingSearchParams(
-  obj: { [key: string]: any },
+  obj:
+    | BookingWidgetSearchData
+    | SelectHotelBooking
+    | SelectRateBooking
+    | DetailsBooking,
  { initialSearchParams }: { initialSearchParams?: URLSearchParams } = {}
 ) {
  return serializeSearchParams(obj, {