Merged in feat/SW-1023-bed-type-information (pull request #1056)

Feat/SW-1023 bed type information

* feat(SW-1023): add bed type info

* fix: formatting of bed type string

* fix(SW-1023): refactored bed type info and added default value to children beds

* fix(SW-1023): fixes from PR


Approved-by: Christel Westerberg
Approved-by: Simon.Emanuelsson
This commit is contained in:
Tobias Johansson
2024-12-18 09:47:06 +00:00
parent 77d449b8cb
commit 118f1afafa
11 changed files with 158 additions and 29 deletions

View File

@@ -0,0 +1,44 @@
import { useIntl } from "react-intl"
import { useEnterDetailsStore } from "@/stores/enter-details"
import Body from "@/components/TempDesignSystem/Text/Body"
import { ChildBedMapEnum } from "@/types/components/bookingWidget/enums"
import type { BedTypeInfoProps } from "@/types/components/hotelReservation/enterDetails/bedType"
export default function BedTypeInfo({ hasMultipleBedTypes }: BedTypeInfoProps) {
const intl = useIntl()
const hasChildWithExtraBed = useEnterDetailsStore((state) =>
state.booking.rooms[0].children?.some(
(child) => Number(child.bed) === ChildBedMapEnum.IN_EXTRA_BED
)
)
const availabilityText = intl.formatMessage({
id: "Your selected bed type will be provided based on availability",
})
const extraBedText = intl.formatMessage({
id: "Extra bed will be provided additionally",
})
if (hasMultipleBedTypes && hasChildWithExtraBed) {
return (
<Body>
{availabilityText}. {extraBedText}
</Body>
)
}
if (hasMultipleBedTypes) {
return <Body>{availabilityText}</Body>
}
if (hasChildWithExtraBed) {
return <Body>{extraBedText}</Body>
}
return null
}

View File

@@ -1,3 +1,9 @@
.container {
display: flex;
flex-direction: column;
gap: var(--Spacing-x2);
}
.form {
display: grid;
gap: var(--Spacing-x2);

View File

@@ -9,6 +9,7 @@ import { useEnterDetailsStore } from "@/stores/enter-details"
import { KingBedIcon } from "@/components/Icons"
import RadioCard from "@/components/TempDesignSystem/Form/ChoiceCard/Radio"
import BedTypeInfo from "./BedTypeInfo"
import { bedTypeFormSchema } from "./schema"
import styles from "./bedOptions.module.css"
@@ -62,26 +63,29 @@ export default function BedType({ bedTypes }: BedTypeProps) {
return (
<FormProvider {...methods}>
<form className={styles.form} onSubmit={methods.handleSubmit(onSubmit)}>
{bedTypes.map((roomType) => {
const width =
roomType.size.max === roomType.size.min
? `${roomType.size.min} cm`
: `${roomType.size.min} cm - ${roomType.size.max} cm`
return (
<RadioCard
key={roomType.value}
Icon={KingBedIcon}
iconWidth={46}
id={roomType.value}
name="bedType"
subtitle={width}
title={roomType.description}
value={roomType.value}
/>
)
})}
</form>
<div className={styles.container}>
<BedTypeInfo hasMultipleBedTypes={bedTypes.length > 1} />
<form className={styles.form} onSubmit={methods.handleSubmit(onSubmit)}>
{bedTypes.map((roomType) => {
const width =
roomType.size.max === roomType.size.min
? `${roomType.size.min} cm`
: `${roomType.size.min} cm - ${roomType.size.max} cm`
return (
<RadioCard
key={roomType.value}
Icon={KingBedIcon}
iconWidth={46}
id={roomType.value}
name="bedType"
subtitle={width}
title={roomType.description}
value={roomType.value}
/>
)
})}
</form>
</div>
</FormProvider>
)
}

View File

@@ -22,6 +22,7 @@ import Modal from "../../Modal"
import styles from "./ui.module.css"
import { ChildBedMapEnum } from "@/types/components/bookingWidget/enums"
import type { SummaryProps } from "@/types/components/hotelReservation/summary"
import type { DetailsState } from "@/types/stores/enter-details"
@@ -67,6 +68,25 @@ export default function SummaryUI({
const adults = booking.rooms[0].adults
const children = booking.rooms[0].children
const childrenBeds = children?.reduce(
(acc, value) => {
const bedType = Number(value.bed)
if (bedType === ChildBedMapEnum.IN_ADULTS_BED) {
return acc
}
const count = acc.get(bedType) ?? 0
acc.set(bedType, count + 1)
return acc
},
new Map<ChildBedMapEnum, number>([
[ChildBedMapEnum.IN_CRIB, 0],
[ChildBedMapEnum.IN_EXTRA_BED, 0],
])
)
const childBedCrib = childrenBeds?.get(ChildBedMapEnum.IN_CRIB)
const childBedExtraBed = childrenBeds?.get(ChildBedMapEnum.IN_EXTRA_BED)
const memberPrice = roomRate.memberRate
? {
currency: roomRate.memberRate.localPrice.currency,
@@ -179,12 +199,7 @@ export default function SummaryUI({
: null}
{bedType ? (
<div className={styles.entry}>
<div>
<Body color="uiTextHighContrast">{bedType.description}</Body>
<Caption color="uiTextMediumContrast">
{intl.formatMessage({ id: "Based on availability" })}
</Caption>
</div>
<Body color="uiTextHighContrast">{bedType.description}</Body>
<Body color="uiTextHighContrast">
{intl.formatNumber(0, {
@@ -194,7 +209,39 @@ export default function SummaryUI({
</Body>
</div>
) : null}
{childBedCrib ? (
<div className={styles.entry}>
<div>
<Body color="uiTextHighContrast">
{`${intl.formatMessage({ id: "Crib (child)" })} × ${childBedCrib}`}
</Body>
<Caption color="uiTextMediumContrast">
{intl.formatMessage({ id: "Based on availability" })}
</Caption>
</div>
<Body color="uiTextHighContrast">
{intl.formatNumber(0, {
currency: roomPrice.local.currency,
style: "currency",
})}
</Body>
</div>
) : null}
{childBedExtraBed ? (
<div className={styles.entry}>
<div>
<Body color="uiTextHighContrast">
{`${intl.formatMessage({ id: "Extra bed (child)" })} × ${childBedExtraBed}`}
</Body>
</div>
<Body color="uiTextHighContrast">
{intl.formatNumber(0, {
currency: roomPrice.local.currency,
style: "currency",
})}
</Body>
</div>
) : null}
{breakfast === false ? (
<div className={styles.entry}>
<Body color="uiTextHighContrast">

View File

@@ -105,6 +105,7 @@
"Creative spaces for meetings": "Kreative rum til møder",
"Credit card": "Kreditkort",
"Credit card deleted successfully": "Kreditkort blev slettet",
"Crib (child)": "Kørestol (barn)",
"Currency Code": "DKK",
"Current password": "Nuværende kodeord",
"Customer service": "Kundeservice",
@@ -142,6 +143,8 @@
"Expires at the earliest": "Udløber tidligst {date}",
"Explore all levels and benefits": "Udforsk alle niveauer og fordele",
"Explore nearby": "Udforsk i nærheden",
"Extra bed (child)": "Ekstra seng (barn)",
"Extra bed will be provided additionally": "Der vil blive stillet en ekstra seng til rådighed",
"Extras to your booking": "Tillæg til din booking",
"FAQ": "Ofte stillede spørgsmål",
"Failed to delete credit card, please try again later.": "Kunne ikke slette kreditkort. Prøv venligst igen senere.",
@@ -486,6 +489,7 @@
"Your level": "Dit niveau",
"Your points to spend": "Dine brugbare point",
"Your room": "Dit værelse",
"Your selected bed type will be provided based on availability": "Din valgte sengtype vil blive stillet til rådighed baseret på tilgængelighed",
"Zip code": "Postnummer",
"Zoo": "Zoo",
"Zoom in": "Zoom ind",

View File

@@ -105,6 +105,7 @@
"Creative spaces for meetings": "Kreative Räume für Meetings",
"Credit card": "Kreditkarte",
"Credit card deleted successfully": "Kreditkarte erfolgreich gelöscht",
"Crib (child)": "Kinderbett (Kind)",
"Currency Code": "EUR",
"Current password": "Aktuelles Passwort",
"Customer service": "Kundendienst",
@@ -142,6 +143,8 @@
"Expires at the earliest": "Läuft frühestens am {date} ab",
"Explore all levels and benefits": "Entdecken Sie alle Levels und Vorteile",
"Explore nearby": "Erkunden Sie die Umgebung",
"Extra bed (child)": "Ekstra seng (Kind)",
"Extra bed will be provided additionally": "Ein zusätzliches Bett wird bereitgestellt",
"Extras to your booking": "Extras zu Ihrer Buchung",
"FAQ": "Häufig gestellte Fragen",
"Failed to delete credit card, please try again later.": "Kreditkarte konnte nicht gelöscht werden. Bitte versuchen Sie es später noch einmal.",
@@ -485,6 +488,7 @@
"Your level": "Dein level",
"Your points to spend": "Meine Punkte",
"Your room": "Ihr Zimmer",
"Your selected bed type will be provided based on availability": "Ihre ausgewählte Bettart wird basierend auf der Verfügbarkeit bereitgestellt",
"Zip code": "PLZ",
"Zoo": "Zoo",
"Zoom in": "Vergrößern",

View File

@@ -112,6 +112,7 @@
"Creative spaces for meetings": "Creative spaces for meetings",
"Credit card": "Credit card",
"Credit card deleted successfully": "Credit card deleted successfully",
"Crib (child)": "Crib (child)",
"Currency Code": "EUR",
"Current password": "Current password",
"Customer service": "Customer service",
@@ -150,6 +151,8 @@
"Expires at the earliest": "Expires at the earliest {date}",
"Explore all levels and benefits": "Explore all levels and benefits",
"Explore nearby": "Explore nearby",
"Extra bed (child)": "Extra bed (child)",
"Extra bed will be provided additionally": "Extra bed will be provided additionally",
"Extras to your booking": "Extras to your booking",
"FAQ": "FAQ",
"Failed to delete credit card, please try again later.": "Failed to delete credit card, please try again later.",
@@ -529,6 +532,7 @@
"Your level": "Your level",
"Your points to spend": "Your points to spend",
"Your room": "Your room",
"Your selected bed type will be provided based on availability": "Your selected bed type will be provided based on availability",
"Zip code": "Zip code",
"Zoo": "Zoo",
"Zoom in": "Zoom in",

View File

@@ -105,6 +105,7 @@
"Creative spaces for meetings": "Luovia tiloja kokouksille",
"Credit card": "Luottokortti",
"Credit card deleted successfully": "Luottokortti poistettu onnistuneesti",
"Crib (child)": "Körkkä (lasta)",
"Currency Code": "EUR",
"Current password": "Nykyinen salasana",
"Customer service": "Asiakaspalvelu",
@@ -142,6 +143,8 @@
"Expires at the earliest": "Päättyy aikaisintaan {date}",
"Explore all levels and benefits": "Tutustu kaikkiin tasoihin ja etuihin",
"Explore nearby": "Tutustu lähialueeseen",
"Extra bed (child)": "Lisävuode (lasta)",
"Extra bed will be provided additionally": "Lisävuode toimitetaan erikseen",
"Extras to your booking": "Varauksessa lisäpalveluita",
"FAQ": "Usein kysytyt kysymykset",
"Failed to delete credit card, please try again later.": "Luottokortin poistaminen epäonnistui, yritä myöhemmin uudelleen.",
@@ -484,6 +487,7 @@
"Your level": "Tasosi",
"Your points to spend": "Käytettävissä olevat pisteesi",
"Your room": "Sinun huoneesi",
"Your selected bed type will be provided based on availability": "Valitun vuodetyypin toimitetaan saatavuuden mukaan",
"Zip code": "Postinumero",
"Zoo": "Eläintarha",
"Zoom in": "Lähennä",

View File

@@ -104,6 +104,7 @@
"Country is required": "Land kreves",
"Creative spaces for meetings": "Kreative rom for møter",
"Credit card deleted successfully": "Kredittkort slettet",
"Crib (child)": "Kørestol (barn)",
"Currency Code": "NOK",
"Current password": "Nåværende passord",
"Customer service": "Kundeservice",
@@ -141,6 +142,8 @@
"Expires at the earliest": "Utløper tidligst {date}",
"Explore all levels and benefits": "Utforsk alle nivåer og fordeler",
"Explore nearby": "Utforsk i nærheten",
"Extra bed (child)": "Ekstra seng (barn)",
"Extra bed will be provided additionally": "Ekstra seng vil bli tilgjengelig",
"Extras to your booking": "Tilvalg til bestillingen din",
"FAQ": "Ofte stilte spørsmål",
"Failed to delete credit card, please try again later.": "Kunne ikke slette kredittkortet, prøv igjen senere.",
@@ -484,6 +487,7 @@
"Your level": "Ditt nivå",
"Your points to spend": "Dine brukbare poeng",
"Your room": "Rommet ditt",
"Your selected bed type will be provided based on availability": "Din valgte sengtype vil blive stillet til rådighed baseret på tilgængelighed",
"Zip code": "Post kode",
"Zoo": "Dyrehage",
"Zoom in": "Zoom inn",

View File

@@ -104,6 +104,7 @@
"Country is required": "Land är obligatoriskt",
"Creative spaces for meetings": "Kreativa utrymmen för möten",
"Credit card deleted successfully": "Kreditkort har tagits bort",
"Crib (child)": "Spjälsäng (barn)",
"Currency Code": "SEK",
"Current password": "Nuvarande lösenord",
"Customer service": "Kundservice",
@@ -141,6 +142,8 @@
"Expires at the earliest": "Löper ut tidigast {date}",
"Explore all levels and benefits": "Utforska alla nivåer och fördelar",
"Explore nearby": "Utforska i närheten",
"Extra bed (child)": "Extra säng (barn)",
"Extra bed will be provided additionally": "Extra säng kommer att tillhandahållas",
"Extras to your booking": "Extra tillval till din bokning",
"FAQ": "FAQ",
"Failed to delete credit card, please try again later.": "Det gick inte att ta bort kreditkortet, försök igen senare.",
@@ -484,6 +487,7 @@
"Your level": "Din nivå",
"Your points to spend": "Dina spenderbara poäng",
"Your room": "Ditt rum",
"Your selected bed type will be provided based on availability": "Din valda sängtyp kommer att tillhandahållas baserat på tillgänglighet",
"Zip code": "Postnummer",
"Zoo": "Djurpark",
"Zoom in": "Zooma in",

View File

@@ -1,6 +1,6 @@
import { z } from "zod"
import type { z } from "zod"
import {
import type {
bedTypeFormSchema,
bedTypeSchema,
} from "@/components/HotelReservation/EnterDetails/BedType/schema"
@@ -20,3 +20,7 @@ export type BedTypeProps = {
export interface BedTypeFormSchema extends z.output<typeof bedTypeFormSchema> {}
export type BedTypeSchema = z.output<typeof bedTypeSchema>["bedType"]
export type BedTypeInfoProps = {
hasMultipleBedTypes: boolean
}