diff --git a/components/HotelReservation/SelectRate/RoomSelection/FlexibilityOption/index.tsx b/components/HotelReservation/SelectRate/RoomSelection/FlexibilityOption/index.tsx index 519eef78c..30d5d5264 100644 --- a/components/HotelReservation/SelectRate/RoomSelection/FlexibilityOption/index.tsx +++ b/components/HotelReservation/SelectRate/RoomSelection/FlexibilityOption/index.tsx @@ -18,6 +18,7 @@ export default function FlexibilityOption({ paymentTerm, priceInformation, roomType, + roomTypeCode, handleSelectRate, }: FlexibilityOptionProps) { const [rootDiv, setRootDiv] = useState(undefined) @@ -46,6 +47,7 @@ export default function FlexibilityOption({ function onChange() { const rate = { + roomTypeCode: roomTypeCode, roomType: roomType, priceName: name, public: publicPrice, diff --git a/components/HotelReservation/SelectRate/RoomSelection/RateSummary/index.tsx b/components/HotelReservation/SelectRate/RoomSelection/RateSummary/index.tsx index 29d4b0740..b929bfe76 100644 --- a/components/HotelReservation/SelectRate/RoomSelection/RateSummary/index.tsx +++ b/components/HotelReservation/SelectRate/RoomSelection/RateSummary/index.tsx @@ -24,17 +24,15 @@ export default function RateSummary({
- <> - - {priceToShow?.localPrice.pricePerStay}{" "} - {priceToShow?.localPrice.currency} - - - {intl.formatMessage({ id: "Approx." })}{" "} - {priceToShow?.requestedPrice?.pricePerStay}{" "} - {priceToShow?.requestedPrice?.currency} - - + + {priceToShow?.localPrice.pricePerStay}{" "} + {priceToShow?.localPrice.currency} + + + {intl.formatMessage({ id: "Approx." })}{" "} + {priceToShow?.requestedPrice?.pricePerStay}{" "} + {priceToShow?.requestedPrice?.currency} +
diff --git a/components/HotelReservation/SelectRate/RoomSelection/index.tsx b/components/HotelReservation/SelectRate/RoomSelection/index.tsx index 7d1c15d6d..2eefefe85 100644 --- a/components/HotelReservation/SelectRate/RoomSelection/index.tsx +++ b/components/HotelReservation/SelectRate/RoomSelection/index.tsx @@ -4,6 +4,7 @@ import { useState } from "react" import RateSummary from "./RateSummary" import RoomCard from "./RoomCard" +import { getHotelReservationQueryParams } from "./utils" import styles from "./roomSelection.module.css" @@ -19,12 +20,43 @@ export default function RoomSelection({ const router = useRouter() const searchParams = useSearchParams() + const isUserLoggedIn = !!user function handleSubmit(e: React.FormEvent) { e.preventDefault() + const searchParamsObject = getHotelReservationQueryParams(searchParams) + + /** + * These are the query params that are used on current web and should come from the Booking Widget Search Submit. + * Might need to be changed when Search Submit in the Booking Widget is implemented. + */ const queryParams = new URLSearchParams(searchParams) - queryParams.set("roomClass", e.currentTarget.roomClass?.value) - queryParams.set("flexibility", e.currentTarget.flexibility?.value) + + searchParamsObject.room.forEach((item, index) => { + queryParams.set(`room[${index}].adults`, item.adults.toString()) + + if (Array.isArray(item.child)) { + item.child.forEach((child, childIndex) => { + queryParams.set( + `room[${index}].child[${childIndex}].age`, + child.age.toString() + ) + queryParams.set(`room[${index}].child[${childIndex}].bed`, child.bed) + }) + } + + queryParams.set( + `room[${index}].roomtypecode`, + rateSummary?.roomTypeCode || "" + ) + queryParams.set( + `room[${index}].ratecode`, + isUserLoggedIn + ? rateSummary?.member?.rateCode || "" + : rateSummary?.public?.rateCode || "" + ) + }) + router.push(`select-bed?${queryParams}`) } @@ -48,7 +80,10 @@ export default function RoomSelection({ ))} {rateSummary && ( - + )} diff --git a/components/HotelReservation/SelectRate/RoomSelection/utils.ts b/components/HotelReservation/SelectRate/RoomSelection/utils.ts new file mode 100644 index 000000000..df8562504 --- /dev/null +++ b/components/HotelReservation/SelectRate/RoomSelection/utils.ts @@ -0,0 +1,23 @@ +import { SelectRateSearchParams } from "@/types/components/hotelReservation/selectRate/selectRate" + +function getHotelReservationQueryParams(searchParams: URLSearchParams) { + const searchParamsObject: SelectRateSearchParams = Array.from( + searchParams.entries() + ).reduce((acc, [key, value]) => { + const keys = key.replace(/\]/g, "").split(/\[|\./) // Split keys by '[' or '.' + keys.reduce((nestedAcc, k, i) => { + if (i === keys.length - 1) { + nestedAcc[k] = value // Assign value at the last key + } else { + if (!nestedAcc[k]) { + nestedAcc[k] = isNaN(Number(keys[i + 1])) ? {} : [] // Initialize as array or object + } + } + return nestedAcc[k] + }, acc) + return acc + }, {} as SelectRateSearchParams) + return searchParamsObject +} + +export { getHotelReservationQueryParams } diff --git a/types/components/hotelReservation/selectRate/flexibilityOption.ts b/types/components/hotelReservation/selectRate/flexibilityOption.ts index 473de563b..1835c3b65 100644 --- a/types/components/hotelReservation/selectRate/flexibilityOption.ts +++ b/types/components/hotelReservation/selectRate/flexibilityOption.ts @@ -1,6 +1,10 @@ import { z } from "zod" -import { Product, productTypePriceSchema } from "@/server/routers/hotels/output" +import { + Product, + productTypePriceSchema, + RoomConfiguration, +} from "@/server/routers/hotels/output" import { Rate } from "./selectRate" @@ -12,7 +16,8 @@ export type FlexibilityOptionProps = { value: string paymentTerm: string priceInformation?: Array - roomType: string + roomType: RoomConfiguration["roomType"] + roomTypeCode: RoomConfiguration["roomTypeCode"] handleSelectRate: (rate: Rate) => void } diff --git a/types/components/hotelReservation/selectRate/selectRate.ts b/types/components/hotelReservation/selectRate/selectRate.ts index 43152f11b..f806223c6 100644 --- a/types/components/hotelReservation/selectRate/selectRate.ts +++ b/types/components/hotelReservation/selectRate/selectRate.ts @@ -1,13 +1,28 @@ -import { Product } from "@/server/routers/hotels/output" +import { Product, RoomConfiguration } from "@/server/routers/hotels/output" + +interface Child { + bed: string + age: number +} + +interface Room { + adults: number + roomtypecode: string + ratecode: string + child: Child[] +} export interface SelectRateSearchParams { - fromDate: string - toDate: string hotel: string + fromdate: string + todate: string + room: Room[] + [key: string]: any } export interface Rate { - roomType: string + roomType: RoomConfiguration["roomType"] + roomTypeCode: RoomConfiguration["roomTypeCode"] priceName: string public: Product["productType"]["public"] member: Product["productType"]["member"]