fix(SW-2505): alternative hotels link * fix(SW-2505): handle no chosen room Approved-by: Bianca Widstam
104 lines
2.8 KiB
TypeScript
104 lines
2.8 KiB
TypeScript
"use client"
|
|
import { useIntl } from "react-intl"
|
|
|
|
import { alternativeHotels } from "@/constants/routes/hotelReservation"
|
|
import { useRatesStore } from "@/stores/select-rate"
|
|
|
|
import Alert from "@/components/TempDesignSystem/Alert"
|
|
import { useRoomContext } from "@/contexts/SelectRate/Room"
|
|
import useLang from "@/hooks/useLang"
|
|
|
|
import styles from "./alert.module.css"
|
|
|
|
import { AvailabilityEnum } from "@/types/components/hotelReservation/selectHotel/selectHotel"
|
|
import { AlertTypeEnum } from "@/types/enums/alert"
|
|
|
|
export default function NoAvailabilityAlert() {
|
|
const lang = useLang()
|
|
const intl = useIntl()
|
|
const [bookingCode, selectedRooms, activeRoom] = useRatesStore((state) => [
|
|
state.booking.bookingCode,
|
|
state.rooms,
|
|
state.activeRoom,
|
|
])
|
|
|
|
const { isFetchingPackages, rooms } = useRoomContext()
|
|
|
|
const noAvailableRooms = rooms.every(
|
|
(roomConfig) => roomConfig.status === AvailabilityEnum.NotAvailable
|
|
)
|
|
|
|
const alertLink =
|
|
activeRoom !== -1 && selectedRooms[activeRoom].selectedPackages.length === 0
|
|
? {
|
|
title: intl.formatMessage({
|
|
defaultMessage: "See alternative hotels",
|
|
}),
|
|
url: `${alternativeHotels(lang)}`,
|
|
keepSearchParams: true,
|
|
}
|
|
: null
|
|
|
|
if (isFetchingPackages) {
|
|
return null
|
|
}
|
|
|
|
if (noAvailableRooms) {
|
|
const text = intl.formatMessage({
|
|
defaultMessage: "There are no rooms available that match your request.",
|
|
})
|
|
return (
|
|
<div className={styles.hotelAlert}>
|
|
<Alert
|
|
type={AlertTypeEnum.Info}
|
|
heading={intl.formatMessage({
|
|
defaultMessage: "No availability",
|
|
})}
|
|
text={text}
|
|
link={alertLink}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
const isPublicPromotionWithCode = rooms.some((room) => {
|
|
const filteredCampaigns = room.campaign.filter(Boolean)
|
|
return filteredCampaigns.length
|
|
? filteredCampaigns.every(
|
|
(product) => !!product.rateDefinition?.isCampaignRate
|
|
)
|
|
: false
|
|
})
|
|
|
|
const noAvailableBookingCodeRooms =
|
|
!isPublicPromotionWithCode &&
|
|
rooms.every(
|
|
(room) =>
|
|
room.status === AvailabilityEnum.NotAvailable || !room.code.length
|
|
)
|
|
|
|
if (bookingCode && noAvailableBookingCodeRooms) {
|
|
const bookingCodeText = intl.formatMessage(
|
|
{
|
|
defaultMessage:
|
|
"We found no available rooms using this booking code ({bookingCode}). See available rates below.",
|
|
},
|
|
{ bookingCode }
|
|
)
|
|
return (
|
|
<div className={styles.hotelAlert}>
|
|
<Alert
|
|
type={AlertTypeEnum.Info}
|
|
heading={intl.formatMessage({
|
|
defaultMessage: "No availability",
|
|
})}
|
|
text={bookingCodeText}
|
|
link={alertLink}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
return null
|
|
}
|