205 lines
6.5 KiB
TypeScript
205 lines
6.5 KiB
TypeScript
import "./enterDetailsLayout.css"
|
|
|
|
import { differenceInCalendarDays, format, isWeekend } from "date-fns"
|
|
import { notFound } from "next/navigation"
|
|
|
|
import { Lang } from "@/constants/languages"
|
|
import {
|
|
getBreakfastPackages,
|
|
getCreditCardsSafely,
|
|
getHotelData,
|
|
getProfileSafely,
|
|
getSelectedRoomAvailability,
|
|
} from "@/lib/trpc/memoizedRequests"
|
|
|
|
import BedType from "@/components/HotelReservation/EnterDetails/BedType"
|
|
import Breakfast from "@/components/HotelReservation/EnterDetails/Breakfast"
|
|
import Details from "@/components/HotelReservation/EnterDetails/Details"
|
|
import HistoryStateManager from "@/components/HotelReservation/EnterDetails/HistoryStateManager"
|
|
import Payment from "@/components/HotelReservation/EnterDetails/Payment"
|
|
import SectionAccordion from "@/components/HotelReservation/EnterDetails/SectionAccordion"
|
|
import SelectedRoom from "@/components/HotelReservation/EnterDetails/SelectedRoom"
|
|
import {
|
|
generateChildrenString,
|
|
getQueryParamsForEnterDetails,
|
|
} from "@/components/HotelReservation/SelectRate/RoomSelection/utils"
|
|
import TrackingSDK from "@/components/TrackingSDK"
|
|
import { getIntl } from "@/i18n"
|
|
|
|
import { StepEnum } from "@/types/components/hotelReservation/enterDetails/step"
|
|
import { SelectRateSearchParams } from "@/types/components/hotelReservation/selectRate/selectRate"
|
|
import {
|
|
TrackingChannelEnum,
|
|
TrackingSDKHotelInfo,
|
|
TrackingSDKPageData,
|
|
} from "@/types/components/tracking"
|
|
import type { LangParams, PageArgs } from "@/types/params"
|
|
|
|
function isValidStep(step: string): step is StepEnum {
|
|
return Object.values(StepEnum).includes(step as StepEnum)
|
|
}
|
|
|
|
export default async function StepPage({
|
|
params,
|
|
searchParams,
|
|
}: PageArgs<LangParams & { step: StepEnum }, SelectRateSearchParams>) {
|
|
const { lang } = params
|
|
|
|
const intl = await getIntl()
|
|
const selectRoomParams = new URLSearchParams(searchParams)
|
|
const {
|
|
hotel: hotelId,
|
|
rooms,
|
|
fromDate,
|
|
toDate,
|
|
} = getQueryParamsForEnterDetails(selectRoomParams)
|
|
|
|
const {
|
|
adults,
|
|
children,
|
|
roomTypeCode,
|
|
rateCode,
|
|
packages: packageCodes,
|
|
} = rooms[0] // TODO: Handle multiple rooms
|
|
|
|
const childrenAsString = children && generateChildrenString(children)
|
|
|
|
const breakfastInput = { adults, fromDate, hotelId, toDate }
|
|
void getBreakfastPackages(breakfastInput)
|
|
void getSelectedRoomAvailability({
|
|
hotelId,
|
|
adults,
|
|
children: childrenAsString,
|
|
roomStayStartDate: fromDate,
|
|
roomStayEndDate: toDate,
|
|
rateCode,
|
|
roomTypeCode,
|
|
packageCodes,
|
|
})
|
|
|
|
const roomAvailability = await getSelectedRoomAvailability({
|
|
hotelId,
|
|
adults,
|
|
children: childrenAsString,
|
|
roomStayStartDate: fromDate,
|
|
roomStayEndDate: toDate,
|
|
rateCode,
|
|
roomTypeCode,
|
|
packageCodes,
|
|
})
|
|
const hotelData = await getHotelData({
|
|
hotelId,
|
|
language: lang,
|
|
isCardOnlyPayment: roomAvailability?.mustBeGuaranteed,
|
|
})
|
|
const breakfastPackages = await getBreakfastPackages(breakfastInput)
|
|
const user = await getProfileSafely()
|
|
const savedCreditCards = await getCreditCardsSafely()
|
|
|
|
if (!isValidStep(params.step) || !hotelData || !roomAvailability) {
|
|
return notFound()
|
|
}
|
|
|
|
const mustBeGuaranteed = roomAvailability?.mustBeGuaranteed ?? false
|
|
|
|
const paymentGuarantee = intl.formatMessage({
|
|
id: "Payment Guarantee",
|
|
})
|
|
const payment = intl.formatMessage({
|
|
id: "Payment",
|
|
})
|
|
const guaranteeWithCard = intl.formatMessage({
|
|
id: "Guarantee booking with credit card",
|
|
})
|
|
const selectPaymentMethod = intl.formatMessage({
|
|
id: "Select payment method",
|
|
})
|
|
|
|
const roomPrice =
|
|
user && roomAvailability.memberRate
|
|
? roomAvailability.memberRate?.localPrice.pricePerStay
|
|
: roomAvailability.publicRate!.localPrice.pricePerStay
|
|
|
|
const arrivalDate = new Date(searchParams.fromDate)
|
|
const departureDate = new Date(searchParams.toDate)
|
|
const hotelAttributes = hotelData?.data.attributes
|
|
|
|
const pageTrackingData: TrackingSDKPageData = {
|
|
pageId: "select-rate",
|
|
domainLanguage: params.lang as Lang,
|
|
channel: TrackingChannelEnum["hotelreservation"],
|
|
pageName: "hotelreservation|select-rate",
|
|
siteSections: "hotelreservation|select-rate",
|
|
pageType: "bookingroomsandratespage",
|
|
}
|
|
|
|
const hotelsTrackingData: TrackingSDKHotelInfo = {
|
|
searchTerm: searchParams.city,
|
|
arrivalDate: format(arrivalDate, "yyyy-MM-dd"),
|
|
departureDate: format(departureDate, "yyyy-MM-dd"),
|
|
noOfAdults: adults,
|
|
noOfChildren: children?.length,
|
|
//childBedPreference // "adults|adults|extra|adults"
|
|
noOfRooms: 1, // // TODO: Handle multiple rooms
|
|
duration: differenceInCalendarDays(departureDate, arrivalDate),
|
|
leadTime: differenceInCalendarDays(arrivalDate, new Date()),
|
|
searchType: "hotel",
|
|
bookingTypeofDay: isWeekend(arrivalDate) ? "weekend" : "weekday",
|
|
country: hotelAttributes?.address.country,
|
|
region: hotelAttributes?.address.city,
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<HistoryStateManager />
|
|
<SelectedRoom
|
|
hotelId={hotelId}
|
|
room={roomAvailability.selectedRoom}
|
|
rateDescription={roomAvailability.cancellationText}
|
|
/>
|
|
|
|
{/* TODO: How to handle no beds found? */}
|
|
{roomAvailability.bedTypes ? (
|
|
<SectionAccordion
|
|
header="Select bed"
|
|
step={StepEnum.selectBed}
|
|
label={intl.formatMessage({ id: "Request bedtype" })}
|
|
>
|
|
<BedType bedTypes={roomAvailability.bedTypes} />
|
|
</SectionAccordion>
|
|
) : null}
|
|
|
|
<SectionAccordion
|
|
header={intl.formatMessage({ id: "Food options" })}
|
|
step={StepEnum.breakfast}
|
|
label={intl.formatMessage({ id: "Select breakfast options" })}
|
|
>
|
|
<Breakfast packages={breakfastPackages} />
|
|
</SectionAccordion>
|
|
<SectionAccordion
|
|
header={intl.formatMessage({ id: "Details" })}
|
|
step={StepEnum.details}
|
|
label={intl.formatMessage({ id: "Enter your details" })}
|
|
>
|
|
<Details user={user} />
|
|
</SectionAccordion>
|
|
<SectionAccordion
|
|
header={mustBeGuaranteed ? paymentGuarantee : payment}
|
|
step={StepEnum.payment}
|
|
label={mustBeGuaranteed ? guaranteeWithCard : selectPaymentMethod}
|
|
>
|
|
<Payment
|
|
roomPrice={roomPrice}
|
|
otherPaymentOptions={
|
|
hotelData.data.attributes.merchantInformationData
|
|
.alternatePaymentOptions
|
|
}
|
|
savedCreditCards={savedCreditCards}
|
|
mustBeGuaranteed={mustBeGuaranteed}
|
|
/>
|
|
</SectionAccordion>
|
|
<TrackingSDK pageData={pageTrackingData} hotelInfo={hotelsTrackingData} />
|
|
</>
|
|
)
|
|
}
|