import { useRouter } from "next/navigation" import { useIntl } from "react-intl" import { CheckCircleIcon, EditIcon } from "@/components/Icons" import Accordion from "@/components/TempDesignSystem/Accordion" import AccordionItem from "@/components/TempDesignSystem/Accordion/AccordionItem" import Button from "@/components/TempDesignSystem/Button" import Divider from "@/components/TempDesignSystem/Divider" import Body from "@/components/TempDesignSystem/Text/Body" import Subtitle from "@/components/TempDesignSystem/Text/Subtitle" import RemoveButton from "./RemoveButton" import styles from "./addedAncillaries.module.css" import type { AddedAncillariesProps } from "@/types/components/myPages/myStay/ancillaries" export function AddedAncillaries({ ancillaries, booking, }: AddedAncillariesProps) { const intl = useIntl() const router = useRouter() return (
{intl.formatMessage({ id: "My Add-on's" })} {booking.ancillary?.deliveryTime && (
{intl.formatMessage({ id: "Delivered at:" })} {booking.ancillary?.deliveryTime}
)}
{booking.ancillaries.map((ancillary) => { const ancillaryItem = ancillaries?.find((a) => a.id === ancillary.code) return ( <> } >
{ancillary.comment && ( <>
{intl.formatMessage({ id: "Other requests" })}: {ancillary.comment}
)}
{intl.formatMessage({ id: "Total" })} {ancillary.currency.toLowerCase() === "points" ? `${ancillary.totalPrice} ${intl.formatMessage({ id: "Points" })}` : `${ancillary.totalPrice} ${ancillary.currency}`}
{booking.confirmationNumber && ancillary.code ? (
router.refresh()} />
) : null}
{ancillaryItem?.title} {`X${ancillary.totalUnit}`}
{intl.formatMessage({ id: "Total" })} {ancillary.currency.toLowerCase() === "points" ? `${ancillary.totalPrice} ${intl.formatMessage({ id: "Points" })}` : `${ancillary.totalPrice} ${ancillary.currency}`}
{ancillary.comment && ( <> {intl.formatMessage({ id: "Other requests" })}: {ancillary.comment} )}
{booking.confirmationNumber && ancillary.code ? (
router.refresh()} />
) : null}
) })}
) }