{title}

import { Dialog, Modal, ModalOverlay } from "react-aria-components" import { useIntl } from "react-intl" import { useEnterDetailsStore } from "@/stores/enter-details" import { InfoCircleIcon } from "@/components/Icons" import Button from "@/components/TempDesignSystem/Button" import Body from "@/components/TempDesignSystem/Text/Body" import Caption from "@/components/TempDesignSystem/Text/Caption" import Subtitle from "@/components/TempDesignSystem/Text/Subtitle" import Title from "@/components/TempDesignSystem/Text/Title" import { formatPrice } from "@/utils/numberFormatting" import { calculateTotalRoomPrice } from "../Payment/helpers" import PriceChangeSummary from "./PriceChangeSummary" import styles from "./priceChangeDialog.module.css" import type { PriceChangeData } from "@/types/components/hotelReservation/enterDetails/payment" type PriceDetailsState = { newTotalPrice: number roomPrices: { prevPrice: number; newPrice?: number }[] } type PriceChangeDialogProps = { isOpen: boolean priceChangeData: PriceChangeData prevTotalPrice: number currency: string onCancel: () => void onAccept: () => void } export default function PriceChangeDialog({ isOpen, priceChangeData, prevTotalPrice, currency, onCancel, onAccept, }: PriceChangeDialogProps) { const intl = useIntl() const title = intl.formatMessage({ id: "Price change" }) const rooms = useEnterDetailsStore((state) => state.rooms) const { newTotalPrice, roomPrices } = rooms.reduce( (acc, room, idx) => { const roomPrice = room.room.roomPrice.perStay.local.price const priceChange = priceChangeData[idx] const { totalPrice } = calculateTotalRoomPrice( room, priceChange?.roomPrice ) acc.newTotalPrice += totalPrice acc.roomPrices.push({ prevPrice: roomPrice, newPrice: priceChange?.roomPrice, }) return acc }, { newTotalPrice: 0, roomPrices: [] } ) return ( ) }