"use client" import { useIntl } from "react-intl" import { dt } from "@/lib/dt" import { useEnterDetailsStore } from "@/stores/enter-details" import Body from "@/components/TempDesignSystem/Text/Body" import Caption from "@/components/TempDesignSystem/Text/Caption" import useLang from "@/hooks/useLang" import { getNights } from "@/utils/dateFormatting" import { formatPrice } from "@/utils/numberFormatting" import styles from "./priceDetailsTable.module.css" import { type PriceDetailsTableProps } from "@/types/components/hotelReservation/enterDetails/priceDetailsTable" import type { DetailsState } from "@/types/stores/enter-details" function Row({ label, value }: { label: string; value: string }) { return ( {label} {value} ) } function TableSection({ children }: React.PropsWithChildren) { return {children} } function TableSectionHeader({ title }: { title: string }) { return ( {title} ) } export function storeSelector(state: DetailsState) { return { bedType: state.bedType, booking: state.booking, breakfast: state.breakfast, packages: state.packages, roomRate: state.roomRate, roomPrice: state.roomPrice, totalPrice: state.totalPrice, vat: state.vat, } } export default function PriceDetailsTable({ roomType, }: PriceDetailsTableProps) { const intl = useIntl() const lang = useLang() const { bedType, booking, breakfast, roomPrice, totalPrice, vat } = useEnterDetailsStore(storeSelector) // TODO: Update for Multiroom later const { adults, childrenInRoom } = booking.rooms[0] const nights = getNights(booking.fromDate, booking.toDate) const vatPercentage = vat / 100 const vatAmount = totalPrice.local.price * vatPercentage const priceExclVat = totalPrice.local.price - vatAmount return ( {nights.map((night) => { return ( ) })} {bedType ? ( ) : null} {breakfast ? ( {childrenInRoom?.length ? ( ) : null} ) : null}

{intl.formatMessage({ id: "Price including VAT" })}

{formatPrice( intl, totalPrice.local.price, totalPrice.local.currency )}

) }