feat: add multiroom tracking to booking flow

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

@@ -47,61 +47,66 @@ export default function HotelCardListing({
     (state) => state.activeCodeFilter
   )
 
-  const sortedHotels = useMemo(() => {
-    if (!hotelData) return []
-    return getSortedHotels({ hotels: hotelData, sortBy, bookingCode })
-  }, [hotelData, sortBy, bookingCode])
-
   const hotels = useMemo(() => {
+    const sortedHotels = getSortedHotels({
+      hotels: hotelData,
+      sortBy,
+      bookingCode,
+    })
     const updatedHotelsList = bookingCode
       ? sortedHotels.filter(
           (hotel) =>
-            !hotel.price ||
+            !hotel.availability.productType ||
             activeCodeFilter === BookingCodeFilterEnum.All ||
             (activeCodeFilter === BookingCodeFilterEnum.Discounted &&
-              hotel.price?.public?.rateType !== RateTypeEnum.Regular) ||
+              hotel.availability.productType.public?.rateType !==
+                RateTypeEnum.Regular) ||
             (activeCodeFilter === BookingCodeFilterEnum.Regular &&
-              hotel.price?.public?.rateType === RateTypeEnum.Regular)
+              hotel.availability.productType.public?.rateType ===
+                RateTypeEnum.Regular)
         )
       : sortedHotels
 
-    if (activeFilters.length === 0) return updatedHotelsList
+    if (!activeFilters.length) {
+      return updatedHotelsList
+    }
 
     return updatedHotelsList.filter((hotel) =>
       activeFilters.every((appliedFilterId) =>
-        hotel.hotelData.detailedFacilities.some(
+        hotel.hotel.detailedFacilities.some(
           (facility) => facility.id.toString() === appliedFilterId
         )
       )
     )
-  }, [activeFilters, sortedHotels, bookingCode, activeCodeFilter])
+  }, [activeCodeFilter, activeFilters, bookingCode, hotelData, sortBy])
 
   useEffect(() => {
-    setResultCount(hotels?.length ?? 0)
+    setResultCount(hotels.length)
   }, [hotels, setResultCount])
 
   return (
     <section className={styles.hotelCards}>
-      {hotels?.length ? (
-        hotels.map((hotel) => (
-          <div
-            key={hotel.hotelData.operaId}
-            data-active={
-              hotel.hotelData.name === activeHotelCard ? "true" : "false"
-            }
-          >
-            <HotelCard
-              hotel={hotel}
-              isUserLoggedIn={isUserLoggedIn}
-              state={
-                hotel.hotelData.name === activeHotelCard ? "active" : "default"
+      {hotels?.length
+        ? hotels.map((hotel) => (
+            <div
+              key={hotel.hotel.operaId}
+              data-active={
+                hotel.hotel.name === activeHotelCard ? "true" : "false"
               }
-              type={type}
-              bookingCode={bookingCode}
-            />
-          </div>
-        ))
-      ) : activeFilters ? (
+            >
+              <HotelCard
+                hotelData={hotel}
+                isUserLoggedIn={isUserLoggedIn}
+                state={
+                  hotel.hotel.name === activeHotelCard ? "active" : "default"
+                }
+                type={type}
+                bookingCode={bookingCode}
+              />
+            </div>
+          ))
+        : null}
+      {!hotels?.length && activeFilters ? (
         <Alert
           type={AlertTypeEnum.Info}
           heading={intl.formatMessage({ id: "No hotels match your filters" })}