This creates the alternative hotels page. It is mostly a copy of the select hotel page, and most of the contents of the pages lives under the same component in /components.

Merged in feat/sw-397-alternative-hotels (pull request #1211)

Feat/sw 397 alternative hotels

* fix(SW-397): create alternative hotels page

* update types

* Adapt to new changes for fetching data

* Make bookingcode optional

* Code review fixes


Approved-by: Simon.Emanuelsson

components/HotelReservation/SelectHotel/NoAvailabilityAlert.tsx

@@ -0,0 +1,48 @@
+import { alternativeHotels } from "@/constants/routes/hotelReservation"
+
+import Alert from "@/components/TempDesignSystem/Alert"
+import { getIntl } from "@/i18n"
+import { getLang } from "@/i18n/serverContext"
+
+import type { NoAvailabilityAlertProp } from "@/types/components/hotelReservation/selectHotel/noAvailabilityAlert"
+import { AlertTypeEnum } from "@/types/enums/alert"
+
+export default async function NoAvailabilityAlert({
+  hotels,
+  isAllUnavailable,
+  isAlternative,
+}: NoAvailabilityAlertProp) {
+  const intl = await getIntl()
+  const lang = getLang()
+
+  if (!isAllUnavailable) {
+    return null
+  }
+
+  if (hotels.length === 1 && !isAlternative) {
+    return (
+      <Alert
+        type={AlertTypeEnum.Info}
+        heading={intl.formatMessage({ id: "No availability" })}
+        text={intl.formatMessage({
+          id: "Please try and change your search for this destination or see alternative hotels.",
+        })}
+        link={{
+          title: intl.formatMessage({ id: "See alternative hotels" }),
+          url: `${alternativeHotels(lang)}?hotel=${hotels[0].hotelData.operaId}`,
+          keepSearchParams: true,
+        }}
+      />
+    )
+  }
+
+  return (
+    <Alert
+      type={AlertTypeEnum.Info}
+      heading={intl.formatMessage({ id: "No availability" })}
+      text={intl.formatMessage({
+        id: "There are no rooms available that match your request.",
+      })}
+    />
+  )
+}