@roomstay/frontend 2.6.68 → 2.6.70

package/dist/src/components/steps/room/roomDetails/RoomDetails.js.map

@@ -1 +1 @@
-{"version":3,"file":"RoomDetails.js","sourceRoot":"/","sources":["src/components/steps/room/roomDetails/RoomDetails.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BasketContext, BookingEngineContext, CompanyContext, HotelOverridesContext } from '@frontend/contexts';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport classNames from 'classnames';\nimport React, { useContext, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport AutoAutoHeight from '@/animations/AutoAutoHeight';\nimport BEButton from '@/components/generic/BEButton';\nimport Currency from '@/components/generic/Currency';\nimport Headline from '@/components/generic/Headline';\nimport { IconType } from '@/components/generic/Icon/Icon';\nimport LineBreak from '@/components/generic/LineBreak';\nimport { PlanpayPrice } from '@/components/generic/PlanpayPrice/PlanpayPrice';\nimport Text, { TextType } from '@/components/generic/Text';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport { RoomDetailsBedsBlock } from '@/components/steps/room/roomDetails/RoomDetailsBedsBlock';\nimport { RoomDetailsPerkBlock } from '@/components/steps/room/roomDetails/RoomDetailsPerkBlock';\nimport RoomRatePills from '@/components/steps/room/roomDetails/roomRates/RoomRatePills';\nimport RoomRates from '@/components/steps/room/roomDetails/roomRates/RoomRates';\nimport RoomModal from '@/components/steps/room/RoomModal';\nimport useCurrency from '@/hooks/Currency';\nimport usePlanpay from '@/hooks/Planpay';\nimport { useWindowSize } from '@/hooks/WindowSize';\nimport { HotelPerk } from '@/models/Client/Hotel/HotelPerk';\nimport { Room } from '@/models/Room/Room';\nimport { RoomRate, RoomRatePriceInclusion } from '@/models/Room/RoomRate';\nimport FeaturedPromoFeature from '@/providers/feature/FeaturedPromoFeature';\nimport { ImageSize } from '@/providers/ImageProvider';\nimport { Translation } from '@/translations/Translation';\nimport { Color, getContrastTextColor } from '@/util/Color';\nimport * as currencyHelper from '@/util/CurrencyHelper';\nimport DataLayer, { InteractionStep, InteractionType } from '@/util/DataLayer';\nimport ScreenSize from '@/util/ScreenSize';\nimport { TextAlign } from '@/util/TextAlignment';\nexport interface RoomDetailsProps {\n    room: Room;\n    disableMarginBottom?: boolean;\n}\n\nexport default function RoomDetails(props: RoomDetailsProps) {\n    const [featuredRates, setFeaturedRates] = useState<RoomRate[]>([]);\n    const [standardRates, setStandardRates] = useState<RoomRate[]>([]);\n\n    const [viewingRates, setViewingRates] = useState<boolean | number | null>(null);\n    const [viewingDescription, setViewingDescription] = useState(false);\n\n    const { t } = useTranslation();\n\n    const context = useContext(BookingEngineContext);\n    const basketContext = useContext(BasketContext);\n    const ccx = useContext(CompanyContext);\n    const { hotel } = useCurrentHotel();\n    const hotelOverridesContext = useContext(HotelOverridesContext);\n\n    const { room } = props;\n\n    const classes = classNames('room-details', {\n        ['+is-open']: viewingRates,\n    });\n\n    useEffect(() => {\n        if (basketContext.selectedBasketRow?.getRoom() && basketContext.selectedBasketRow.getRoom().code === props.room.code) {\n            setViewingRates(true);\n        }\n\n        const basketRow = basketContext.selectedBasketRow;\n        if (!basketRow) {\n            return;\n        }\n\n        DataLayer.instance.addRoomImpression(room, { to: basketRow.getStartDate(), from: basketRow.getEndDate() }, basketRow.getPromoCode());\n    }, [basketContext.selectedBasketRow]);\n\n    useEffect(() => {\n        let nonPromoRates: RoomRate[] = [];\n        const toSetFeaturedRate: RoomRate[] = [];\n\n        if (FeaturedPromoFeature.isActive()) {\n            for (const currentRate of room.getRates()) {\n                if (currentRate.promoCode?.toLowerCase() === basketContext.selectedBasketRow?.getPromoCode()?.toLowerCase()) {\n                    toSetFeaturedRate.unshift(currentRate);\n                } else {\n                    nonPromoRates.push(currentRate);\n                }\n            }\n\n            if (toSetFeaturedRate.length > 0) {\n                setViewingRates(true);\n                setFeaturedRates(toSetFeaturedRate);\n            }\n        } else {\n            nonPromoRates = room.getRates();\n        }\n\n        setStandardRates(nonPromoRates);\n    }, [room.getRates()]);\n\n    const trimmedDescription = room.getShortDescription();\n\n    const { isMobile } = useWindowSize();\n\n    const ratesOpen = viewingRates || (context.screenSize <= ScreenSize.Medium && viewingRates === null && !hotel?.mobileDefaultRatesClosed);\n    const moreDetailsOnClick = () => {\n        DataLayer.instance.sendInteraction('More Room Details', InteractionType.LINK, InteractionStep.ROOMS);\n        setViewingDescription(true);\n    };\n    const sendRoomClickOnClick = () => {\n        if (!ratesOpen) {\n            const basketRow = basketContext.selectedBasketRow;\n\n            if (basketRow) {\n                DataLayer.instance.sendRoomClick(room, basketRow.getStartDate(), basketRow.getEndDate(), basketRow.getPromoCode());\n            }\n        }\n        setViewingRates(!ratesOpen);\n    };\n    const closeDescriptionOnClose = () => {\n        setViewingDescription(false);\n    };\n\n    const lowestRawPrice = room.getLowestPrice(false, true);\n    const lowestDisplayPrice = hotelOverridesContext.alwaysShowDecimals ? lowestRawPrice : Math.round(lowestRawPrice);\n    const currencySize = context.screenSize > ScreenSize.Medium && lowestDisplayPrice.toLocaleString().length < 7 ? 'large' : 'normal';\n\n    const convertCurrencyPrice = (value: number) => Math.round(currencyHelper.convertPrice(value, true, ccx.currentCurrency, hotel?.defaultCurrency as string));\n\n    const { value: price, isLoading } = useCurrency({\n        hideDecimals: true,\n        children: lowestDisplayPrice,\n    });\n\n    const selectedRow = basketContext.selectedBasketRow;\n\n    const { hasPricePreview } = usePlanpay();\n\n    const { roomPerks } = room.getRoomPerks({\n        hotel: hotel,\n        room: room,\n        perksLimitNumber: 5,\n    });\n\n    return (\n        <div className={`room-details-container ${props.disableMarginBottom ? '' : 'u-marg-bottom'}`}>\n            <div className={classes}>\n                <div className=\"room-details--image\">\n                    <ImageGallerySlider images={props.room.getImages()} imageSize={ImageSize.Medium} />\n                </div>\n                <div className=\"room-details--content u-pad--heavy u-pad@l-\">\n                    <div className=\"u-marg-bottom\">\n                        {context.screenSize > ScreenSize.Large && (\n                            <>\n                                <div className=\"u-marg-bottom\">\n                                    <RoomRatePills room={room} limit={2} />\n                                </div>\n                            </>\n                        )}\n                        <div className=\"room-details--content-title u-marg-bottom--light\">\n                            <Headline bold>{room.name}</Headline>\n                        </div>\n                        <RoomDetailsBedsBlock room={room} />\n                        {trimmedDescription?.replace(/<br(\\/|)>/g, '') && (\n                            <div className=\"room-details--content-description u-marg-bottom--light\">\n                                <Text color={Color.DarkGrey} type={TextType.Small}>\n                                    <span dangerouslySetInnerHTML={{ __html: trimmedDescription?.replace(/<br(\\/|)>/g, '') || '' }} />\n                                </Text>\n                            </div>\n                        )}\n                    </div>\n\n                    <div className=\"row\">\n                        {!hotel?.perksHideOnRoomRow && (\n                            <div className=\"col-12 u-flex u-marg-bottom@m- flex-column align-items-start\">\n                                <div className=\"room-details--content-perks u-marg-bottom@m-\">\n                                    {isMobile && (\n                                        <div className=\"u-marg-bottom\">\n                                            <Text type={TextType.Small} bold color={Color.Accent}>\n                                                {hotel?.perkTitle || t(Translation.Misc.Perks.AndYouGetAll)}\n                                            </Text>\n                                        </div>\n                                    )}\n                                    <RoomDetailsPerkBlock perks={roomPerks as HotelPerk[]} room={room} />\n                                </div>\n                            </div>\n                        )}\n                        {hotel?.showDescriptionOnRoomDetails && (\n                            <div className=\"col-12\">\n                                <LineBreak noMargins />\n                                <div className=\"u-marg-top u-text-overflow-ellipsis-3 u-marg-bottom\">\n                                    <Text type={TextType.Small} color={Color.Graphite}>\n                                        <span dangerouslySetInnerHTML={{ __html: props.room.getLongDescription() || '' }} />\n                                    </Text>\n                                </div>\n                            </div>\n                        )}\n                        <div className=\"col-md-6 u-flex u-marg-bottom@m- flex-column align-items-start\">\n                            <BEButton icon={IconType.ArrowRight2} isText primary size=\"tiny\" iconPosition=\"right\" onClick={moreDetailsOnClick}>\n                                {t(Translation.Step.Room.RoomInfo.MoreDetails)}\n                            </BEButton>\n                        </div>\n                        <div className=\"col-md-6 u-flex justify-content-end flex-column align-items-start align-items-md-end\">\n                            <Text type={TextType.Small} color={Color.Navy} inline>\n                                {t(Translation.Misc.From)}\n                            </Text>\n                            <div className=\"room-details--content-price flex-row align-items-end\">\n                                <Headline size={currencySize} bold>\n                                    <Currency hideDecimals>{lowestDisplayPrice}</Currency>\n                                </Headline>\n                                <Text color={Color.DarkGrey} inline>\n                                    /{t(Translation.Misc.Night)}\n                                </Text>\n                            </div>\n                            <Text type={TextType.Small} color={Color.Grey} className=\"u-nowrap\" align={isMobile ? TextAlign.Left : TextAlign.Right}>\n                                <span\n                                    dangerouslySetInnerHTML={{\n                                        __html:\n                                            room.getLowestPriceType() === RoomRatePriceInclusion.IncludingFeesAndTaxes\n                                                ? t(Translation.Step.Room.RoomInfo.IncludesTaxes)\n                                                : t(Translation.Step.Room.ExcludingTaxes),\n                                    }}\n                                ></span>\n                            </Text>\n                        </div>\n                    </div>\n                    <div className=\"u-flex-direction-column u-flex u-flex-align-flex-end u-flex-align-flex-start@m- u-w-100@m-\">\n                        {!isLoading && hasPricePreview ? (\n                            <div className=\"u-marg-top--light\">\n                                <PlanpayPrice price={price} checkin={(selectedRow?.getStartDate() || basketContext.endDate).format('YYYY-MM-DD')} currency={ccx.currentCurrency} />\n                            </div>\n                        ) : null}\n                        <BEButton\n                            className=\"u-marg-top--light\"\n                            name=\"ViewRatesNowButton\"\n                            primary\n                            primaryActive={!!ratesOpen}\n                            filled\n                            stopIconAnimation\n                            icon={ratesOpen ? IconType.ArrowUp2 : IconType.ArrowDown2}\n                            iconPosition=\"right\"\n                            onClick={sendRoomClickOnClick}\n                            wide={context.screenSize <= ScreenSize.Large}\n                            textColor={getContrastTextColor(ratesOpen ? hotel?.colors.accent3 : hotel?.colors.accent)}\n                        >\n                            {ratesOpen ? t(Translation.Step.Room.RoomInfo.CloseRates) : t(Translation.Step.Room.RoomInfo.ViewRates)}\n                        </BEButton>\n                    </div>\n                </div>\n            </div>\n            <AutoAutoHeight open={!!ratesOpen}>\n                <RoomRates roomCode={room.code as string} rates={standardRates} featuredRates={featuredRates} />\n            </AutoAutoHeight>\n            <RoomModal open={viewingDescription} room={props.room} rates={standardRates} featuredRates={featuredRates} onClose={closeDescriptionOnClose} />\n            {room.getRates().map((rate) => {\n                return (\n                    <script key={room.code + '-' + rate.code} type=\"application/ld+json\">\n                        {JSON.stringify({\n                            '@context': 'http://schema.org/',\n                            '@type': 'Offer',\n                            itemOffered: {\n                                '@type': 'HotelRoom',\n                                name: room.name,\n                            },\n                            name: rate.name,\n                            identifier: rate.code,\n                            priceSpecification: {\n                                '@type': 'UnitPriceSpecification',\n                                price: convertCurrencyPrice(rate.getAveragePrice(true)),\n                                basePrice: convertCurrencyPrice(rate.getTotalPrice(true)),\n                                totalPrice: convertCurrencyPrice(rate.getAveragePrice()),\n                                priceCurrency: ccx.currentCurrency,\n                                unitText: 'Nightly',\n                            },\n                        })}\n                    </script>\n                );\n            })}\n        </div>\n    );\n}\n"]}
+{"version":3,"file":"RoomDetails.js","sourceRoot":"/","sources":["src/components/steps/room/roomDetails/RoomDetails.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BasketContext, BookingEngineContext, CompanyContext, HotelOverridesContext } from '@frontend/contexts';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport classNames from 'classnames';\nimport React, { useContext, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport AutoAutoHeight from '@/animations/AutoAutoHeight';\nimport BEButton from '@/components/generic/BEButton';\nimport Currency from '@/components/generic/Currency';\nimport Headline from '@/components/generic/Headline';\nimport { IconType } from '@/components/generic/Icon/Icon';\nimport LineBreak from '@/components/generic/LineBreak';\nimport { PlanpayPrice } from '@/components/generic/PlanpayPrice/PlanpayPrice';\nimport Text, { TextType } from '@/components/generic/Text';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport { RoomDetailsBedsBlock } from '@/components/steps/room/roomDetails/RoomDetailsBedsBlock';\nimport { RoomDetailsPerkBlock } from '@/components/steps/room/roomDetails/RoomDetailsPerkBlock';\nimport RoomRatePills from '@/components/steps/room/roomDetails/roomRates/RoomRatePills';\nimport RoomRates from '@/components/steps/room/roomDetails/roomRates/RoomRates';\nimport UnavailableRoom from '@/components/steps/room/roomDetails/unavailableRoom/UnavailableRoom';\nimport RoomModal from '@/components/steps/room/RoomModal';\nimport useCurrency from '@/hooks/Currency';\nimport usePlanpay from '@/hooks/Planpay';\nimport { useWindowSize } from '@/hooks/WindowSize';\nimport { HotelPerk } from '@/models/Client/Hotel/HotelPerk';\nimport { Room } from '@/models/Room/Room';\nimport { RoomRate, RoomRatePriceInclusion } from '@/models/Room/RoomRate';\nimport FeaturedPromoFeature from '@/providers/feature/FeaturedPromoFeature';\nimport { ImageSize } from '@/providers/ImageProvider';\nimport { Translation } from '@/translations/Translation';\nimport { Color, getContrastTextColor } from '@/util/Color';\nimport * as currencyHelper from '@/util/CurrencyHelper';\nimport DataLayer, { InteractionStep, InteractionType } from '@/util/DataLayer';\nimport ScreenSize from '@/util/ScreenSize';\nimport { TextAlign } from '@/util/TextAlignment';\nexport interface RoomDetailsProps {\n    room: Room;\n    disableMarginBottom?: boolean;\n}\n\nexport default function RoomDetails(props: RoomDetailsProps) {\n    const { room } = props;\n\n    const [featuredRates, setFeaturedRates] = useState<RoomRate[]>([]);\n    const [standardRates, setStandardRates] = useState<RoomRate[]>([]);\n\n    const [viewingRates, setViewingRates] = useState<boolean | number | null>(!room.isAvailable());\n    const [viewingDescription, setViewingDescription] = useState(false);\n\n    const { t } = useTranslation();\n\n    const context = useContext(BookingEngineContext);\n    const basketContext = useContext(BasketContext);\n    const ccx = useContext(CompanyContext);\n    const { hotel } = useCurrentHotel();\n    const hotelOverridesContext = useContext(HotelOverridesContext);\n\n    const classes = classNames('room-details', {\n        ['+is-open']: viewingRates,\n    });\n\n    useEffect(() => {\n        if (basketContext.selectedBasketRow?.getRoom() && basketContext.selectedBasketRow.getRoom().code === props.room.code) {\n            setViewingRates(true);\n        }\n\n        const basketRow = basketContext.selectedBasketRow;\n        if (!basketRow) {\n            return;\n        }\n\n        DataLayer.instance.addRoomImpression(room, { to: basketRow.getStartDate(), from: basketRow.getEndDate() }, basketRow.getPromoCode());\n    }, [basketContext.selectedBasketRow]);\n\n    useEffect(() => {\n        let nonPromoRates: RoomRate[] = [];\n        const toSetFeaturedRate: RoomRate[] = [];\n\n        if (FeaturedPromoFeature.isActive()) {\n            for (const currentRate of room.getRates()) {\n                if (currentRate.promoCode?.toLowerCase() === basketContext.selectedBasketRow?.getPromoCode()?.toLowerCase()) {\n                    toSetFeaturedRate.unshift(currentRate);\n                } else {\n                    nonPromoRates.push(currentRate);\n                }\n            }\n\n            if (toSetFeaturedRate.length > 0) {\n                setViewingRates(true);\n                setFeaturedRates(toSetFeaturedRate);\n            }\n        } else {\n            nonPromoRates = room.getRates();\n        }\n\n        setStandardRates(nonPromoRates);\n    }, [room.getRates()]);\n\n    const trimmedDescription = room.getShortDescription();\n\n    const { isMobile } = useWindowSize();\n\n    const ratesOpen = viewingRates || (context.screenSize <= ScreenSize.Medium && viewingRates === null && !hotel?.mobileDefaultRatesClosed);\n    const moreDetailsOnClick = () => {\n        DataLayer.instance.sendInteraction('More Room Details', InteractionType.LINK, InteractionStep.ROOMS);\n        setViewingDescription(true);\n    };\n    const sendRoomClickOnClick = () => {\n        if (!ratesOpen) {\n            const basketRow = basketContext.selectedBasketRow;\n\n            if (basketRow) {\n                DataLayer.instance.sendRoomClick(room, basketRow.getStartDate(), basketRow.getEndDate(), basketRow.getPromoCode());\n            }\n        }\n        setViewingRates(!ratesOpen);\n    };\n    const closeDescriptionOnClose = () => {\n        setViewingDescription(false);\n    };\n\n    const lowestRawPrice = room.getLowestPrice(false, true);\n    const lowestDisplayPrice = hotelOverridesContext.alwaysShowDecimals ? lowestRawPrice : Math.round(lowestRawPrice);\n    const currencySize = context.screenSize > ScreenSize.Medium && lowestDisplayPrice.toLocaleString().length < 7 ? 'large' : 'normal';\n\n    const convertCurrencyPrice = (value: number) => Math.round(currencyHelper.convertPrice(value, true, ccx.currentCurrency, hotel?.defaultCurrency as string));\n\n    const { value: price, isLoading } = useCurrency({\n        hideDecimals: true,\n        children: lowestDisplayPrice,\n    });\n\n    const selectedRow = basketContext.selectedBasketRow;\n\n    const { hasPricePreview } = usePlanpay();\n\n    const { roomPerks } = room.getRoomPerks({\n        hotel: hotel,\n        room: room,\n        perksLimitNumber: 5,\n    });\n\n    return (\n        <div className={`room-details-container ${props.disableMarginBottom ? '' : 'u-marg-bottom'}`}>\n            <div className={classes}>\n                <div className=\"room-details--image\">\n                    <ImageGallerySlider images={props.room.getImages()} imageSize={ImageSize.Medium} />\n                </div>\n                <div className=\"room-details--content u-pad--heavy u-pad@l-\">\n                    <div className=\"u-marg-bottom\">\n                        {context.screenSize > ScreenSize.Large && (\n                            <>\n                                <div className=\"u-marg-bottom\">\n                                    <RoomRatePills room={room} limit={2} />\n                                </div>\n                            </>\n                        )}\n                        <div className=\"room-details--content-title u-marg-bottom--light\">\n                            <Headline bold>{room.name}</Headline>\n                        </div>\n                        <RoomDetailsBedsBlock room={room} />\n                        {trimmedDescription?.replace(/<br(\\/|)>/g, '') && (\n                            <div className=\"room-details--content-description u-marg-bottom--light\">\n                                <Text color={Color.DarkGrey} type={TextType.Small}>\n                                    <span dangerouslySetInnerHTML={{ __html: trimmedDescription?.replace(/<br(\\/|)>/g, '') || '' }} />\n                                </Text>\n                            </div>\n                        )}\n                    </div>\n\n                    <div className=\"row\">\n                        {!hotel?.perksHideOnRoomRow && (\n                            <div className=\"col-12 u-flex u-marg-bottom@m- flex-column align-items-start\">\n                                <div className=\"room-details--content-perks u-marg-bottom@m-\">\n                                    {isMobile && (\n                                        <div className=\"u-marg-bottom\">\n                                            <Text type={TextType.Small} bold color={Color.Accent}>\n                                                {hotel?.perkTitle || t(Translation.Misc.Perks.AndYouGetAll)}\n                                            </Text>\n                                        </div>\n                                    )}\n                                    <RoomDetailsPerkBlock perks={roomPerks as HotelPerk[]} room={room} />\n                                </div>\n                            </div>\n                        )}\n                        {hotel?.showDescriptionOnRoomDetails && (\n                            <div className=\"col-12\">\n                                <LineBreak noMargins />\n                                <div className=\"u-marg-top u-text-overflow-ellipsis-3 u-marg-bottom\">\n                                    <Text type={TextType.Small} color={Color.Graphite}>\n                                        <span dangerouslySetInnerHTML={{ __html: props.room.getLongDescription() || '' }} />\n                                    </Text>\n                                </div>\n                            </div>\n                        )}\n                        <div className=\"col-md-6 u-flex u-marg-bottom@m- flex-column align-items-start\">\n                            <BEButton icon={IconType.ArrowRight2} isText primary size=\"tiny\" iconPosition=\"right\" onClick={moreDetailsOnClick}>\n                                {t(Translation.Step.Room.RoomInfo.MoreDetails)}\n                            </BEButton>\n                        </div>\n                        {room.isAvailable() && (\n                            <div className=\"col-md-6 u-flex justify-content-end flex-column align-items-start align-items-md-end\">\n                                <Text type={TextType.Small} color={Color.Navy} inline>\n                                    {t(Translation.Misc.From)}\n                                </Text>\n                                <div className=\"room-details--content-price flex-row align-items-end\">\n                                    <Headline size={currencySize} bold>\n                                        <Currency hideDecimals>{lowestDisplayPrice}</Currency>\n                                    </Headline>\n                                    <Text color={Color.DarkGrey} inline>\n                                        /{t(Translation.Misc.Night)}\n                                    </Text>\n                                </div>\n                                <Text type={TextType.Small} color={Color.Grey} className=\"u-nowrap\" align={isMobile ? TextAlign.Left : TextAlign.Right}>\n                                    <span\n                                        dangerouslySetInnerHTML={{\n                                            __html:\n                                                room.getLowestPriceType() === RoomRatePriceInclusion.IncludingFeesAndTaxes\n                                                    ? t(Translation.Step.Room.RoomInfo.IncludesTaxes)\n                                                    : t(Translation.Step.Room.ExcludingTaxes),\n                                        }}\n                                    ></span>\n                                </Text>\n                            </div>\n                        )}\n                    </div>\n                    <div className=\"u-flex-direction-column u-flex u-flex-align-flex-end u-flex-align-flex-start@m- u-w-100@m-\">\n                        {!isLoading && hasPricePreview ? (\n                            <div className=\"u-marg-top--light\">\n                                <PlanpayPrice price={price} checkin={(selectedRow?.getStartDate() || basketContext.endDate).format('YYYY-MM-DD')} currency={ccx.currentCurrency} />\n                            </div>\n                        ) : null}\n                        <BEButton\n                            className=\"u-marg-top--light\"\n                            name=\"ViewRatesNowButton\"\n                            primary\n                            primaryActive={!!ratesOpen}\n                            filled\n                            stopIconAnimation\n                            icon={ratesOpen ? IconType.ArrowUp2 : IconType.ArrowDown2}\n                            iconPosition=\"right\"\n                            onClick={sendRoomClickOnClick}\n                            wide={context.screenSize <= ScreenSize.Large}\n                            textColor={getContrastTextColor(ratesOpen ? hotel?.colors.accent3 : hotel?.colors.accent)}\n                        >\n                            {ratesOpen ? t(Translation.Step.Room.RoomInfo.CloseRates) : t(Translation.Step.Room.RoomInfo.ViewRates)}\n                        </BEButton>\n                    </div>\n                </div>\n            </div>\n            <AutoAutoHeight open={!!ratesOpen}>\n                {room.isAvailable() ? <RoomRates roomCode={room.code as string} rates={standardRates} featuredRates={featuredRates} /> : <UnavailableRoom room={room} />}\n            </AutoAutoHeight>\n            <RoomModal open={viewingDescription} room={props.room} rates={standardRates} featuredRates={featuredRates} onClose={closeDescriptionOnClose} />\n            {room.getRates().map((rate) => {\n                return (\n                    <script key={room.code + '-' + rate.code} type=\"application/ld+json\">\n                        {JSON.stringify({\n                            '@context': 'http://schema.org/',\n                            '@type': 'Offer',\n                            itemOffered: {\n                                '@type': 'HotelRoom',\n                                name: room.name,\n                            },\n                            name: rate.name,\n                            identifier: rate.code,\n                            priceSpecification: {\n                                '@type': 'UnitPriceSpecification',\n                                price: convertCurrencyPrice(rate.getAveragePrice(true)),\n                                basePrice: convertCurrencyPrice(rate.getTotalPrice(true)),\n                                totalPrice: convertCurrencyPrice(rate.getAveragePrice()),\n                                priceCurrency: ccx.currentCurrency,\n                                unitText: 'Nightly',\n                            },\n                        })}\n                    </script>\n                );\n            })}\n        </div>\n    );\n}\n"]}

