Files
web/apps/scandic-web/components/HotelReservation/EnterDetails/Summary/UI/Breakfast/index.tsx

74 lines
2.0 KiB
TypeScript

"use client"
import { useIntl } from "react-intl"
import { Typography } from "@scandic-hotels/design-system/Typography"
import { formatPrice } from "@/utils/numberFormatting"
import styles from "./breakfast.module.css"
import type { BreakfastPackage } from "@/types/components/hotelReservation/breakfast"
interface BreakfastProps {
adults: number
breakfast: BreakfastPackage | false | undefined
breakfastIncluded: boolean
guests: string
nights: number
}
export default function Breakfast({
adults,
breakfast,
breakfastIncluded,
guests,
nights,
}: BreakfastProps) {
const intl = useIntl()
const breakfastBuffet = intl.formatMessage({
defaultMessage: "Breakfast buffet",
})
if (breakfastIncluded || breakfast) {
const price = breakfast
? formatPrice(
intl,
breakfast.localPrice.price * adults * nights,
breakfast.localPrice.currency
)
: intl.formatMessage({ defaultMessage: "Included" })
return (
<div className={styles.entry}>
<div>
<Typography variant="Body/Paragraph/mdRegular">
<p className={styles.textDefault}>{breakfastBuffet}</p>
</Typography>
<Typography variant="Body/Supporting text (caption)/smRegular">
<p className={styles.uiTextMediumContrast}>{guests}</p>
</Typography>
</div>
<Typography variant="Body/Paragraph/mdRegular">
<p className={styles.textDefault}>{price}</p>
</Typography>
</div>
)
}
if (breakfast === false) {
const noBreakfast = intl.formatMessage({ defaultMessage: "No breakfast" })
return (
<div className={styles.entry}>
<Typography variant="Body/Paragraph/mdRegular">
<p className={styles.textDefault}>{breakfastBuffet}</p>
</Typography>
<Typography variant="Body/Paragraph/mdRegular">
<p className={styles.textDefault}>{noBreakfast}</p>
</Typography>
</div>
)
}
return null
}