Merged in fix/SW-2462-room-availability-error (pull request #1920)

Fix/SW-2462 room availability error

* fix: added toast error when availability fails and you get redirect to select-rate

* fix: added support for showing alert when availability error happens

* fix: rename PaymentAlert -> BookingAlert


Approved-by: Erik Tiekstra

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

@@ -0,0 +1,38 @@
+"use client"
+
+import { usePathname, useSearchParams } from "next/navigation"
+import { useEffect } from "react"
+import { useIntl } from "react-intl"
+
+import { BookingErrorCodeEnum } from "@/constants/booking"
+
+import { toast } from "@/components/TempDesignSystem/Toasts"
+
+export default function AvailabilityError() {
+  const intl = useIntl()
+  const pathname = usePathname()
+  const searchParams = useSearchParams()
+
+  const errorCode = searchParams.get("errorCode")
+  const hasAvailabilityError =
+    errorCode === BookingErrorCodeEnum.AvailabilityError
+
+  const errorMessage = intl.formatMessage({
+    defaultMessage:
+      "Unfortunately, one of the rooms you selected is sold out. Please choose another room to proceed.",
+  })
+
+  useEffect(() => {
+    if (!hasAvailabilityError) {
+      return
+    }
+
+    toast.error(errorMessage)
+
+    const newParams = new URLSearchParams(searchParams.toString())
+    newParams.delete("errorCode")
+    window.history.replaceState({}, "", `${pathname}?${newParams.toString()}`)
+  }, [errorMessage, hasAvailabilityError, pathname, searchParams])
+
+  return null
+}

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

@@ -12,6 +12,7 @@ import { setLang } from "@/i18n/serverContext"
 import { getHotelSearchDetails } from "@/utils/hotelSearchDetails"
 import { convertSearchParamsToObj } from "@/utils/url"
 
+import AvailabilityError from "./AvailabilityError"
 import { getValidDates } from "./getValidDates"
 import { getTracking } from "./tracking"
 
@@ -90,6 +91,8 @@ export default async function SelectRatePage({
           hotelInfo={hotelsTrackingData}
         />
       </Suspense>
+
+      <AvailabilityError />
     </>
   )
 }