diff --git a/components/HotelReservation/EnterDetails/BedType/index.tsx b/components/HotelReservation/EnterDetails/BedType/index.tsx index f822024c1..1bf78fee5 100644 --- a/components/HotelReservation/EnterDetails/BedType/index.tsx +++ b/components/HotelReservation/EnterDetails/BedType/index.tsx @@ -3,45 +3,52 @@ import { zodResolver } from "@hookform/resolvers/zod" import { useCallback, useEffect } from "react" import { FormProvider, useForm } from "react-hook-form" -import { useIntl } from "react-intl" import { useEnterDetailsStore } from "@/stores/enter-details" import { KingBedIcon } from "@/components/Icons" import RadioCard from "@/components/TempDesignSystem/Form/ChoiceCard/Radio" -import { bedTypeSchema } from "./schema" +import { bedTypeFormSchema } from "./schema" import styles from "./bedOptions.module.css" import type { + BedTypeFormSchema, BedTypeProps, - BedTypeSchema, } from "@/types/components/hotelReservation/enterDetails/bedType" export default function BedType({ bedTypes }: BedTypeProps) { - const intl = useIntl() const bedType = useEnterDetailsStore((state) => state.userData.bedType) - const methods = useForm({ - defaultValues: bedType + const methods = useForm({ + defaultValues: bedType?.roomTypeCode ? { - bedType, + bedType: bedType.roomTypeCode, } : undefined, criteriaMode: "all", mode: "all", - resolver: zodResolver(bedTypeSchema), + resolver: zodResolver(bedTypeFormSchema), reValidateMode: "onChange", }) const completeStep = useEnterDetailsStore((state) => state.completeStep) const onSubmit = useCallback( - (values: BedTypeSchema) => { - completeStep(values) + (bedTypeRoomCode: BedTypeFormSchema) => { + const matchingRoom = bedTypes.find( + (roomType) => roomType.value === bedTypeRoomCode.bedType + ) + if (matchingRoom) { + const bedType = { + description: matchingRoom.description, + roomTypeCode: matchingRoom.value, + } + completeStep({ bedType }) + } }, - [completeStep] + [completeStep, bedTypes] ) useEffect(() => { @@ -70,7 +77,7 @@ export default function BedType({ bedTypes }: BedTypeProps) { name="bedType" subtitle={width} title={roomType.description} - value={roomType.description} + value={roomType.value} /> ) })} diff --git a/components/HotelReservation/EnterDetails/BedType/schema.ts b/components/HotelReservation/EnterDetails/BedType/schema.ts index 5323f4e02..7433b39da 100644 --- a/components/HotelReservation/EnterDetails/BedType/schema.ts +++ b/components/HotelReservation/EnterDetails/BedType/schema.ts @@ -1,7 +1,9 @@ import { z } from "zod" -import { BedTypeEnum } from "@/types/enums/bedType" - export const bedTypeSchema = z.object({ + description: z.string(), + roomTypeCode: z.string(), +}) +export const bedTypeFormSchema = z.object({ bedType: z.string(), }) diff --git a/components/HotelReservation/EnterDetails/SectionAccordion/index.tsx b/components/HotelReservation/EnterDetails/SectionAccordion/index.tsx index b809da02a..867a9c392 100644 --- a/components/HotelReservation/EnterDetails/SectionAccordion/index.tsx +++ b/components/HotelReservation/EnterDetails/SectionAccordion/index.tsx @@ -37,7 +37,7 @@ export default function SectionAccordion({ useEffect(() => { if (step === StepEnum.selectBed) { const value = stepData.bedType - value && setTitle(value) + value && setTitle(value.description) } // If breakfast step, check if an option has been selected if (step === StepEnum.breakfast && stepData.breakfast) { diff --git a/components/HotelReservation/EnterDetails/Summary/index.tsx b/components/HotelReservation/EnterDetails/Summary/index.tsx index f8fe7f218..752f3fd4a 100644 --- a/components/HotelReservation/EnterDetails/Summary/index.tsx +++ b/components/HotelReservation/EnterDetails/Summary/index.tsx @@ -17,6 +17,7 @@ import { formatNumber } from "@/utils/format" import styles from "./summary.module.css" +import { BedTypeSchema } from "@/types/components/hotelReservation/enterDetails/bedType" import { RoomsData } from "@/types/components/hotelReservation/enterDetails/bookingData" import { BreakfastPackage } from "@/types/components/hotelReservation/enterDetails/breakfast" import { BreakfastPackageEnum } from "@/types/enums/breakfast" @@ -32,7 +33,7 @@ export default function Summary({ showMemberPrice: boolean room: RoomsData }) { - const [chosenBed, setChosenBed] = useState() + const [chosenBed, setChosenBed] = useState() const [chosenBreakfast, setChosenBreakfast] = useState< BreakfastPackage | BreakfastPackageEnum.NO_BREAKFAST >() @@ -136,7 +137,7 @@ export default function Summary({ {chosenBed ? (
- {chosenBed} + {chosenBed.description} {intl.formatMessage({ id: "Based on availability" })} diff --git a/server/routers/hotels/query.ts b/server/routers/hotels/query.ts index 626ae359d..2938616c5 100644 --- a/server/routers/hotels/query.ts +++ b/server/routers/hotels/query.ts @@ -57,7 +57,7 @@ import { } from "./utils" import { FacilityCardTypeEnum } from "@/types/components/hotelPage/facilities" -import type { BedType } from "@/types/components/hotelReservation/enterDetails/bedType" +import type { BedTypeSelection } from "@/types/components/hotelReservation/enterDetails/bedType" import { AvailabilityEnum } from "@/types/components/hotelReservation/selectHotel/selectHotel" import { BreakfastPackageEnum } from "@/types/enums/breakfast" import type { RequestOptionsWithOutBody } from "@/types/fetch" @@ -763,7 +763,7 @@ export const hotelQueryRouter = router({ } } }) - .filter((bed): bed is BedType => Boolean(bed)) + .filter((bed): bed is BedTypeSelection => Boolean(bed)) selectedRoomAvailabilitySuccessCounter.add(1, { hotelId, diff --git a/stores/enter-details.ts b/stores/enter-details.ts index e40100bb3..8b81a2947 100644 --- a/stores/enter-details.ts +++ b/stores/enter-details.ts @@ -14,6 +14,7 @@ import { getQueryParamsForEnterDetails, } from "@/components/HotelReservation/SelectRate/RoomSelection/utils" +import type { BedTypeSchema } from "@/types/components/hotelReservation/enterDetails/bedType" import { BookingData } from "@/types/components/hotelReservation/enterDetails/bookingData" import { BreakfastPackage } from "@/types/components/hotelReservation/enterDetails/breakfast" import { DetailsSchema } from "@/types/components/hotelReservation/enterDetails/details" @@ -24,7 +25,7 @@ const SESSION_STORAGE_KEY = "enterDetails" interface EnterDetailsState { userData: { - bedType: string | undefined + bedType: BedTypeSchema | undefined breakfast: BreakfastPackage | BreakfastPackageEnum.NO_BREAKFAST | undefined } & DetailsSchema roomData: BookingData @@ -35,7 +36,10 @@ interface EnterDetailsState { completeStep: (updatedData: Partial) => void navigate: ( step: StepEnum, - updatedData?: Record + updatedData?: Record< + string, + string | boolean | BreakfastPackage | BedTypeSchema + > ) => void setCurrentStep: (step: StepEnum) => void } diff --git a/types/components/hotelReservation/enterDetails/bedType.ts b/types/components/hotelReservation/enterDetails/bedType.ts index 3948fcae3..5553924dd 100644 --- a/types/components/hotelReservation/enterDetails/bedType.ts +++ b/types/components/hotelReservation/enterDetails/bedType.ts @@ -1,8 +1,11 @@ import { z } from "zod" -import { bedTypeSchema } from "@/components/HotelReservation/EnterDetails/BedType/schema" +import { + bedTypeFormSchema, + bedTypeSchema, +} from "@/components/HotelReservation/EnterDetails/BedType/schema" -export type BedType = { +export type BedTypeSelection = { description: string size: { min: number @@ -11,7 +14,9 @@ export type BedType = { value: string } export type BedTypeProps = { - bedTypes: BedType[] + bedTypes: BedTypeSelection[] } +export interface BedTypeFormSchema extends z.output {} + export interface BedTypeSchema extends z.output {} diff --git a/types/enums/bedType.ts b/types/enums/bedType.ts deleted file mode 100644 index 2feb6d980..000000000 --- a/types/enums/bedType.ts +++ /dev/null @@ -1,4 +0,0 @@ -export enum BedTypeEnum { - KING = "KING", - QUEEN = "QUEEN", -}