package/dist/src/components/steps/room/roomDetails/unavailableRoom/UnavailableRoom.d.ts

@@ -0,0 +1,5 @@
+import { Room } from '../../../../../models/Room/Room';
+export interface UnavailableRoomProps {
+    room: Room;
+}
+export default function UnavailableRoom({ room }: UnavailableRoomProps): JSX.Element;

package/dist/src/components/steps/room/roomDetails/unavailableRoom/UnavailableRoom.js

@@ -0,0 +1,83 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const classnames_1 = __importDefault(require("classnames"));
+const react_1 = __importStar(require("react"));
+const react_i18next_1 = require("react-i18next");
+const AutoAutoHeight_1 = __importDefault(require("../../../../../animations/AutoAutoHeight"));
+const BEButton_1 = __importDefault(require("../../../../generic/BEButton"));
+const DatePicker_1 = __importDefault(require("../../../../generic/date/DatePicker"));
+const Icon_1 = require("../../../../generic/Icon/Icon");
+const Text_1 = __importStar(require("../../../../generic/Text"));
+const contexts_1 = require("../../../../../contexts");
+const hooks_1 = require("../../../../../hooks");
+const Translation_1 = require("../../../../../translations/Translation");
+const Color_1 = require("../../../../../util/Color");
+const ScreenSize_1 = __importDefault(require("../../../../../util/ScreenSize"));
+const UnavailableRoom_module_scss_1 = __importDefault(require("./UnavailableRoom.module.scss"));
+function UnavailableRoom({ room }) {
+    var _a, _b;
+    const { t } = (0, react_i18next_1.useTranslation)();
+    const { screenSize } = (0, react_1.useContext)(contexts_1.BookingEngineContext);
+    const { hotel } = (0, hooks_1.useCurrentHotel)();
+    const basketContext = (0, react_1.useContext)(contexts_1.BasketContext);
+    const basketRows = basketContext.currentBasketRows;
+    const basketRow = (_a = basketContext.selectedBasketRow) !== null && _a !== void 0 ? _a : basketRows[basketRows.length - 1];
+    const [startDate, setStartDate] = (0, react_1.useState)(undefined);
+    const [endDate, setEndDate] = (0, react_1.useState)(undefined);
+    const [openCalendar, setOpenCalendar] = (0, react_1.useState)(false);
+    const toggleCalendar = () => setOpenCalendar((v) => !v);
+    const selectDates = () => {
+        if (startDate && endDate) {
+            basketContext.setStartDate(startDate);
+            basketContext.setEndDate(endDate);
+        }
+    };
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("div", { className: (0, classnames_1.default)(UnavailableRoom_module_scss_1.default.container, { [UnavailableRoom_module_scss_1.default.calendarOpen]: openCalendar }) },
+            react_1.default.createElement("div", { className: UnavailableRoom_module_scss_1.default.info },
+                react_1.default.createElement(Text_1.default, { bold: true }, t(Translation_1.Translation.Step.Room.RoomInfo.Unfortunately)),
+                react_1.default.createElement(Text_1.default, { color: Color_1.Color.Accent }, basketRow === null || basketRow === void 0 ? void 0 :
+                    basketRow.getStartDate().format('ddd, DD MMM'),
+                    " \u2014 ", basketRow === null || basketRow === void 0 ? void 0 :
+                    basketRow.getEndDate().format('ddd, DD MMM')),
+                react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small }, t(Translation_1.Translation.Step.Room.RoomInfo.IsUnavailableForRoom, {
+                    room: room.name,
+                }))),
+            react_1.default.createElement(BEButton_1.default, { className: UnavailableRoom_module_scss_1.default.findDatesBtn, name: "FindAvailableDatesButton", primary: true, primaryActive: openCalendar, filled: true, icon: openCalendar ? Icon_1.IconType.ArrowUp2 : Icon_1.IconType.ArrowDown2, iconPosition: "right", stopIconAnimation: true, textColor: (0, Color_1.getContrastTextColor)(openCalendar ? hotel === null || hotel === void 0 ? void 0 : hotel.colors.accent3 : hotel === null || hotel === void 0 ? void 0 : hotel.colors.accent), onClick: toggleCalendar, size: screenSize <= ScreenSize_1.default.Mobile ? 'small' : 'normal' }, t(Translation_1.Translation.Step.Room.RoomInfo.FindAvailableDatesForRoom)),
+            react_1.default.createElement(AutoAutoHeight_1.default, { open: openCalendar, topOffset: 21 },
+                react_1.default.createElement("div", { className: UnavailableRoom_module_scss_1.default.calendarOverlay },
+                    react_1.default.createElement(DatePicker_1.default, { showMonthOnLoad: basketRow.getStartDate(), showMultipleMonths: screenSize > ScreenSize_1.default.ExtraLarge, supportsMultiSelecting: true, supportsWeek: false, className: UnavailableRoom_module_scss_1.default.calendar, roomCode: (_b = room.code) !== null && _b !== void 0 ? _b : '', small: true, onStartDateChanged: setStartDate, onEndDateChanged: setEndDate }),
+                    react_1.default.createElement("div", { className: UnavailableRoom_module_scss_1.default.calendarFooter },
+                        react_1.default.createElement(Text_1.default, { bold: true, color: startDate ? Color_1.Color.Accent : undefined }, startDate
+                            ? `${startDate.format('ddd, DD MMM')}${endDate ? ` — ${endDate.format('ddd, DD MMM')}` : ''}`
+                            : t(Translation_1.Translation.Step.Room.RoomInfo.SelectDate)),
+                        react_1.default.createElement(BEButton_1.default, { primary: true, filled: true, onClick: selectDates, disabled: !(startDate && endDate), mobileWidth: true }, t(Translation_1.Translation.Step.Room.RoomInfo.SelectCheckoutDate))))))));
+}
+exports.default = UnavailableRoom;
+//# sourceMappingURL=UnavailableRoom.js.map

