Merged in feat/refactor-header-footer-sitewidealert (pull request #1374)

Refactor: removed parallel routes for header, footer and sidewidealert. Langswitcher and sidewidealert now client components

* feat - removed parallel routes and made sidepeek and sitewidealerts as client components

* Langswitcher as client component

* Fixed lang switcher for current header

* Passing lang when fetching siteconfig

* Merge branch 'master' into feat/refactor-header-footer-sitewidealert

* Refactor

* Removed dead code

* Show only languages that has translation

* Refetch sitewidealert every 60 seconds

* Merge branch 'master' into feat/refactor-header-footer-sitewidealert

* Removed sidepeek parallel route from my-stay

* Added missing env.var to env.test

* Removed console.log


Approved-by: Joakim Jäderberg

components/HotelReservation/SelectRate/index.tsx

@@ -0,0 +1,126 @@
+import { differenceInCalendarDays, format, isWeekend } from "date-fns"
+import stringify from "json-stable-stringify-without-jsonify"
+import { notFound } from "next/navigation"
+import { Suspense } from "react"
+
+import { getHotel } from "@/lib/trpc/memoizedRequests"
+
+import { getValidDates } from "@/app/[lang]/(live)/(public)/hotelreservation/(standard)/select-rate/getValidDates"
+import { getHotelSearchDetails } from "@/app/[lang]/(live)/(public)/hotelreservation/(standard)/utils"
+import HotelInfoCard, {
+  HotelInfoCardSkeleton,
+} from "@/components/HotelReservation/SelectRate/HotelInfoCard"
+import {
+  preload,
+  RoomsContainer,
+} from "@/components/HotelReservation/SelectRate/RoomsContainer"
+import { RoomsContainerSkeleton } from "@/components/HotelReservation/SelectRate/RoomsContainer/RoomsContainerSkeleton"
+import TrackingSDK from "@/components/TrackingSDK"
+import { setLang } from "@/i18n/serverContext"
+import { convertSearchParamsToObj } from "@/utils/url"
+
+import { ChildBedMapEnum } from "@/types/components/bookingWidget/enums"
+import type { SelectRateSearchParams } from "@/types/components/hotelReservation/selectRate/selectRate"
+import {
+  TrackingChannelEnum,
+  type TrackingSDKHotelInfo,
+  type TrackingSDKPageData,
+} from "@/types/components/tracking"
+import type { LangParams, PageArgs } from "@/types/params"
+
+export default async function SelectRatePage({
+  params,
+  searchParams,
+}: PageArgs<LangParams & { section: string }, SelectRateSearchParams>) {
+  setLang(params.lang)
+  const searchDetails = await getHotelSearchDetails({ searchParams })
+  if (!searchDetails?.hotel) {
+    return notFound()
+  }
+  const { hotel, adultsInRoom, childrenInRoom, selectHotelParams } =
+    searchDetails
+
+  const { fromDate, toDate } = getValidDates(
+    selectHotelParams.fromDate,
+    selectHotelParams.toDate
+  )
+
+  preload(
+    hotel.id,
+    params.lang,
+    fromDate.format("YYYY-MM-DD"),
+    toDate.format("YYYY-MM-DD"),
+    adultsInRoom,
+    childrenInRoom
+  )
+
+  const hotelData = await getHotel({
+    hotelId: hotel.id,
+    isCardOnlyPayment: false,
+    language: params.lang,
+  })
+
+  const arrivalDate = fromDate.toDate()
+  const departureDate = toDate.toDate()
+
+  const pageTrackingData: TrackingSDKPageData = {
+    pageId: "select-rate",
+    domainLanguage: params.lang,
+    channel: TrackingChannelEnum["hotelreservation"],
+    pageName: "hotelreservation|select-rate",
+    siteSections: "hotelreservation|select-rate",
+    pageType: "bookingroomsandratespage",
+    siteVersion: "new-web",
+  }
+
+  const hotelsTrackingData: TrackingSDKHotelInfo = {
+    searchTerm: selectHotelParams.city ?? hotel?.name,
+    arrivalDate: format(arrivalDate, "yyyy-MM-dd"),
+    departureDate: format(departureDate, "yyyy-MM-dd"),
+    noOfAdults: adultsInRoom[0], // TODO: Handle multiple rooms
+    noOfChildren: childrenInRoom?.length,
+    ageOfChildren: childrenInRoom?.map((c) => c.age).join(","),
+    childBedPreference: childrenInRoom
+      ?.map((c) => ChildBedMapEnum[c.bed])
+      .join("|"),
+    noOfRooms: 1, // // TODO: Handle multiple rooms
+    duration: differenceInCalendarDays(departureDate, arrivalDate),
+    leadTime: differenceInCalendarDays(arrivalDate, new Date()),
+    searchType: "hotel",
+    bookingTypeofDay: isWeekend(arrivalDate) ? "weekend" : "weekday",
+    country: hotelData?.hotel.address.country,
+    hotelID: hotel?.id,
+    region: hotelData?.hotel.address.city,
+  }
+
+  const hotelId = +hotel.id
+
+  const booking = convertSearchParamsToObj<SelectRateSearchParams>(searchParams)
+  const suspenseKey = stringify(searchParams)
+
+  return (
+    <>
+      <Suspense fallback={<HotelInfoCardSkeleton />}>
+        <HotelInfoCard hotelData={hotelData} />
+      </Suspense>
+
+      <Suspense key={suspenseKey} fallback={<RoomsContainerSkeleton />}>
+        <RoomsContainer
+          adultArray={adultsInRoom}
+          booking={booking}
+          childArray={childrenInRoom}
+          fromDate={arrivalDate}
+          hotelId={hotelId}
+          lang={params.lang}
+          toDate={departureDate}
+        />
+      </Suspense>
+      <Suspense key={suspenseKey} fallback={null}>
+        <TrackingSDK
+          pageData={pageTrackingData}
+          hotelInfo={hotelsTrackingData}
+        />
+      </Suspense>
+    </>
+  )
+}

components/HotelReservation/SidePeek/index.tsx

@@ -7,11 +7,7 @@ import HotelSidePeek from "@/components/SidePeeks/HotelSidePeek"
 import RoomSidePeek from "@/components/SidePeeks/RoomSidePeek"
 import useLang from "@/hooks/useLang"
 
-import type { HotelReservationSidePeekProps } from "@/types/components/hotelReservation/sidePeek"
-
-export default function HotelReservationSidePeek({
-  hotel,
-}: HotelReservationSidePeekProps) {
+export default function HotelReservationSidePeek() {
   const activeSidePeek = useSidePeekStore((state) => state.activeSidePeek)
   const hotelId = useSidePeekStore((state) => state.hotelId)
   const roomTypeCode = useSidePeekStore((state) => state.roomTypeCode)
@@ -27,7 +23,6 @@ export default function HotelReservationSidePeek({
     },
     {
       enabled: !!hotelId,
-      initialData: hotel ?? undefined,
     }
   )