"use client" import { Fragment } from "react" import { useIntl } from "react-intl" import { dt } from "@/lib/dt" import { PriceTagIcon } from "@/components/Icons" import Body from "@/components/TempDesignSystem/Text/Body" import Caption from "@/components/TempDesignSystem/Text/Caption" import useLang from "@/hooks/useLang" import { formatPrice } from "@/utils/numberFormatting" import styles from "./priceDetailsTable.module.css" import type { Price } from "@/types/components/hotelReservation/price" import { CurrencyEnum } from "@/types/enums/currency" import type { RoomState } from "@/types/stores/enter-details" function Row({ label, value, bold, }: { label: string value: string bold?: boolean }) { return ( {label} {value} ) } function TableSection({ children }: React.PropsWithChildren) { return {children} } function TableSectionHeader({ title, subtitle, }: { title: string subtitle?: string }) { return ( {title} {subtitle ? {subtitle} : null} ) } export type Room = Pick< RoomState["room"], | "adults" | "bedType" | "breakfast" | "childrenInRoom" | "roomFeatures" | "roomRate" | "roomType" > & { guest?: RoomState["room"]["guest"] } export interface PriceDetailsTableProps { bookingCode?: string fromDate: string isMember: boolean rooms: Room[] toDate: string totalPrice: Price vat: number } export default function PriceDetailsTable({ bookingCode, fromDate, isMember, rooms, toDate, totalPrice, vat, }: PriceDetailsTableProps) { const intl = useIntl() const lang = useLang() const diff = dt(toDate).diff(fromDate, "days") const nights = intl.formatMessage( { id: "{totalNights, plural, one {# night} other {# nights}}" }, { totalNights: diff } ) const vatPercentage = vat / 100 const vatAmount = totalPrice.local.price * vatPercentage const priceExclVat = totalPrice.local.price - vatAmount const duration = ` ${dt(fromDate).locale(lang).format("ddd, D MMM")} - ${dt(toDate).locale(lang).format("ddd, D MMM")} (${nights})` return ( {rooms.map((room, idx) => { const getMemberRate = room.guest?.join || room.guest?.membershipNo || (idx === 0 && isMember) const price = getMemberRate && room.roomRate.memberRate ? room.roomRate.memberRate : room.roomRate.publicRate const voucherPrice = room.roomRate.voucherRate const chequePrice = room.roomRate.chequeRate if (!price) { return null } return ( {rooms.length > 1 && ( {intl.formatMessage({ id: "Room" })} {idx + 1} )} {price && ( <> {room.roomFeatures ? room.roomFeatures.map((feature) => ( )) : null} {room.bedType ? ( ) : null} )} {voucherPrice && ( )} {chequePrice && ( )} {room.breakfast ? ( {room.childrenInRoom?.length ? ( ) : null} ) : null} ) })} {totalPrice.local.currency !== CurrencyEnum.Voucher && totalPrice.local.currency !== CurrencyEnum.CC ? ( <> ) : null} {totalPrice.local.regularPrice && ( )} {bookingCode && totalPrice.local.regularPrice && ( )}
{intl.formatMessage({ id: "Price including VAT" })} {formatPrice( intl, totalPrice.local.price, totalPrice.local.currency, totalPrice.local.additionalPrice, totalPrice.local.additionalPriceCurrency )}
{formatPrice( intl, totalPrice.local.regularPrice, totalPrice.local.currency )}
{bookingCode}
) }