package/dist/src/components/steps/room/roomDetails/unavailableRoom/UnavailableRoom.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UnavailableRoom.js","sourceRoot":"/","sources":["src/components/steps/room/roomDetails/unavailableRoom/UnavailableRoom.tsx"],"names":[],"mappings":"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","sourcesContent":["import classNames from 'classnames';\nimport { Dayjs } from 'dayjs';\nimport React, { useContext, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport AutoAutoHeight from '@/animations/AutoAutoHeight';\nimport BEButton from '@/components/generic/BEButton';\nimport DatePicker from '@/components/generic/date/DatePicker';\nimport { IconType } from '@/components/generic/Icon/Icon';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { BasketContext, BookingEngineContext } from '@/contexts';\nimport { useCurrentHotel } from '@/hooks';\nimport { Room } from '@/models/Room/Room';\nimport { Translation } from '@/translations/Translation';\nimport { Color, getContrastTextColor } from '@/util/Color';\nimport ScreenSize from '@/util/ScreenSize';\n\nimport styles from './UnavailableRoom.module.scss';\n\nexport interface UnavailableRoomProps {\n    room: Room;\n}\n\nexport default function UnavailableRoom({ room }: UnavailableRoomProps) {\n    const { t } = useTranslation();\n    const { screenSize } = useContext(BookingEngineContext);\n    const { hotel } = useCurrentHotel();\n\n    const basketContext = useContext(BasketContext);\n    const basketRows = basketContext.currentBasketRows;\n    const basketRow = basketContext.selectedBasketRow ?? basketRows[basketRows.length - 1];\n\n    const [startDate, setStartDate] = useState<Dayjs | undefined>(undefined);\n    const [endDate, setEndDate] = useState<Dayjs | undefined>(undefined);\n\n    const [openCalendar, setOpenCalendar] = useState(false);\n\n    const toggleCalendar = () => setOpenCalendar((v) => !v);\n\n    const selectDates = () => {\n        if (startDate && endDate) {\n            basketContext.setStartDate(startDate);\n            basketContext.setEndDate(endDate);\n        }\n    };\n\n    return (\n        <>\n            <div className={classNames(styles.container, { [styles.calendarOpen]: openCalendar })}>\n                <div className={styles.info}>\n                    <Text bold>{t(Translation.Step.Room.RoomInfo.Unfortunately)}</Text>\n\n                    <Text color={Color.Accent}>\n                        {basketRow?.getStartDate().format('ddd, DD MMM')} — {basketRow?.getEndDate().format('ddd, DD MMM')}\n                    </Text>\n\n                    <Text type={TextType.Small}>\n                        {t(Translation.Step.Room.RoomInfo.IsUnavailableForRoom, {\n                            room: room.name,\n                        })}\n                    </Text>\n                </div>\n\n                <BEButton\n                    className={styles.findDatesBtn}\n                    name=\"FindAvailableDatesButton\"\n                    primary\n                    primaryActive={openCalendar}\n                    filled\n                    icon={openCalendar ? IconType.ArrowUp2 : IconType.ArrowDown2}\n                    iconPosition=\"right\"\n                    stopIconAnimation\n                    textColor={getContrastTextColor(openCalendar ? hotel?.colors.accent3 : hotel?.colors.accent)}\n                    onClick={toggleCalendar}\n                    size={screenSize <= ScreenSize.Mobile ? 'small' : 'normal'}\n                >\n                    {t(Translation.Step.Room.RoomInfo.FindAvailableDatesForRoom)}\n                </BEButton>\n\n                {/* Calendar overlay – appears half-way under the button */}\n                <AutoAutoHeight open={openCalendar} topOffset={21}>\n                    <div className={styles.calendarOverlay}>\n                        <DatePicker\n                            showMonthOnLoad={basketRow.getStartDate()}\n                            showMultipleMonths={screenSize > ScreenSize.ExtraLarge}\n                            supportsMultiSelecting\n                            supportsWeek={false}\n                            className={styles.calendar}\n                            roomCode={room.code ?? ''}\n                            small\n                            onStartDateChanged={setStartDate}\n                            onEndDateChanged={setEndDate}\n                        />\n\n                        <div className={styles.calendarFooter}>\n                            <Text bold color={startDate ? Color.Accent : undefined}>\n                                {startDate\n                                    ? `${startDate.format('ddd, DD MMM')}${endDate ? ` — ${endDate.format('ddd, DD MMM')}` : ''}`\n                                    : t(Translation.Step.Room.RoomInfo.SelectDate)}\n                            </Text>\n                            <BEButton primary filled onClick={selectDates} disabled={!(startDate && endDate)} mobileWidth>\n                                {t(Translation.Step.Room.RoomInfo.SelectCheckoutDate)}\n                            </BEButton>\n                        </div>\n                    </div>\n                </AutoAutoHeight>\n            </div>\n        </>\n    );\n}\n"]}

package/dist/src/components/summary/BEMobileSummaryModal.js

@@ -51,6 +51,7 @@ const Color_1 = require("../../util/Color");
 const GetStepRoom_1 = __importDefault(require("../../util/GetStepRoom"));
 const StringHelper_1 = __importDefault(require("../../util/StringHelper"));
 const TextAlignment_1 = require("../../util/TextAlignment");
+const GroupedCheckInOutTimes_1 = require("../generic/GroupedCheckInOutTimes/GroupedCheckInOutTimes");
 function BEMobileSummaryModal(props) {
     var _a, _b, _c, _d;
     const basketContext = (0, react_1.useContext)(contexts_1.BasketContext);
@@ -107,21 +108,9 @@ function BEMobileSummaryModal(props) {
                     react_1.default.createElement("span", { dangerouslySetInnerHTML: { __html: t(Translation_1.Translation.Step.Room.RoomInfo.IncludesTaxes) } })))) },
         react_1.default.createElement(react_1.default.Fragment, null,
             react_1.default.createElement("div", { className: "container" },
-                react_1.default.createElement("div", { className: "row u-border-bottom u-pad-top-bottom" },
-                    react_1.default.createElement("div", { className: "col-6" },
-                        react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Grey },
-                            react_1.default.createElement("strong", null, t(Translation_1.Translation.Misc.CheckIn))),
-                        react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
-                            t(Translation_1.Translation.Misc.After),
-                            " ", hotel === null || hotel === void 0 ? void 0 :
-                            hotel.checkInTime)),
-                    react_1.default.createElement("div", { className: "col-6" },
-                        react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Grey },
-                            react_1.default.createElement("strong", null, t(Translation_1.Translation.Misc.CheckOut))),
-                        react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
-                            t(Translation_1.Translation.Misc.Before),
-                            " ", hotel === null || hotel === void 0 ? void 0 :
-                            hotel.checkOutTime))),
+                react_1.default.createElement(GroupedCheckInOutTimes_1.GroupedCheckInOutTimes, { hotel: hotel, wrapperClassName: "row u-border-bottom u-pad-top-bottom", colClassName: "col-6", CheckInRender: () => (react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Grey },
+                        react_1.default.createElement("strong", null, t(Translation_1.Translation.Misc.CheckIn)))), CheckOutRender: () => (react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Grey },
+                        react_1.default.createElement("strong", null, t(Translation_1.Translation.Misc.CheckOut)))), LineRender: ({ line }) => react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small }, line) }),
                 react_1.default.createElement("div", { className: "row u-border-bottom u-pad be-mobile-summary-select-date-header", style: { width: 'unset' } },
                     react_1.default.createElement("div", { style: { flex: 1 } },
                         react_1.default.createElement("div", { className: "u-flex u-flex-flex-start" },

package/dist/src/components/summary/BEMobileSummaryModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"BEMobileSummaryModal.js","sourceRoot":"/","sources":["src/components/summary/BEMobileSummaryModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BasketContext } from '@frontend/contexts';\nimport { OrderableReactList, useCurrentHotel, useElementSort } from '@frontend/hooks';\nimport React, { useContext, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Link } from 'react-router-dom';\nimport { Translation } from 'translations/Translation';\n\nimport BEButton from '@/components/generic/BEButton';\nimport Currency from '@/components/generic/Currency';\nimport Headline from '@/components/generic/Headline';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport LineBreak from '@/components/generic/LineBreak';\nimport HotelLocationMap from '@/components/generic/map/HotelLocationMap';\nimport SimpleModal from '@/components/generic/modal/SimpleModal';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { ItemisedFeesListing } from '@/components/steps/common/ItemisedFeesListing/ItemisedFeesListing';\nimport { BESummaryLayoutOrder } from '@/components/summary/BESummary';\nimport BESummaryAddonRow from '@/components/summary/BESummaryAddonRow';\nimport { BESummaryPerkBlock } from '@/components/summary/BESummaryPerkBlock';\nimport BESummaryPrivacyPolicy from '@/components/summary/BESummaryPrivacyPolicy';\nimport BESummaryRoomRow from '@/components/summary/BESummaryRoomRow';\nimport TransportDistanceFromHotelBlock from '@/components/summary/TransportDistanceFromHotelBlock';\nimport BasketAddonRow from '@/models/BasketAddonRow';\nimport BasketRow from '@/models/BasketRow';\nimport { Color } from '@/util/Color';\nimport getStepRoom from '@/util/GetStepRoom';\nimport StringHelper from '@/util/StringHelper';\nimport { TextAlign } from '@/util/TextAlignment';\n\nexport interface BEMobileSummaryModalProps {\n    isOpen?: boolean;\n    onClose?: () => void;\n    showImages?: boolean;\n}\n\nexport default function BEMobileSummaryModal(props: BEMobileSummaryModalProps) {\n    const basketContext = useContext(BasketContext);\n    const { hotel } = useCurrentHotel();\n\n    const selectedBasketRows = basketContext.getAllValidRows();\n\n    const addons = basketContext.basketAddonRows;\n\n    const { t } = useTranslation();\n\n    const [mobileLayout, setMobileLayout] = useState<OrderableReactList>({});\n\n    useEffect(() => {\n        // We do this hacky thing since Mobile summary & Desktop summary are almost identical, just blocks are presented differently\n        const newLayout: typeof BESummaryLayoutOrder = { ...BESummaryLayoutOrder };\n        newLayout.TransportDistanceBlock.component = (\n            <div className=\"u-flex justify-content-center u-marg-top u-marg-bottom\">\n                <div className=\"u-flex flex-row u-w-100\">\n                    <TransportDistanceFromHotelBlock vertical hotel={hotel} />\n                </div>\n            </div>\n        );\n        newLayout.PerksBlock.component = <BESummaryPerkBlock size=\"mobile\" />;\n\n        setMobileLayout(newLayout);\n    }, []);\n\n    const { sortedComponents } = useElementSort(mobileLayout);\n\n    const totalDays = basketContext.endDate ? basketContext.endDate.diff(basketContext.startDate, 'day') : 0;\n\n    const addressLine1 = [hotel?.address?.line1, hotel?.address?.city];\n    const addressLine2 = [hotel?.address?.postalCode, hotel?.address?.state];\n\n    const getAddressString = (val: string[]) => {\n        const line = val.filter((it) => !!it && it !== '0').join(', ');\n\n        if (line) {\n            return <Text type={TextType.Small}>{line}</Text>;\n        }\n\n        return null;\n    };\n\n    const onCloseModalHandler = () => {\n        return props.onClose ? props.onClose() : null;\n    };\n\n    const editOnClick = () => {\n        props.onClose?.();\n    };\n\n    const onEditPropertyClickedHandler = () => {\n        props.onClose?.();\n    };\n\n    const totalPrice = basketContext.getTotalPrice();\n    const totalPayNow = basketContext.getTotalPayNow();\n    const totalFees = basketContext.getTotalFees();\n    const itemisedFees = basketContext.getItemisedFees();\n    const depositFees = basketContext.getDepositFees();\n\n    return (\n        <SimpleModal\n            open={props.isOpen}\n            title={t(Translation.Misc.Summary)}\n            onClose={onCloseModalHandler}\n            mobileFooter={\n                <div className=\"row align-items-center\">\n                    <div className=\"col-4\">\n                        <Text type={TextType.Body}>{t(Translation.Misc.Total)}</Text>\n                        <Text type={TextType.Small} color={Color.Accent}>\n                            <strong>{StringHelper.pluralWithDictAndCount(totalDays, Translation.Misc.Night, t)}</strong>\n                        </Text>\n                    </div>\n                    <div className=\"col-8 u-flex u-flex-direction-column align-items-end\">\n                        <Headline bold size=\"normal\" align={TextAlign.Right}>\n                            <Currency>{totalPrice}</Currency>\n                        </Headline>\n                        <Text color={Color.DarkGrey} type={TextType.Small} align={TextAlign.Right}>\n                            <span dangerouslySetInnerHTML={{ __html: t(Translation.Step.Room.RoomInfo.IncludesTaxes) }}></span>\n                        </Text>\n                    </div>\n                </div>\n            }\n        >\n            <>\n                <div className=\"container\">\n                    <div className=\"row u-border-bottom u-pad-top-bottom\">\n                        <div className=\"col-6\">\n                            <Text type={TextType.Small} color={Color.Grey}>\n                                <strong>{t(Translation.Misc.CheckIn)}</strong>\n                            </Text>\n                            <Text type={TextType.Small}>\n                                {t(Translation.Misc.After)} {hotel?.checkInTime}\n                            </Text>\n                        </div>\n                        <div className=\"col-6\">\n                            <Text type={TextType.Small} color={Color.Grey}>\n                                <strong>{t(Translation.Misc.CheckOut)}</strong>\n                            </Text>\n                            <Text type={TextType.Small}>\n                                {t(Translation.Misc.Before)} {hotel?.checkOutTime}\n                            </Text>\n                        </div>\n                    </div>\n\n                    <div className=\"row u-border-bottom u-pad be-mobile-summary-select-date-header\" style={{ width: 'unset' }}>\n                        <div style={{ flex: 1 }}>\n                            <div className=\"u-flex u-flex-flex-start\">\n                                <Text className=\"select-date-header-title\">\n                                    <span\n                                        {...(basketContext.startDate\n                                            ? {\n                                                  style: {\n                                                      color: Color.Accent,\n                                                      fontWeight: 'bold',\n                                                  },\n                                              }\n                                            : {})}\n                                    >\n                                        {basketContext.startDate ? basketContext.startDate.format('MMM D') : t(Translation.Step.Date.Arrival)}\n                                    </span>\n                                </Text>\n                                <span className=\"u-marg-left-right--light\">\n                                    <Icon icon={IconType.ArrowRight2} size=\"18px\" color={Color.DarkGrey} />\n                                </span>\n                                <Text className=\"select-date-header-title\">\n                                    <span\n                                        {...(basketContext.endDate\n                                            ? {\n                                                  style: {\n                                                      color: Color.Accent,\n                                                      fontWeight: 'bold',\n                                                  },\n                                              }\n                                            : {})}\n                                    >\n                                        {basketContext.endDate ? basketContext.endDate.format('MMM D') : t(Translation.Step.Date.Departure)}\n                                    </span>\n                                </Text>\n                            </div>\n                            <Text className=\"select-date-header-subtitle\">\n                                {basketContext.getNumberOfAdults(true)},&nbsp;\n                                {basketContext.getNumberOfChildren(true)},&nbsp;\n                                {basketContext.getNumberOfRooms(true)}\n                            </Text>\n                        </div>\n                        <div className=\"u-align-right\">\n                            <Link to={getStepRoom().getStepUrl()}>\n                                <BEButton onClick={editOnClick} size=\"tiny\">\n                                    {t(Translation.Misc.Edit).toUpperCase()}\n                                </BEButton>\n                            </Link>\n                        </div>\n                    </div>\n\n                    {selectedBasketRows && selectedBasketRows.length ? (\n                        <>\n                            {selectedBasketRows.map((row: BasketRow, index: number) => {\n                                if (!row.isValid()) return;\n\n                                return (\n                                    <BESummaryRoomRow\n                                        row={row}\n                                        index={index}\n                                        key={row.getID()}\n                                        showImages={!!props.showImages}\n                                        onEditPropertyClicked={onEditPropertyClickedHandler}\n                                    />\n                                );\n                            })}\n\n                            {addons.length > 0 && (\n                                <>\n                                    <LineBreak noMargins darker />\n\n                                    <div className=\"u-marg-top\">\n                                        <Text type={TextType.Label} color={Color.DarkGrey}>\n                                            <strong>Add-on Items</strong>\n                                        </Text>\n                                    </div>\n\n                                    {addons.map((row: BasketAddonRow, index: number) => {\n                                        const onRemoveClickHandler = () => {\n                                            return basketContext.removeBasketAddonRow(row);\n                                        };\n\n                                        return <BESummaryAddonRow row={row} key={row.getID()} onRemoveClick={onRemoveClickHandler} />;\n                                    })}\n                                </>\n                            )}\n                        </>\n                    ) : (\n                        <div className=\"u-marg-bottom--heavy u-marg-top--heavy\">\n                            <div className=\"u-marg-bottom--heavy\">\n                                <Text type={TextType.Body}>{t(Translation.Step.General.YourCartIsEmpty)}</Text>\n                            </div>\n                            <div style={{ height: '150px', position: 'relative' }}>\n                                <HotelLocationMap />\n                            </div>\n                            <div className=\"u-marg-top\">\n                                <div className=\"u-marg-bottom\">\n                                    <Text bold>{hotel?.name}</Text>\n                                </div>\n                                {getAddressString(addressLine1 as string[])}\n                                {getAddressString(addressLine2 as string[])}\n                            </div>\n                        </div>\n                    )}\n\n                    {/* Fees */}\n                    {totalFees > 0 && !itemisedFees?.length && (\n                        <>\n                            <div className=\"line-break\" style={{ marginTop: 0, marginBottom: '24px' }} />\n                            <div className=\"u-flex\">\n                                <Text type={TextType.Small}> {t(Translation.Step.Room.Summary.CreditCardSurcharge)}</Text>\n                                <Text type={TextType.Small}>\n                                    <Currency>{totalFees}</Currency>\n                                </Text>\n                            </div>\n                        </>\n                    )}\n\n                    {!!itemisedFees?.length && <ItemisedFeesListing fees={itemisedFees} />}\n\n                    {sortedComponents}\n\n                    <div className=\"u-marg-top--heavy u-marg-bottom--heavy\">\n                        <BESummaryPrivacyPolicy />\n                    </div>\n                    {hotel?.requireDeposit && (\n                        <div className=\"u-marg-bottom--heavy\">\n                            <div className=\"row align-items-center\">\n                                <div className=\"col-12 u-marg-top--light\">\n                                    <div className=\"u-flex\">\n                                        <Text type={TextType.Small}> {t(Translation.Step.Room.Summary.CreditCardSurcharge)}</Text>\n                                        <Text type={TextType.Small}>\n                                            <Currency>{depositFees}</Currency>\n                                        </Text>\n                                    </div>\n                                </div>\n                                <div className=\"line-break\" style={{ marginTop: 0, marginBottom: '8px' }} />\n                                <div className=\"col-12 u-marg-top--light u-marg-bottom--light\">\n                                    <div className=\"u-flex\">\n                                        <Text type={TextType.Small} bold>\n                                            {t(Translation.Misc.PayNow)}\n                                        </Text>\n                                        <Text type={TextType.Small} bold>\n                                            <Currency>{totalPayNow}</Currency>\n                                        </Text>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                    )}\n                </div>\n            </>\n        </SimpleModal>\n    );\n}\n"]}
+{"version":3,"file":"BEMobileSummaryModal.js","sourceRoot":"/","sources":["src/components/summary/BEMobileSummaryModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BasketContext } from '@frontend/contexts';\nimport { OrderableReactList, useCurrentHotel, useElementSort } from '@frontend/hooks';\nimport React, { useContext, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Link } from 'react-router-dom';\nimport { Translation } from 'translations/Translation';\n\nimport BEButton from '@/components/generic/BEButton';\nimport Currency from '@/components/generic/Currency';\nimport Headline from '@/components/generic/Headline';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport LineBreak from '@/components/generic/LineBreak';\nimport HotelLocationMap from '@/components/generic/map/HotelLocationMap';\nimport SimpleModal from '@/components/generic/modal/SimpleModal';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { ItemisedFeesListing } from '@/components/steps/common/ItemisedFeesListing/ItemisedFeesListing';\nimport { BESummaryLayoutOrder } from '@/components/summary/BESummary';\nimport BESummaryAddonRow from '@/components/summary/BESummaryAddonRow';\nimport { BESummaryPerkBlock } from '@/components/summary/BESummaryPerkBlock';\nimport BESummaryPrivacyPolicy from '@/components/summary/BESummaryPrivacyPolicy';\nimport BESummaryRoomRow from '@/components/summary/BESummaryRoomRow';\nimport TransportDistanceFromHotelBlock from '@/components/summary/TransportDistanceFromHotelBlock';\nimport BasketAddonRow from '@/models/BasketAddonRow';\nimport BasketRow from '@/models/BasketRow';\nimport { Color } from '@/util/Color';\nimport getStepRoom from '@/util/GetStepRoom';\nimport StringHelper from '@/util/StringHelper';\nimport { TextAlign } from '@/util/TextAlignment';\n\nimport { GroupedCheckInOutTimes } from '../generic/GroupedCheckInOutTimes/GroupedCheckInOutTimes';\n\nexport interface BEMobileSummaryModalProps {\n    isOpen?: boolean;\n    onClose?: () => void;\n    showImages?: boolean;\n}\n\nexport default function BEMobileSummaryModal(props: BEMobileSummaryModalProps) {\n    const basketContext = useContext(BasketContext);\n    const { hotel } = useCurrentHotel();\n\n    const selectedBasketRows = basketContext.getAllValidRows();\n\n    const addons = basketContext.basketAddonRows;\n\n    const { t } = useTranslation();\n\n    const [mobileLayout, setMobileLayout] = useState<OrderableReactList>({});\n\n    useEffect(() => {\n        // We do this hacky thing since Mobile summary & Desktop summary are almost identical, just blocks are presented differently\n        const newLayout: typeof BESummaryLayoutOrder = { ...BESummaryLayoutOrder };\n        newLayout.TransportDistanceBlock.component = (\n            <div className=\"u-flex justify-content-center u-marg-top u-marg-bottom\">\n                <div className=\"u-flex flex-row u-w-100\">\n                    <TransportDistanceFromHotelBlock vertical hotel={hotel} />\n                </div>\n            </div>\n        );\n        newLayout.PerksBlock.component = <BESummaryPerkBlock size=\"mobile\" />;\n\n        setMobileLayout(newLayout);\n    }, []);\n\n    const { sortedComponents } = useElementSort(mobileLayout);\n\n    const totalDays = basketContext.endDate ? basketContext.endDate.diff(basketContext.startDate, 'day') : 0;\n\n    const addressLine1 = [hotel?.address?.line1, hotel?.address?.city];\n    const addressLine2 = [hotel?.address?.postalCode, hotel?.address?.state];\n\n    const getAddressString = (val: string[]) => {\n        const line = val.filter((it) => !!it && it !== '0').join(', ');\n\n        if (line) {\n            return <Text type={TextType.Small}>{line}</Text>;\n        }\n\n        return null;\n    };\n\n    const onCloseModalHandler = () => {\n        return props.onClose ? props.onClose() : null;\n    };\n\n    const editOnClick = () => {\n        props.onClose?.();\n    };\n\n    const onEditPropertyClickedHandler = () => {\n        props.onClose?.();\n    };\n\n    const totalPrice = basketContext.getTotalPrice();\n    const totalPayNow = basketContext.getTotalPayNow();\n    const totalFees = basketContext.getTotalFees();\n    const itemisedFees = basketContext.getItemisedFees();\n    const depositFees = basketContext.getDepositFees();\n\n    return (\n        <SimpleModal\n            open={props.isOpen}\n            title={t(Translation.Misc.Summary)}\n            onClose={onCloseModalHandler}\n            mobileFooter={\n                <div className=\"row align-items-center\">\n                    <div className=\"col-4\">\n                        <Text type={TextType.Body}>{t(Translation.Misc.Total)}</Text>\n                        <Text type={TextType.Small} color={Color.Accent}>\n                            <strong>{StringHelper.pluralWithDictAndCount(totalDays, Translation.Misc.Night, t)}</strong>\n                        </Text>\n                    </div>\n                    <div className=\"col-8 u-flex u-flex-direction-column align-items-end\">\n                        <Headline bold size=\"normal\" align={TextAlign.Right}>\n                            <Currency>{totalPrice}</Currency>\n                        </Headline>\n                        <Text color={Color.DarkGrey} type={TextType.Small} align={TextAlign.Right}>\n                            <span dangerouslySetInnerHTML={{ __html: t(Translation.Step.Room.RoomInfo.IncludesTaxes) }}></span>\n                        </Text>\n                    </div>\n                </div>\n            }\n        >\n            <>\n                <div className=\"container\">\n                    <GroupedCheckInOutTimes\n                        hotel={hotel}\n                        wrapperClassName=\"row u-border-bottom u-pad-top-bottom\"\n                        colClassName=\"col-6\"\n                        CheckInRender={() => (\n                            <Text type={TextType.Small} color={Color.Grey}>\n                                <strong>{t(Translation.Misc.CheckIn)}</strong>\n                            </Text>\n                        )}\n                        CheckOutRender={() => (\n                            <Text type={TextType.Small} color={Color.Grey}>\n                                <strong>{t(Translation.Misc.CheckOut)}</strong>\n                            </Text>\n                        )}\n                        LineRender={({ line }: { line: string }) => <Text type={TextType.Small}>{line}</Text>}\n                    />\n\n                    <div className=\"row u-border-bottom u-pad be-mobile-summary-select-date-header\" style={{ width: 'unset' }}>\n                        <div style={{ flex: 1 }}>\n                            <div className=\"u-flex u-flex-flex-start\">\n                                <Text className=\"select-date-header-title\">\n                                    <span\n                                        {...(basketContext.startDate\n                                            ? {\n                                                  style: {\n                                                      color: Color.Accent,\n                                                      fontWeight: 'bold',\n                                                  },\n                                              }\n                                            : {})}\n                                    >\n                                        {basketContext.startDate ? basketContext.startDate.format('MMM D') : t(Translation.Step.Date.Arrival)}\n                                    </span>\n                                </Text>\n                                <span className=\"u-marg-left-right--light\">\n                                    <Icon icon={IconType.ArrowRight2} size=\"18px\" color={Color.DarkGrey} />\n                                </span>\n                                <Text className=\"select-date-header-title\">\n                                    <span\n                                        {...(basketContext.endDate\n                                            ? {\n                                                  style: {\n                                                      color: Color.Accent,\n                                                      fontWeight: 'bold',\n                                                  },\n                                              }\n                                            : {})}\n                                    >\n                                        {basketContext.endDate ? basketContext.endDate.format('MMM D') : t(Translation.Step.Date.Departure)}\n                                    </span>\n                                </Text>\n                            </div>\n                            <Text className=\"select-date-header-subtitle\">\n                                {basketContext.getNumberOfAdults(true)},&nbsp;\n                                {basketContext.getNumberOfChildren(true)},&nbsp;\n                                {basketContext.getNumberOfRooms(true)}\n                            </Text>\n                        </div>\n                        <div className=\"u-align-right\">\n                            <Link to={getStepRoom().getStepUrl()}>\n                                <BEButton onClick={editOnClick} size=\"tiny\">\n                                    {t(Translation.Misc.Edit).toUpperCase()}\n                                </BEButton>\n                            </Link>\n                        </div>\n                    </div>\n\n                    {selectedBasketRows && selectedBasketRows.length ? (\n                        <>\n                            {selectedBasketRows.map((row: BasketRow, index: number) => {\n                                if (!row.isValid()) return;\n\n                                return (\n                                    <BESummaryRoomRow\n                                        row={row}\n                                        index={index}\n                                        key={row.getID()}\n                                        showImages={!!props.showImages}\n                                        onEditPropertyClicked={onEditPropertyClickedHandler}\n                                    />\n                                );\n                            })}\n\n                            {addons.length > 0 && (\n                                <>\n                                    <LineBreak noMargins darker />\n\n                                    <div className=\"u-marg-top\">\n                                        <Text type={TextType.Label} color={Color.DarkGrey}>\n                                            <strong>Add-on Items</strong>\n                                        </Text>\n                                    </div>\n\n                                    {addons.map((row: BasketAddonRow, index: number) => {\n                                        const onRemoveClickHandler = () => {\n                                            return basketContext.removeBasketAddonRow(row);\n                                        };\n\n                                        return <BESummaryAddonRow row={row} key={row.getID()} onRemoveClick={onRemoveClickHandler} />;\n                                    })}\n                                </>\n                            )}\n                        </>\n                    ) : (\n                        <div className=\"u-marg-bottom--heavy u-marg-top--heavy\">\n                            <div className=\"u-marg-bottom--heavy\">\n                                <Text type={TextType.Body}>{t(Translation.Step.General.YourCartIsEmpty)}</Text>\n                            </div>\n                            <div style={{ height: '150px', position: 'relative' }}>\n                                <HotelLocationMap />\n                            </div>\n                            <div className=\"u-marg-top\">\n                                <div className=\"u-marg-bottom\">\n                                    <Text bold>{hotel?.name}</Text>\n                                </div>\n                                {getAddressString(addressLine1 as string[])}\n                                {getAddressString(addressLine2 as string[])}\n                            </div>\n                        </div>\n                    )}\n\n                    {/* Fees */}\n                    {totalFees > 0 && !itemisedFees?.length && (\n                        <>\n                            <div className=\"line-break\" style={{ marginTop: 0, marginBottom: '24px' }} />\n                            <div className=\"u-flex\">\n                                <Text type={TextType.Small}> {t(Translation.Step.Room.Summary.CreditCardSurcharge)}</Text>\n                                <Text type={TextType.Small}>\n                                    <Currency>{totalFees}</Currency>\n                                </Text>\n                            </div>\n                        </>\n                    )}\n\n                    {!!itemisedFees?.length && <ItemisedFeesListing fees={itemisedFees} />}\n\n                    {sortedComponents}\n\n                    <div className=\"u-marg-top--heavy u-marg-bottom--heavy\">\n                        <BESummaryPrivacyPolicy />\n                    </div>\n                    {hotel?.requireDeposit && (\n                        <div className=\"u-marg-bottom--heavy\">\n                            <div className=\"row align-items-center\">\n                                <div className=\"col-12 u-marg-top--light\">\n                                    <div className=\"u-flex\">\n                                        <Text type={TextType.Small}> {t(Translation.Step.Room.Summary.CreditCardSurcharge)}</Text>\n                                        <Text type={TextType.Small}>\n                                            <Currency>{depositFees}</Currency>\n                                        </Text>\n                                    </div>\n                                </div>\n                                <div className=\"line-break\" style={{ marginTop: 0, marginBottom: '8px' }} />\n                                <div className=\"col-12 u-marg-top--light u-marg-bottom--light\">\n                                    <div className=\"u-flex\">\n                                        <Text type={TextType.Small} bold>\n                                            {t(Translation.Misc.PayNow)}\n                                        </Text>\n                                        <Text type={TextType.Small} bold>\n                                            <Currency>{totalPayNow}</Currency>\n                                        </Text>\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                    )}\n                </div>\n            </>\n        </SimpleModal>\n    );\n}\n"]}

package/dist/src/contexts/BasketContext/BasketContextType.d.ts

@@ -13,6 +13,7 @@ export interface BasketContextType {
     basketAddonRows: BasketAddonRow[];
     basketFeeRows: ItemisedFee[];
     loadedPromotion: IPromotion | null;
+    quoteQueryID: string;
     startDate: dayjs.Dayjs;
     endDate: dayjs.Dayjs;
     pencilId: string | undefined;

package/dist/src/contexts/BasketContext/BasketContextType.js.map

@@ -1 +1 @@
-{"version":3,"file":"BasketContextType.js","sourceRoot":"/","sources":["src/contexts/BasketContext/BasketContextType.ts"],"names":[],"mappings":"","sourcesContent":["import type dayjs from 'dayjs';\n\nimport type { Addon } from '@/models/Addon/Addon';\nimport type ReservationsDTO from '@/models/Api/ReservationsDTO';\nimport type BasketAddonRow from '@/models/BasketAddonRow';\nimport type BasketRow from '@/models/BasketRow';\nimport { ItemisedFee } from '@/models/Fee';\nimport type { IPromotion } from '@/models/Promotion/IPromotion.type';\nimport type { RoomRate } from '@/models/Room/RoomRate';\nimport { RoomstaySession } from '@/models/RoomstaySession';\n\nexport interface BasketContextType {\n    selectedBasketRow: BasketRow;\n    currentBasketRows: BasketRow[];\n    basketAddonRows: BasketAddonRow[];\n    basketFeeRows: ItemisedFee[];\n    loadedPromotion: IPromotion | null;\n\n    startDate: dayjs.Dayjs;\n    endDate: dayjs.Dayjs;\n    pencilId: string | undefined;\n\n    isLoadingPriceQuote: boolean;\n\n    addBasketRow: (row: BasketRow) => void;\n    addRate: (rate: RoomRate, notify?: boolean) => Promise<void>;\n\n    getAllValidRows: () => BasketRow[];\n    getAllDatelessRows: () => BasketRow[];\n\n    getNumberOfAdults: (withTranslation: boolean) => number | string;\n    getNumberOfChildren: (withTranslation: boolean) => number | string;\n    getNumberOfInfants: (withTranslation: boolean) => number | string;\n    getNumberOfRooms: (withTranslation: boolean) => number | string;\n\n    getTotalPrice: () => any;\n    getTotalDeposit: () => number;\n    getDepositFees: () => number;\n    getTotalFees: () => number;\n    getItemisedFees: () => ItemisedFee[];\n    getTotalPayNow: () => number;\n\n    updateBasketRow: (row: BasketRow, updateGlobalDates?: boolean) => void;\n    removeBasketRow: (row: BasketRow) => void;\n\n    clearBasketRows: (confirm: boolean) => void;\n    selectBasketRow: (row: BasketRow | null) => void;\n\n    setStartDate: (date: dayjs.Dayjs) => void;\n    setEndDate: (date: dayjs.Dayjs) => void;\n\n    quoteOrPencilReservation: (applyQuote: () => boolean) => void;\n\n    hasCheckedOut: boolean;\n    reservationData: ReservationsDTO;\n    booked: (data: ReservationsDTO, reservationRequest?: RoomstaySession['reservationRequest']) => Promise<void>;\n    rollback: () => void;\n    checkedOut: (data: ReservationsDTO) => void;\n    clearSelectedRates: () => void;\n    finish: () => void;\n\n    getRowForAddon: (selectedAddon: Addon) => BasketAddonRow | undefined;\n\n    setAddonQuantities: (addon: Addon, quantities: { quantity: number; adult: number; child: number }, selectedDate: string, selectedTime: string) => void;\n\n    removeBasketAddonRow: (row: BasketAddonRow) => void;\n    attemptSelectUnfilledRow: () => BasketRow | undefined;\n\n    initBasketRows: (basketRows: BasketRow[]) => void;\n    updateBasketFeeRows: () => void;\n\n    onDatePickerOpenChange: (isOpen: boolean) => void;\n    isDatePickerOpen: boolean;\n}\n"]}
+{"version":3,"file":"BasketContextType.js","sourceRoot":"/","sources":["src/contexts/BasketContext/BasketContextType.ts"],"names":[],"mappings":"","sourcesContent":["import type dayjs from 'dayjs';\n\nimport type { Addon } from '@/models/Addon/Addon';\nimport type ReservationsDTO from '@/models/Api/ReservationsDTO';\nimport type BasketAddonRow from '@/models/BasketAddonRow';\nimport type BasketRow from '@/models/BasketRow';\nimport { ItemisedFee } from '@/models/Fee';\nimport type { IPromotion } from '@/models/Promotion/IPromotion.type';\nimport type { RoomRate } from '@/models/Room/RoomRate';\nimport { RoomstaySession } from '@/models/RoomstaySession';\n\nexport interface BasketContextType {\n    selectedBasketRow: BasketRow;\n    currentBasketRows: BasketRow[];\n    basketAddonRows: BasketAddonRow[];\n    basketFeeRows: ItemisedFee[];\n    loadedPromotion: IPromotion | null;\n    quoteQueryID: string; // This ID is used to detect changes and re-fetch deposit quotes during checkout.\n\n    startDate: dayjs.Dayjs;\n    endDate: dayjs.Dayjs;\n    pencilId: string | undefined;\n\n    isLoadingPriceQuote: boolean;\n\n    addBasketRow: (row: BasketRow) => void;\n    addRate: (rate: RoomRate, notify?: boolean) => Promise<void>;\n\n    getAllValidRows: () => BasketRow[];\n    getAllDatelessRows: () => BasketRow[];\n\n    getNumberOfAdults: (withTranslation: boolean) => number | string;\n    getNumberOfChildren: (withTranslation: boolean) => number | string;\n    getNumberOfInfants: (withTranslation: boolean) => number | string;\n    getNumberOfRooms: (withTranslation: boolean) => number | string;\n\n    getTotalPrice: () => any;\n    getTotalDeposit: () => number;\n    getDepositFees: () => number;\n    getTotalFees: () => number;\n    getItemisedFees: () => ItemisedFee[];\n    getTotalPayNow: () => number;\n\n    updateBasketRow: (row: BasketRow, updateGlobalDates?: boolean) => void;\n    removeBasketRow: (row: BasketRow) => void;\n\n    clearBasketRows: (confirm: boolean) => void;\n    selectBasketRow: (row: BasketRow | null) => void;\n\n    setStartDate: (date: dayjs.Dayjs) => void;\n    setEndDate: (date: dayjs.Dayjs) => void;\n\n    quoteOrPencilReservation: (applyQuote: () => boolean) => void;\n\n    hasCheckedOut: boolean;\n    reservationData: ReservationsDTO;\n    booked: (data: ReservationsDTO, reservationRequest?: RoomstaySession['reservationRequest']) => Promise<void>;\n    rollback: () => void;\n    checkedOut: (data: ReservationsDTO) => void;\n    clearSelectedRates: () => void;\n    finish: () => void;\n\n    getRowForAddon: (selectedAddon: Addon) => BasketAddonRow | undefined;\n\n    setAddonQuantities: (addon: Addon, quantities: { quantity: number; adult: number; child: number }, selectedDate: string, selectedTime: string) => void;\n\n    removeBasketAddonRow: (row: BasketAddonRow) => void;\n    attemptSelectUnfilledRow: () => BasketRow | undefined;\n\n    initBasketRows: (basketRows: BasketRow[]) => void;\n    updateBasketFeeRows: () => void;\n\n    onDatePickerOpenChange: (isOpen: boolean) => void;\n    isDatePickerOpen: boolean;\n}\n"]}

package/dist/src/contexts/BasketContext/BasketContextWrapper.js

@@ -408,6 +408,12 @@ function BasketContextWrapper(props) {
         }
         setBasketFeeRows(newFees);
     };
+    const quoteQueryID = (0, react_1.useMemo)(() => {
+        if (!hotel || !(hotel === null || hotel === void 0 ? void 0 : hotel.requireDeposit)) {
+            return '';
+        }
+        return BookingAPI_1.default.Reservation.buildQuoteQueryID(currentBasketRows, isExternalMemberHotel ? memberNumber : undefined);
+    }, [currentBasketRows, isExternalMemberHotel, memberNumber, hotel === null || hotel === void 0 ? void 0 : hotel.hotelID]);
     const workingContext = {
         startDate: startDate,
         endDate: endDate,
@@ -420,6 +426,7 @@ function BasketContextWrapper(props) {
         reservationData: reservationData,
         isLoadingPriceQuote,
         loadedPromotion,
+        quoteQueryID,
         pencilId,
         /**
          * Adds a new basket row and applies relevant updates: