Merged in feat/booking-flow-performance (pull request #1282)

feat: booking flow performance

* feat: booking flow performance

* Cleanup


Approved-by: Michael Zetterberg
Approved-by: Pontus Dreij

components/HotelReservation/SelectRate/HotelInfoCard/NoRoomsAlert.module.css

@@ -1,5 +0,0 @@
-.hotelAlert {
-  max-width: var(--max-width-navigation);
-  margin: 0 auto;
-  padding-top: var(--Spacing-x-one-and-half);
-}

components/HotelReservation/SelectRate/HotelInfoCard/NoRoomsAlert.tsx

@@ -1,85 +0,0 @@
-import { dt } from "@/lib/dt"
-import { getRoomsAvailability } from "@/lib/trpc/memoizedRequests"
-
-import Alert from "@/components/TempDesignSystem/Alert"
-import { getIntl } from "@/i18n"
-import { safeTry } from "@/utils/safeTry"
-
-import { generateChildrenString } from "../../utils"
-import { combineRoomAvailabilities } from "../utils"
-
-import styles from "./NoRoomsAlert.module.css"
-
-import type { Child } from "@/types/components/hotelReservation/selectRate/selectRate"
-import { AlertTypeEnum } from "@/types/enums/alert"
-import type { Lang } from "@/constants/languages"
-
-type Props = {
-  hotelId: number
-  lang: Lang
-  adultArray: number[]
-  childArray?: Child[]
-  fromDate: Date
-  toDate: Date
-}
-
-export async function NoRoomsAlert({
-  hotelId,
-  fromDate,
-  toDate,
-  childArray,
-  adultArray,
-  lang,
-}: Props) {
-  const fromDateString = dt(fromDate).format("YYYY-MM-DD")
-  const toDateString = dt(toDate).format("YYYY-MM-DD")
-
-  const uniqueAdultCounts = [...new Set(adultArray)]
-  const roomsAvailabilityPromises = uniqueAdultCounts.map((adultCount) => {
-    return safeTry(
-      getRoomsAvailability({
-        hotelId: hotelId,
-        roomStayStartDate: fromDateString,
-        roomStayEndDate: toDateString,
-        adults: adultCount,
-        children:
-          childArray && childArray.length > 0
-            ? generateChildrenString(childArray)
-            : undefined,
-      })
-    )
-  })
-
-  const roomsAvailabilityResults = await Promise.all(roomsAvailabilityPromises)
-
-  const roomsAvailability = combineRoomAvailabilities({
-    availabilityResults: roomsAvailabilityResults,
-  })
-
-  if (!roomsAvailability) {
-    return null
-  }
-
-  const noRoomsAvailable = roomsAvailability.roomConfigurations.reduce(
-    (acc, room) => {
-      return acc && room.status === "NotAvailable"
-    },
-    true
-  )
-
-  if (!noRoomsAvailable) {
-    return null
-  }
-
-  const intl = await getIntl(lang)
-  return (
-    <div className={styles.hotelAlert}>
-      <Alert
-        type={AlertTypeEnum.Info}
-        text={intl.formatMessage({
-          id: "There are no rooms available that match your request",
-        })}
-      />
-    </div>
-  )
-}

components/HotelReservation/SelectRate/HotelInfoCard/index.tsx

@@ -1,5 +1,3 @@
-import { Suspense } from "react"
-
 import { getHotel } from "@/lib/trpc/memoizedRequests"
 
 import { mapFacilityToIcon } from "@/components/ContentType/HotelPage/data"
@@ -15,7 +13,6 @@ import { getSingleDecimal } from "@/utils/numberFormatting"
 
 import ReadMore from "../../ReadMore"
 import TripAdvisorChip from "../../TripAdvisorChip"
-import { NoRoomsAlert } from "./NoRoomsAlert"
 
 import styles from "./hotelInfoCard.module.css"
 
@@ -24,7 +21,6 @@ import type { HotelInfoCardProps } from "@/types/components/hotelReservation/sel
 export default async function HotelInfoCard({
   hotelId,
   lang,
-  ...props
 }: HotelInfoCardProps) {
   const hotelData = await getHotel({
     hotelId: hotelId.toString(),
@@ -119,10 +115,6 @@ export default async function HotelInfoCard({
           </div>
         )
       })}
-
-      <Suspense fallback={null} key={hotelId}>
-        <NoRoomsAlert hotelId={hotelId} lang={lang} {...props} />
-      </Suspense>
     </article>
   )
 }