Merged in fix/SW-2428-room-preferences-pageview (pull request #2095)

fix(SW-2428): read room packages from search param in select rate tracking

* fix(SW-2428): read room packages from search param in select rate tracking


Approved-by: Bianca Widstam

apps/scandic-web/components/HotelReservation/SelectRate/Tracking/index.tsx

@@ -0,0 +1,71 @@
+"use client"
+
+import { useSearchParams } from "next/navigation"
+import React from "react"
+
+import { REDEMPTION } from "@/constants/booking"
+
+import TrackingSDK from "@/components/TrackingSDK"
+import useLang from "@/hooks/useLang"
+import { convertSearchParamsToObj, searchParamsToRecord } from "@/utils/url"
+
+import { getValidDates } from "../getValidDates"
+import { getTracking } from "./tracking"
+
+import type { SelectRateSearchParams } from "@/types/components/hotelReservation/selectRate/selectRate"
+import type { ChildrenInRoom } from "@/utils/hotelSearchDetails"
+
+export default function Tracking({
+  adultsInRoom,
+  childrenInRoom,
+  hotelId,
+  hotelName,
+  noOfRooms,
+  country,
+  city,
+}: {
+  adultsInRoom: number[]
+  childrenInRoom: ChildrenInRoom
+  hotelId: string
+  hotelName: string
+  noOfRooms: number
+  country: string
+  city: string
+}) {
+  const lang = useLang()
+  const params = useSearchParams()
+  const selectRateParams = convertSearchParamsToObj<SelectRateSearchParams>(
+    searchParamsToRecord(params)
+  )
+
+  const { fromDate, toDate } = getValidDates(
+    selectRateParams.fromDate,
+    selectRateParams.toDate
+  )
+
+  const { rooms, searchType, bookingCode, city: paramCity } = selectRateParams
+
+  const arrivalDate = fromDate.toDate()
+  const departureDate = toDate.toDate()
+
+  const { hotelsTrackingData, pageTrackingData } = getTracking(
+    lang,
+    arrivalDate,
+    departureDate,
+    adultsInRoom,
+    childrenInRoom,
+    hotelId,
+    hotelName,
+    noOfRooms,
+    country,
+    city,
+    paramCity,
+    bookingCode,
+    searchType === REDEMPTION,
+    rooms
+  )
+
+  return (
+    <TrackingSDK pageData={pageTrackingData} hotelInfo={hotelsTrackingData} />
+  )
+}

apps/scandic-web/components/HotelReservation/SelectRate/Tracking/tracking.ts

@@ -1,6 +1,8 @@
 import { differenceInCalendarDays, format, isWeekend } from "date-fns"
 
 import { ChildBedMapEnum } from "@/types/components/bookingWidget/enums"
+import { RoomPackageCodeEnum } from "@/types/components/hotelReservation/selectRate/roomFilter"
+import type { Room } from "@/types/components/hotelReservation/selectRate/selectRate"
 import {
   TrackingChannelEnum,
   type TrackingSDKHotelInfo,
@@ -22,7 +24,8 @@ export function getTracking(
   hotelCity: string | undefined,
   paramCity: string | undefined,
   bookingCode?: string,
-  isRedemption?: boolean
+  isRedemption?: boolean,
+  rooms?: Room[]
 ) {
   const pageTrackingData: TrackingSDKPageData = {
     channel: TrackingChannelEnum.hotelreservation,
@@ -56,6 +59,25 @@ export function getTracking(
     searchType: "hotel",
     bookingCode: bookingCode ?? "n/a",
     rewardNight: isRedemption ? "yes" : "no",
+    specialRoomType: rooms
+      ?.map((room) => {
+        const packages = room.packages
+          ?.map((pkg) => {
+            if (pkg === RoomPackageCodeEnum.ACCESSIBILITY_ROOM) {
+              return "accessibility"
+            } else if (pkg === RoomPackageCodeEnum.ALLERGY_ROOM) {
+              return "allergy friendly"
+            } else if (pkg === RoomPackageCodeEnum.PET_ROOM) {
+              return "pet room"
+            } else {
+              return ""
+            }
+          })
+          .join(",")
+
+        return packages ?? ""
+      })
+      .join("|"),
   }
 
   return {

apps/scandic-web/components/HotelReservation/SelectRate/index.tsx

@@ -1,22 +1,18 @@
-import stringify from "json-stable-stringify-without-jsonify"
 import { cookies } from "next/headers"
 import { notFound } from "next/navigation"
-import { Suspense } from "react"
 
-import { FamilyAndFriendsCodes, REDEMPTION } from "@/constants/booking"
+import { FamilyAndFriendsCodes } from "@/constants/booking"
 import { getHotel } from "@/lib/trpc/memoizedRequests"
 
 import HotelInfoCard from "@/components/HotelReservation/SelectRate/HotelInfoCard"
 import { RoomsContainer } from "@/components/HotelReservation/SelectRate/RoomsContainer"
-import TrackingSDK from "@/components/TrackingSDK"
 import { setLang } from "@/i18n/serverContext"
 import { getHotelSearchDetails } from "@/utils/hotelSearchDetails"
 import { convertSearchParamsToObj } from "@/utils/url"
 
 import FnFNotAllowedAlert from "../FnFNotAllowedAlert/FnFNotAllowedAlert"
 import AvailabilityError from "./AvailabilityError"
-import { getValidDates } from "./getValidDates"
-import { getTracking } from "./tracking"
+import Tracking from "./Tracking"
 
 import type { SelectRateSearchParams } from "@/types/components/hotelReservation/selectRate/selectRate"
 import type { LangParams, PageArgs } from "@/types/params"
@@ -30,14 +26,8 @@ export default async function SelectRatePage({
   if (!searchDetails?.hotel) {
     return notFound()
   }
-  const {
-    adultsInRoom,
-    childrenInRoom,
-    hotel,
-    noOfRooms,
-    selectHotelParams,
-    bookingCode,
-  } = searchDetails
+  const { adultsInRoom, childrenInRoom, hotel, noOfRooms, bookingCode } =
+    searchDetails
 
   const hotelData = await getHotel({
     hotelId: hotel.id,
@@ -49,30 +39,6 @@ export default async function SelectRatePage({
     return notFound()
   }
 
-  const { fromDate, toDate } = getValidDates(
-    selectHotelParams.fromDate,
-    selectHotelParams.toDate
-  )
-
-  const arrivalDate = fromDate.toDate()
-  const departureDate = toDate.toDate()
-
-  const { hotelsTrackingData, pageTrackingData } = getTracking(
-    params.lang,
-    arrivalDate,
-    departureDate,
-    adultsInRoom,
-    childrenInRoom,
-    hotel.id,
-    hotel.name,
-    noOfRooms,
-    hotelData.hotel.address.country,
-    hotelData.hotel.address.city,
-    selectHotelParams.city,
-    bookingCode,
-    selectHotelParams.searchType === REDEMPTION
-  )
-
   const booking = convertSearchParamsToObj<SelectRateSearchParams>(searchParams)
 
   let isInValidFNF = false
@@ -80,7 +46,6 @@ export default async function SelectRatePage({
     const cookieStore = cookies()
     isInValidFNF = cookieStore.get("sc")?.value !== "1"
   }
-  const suspenseKey = stringify(searchParams)
   return (
     <>
       <HotelInfoCard hotel={hotelData.hotel} />
@@ -96,12 +61,15 @@ export default async function SelectRatePage({
         />
       )}
 
-      <Suspense key={`${suspenseKey}-tracking`} fallback={null}>
-        <TrackingSDK
-          pageData={pageTrackingData}
-          hotelInfo={hotelsTrackingData}
-        />
-      </Suspense>
+      <Tracking
+        adultsInRoom={adultsInRoom}
+        childrenInRoom={childrenInRoom}
+        hotelId={hotel.id}
+        hotelName={hotel.name}
+        noOfRooms={noOfRooms}
+        country={hotelData.hotel.address.country}
+        city={hotelData.hotel.address.city}
+      />
 
       <AvailabilityError />
     </>