import { useRouter } from "next/navigation" import { useIntl } from "react-intl" import { MaterialIcon } from "@scandic-hotels/design-system/Icons" import Accordion from "@/components/TempDesignSystem/Accordion" import AccordionItem from "@/components/TempDesignSystem/Accordion/AccordionItem" import Divider from "@/components/TempDesignSystem/Divider" import Body from "@/components/TempDesignSystem/Text/Body" import Subtitle from "@/components/TempDesignSystem/Text/Subtitle" import { trackRemoveAncillary } from "@/utils/tracking/myStay" import { getBreakfastPackagesFromAncillaryFlow } from "../../utils/hasBreakfastPackage" import RemoveButton from "./RemoveButton" import styles from "./addedAncillaries.module.css" import type { AddedAncillariesProps } from "@/types/components/myPages/myStay/ancillaries" import { BreakfastPackageEnum } from "@/types/enums/breakfast" import type { BookingConfirmation, PackageSchema, } from "@/types/trpc/routers/booking/confirmation" export function AddedAncillaries({ ancillaries, booking, }: AddedAncillariesProps) { const intl = useIntl() const router = useRouter() const addedBreakfastPackages = getBreakfastPackagesFromAncillaryFlow( booking.packages ) const addedAncillaries = getAddedAncillaries(booking, addedBreakfastPackages) if (addedAncillaries.length === 0) { return null } return (
{intl.formatMessage({ id: "My Add-on's" })} {booking.ancillary?.deliveryTime && (
{intl.formatMessage({ id: "Delivered at:" })} {booking.ancillary?.deliveryTime}
)}
{addedAncillaries.map((ancillary) => { const ancillaryTitle = ancillary.code === BreakfastPackageEnum.ANCILLARY_REGULAR_BREAKFAST ? intl.formatMessage({ id: "Breakfast" }) : (ancillaries?.find( (a) => a.id === ancillary.code || a.loyaltyCode === ancillary.code )?.title ?? "") 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 ? (
p.code) : [ancillary.code] } title={ancillaryTitle} onSuccess={router.refresh} />
) : null}
{ancillaryTitle} {`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 ? (
p.code) : [ancillary.code] } title={ancillaryTitle} onSuccess={() => { trackRemoveAncillary( ancillary, booking.hotelId, booking.ancillary?.deliveryTime ) router.refresh() }} />
) : null}
) })}
) } /** * All ancillaries that are added to the booking * * Adding a special ancillary for breakfast, calculated from * all breakfast packages that has been added as ancillaries, * not in the booking flow. */ function getAddedAncillaries( booking: BookingConfirmation["booking"], addedBreakfastPackages: PackageSchema[] | undefined ) { if (!addedBreakfastPackages?.length) { return booking.ancillaries } const combinedBreakfastPackageAsAncillary: PackageSchema = { code: BreakfastPackageEnum.ANCILLARY_REGULAR_BREAKFAST, unitPrice: 0, points: 0, currency: addedBreakfastPackages[0].currency, type: addedBreakfastPackages[0].type, description: addedBreakfastPackages[0].description, comment: addedBreakfastPackages[0].comment, totalPrice: addedBreakfastPackages.reduce( (acc, curr) => acc + curr.totalPrice, 0 ), unit: addedBreakfastPackages.reduce((acc, curr) => acc + curr.unit, 0), totalUnit: addedBreakfastPackages.reduce( (acc, curr) => acc + curr.totalUnit, 0 ), } return [combinedBreakfastPackageAsAncillary, ...booking.ancillaries] }