@roomstay/frontend 2.6.83 → 2.6.85

package/dist/src/components/steps/room/AvailableUpgradesModal.js

@@ -58,6 +58,7 @@ const Headline_1 = __importDefault(require("../../generic/Headline"));
 const SimpleModal_1 = __importDefault(require("../../generic/modal/SimpleModal"));
 const Text_1 = __importStar(require("../../generic/Text"));
 const ImageGallerySlider_1 = __importDefault(require("./ImageGallerySlider"));
+const LargeRateCard_1 = __importDefault(require("./LargeRateCard"));
 const LargeRoomCard_1 = __importDefault(require("./LargeRoomCard"));
 const useSignedInMember_1 = require("../../../hooks/useSignedInMember");
 const RoomUpsellFeature_1 = __importDefault(require("../../../providers/feature/RoomUpsellFeature"));
@@ -73,7 +74,8 @@ const AvailableUpgradesModal = () => {
     const { on } = (0, hooks_1.useEvent)();
     const room = row === null || row === void 0 ? void 0 : row.getRoom();
     const selectedRate = row === null || row === void 0 ? void 0 : row.getRate();
-    const [rates, setRates] = (0, react_1.useState)();
+    const [roomUpgrades, setRoomUpgrades] = (0, react_1.useState)([]);
+    const [rateUpgrades, setRateUpgrades] = (0, react_1.useState)([]);
     (0, react_1.useEffect)(() => {
         let cancelled = false;
         on(events_1.AddToCartEvent, (event) => __awaiter(void 0, void 0, void 0, function* () {
@@ -88,39 +90,94 @@ const AvailableUpgradesModal = () => {
     }, []);
     (0, react_1.useEffect)(() => {
         let cancelled = false;
-        if (row) {
-            BookingAPI_1.default.Availability.fetchAvailabilityData(row, hotel === null || hotel === void 0 ? void 0 : hotel.hotelID, memberNumber, true).then((availableRooms) => {
+        if (row && selectedRate) {
+            BookingAPI_1.default.Availability.fetchAvailabilityData(row, hotel === null || hotel === void 0 ? void 0 : hotel.hotelID, memberNumber, true).then((availableRooms) => __awaiter(void 0, void 0, void 0, function* () {
                 if (cancelled)
                     return;
-                const unfilteredRates = [];
-                availableRooms === null || availableRooms === void 0 ? void 0 : availableRooms.map((availableRoom) => {
-                    return availableRoom.getRates();
-                }).forEach((fewRates) => {
-                    fewRates.forEach((oneRate) => {
-                        unfilteredRates.push(oneRate);
+                const allRates = [];
+                availableRooms === null || availableRooms === void 0 ? void 0 : availableRooms.forEach((availableRoom) => {
+                    availableRoom.getRates().forEach((rate) => {
+                        allRates.push(rate);
                     });
                 });
-                const filteredRates = unfilteredRates
-                    .filter((rate) => {
-                    return rate.getAveragePrice() > (selectedRate === null || selectedRate === void 0 ? void 0 : selectedRate.getAveragePrice()) && rate.name === (selectedRate === null || selectedRate === void 0 ? void 0 : selectedRate.name);
-                })
+                const roomUpsellsEnabled = (hotel === null || hotel === void 0 ? void 0 : hotel.enableRoomUpsells) || RoomUpsellFeature_1.default.isActive();
+                const rateUpsellsEnabled = hotel === null || hotel === void 0 ? void 0 : hotel.enableRateUpsells;
+                // Check for minimum stay opportunities
+                const hasMinStayOpportunities = BookingAPI_1.default.Availability.hasMinStayUpsellOpportunities(row, hotel === null || hotel === void 0 ? void 0 : hotel.hotelID, memberNumber);
+                const minStayUpsells = [];
+                if (rateUpsellsEnabled && hasMinStayOpportunities) {
+                    // Fetch extended availability for minimum stay upsells
+                    const extendedRooms = yield BookingAPI_1.default.Availability.fetchMinimumStayExtensions(row, hotel === null || hotel === void 0 ? void 0 : hotel.hotelID, memberNumber);
+                    if (extendedRooms && !cancelled) {
+                        extendedRooms.forEach((room) => {
+                            room.getRates().forEach((rate) => {
+                                // We want to find rates where the user can extend the stay in their current room, for a lower price per night.
+                                const wasAvailableForOriginalDates = allRates.find((r) => r.code === rate.code);
+                                const isCheaperPerNight = rate.getAveragePrice() < selectedRate.getAveragePrice();
+                                const requiresLongerStay = rate.minNightStayOverride && rate.minNightStayOverride > row.getNumberOfDays();
+                                const isSameRoom = rate.getRoom().code === selectedRate.getRoom().code;
+                                if (!wasAvailableForOriginalDates && isSameRoom && rate.isUpsellRate && isCheaperPerNight && requiresLongerStay) {
+                                    minStayUpsells.push(rate);
+                                }
+                            });
+                        });
+                    }
+                }
+                if (cancelled)
+                    return;
+                // Find rate upgrades (same room, different rate)
+                const rateUpgradeRoomRates = rateUpsellsEnabled
+                    ? allRates
+                        .filter((rate) => {
+                        const isSameRoom = rate.getRoom().code === selectedRate.getRoom().code;
+                        const isDifferentRate = rate.code !== selectedRate.code;
+                        const isUpsellRate = rate.isUpsellRate === true;
+                        const isMoreExpensive = rate.getAveragePrice() > selectedRate.getAveragePrice();
+                        // Don't show rates with lower minimum stay requirements as upsells, because we might show a minimum
+                        // stay upsell when the user has already chosen a rate with a longer minimum stay requirement.
+                        // But, still show upsell rates that don't have a minimum night stay requirement.
+                        const hasLowerMinStay = rate.minNightStayOverride && rate.minNightStayOverride < row.getNumberOfDays();
+                        return isSameRoom && isDifferentRate && isUpsellRate && isMoreExpensive && !hasLowerMinStay;
+                    })
+                        .sort((a, b) => a.getAveragePrice() - b.getAveragePrice())
+                        .slice(0, 3)
+                    : [];
+                // Combine regular rate upgrades with minimum stay upsells
+                const allRateUpgrades = [...rateUpgradeRoomRates, ...minStayUpsells]
                     .sort((a, b) => {
-                    if (a.getAveragePrice() === (selectedRate === null || selectedRate === void 0 ? void 0 : selectedRate.getAveragePrice()))
-                        return 1;
-                    if (b.getAveragePrice() === (selectedRate === null || selectedRate === void 0 ? void 0 : selectedRate.getAveragePrice()))
+                    // Prioritize minimum stay deals (rates with minNightStayOverride)
+                    const aIsMinStay = !!(a.minNightStayOverride && a.minNightStayOverride > row.getNumberOfDays());
+                    const bIsMinStay = !!(b.minNightStayOverride && b.minNightStayOverride > row.getNumberOfDays());
+                    if (aIsMinStay && !bIsMinStay)
                         return -1;
+                    if (!aIsMinStay && bIsMinStay)
+                        return 1;
                     return a.getAveragePrice() - b.getAveragePrice();
                 })
                     .slice(0, 3);
-                setRates(filteredRates);
-                if (filteredRates.length === 0 && selectedRate) {
+                // Find room upgrades (different room, same rate, higher price)
+                const roomUpgradeRoomRates = roomUpsellsEnabled
+                    ? allRates
+                        .filter((rate) => {
+                        const isDifferentRoom = rate.getRoom().code !== selectedRate.getRoom().code;
+                        const isSameRate = rate.name === selectedRate.name;
+                        const isMoreExpensive = rate.getAveragePrice() > selectedRate.getAveragePrice();
+                        return isDifferentRoom && isSameRate && isMoreExpensive;
+                    })
+                        .sort((a, b) => a.getAveragePrice() - b.getAveragePrice())
+                        .slice(0, 3)
+                    : [];
+                setRoomUpgrades(roomUpgradeRoomRates);
+                setRateUpgrades(allRateUpgrades);
+                const hasUpgrades = roomUpgradeRoomRates.length > 0 || allRateUpgrades.length > 0;
+                if (!hasUpgrades && selectedRate) {
                     // Proceed as if user clicked the nav.
                     confirmRateOnClick();
                 }
                 else {
-                    setIsOpen(true);
+                    setIsOpen(hasUpgrades);
                 }
-            });
+            }));
         }
         return () => {
             cancelled = true;
@@ -140,7 +197,15 @@ const AvailableUpgradesModal = () => {
         if (row) {
             if (rate) {
                 DataLayer_1.default.instance.sendUpsellConfirmed({ from: row.getStartDate(), to: row.getEndDate() }, row.getRate(), rate);
-                row.setRate(rate, RoomUpsellFeature_1.default.isActive());
+                const isUpsellActive = (hotel === null || hotel === void 0 ? void 0 : hotel.enableRoomUpsells) || RoomUpsellFeature_1.default.isActive() || (hotel === null || hotel === void 0 ? void 0 : hotel.enableRateUpsells);
+                // Check if this is a minimum stay upsell that requires extending the checkout
+                if (rate.minNightStayOverride && rate.minNightStayOverride > row.getNumberOfDays()) {
+                    const newStartDate = row.getStartDate();
+                    const newEndDate = newStartDate.add(rate.minNightStayOverride, 'days');
+                    row.setStartDate(newStartDate);
+                    row.setEndDate(newEndDate);
+                }
+                row.setRate(rate, isUpsellActive);
                 basketContext.updateBasketRow(row);
                 closeModal();
             }
@@ -149,7 +214,11 @@ const AvailableUpgradesModal = () => {
             }
         }
     };
-    return RoomUpsellFeature_1.default.isActive() ? (react_1.default.createElement(SimpleModal_1.default, { open: isOpen, onClose: cancelUpsell, title: t(Translation_1.Translation.Step.Room.AvailableUpgrades) },
+    const roomUpsellsEnabled = (hotel === null || hotel === void 0 ? void 0 : hotel.enableRoomUpsells) || RoomUpsellFeature_1.default.isActive();
+    const rateUpsellsEnabled = hotel === null || hotel === void 0 ? void 0 : hotel.enableRateUpsells;
+    const upsellsEnabled = roomUpsellsEnabled || rateUpsellsEnabled;
+    const allUpgrades = [...rateUpgrades, ...roomUpgrades].slice(0, 3);
+    return upsellsEnabled && row ? (react_1.default.createElement(SimpleModal_1.default, { open: isOpen, onClose: cancelUpsell, title: t(Translation_1.Translation.Step.Room.AvailableUpgrades) },
         react_1.default.createElement("div", { className: "upgrades-room-modal" },
             react_1.default.createElement("div", { className: "current-room-block container" },
                 react_1.default.createElement("div", { className: "u-flex u-flex-flex-start row" },
@@ -176,12 +245,11 @@ const AvailableUpgradesModal = () => {
                 react_1.default.createElement("div", { className: "u-pad-top u-marg-bottom" },
                     react_1.default.createElement("div", { className: "u-marg-bottom--heavy" },
                         react_1.default.createElement(Headline_1.default, { bold: true }, t(Translation_1.Translation.Step.Room.CheckOutOtherOptions))),
-                    react_1.default.createElement("div", { className: "row no-gutters" }, rates === null || rates === void 0 ? void 0 : rates.map((rate) => {
-                        const onSelectRate = () => {
-                            confirmRateOnClick(rate);
-                        };
-                        return (react_1.default.createElement("div", { className: "col-md-6 col-xl-4 u-marg-bottom u-pad-left--light u-pad-right--light", key: rate.getRoom().name },
-                            react_1.default.createElement(LargeRoomCard_1.default, { selectedRate: selectedRate, rate: rate, onSelectRate: onSelectRate })));
+                    react_1.default.createElement("div", { className: "row no-gutters" }, allUpgrades.map((rate) => {
+                        const isRateUpgrade = rate.getRoom().code === (selectedRate === null || selectedRate === void 0 ? void 0 : selectedRate.getRoom().code);
+                        const key = `room-${rate.getRoom().code}-${rate.code}`;
+                        return (react_1.default.createElement("div", { className: "col-md-6 col-xl-4 u-marg-bottom u-pad-left--light u-pad-right--light", key: key }, selectedRate &&
+                            (isRateUpgrade ? (react_1.default.createElement(LargeRateCard_1.default, { selectedRate: selectedRate, rate: rate, onSelectRate: () => confirmRateOnClick(rate), startDate: row.getStartDate() })) : (react_1.default.createElement(LargeRoomCard_1.default, { selectedRate: selectedRate, rate: rate, onSelectRate: () => confirmRateOnClick(rate) })))));
                     }))))))) : null;
 };
 exports.default = AvailableUpgradesModal;

package/dist/src/components/steps/room/AvailableUpgradesModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"AvailableUpgradesModal.js","sourceRoot":"/","sources":["src/components/steps/room/AvailableUpgradesModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BasketContext } from '@frontend/contexts';\nimport { AddToCartEvent } from '@frontend/events';\nimport { useCurrentHotel, useEvent } from '@frontend/hooks';\nimport React, { FC, useContext, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport API from '@/api/BookingAPI';\nimport BEButton from '@/components/generic/BEButton';\nimport Currency from '@/components/generic/Currency';\nimport Headline from '@/components/generic/Headline';\nimport SimpleModal from '@/components/generic/modal/SimpleModal';\nimport Text, { TextType } from '@/components/generic/Text';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport LargeRoomCard from '@/components/steps/room/LargeRoomCard';\nimport { useSignedInMember } from '@/hooks/useSignedInMember';\nimport BasketRow from '@/models/BasketRow';\nimport { RoomRate } from '@/models/Room/RoomRate';\nimport RoomUpsellFeature from '@/providers/feature/RoomUpsellFeature';\nimport { Color } from '@/util/Color';\nimport DataLayer from '@/util/DataLayer';\n\nconst AvailableUpgradesModal: FC = () => {\n    const { t } = useTranslation();\n    const { hotel } = useCurrentHotel();\n    const { memberNumber } = useSignedInMember();\n    const [isOpen, setIsOpen] = useState(false);\n    const [row, setRow] = useState<BasketRow | null>(null);\n\n    const basketContext = useContext(BasketContext);\n\n    const { on } = useEvent();\n\n    const room = row?.getRoom();\n    const selectedRate = row?.getRate();\n\n    const [rates, setRates] = useState<RoomRate[]>();\n\n    useEffect(() => {\n        let cancelled = false;\n\n        on(AddToCartEvent, async (event: AddToCartEvent): Promise<void | boolean> => {\n            if (cancelled) return;\n\n            setRow(event.basketRow);\n            return true;\n        });\n\n        return () => {\n            cancelled = true;\n        };\n    }, []);\n\n    useEffect(() => {\n        let cancelled = false;\n\n        if (row) {\n            API.Availability.fetchAvailabilityData(row, hotel?.hotelID as string, memberNumber, true).then((availableRooms) => {\n                if (cancelled) return;\n\n                const unfilteredRates: RoomRate[] = [];\n                availableRooms\n                    ?.map((availableRoom) => {\n                        return availableRoom.getRates();\n                    })\n                    .forEach((fewRates) => {\n                        fewRates.forEach((oneRate) => {\n                            unfilteredRates.push(oneRate);\n                        });\n                    });\n                const filteredRates = unfilteredRates\n                    .filter((rate) => {\n                        return rate.getAveragePrice() > (selectedRate?.getAveragePrice() as number) && rate.name === selectedRate?.name;\n                    })\n                    .sort((a: RoomRate, b: RoomRate) => {\n                        if (a.getAveragePrice() === selectedRate?.getAveragePrice()) return 1;\n                        if (b.getAveragePrice() === selectedRate?.getAveragePrice()) return -1;\n                        return a.getAveragePrice() - b.getAveragePrice();\n                    })\n                    .slice(0, 3);\n\n                setRates(filteredRates);\n                if (filteredRates.length === 0 && selectedRate) {\n                    // Proceed as if user clicked the nav.\n                    confirmRateOnClick();\n                } else {\n                    setIsOpen(true);\n                }\n            });\n        }\n\n        return () => {\n            cancelled = true;\n        };\n    }, [row, memberNumber]);\n\n    const closeModal = () => {\n        setIsOpen(false);\n        setRow(null);\n    };\n\n    const cancelUpsell = () => {\n        if (row) {\n            DataLayer.instance.sendUpsellCancelled({ from: row.getStartDate(), to: row.getEndDate() }, row.getRate() as RoomRate);\n        }\n\n        closeModal();\n    };\n\n    const confirmRateOnClick = (rate?: RoomRate) => {\n        if (row) {\n            if (rate) {\n                DataLayer.instance.sendUpsellConfirmed({ from: row.getStartDate(), to: row.getEndDate() }, row.getRate() as RoomRate, rate);\n\n                row.setRate(rate, RoomUpsellFeature.isActive());\n                basketContext.updateBasketRow(row);\n                closeModal();\n            } else {\n                cancelUpsell();\n            }\n        }\n    };\n\n    return RoomUpsellFeature.isActive() ? (\n        <SimpleModal open={isOpen} onClose={cancelUpsell} title={t(Translation.Step.Room.AvailableUpgrades)}>\n            <div className=\"upgrades-room-modal\">\n                <div className=\"current-room-block container\">\n                    <div className=\"u-flex u-flex-flex-start row\">\n                        <div className=\"image-wrapper col-md-3 col-12\">\n                            <ImageGallerySlider images={room?.getImages() || []} />\n                        </div>\n                        <div className=\"u-flex info-block col-md-7 col-sm-9\">\n                            <div>\n                                <Text color={Color.DarkGrey} bold>\n                                    {t(Translation.Step.Room.CurrentSelectedRoom)}\n                                </Text>\n                                <Headline bold>{room?.name}</Headline>\n                                <Text type={TextType.Small} color={Color.DarkGrey}>\n                                    {selectedRate?.name}\n                                </Text>\n                            </div>\n                            <div>\n                                <div className=\"room-details--content-price flex-row\">\n                                    <Headline bold>\n                                        <Currency hideDecimals>{selectedRate?.getAveragePrice()}</Currency>\n                                    </Headline>\n                                    <Text color={Color.DarkGrey} inline>\n                                        /{t(Translation.Misc.Night)}\n                                    </Text>\n                                </div>\n                                <div className=\"u-marg-bottom\">\n                                    <Text type={TextType.Small} color={Color.Grey} className=\"u-nowrap\">\n                                        <span dangerouslySetInnerHTML={{ __html: t(Translation.Step.Room.RoomInfo.IncludesTaxes) }}></span>\n                                    </Text>\n                                </div>\n                            </div>\n                        </div>\n                        <div className=\"u-flex u-flex-align-center col-md-2 col-sm-3\">\n                            <BEButton wide filled primary onClick={() => confirmRateOnClick()}>\n                                {t(Translation.Step.Room.Confirm)}\n                            </BEButton>\n                        </div>\n                    </div>\n                </div>\n                <div className=\"container\" style={{ backgroundColor: Color.Snow }}>\n                    <div className=\"u-pad-top u-marg-bottom\">\n                        <div className=\"u-marg-bottom--heavy\">\n                            <Headline bold>{t(Translation.Step.Room.CheckOutOtherOptions)}</Headline>\n                        </div>\n                        <div className=\"row no-gutters\">\n                            {rates?.map((rate) => {\n                                const onSelectRate = () => {\n                                    confirmRateOnClick(rate);\n                                };\n\n                                return (\n                                    <div className=\"col-md-6 col-xl-4 u-marg-bottom u-pad-left--light u-pad-right--light\" key={rate.getRoom().name}>\n                                        <LargeRoomCard selectedRate={selectedRate as RoomRate} rate={rate} onSelectRate={onSelectRate} />\n                                    </div>\n                                );\n                            })}\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </SimpleModal>\n    ) : null;\n};\n\nexport default AvailableUpgradesModal;\n"]}
+{"version":3,"file":"AvailableUpgradesModal.js","sourceRoot":"/","sources":["src/components/steps/room/AvailableUpgradesModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BasketContext } from '@frontend/contexts';\nimport { AddToCartEvent } from '@frontend/events';\nimport { useCurrentHotel, useEvent } from '@frontend/hooks';\nimport React, { FC, useContext, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport API from '@/api/BookingAPI';\nimport BEButton from '@/components/generic/BEButton';\nimport Currency from '@/components/generic/Currency';\nimport Headline from '@/components/generic/Headline';\nimport SimpleModal from '@/components/generic/modal/SimpleModal';\nimport Text, { TextType } from '@/components/generic/Text';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport LargeRateCard from '@/components/steps/room/LargeRateCard';\nimport LargeRoomCard from '@/components/steps/room/LargeRoomCard';\nimport { useSignedInMember } from '@/hooks/useSignedInMember';\nimport BasketRow from '@/models/BasketRow';\nimport { RoomRate } from '@/models/Room/RoomRate';\nimport RoomUpsellFeature from '@/providers/feature/RoomUpsellFeature';\nimport { Color } from '@/util/Color';\nimport DataLayer from '@/util/DataLayer';\n\nconst AvailableUpgradesModal: FC = () => {\n    const { t } = useTranslation();\n    const { hotel } = useCurrentHotel();\n    const { memberNumber } = useSignedInMember();\n    const [isOpen, setIsOpen] = useState(false);\n    const [row, setRow] = useState<BasketRow | null>(null);\n\n    const basketContext = useContext(BasketContext);\n\n    const { on } = useEvent();\n\n    const room = row?.getRoom();\n    const selectedRate = row?.getRate();\n\n    const [roomUpgrades, setRoomUpgrades] = useState<RoomRate[]>([]);\n    const [rateUpgrades, setRateUpgrades] = useState<RoomRate[]>([]);\n\n    useEffect(() => {\n        let cancelled = false;\n\n        on(AddToCartEvent, async (event: AddToCartEvent): Promise<void | boolean> => {\n            if (cancelled) return;\n\n            setRow(event.basketRow);\n            return true;\n        });\n\n        return () => {\n            cancelled = true;\n        };\n    }, []);\n\n    useEffect(() => {\n        let cancelled = false;\n\n        if (row && selectedRate) {\n            API.Availability.fetchAvailabilityData(row, hotel?.hotelID as string, memberNumber, true).then(async (availableRooms) => {\n                if (cancelled) return;\n\n                const allRates: RoomRate[] = [];\n                availableRooms?.forEach((availableRoom) => {\n                    availableRoom.getRates().forEach((rate) => {\n                        allRates.push(rate);\n                    });\n                });\n\n                const roomUpsellsEnabled = hotel?.enableRoomUpsells || RoomUpsellFeature.isActive();\n                const rateUpsellsEnabled = hotel?.enableRateUpsells;\n\n                // Check for minimum stay opportunities\n                const hasMinStayOpportunities = API.Availability.hasMinStayUpsellOpportunities(row, hotel?.hotelID as string, memberNumber);\n                const minStayUpsells: RoomRate[] = [];\n\n                if (rateUpsellsEnabled && hasMinStayOpportunities) {\n                    // Fetch extended availability for minimum stay upsells\n                    const extendedRooms = await API.Availability.fetchMinimumStayExtensions(row, hotel?.hotelID as string, memberNumber);\n\n                    if (extendedRooms && !cancelled) {\n                        extendedRooms.forEach((room) => {\n                            room.getRates().forEach((rate) => {\n                                // We want to find rates where the user can extend the stay in their current room, for a lower price per night.\n                                const wasAvailableForOriginalDates = allRates.find((r) => r.code === rate.code);\n                                const isCheaperPerNight = rate.getAveragePrice() < selectedRate.getAveragePrice();\n                                const requiresLongerStay = rate.minNightStayOverride && rate.minNightStayOverride > row.getNumberOfDays();\n                                const isSameRoom = rate.getRoom().code === selectedRate.getRoom().code;\n\n                                if (!wasAvailableForOriginalDates && isSameRoom && rate.isUpsellRate && isCheaperPerNight && requiresLongerStay) {\n                                    minStayUpsells.push(rate);\n                                }\n                            });\n                        });\n                    }\n                }\n\n                if (cancelled) return;\n\n                // Find rate upgrades (same room, different rate)\n                const rateUpgradeRoomRates = rateUpsellsEnabled\n                    ? allRates\n                          .filter((rate) => {\n                              const isSameRoom = rate.getRoom().code === selectedRate.getRoom().code;\n                              const isDifferentRate = rate.code !== selectedRate.code;\n                              const isUpsellRate = rate.isUpsellRate === true;\n                              const isMoreExpensive = rate.getAveragePrice() > selectedRate.getAveragePrice();\n\n                              // Don't show rates with lower minimum stay requirements as upsells, because we might show a minimum\n                              // stay upsell when the user has already chosen a rate with a longer minimum stay requirement.\n                              // But, still show upsell rates that don't have a minimum night stay requirement.\n                              const hasLowerMinStay = rate.minNightStayOverride && rate.minNightStayOverride < row.getNumberOfDays();\n\n                              return isSameRoom && isDifferentRate && isUpsellRate && isMoreExpensive && !hasLowerMinStay;\n                          })\n                          .sort((a, b) => a.getAveragePrice() - b.getAveragePrice())\n                          .slice(0, 3)\n                    : [];\n\n                // Combine regular rate upgrades with minimum stay upsells\n                const allRateUpgrades = [...rateUpgradeRoomRates, ...minStayUpsells]\n                    .sort((a, b) => {\n                        // Prioritize minimum stay deals (rates with minNightStayOverride)\n                        const aIsMinStay = !!(a.minNightStayOverride && a.minNightStayOverride > row.getNumberOfDays());\n                        const bIsMinStay = !!(b.minNightStayOverride && b.minNightStayOverride > row.getNumberOfDays());\n                        if (aIsMinStay && !bIsMinStay) return -1;\n                        if (!aIsMinStay && bIsMinStay) return 1;\n                        return a.getAveragePrice() - b.getAveragePrice();\n                    })\n                    .slice(0, 3);\n\n                // Find room upgrades (different room, same rate, higher price)\n                const roomUpgradeRoomRates = roomUpsellsEnabled\n                    ? allRates\n                          .filter((rate) => {\n                              const isDifferentRoom = rate.getRoom().code !== selectedRate.getRoom().code;\n                              const isSameRate = rate.name === selectedRate.name;\n                              const isMoreExpensive = rate.getAveragePrice() > selectedRate.getAveragePrice();\n\n                              return isDifferentRoom && isSameRate && isMoreExpensive;\n                          })\n                          .sort((a, b) => a.getAveragePrice() - b.getAveragePrice())\n                          .slice(0, 3)\n                    : [];\n\n                setRoomUpgrades(roomUpgradeRoomRates);\n                setRateUpgrades(allRateUpgrades);\n\n                const hasUpgrades = roomUpgradeRoomRates.length > 0 || allRateUpgrades.length > 0;\n                if (!hasUpgrades && selectedRate) {\n                    // Proceed as if user clicked the nav.\n                    confirmRateOnClick();\n                } else {\n                    setIsOpen(hasUpgrades);\n                }\n            });\n        }\n\n        return () => {\n            cancelled = true;\n        };\n    }, [row, memberNumber]);\n\n    const closeModal = () => {\n        setIsOpen(false);\n        setRow(null);\n    };\n\n    const cancelUpsell = () => {\n        if (row) {\n            DataLayer.instance.sendUpsellCancelled({ from: row.getStartDate(), to: row.getEndDate() }, row.getRate() as RoomRate);\n        }\n\n        closeModal();\n    };\n\n    const confirmRateOnClick = (rate?: RoomRate) => {\n        if (row) {\n            if (rate) {\n                DataLayer.instance.sendUpsellConfirmed({ from: row.getStartDate(), to: row.getEndDate() }, row.getRate() as RoomRate, rate);\n\n                const isUpsellActive = hotel?.enableRoomUpsells || RoomUpsellFeature.isActive() || hotel?.enableRateUpsells;\n\n                // Check if this is a minimum stay upsell that requires extending the checkout\n                if (rate.minNightStayOverride && rate.minNightStayOverride > row.getNumberOfDays()) {\n                    const newStartDate = row.getStartDate();\n                    const newEndDate = newStartDate.add(rate.minNightStayOverride, 'days');\n\n                    row.setStartDate(newStartDate);\n                    row.setEndDate(newEndDate);\n                }\n\n                row.setRate(rate, isUpsellActive);\n                basketContext.updateBasketRow(row);\n                closeModal();\n            } else {\n                cancelUpsell();\n            }\n        }\n    };\n\n    const roomUpsellsEnabled = hotel?.enableRoomUpsells || RoomUpsellFeature.isActive();\n    const rateUpsellsEnabled = hotel?.enableRateUpsells;\n    const upsellsEnabled = roomUpsellsEnabled || rateUpsellsEnabled;\n\n    const allUpgrades = [...rateUpgrades, ...roomUpgrades].slice(0, 3);\n\n    return upsellsEnabled && row ? (\n        <SimpleModal open={isOpen} onClose={cancelUpsell} title={t(Translation.Step.Room.AvailableUpgrades)}>\n            <div className=\"upgrades-room-modal\">\n                <div className=\"current-room-block container\">\n                    <div className=\"u-flex u-flex-flex-start row\">\n                        <div className=\"image-wrapper col-md-3 col-12\">\n                            <ImageGallerySlider images={room?.getImages() || []} />\n                        </div>\n                        <div className=\"u-flex info-block col-md-7 col-sm-9\">\n                            <div>\n                                <Text color={Color.DarkGrey} bold>\n                                    {t(Translation.Step.Room.CurrentSelectedRoom)}\n                                </Text>\n                                <Headline bold>{room?.name}</Headline>\n                                <Text type={TextType.Small} color={Color.DarkGrey}>\n                                    {selectedRate?.name}\n                                </Text>\n                            </div>\n                            <div>\n                                <div className=\"room-details--content-price flex-row\">\n                                    <Headline bold>\n                                        <Currency hideDecimals>{selectedRate?.getAveragePrice()}</Currency>\n                                    </Headline>\n                                    <Text color={Color.DarkGrey} inline>\n                                        /{t(Translation.Misc.Night)}\n                                    </Text>\n                                </div>\n                                <div className=\"u-marg-bottom\">\n                                    <Text type={TextType.Small} color={Color.Grey} className=\"u-nowrap\">\n                                        <span dangerouslySetInnerHTML={{ __html: t(Translation.Step.Room.RoomInfo.IncludesTaxes) }}></span>\n                                    </Text>\n                                </div>\n                            </div>\n                        </div>\n                        <div className=\"u-flex u-flex-align-center col-md-2 col-sm-3\">\n                            <BEButton wide filled primary onClick={() => confirmRateOnClick()}>\n                                {t(Translation.Step.Room.Confirm)}\n                            </BEButton>\n                        </div>\n                    </div>\n                </div>\n                <div className=\"container\" style={{ backgroundColor: Color.Snow }}>\n                    <div className=\"u-pad-top u-marg-bottom\">\n                        <div className=\"u-marg-bottom--heavy\">\n                            <Headline bold>{t(Translation.Step.Room.CheckOutOtherOptions)}</Headline>\n                        </div>\n\n                        {/* Combined Upgrades - Rate upgrades first, then Room upgrades */}\n                        <div className=\"row no-gutters\">\n                            {allUpgrades.map((rate) => {\n                                const isRateUpgrade = rate.getRoom().code === selectedRate?.getRoom().code;\n                                const key = `room-${rate.getRoom().code}-${rate.code}`;\n\n                                return (\n                                    <div className=\"col-md-6 col-xl-4 u-marg-bottom u-pad-left--light u-pad-right--light\" key={key}>\n                                        {selectedRate &&\n                                            (isRateUpgrade ? (\n                                                <LargeRateCard\n                                                    selectedRate={selectedRate}\n                                                    rate={rate}\n                                                    onSelectRate={() => confirmRateOnClick(rate)}\n                                                    startDate={row.getStartDate()}\n                                                />\n                                            ) : (\n                                                <LargeRoomCard selectedRate={selectedRate} rate={rate} onSelectRate={() => confirmRateOnClick(rate)} />\n                                            ))}\n                                    </div>\n                                );\n                            })}\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </SimpleModal>\n    ) : null;\n};\n\nexport default AvailableUpgradesModal;\n"]}

package/dist/src/components/steps/room/LargeRateCard.d.ts

@@ -0,0 +1,10 @@
+import dayjs from 'dayjs';
+import { RoomRate } from '../../../models/Room/RoomRate';
+interface Props {
+    rate: RoomRate;
+    selectedRate: RoomRate;
+    onSelectRate: () => void;
+    startDate?: dayjs.Dayjs;
+}
+declare const LargeRateCard: (props: Props) => JSX.Element;
+export default LargeRateCard;

package/dist/src/components/steps/room/LargeRateCard.js

@@ -0,0 +1,120 @@
+"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 () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __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 react_1 = __importDefault(require("react"));
+const react_i18next_1 = require("react-i18next");
+const Translation_1 = require("translations/Translation");
+const BEButton_1 = __importDefault(require("../../generic/BEButton"));
+const Currency_1 = __importDefault(require("../../generic/Currency"));
+const Headline_1 = __importDefault(require("../../generic/Headline"));
+const Text_1 = __importStar(require("../../generic/Text"));
+const ImageGallerySlider_1 = __importDefault(require("./ImageGallerySlider"));
+const RoomRate_1 = require("../../../models/Room/RoomRate");
+const Color_1 = require("../../../util/Color");
+const StringHelper_1 = __importDefault(require("../../../util/StringHelper"));
+const LargeRateCard = (props) => {
+    const { t } = (0, react_i18next_1.useTranslation)();
+    const room = props.rate.getRoom();
+    const trimmedDescription = props.rate.description || props.rate.name;
+    const updateRate = () => {
+        props.onSelectRate();
+    };
+    // Calculate the price difference
+    const ratePrice = props.rate.getAveragePrice();
+    const selectedPrice = props.selectedRate.getAveragePrice();
+    const priceDifference = ratePrice - selectedPrice;
+    // Calculate current nights from the selected rate's night rates
+    const currentNights = Object.keys(props.selectedRate.nightRates).length;
+    // Only show minimum stay upgrades if they require longer stay AND are cheaper per night
+    const minNightStay = props.rate.minNightStayOverride;
+    const isMinStayUpgrade = minNightStay && minNightStay > currentNights && ratePrice < selectedPrice;
+    // Calculate the extended checkout date for minimum stay upgrades
+    const extendedCheckoutDate = props.startDate && minNightStay ? props.startDate.add(minNightStay, 'days') : null;
+    return (react_1.default.createElement("div", { className: "upgrade-card upgrade-card--rate u-border-rounded" },
+        react_1.default.createElement("div", { className: "upgrade-card__image" },
+            react_1.default.createElement(ImageGallerySlider_1.default, { images: room.getImages() })),
+        react_1.default.createElement("div", { className: "u-pad container" },
+            react_1.default.createElement(Text_1.default, { bold: true }, room.name),
+            react_1.default.createElement("div", { className: "u-marg-top--light" },
+                react_1.default.createElement(Text_1.default, { bold: true, color: Color_1.Color.Accent }, props.rate.name),
+                react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.DarkGrey }, trimmedDescription)),
+            react_1.default.createElement("div", { className: "u-flex flex-column no-gutters u-marg-top" },
+                isMinStayUpgrade && (react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement("div", { className: "u-marg-bottom" },
+                        react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Accent }, t(Translation_1.Translation.Step.Room.Upsell.ExtendYourStay, {
+                            count: minNightStay - currentNights,
+                            nights: StringHelper_1.default.pluralWithDict(minNightStay - currentNights, Translation_1.Translation.Misc.Night, t).toLowerCase(),
+                        })),
+                        extendedCheckoutDate && (react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Accent, bold: true, className: "u-marg-top-bottom--lighter" }, t(Translation_1.Translation.Step.Room.Upsell.ExtendCheckout, {
+                            date: extendedCheckoutDate.format('MMM D, YYYY'),
+                        }))),
+                        react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.DarkGrey }, t(Translation_1.Translation.Step.Room.Upsell.MinimumStay, { minNightStay }))),
+                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Graphite }, t(Translation_1.Translation.Step.Room.Upsell.SaveWithLongerStay)),
+                    react_1.default.createElement("div", { className: "u-flex u-flex-flex-start u-flex-align-center flex-row" },
+                        react_1.default.createElement(Headline_1.default, { bold: true, color: Color_1.Color.Success },
+                            react_1.default.createElement("span", { className: "u-flex align-items-center" },
+                                react_1.default.createElement(Currency_1.default, { hideDecimals: true }, props.rate.getAveragePrice()))),
+                        react_1.default.createElement(Text_1.default, { color: Color_1.Color.DarkGrey, inline: true },
+                            "/",
+                            t(Translation_1.Translation.Misc.Night))),
+                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Success, className: "upgrade-inline-price" },
+                        react_1.default.createElement(react_i18next_1.Trans, { i18nKey: Translation_1.Translation.Step.Room.Upsell.SavePerNight, values: { amount: Math.abs(priceDifference) }, components: [
+                                react_1.default.createElement(Currency_1.default, { key: 0, hideDecimals: true }, Math.abs(priceDifference)),
+                            ] })))),
+                !isMinStayUpgrade && (react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Navy, inline: true }, t(Translation_1.Translation.Misc.From)),
+                    react_1.default.createElement("div", { className: "u-flex u-flex-flex-start u-flex-align-center flex-row" },
+                        react_1.default.createElement(Headline_1.default, { bold: true },
+                            react_1.default.createElement("span", { className: "u-flex align-items-center" },
+                                "+",
+                                react_1.default.createElement(Currency_1.default, { hideDecimals: true }, priceDifference))),
+                        react_1.default.createElement(Text_1.default, { color: Color_1.Color.DarkGrey, inline: true },
+                            "/",
+                            t(Translation_1.Translation.Misc.Night))))),
+                react_1.default.createElement("div", { className: "u-marg-bottom" },
+                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Grey, inline: true, className: "u-nowrap" },
+                        react_1.default.createElement("span", { dangerouslySetInnerHTML: {
+                                __html: props.rate.getPriceType() === RoomRate_1.RoomRatePriceInclusion.IncludingFeesAndTaxes
+                                    ? t(Translation_1.Translation.Step.Room.RoomInfo.IncludesTaxes)
+                                    : t(Translation_1.Translation.Step.Room.ExcludingTaxes),
+                            } }))),
+                react_1.default.createElement("div", { className: "u-marg-top--light u-flex justify-content-end u-w-100@m-" },
+                    react_1.default.createElement(BEButton_1.default, { onClick: updateRate, name: "UpgradeRateButton", primary: true, filled: true, wide: true }, t(Translation_1.Translation.Step.Room.Upgrade)))))));
+};
+exports.default = LargeRateCard;
+//# sourceMappingURL=LargeRateCard.js.map

package/dist/src/components/steps/room/LargeRateCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LargeRateCard.js","sourceRoot":"/","sources":["src/components/steps/room/LargeRateCard.tsx"],"names":[],"mappings":"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","sourcesContent":["import dayjs from 'dayjs';\nimport React from 'react';\nimport { Trans, useTranslation } from 'react-i18next';\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 Text, { TextType } from '@/components/generic/Text';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport { RoomRate, RoomRatePriceInclusion } from '@/models/Room/RoomRate';\nimport { Color } from '@/util/Color';\nimport StringHelper from '@/util/StringHelper';\n\ninterface Props {\n    rate: RoomRate;\n    selectedRate: RoomRate;\n    onSelectRate: () => void;\n    startDate?: dayjs.Dayjs;\n}\n\nconst LargeRateCard = (props: Props) => {\n    const { t } = useTranslation();\n\n    const room = props.rate.getRoom();\n    const trimmedDescription = props.rate.description || props.rate.name;\n\n    const updateRate = () => {\n        props.onSelectRate();\n    };\n\n    // Calculate the price difference\n    const ratePrice = props.rate.getAveragePrice();\n    const selectedPrice = props.selectedRate.getAveragePrice();\n    const priceDifference = ratePrice - selectedPrice;\n\n    // Calculate current nights from the selected rate's night rates\n    const currentNights = Object.keys(props.selectedRate.nightRates).length;\n\n    // Only show minimum stay upgrades if they require longer stay AND are cheaper per night\n    const minNightStay = props.rate.minNightStayOverride;\n    const isMinStayUpgrade = minNightStay && minNightStay > currentNights && ratePrice < selectedPrice;\n\n    // Calculate the extended checkout date for minimum stay upgrades\n    const extendedCheckoutDate = props.startDate && minNightStay ? props.startDate.add(minNightStay, 'days') : null;\n\n    return (\n        <div className=\"upgrade-card upgrade-card--rate u-border-rounded\">\n            <div className=\"upgrade-card__image\">\n                <ImageGallerySlider images={room.getImages()} />\n            </div>\n            <div className=\"u-pad container\">\n                <Text bold>{room.name}</Text>\n                <div className=\"u-marg-top--light\">\n                    <Text bold color={Color.Accent}>\n                        {props.rate.name}\n                    </Text>\n                    <Text type={TextType.Small} color={Color.DarkGrey}>\n                        {trimmedDescription}\n                    </Text>\n                </div>\n\n                <div className=\"u-flex flex-column no-gutters u-marg-top\">\n                    {isMinStayUpgrade && (\n                        <>\n                            <div className=\"u-marg-bottom\">\n                                <Text type={TextType.Small} color={Color.Accent}>\n                                    {t(Translation.Step.Room.Upsell.ExtendYourStay, {\n                                        count: minNightStay - currentNights,\n                                        nights: StringHelper.pluralWithDict(minNightStay - currentNights, Translation.Misc.Night, t).toLowerCase(),\n                                    })}\n                                </Text>\n                                {extendedCheckoutDate && (\n                                    <Text type={TextType.Small} color={Color.Accent} bold className=\"u-marg-top-bottom--lighter\">\n                                        {t(Translation.Step.Room.Upsell.ExtendCheckout, {\n                                            date: extendedCheckoutDate.format('MMM D, YYYY'),\n                                        })}\n                                    </Text>\n                                )}\n                                <Text type={TextType.Small} color={Color.DarkGrey}>\n                                    {t(Translation.Step.Room.Upsell.MinimumStay, { minNightStay })}\n                                </Text>\n                            </div>\n\n                            <Text type={TextType.Small} color={Color.Graphite}>\n                                {t(Translation.Step.Room.Upsell.SaveWithLongerStay)}\n                            </Text>\n\n                            <div className=\"u-flex u-flex-flex-start u-flex-align-center flex-row\">\n                                <Headline bold color={Color.Success}>\n                                    <span className=\"u-flex align-items-center\">\n                                        <Currency hideDecimals>{props.rate.getAveragePrice()}</Currency>\n                                    </span>\n                                </Headline>\n                                <Text color={Color.DarkGrey} inline>\n                                    /{t(Translation.Misc.Night)}\n                                </Text>\n                            </div>\n\n                            <Text type={TextType.Small} color={Color.Success} className=\"upgrade-inline-price\">\n                                <Trans\n                                    i18nKey={Translation.Step.Room.Upsell.SavePerNight}\n                                    values={{ amount: Math.abs(priceDifference) }}\n                                    components={[\n                                        <Currency key={0} hideDecimals>\n                                            {Math.abs(priceDifference)}\n                                        </Currency>,\n                                    ]}\n                                />\n                            </Text>\n                        </>\n                    )}\n\n                    {!isMinStayUpgrade && (\n                        <>\n                            <Text type={TextType.Small} color={Color.Navy} inline>\n                                {t(Translation.Misc.From)}\n                            </Text>\n                            <div className=\"u-flex u-flex-flex-start u-flex-align-center flex-row\">\n                                <Headline bold>\n                                    <span className=\"u-flex align-items-center\">\n                                        +<Currency hideDecimals>{priceDifference}</Currency>\n                                    </span>\n                                </Headline>\n                                <Text color={Color.DarkGrey} inline>\n                                    /{t(Translation.Misc.Night)}\n                                </Text>\n                            </div>\n                        </>\n                    )}\n\n                    <div className=\"u-marg-bottom\">\n                        <Text type={TextType.Small} color={Color.Grey} inline className=\"u-nowrap\">\n                            <span\n                                dangerouslySetInnerHTML={{\n                                    __html:\n                                        props.rate.getPriceType() === 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 className=\"u-marg-top--light u-flex justify-content-end u-w-100@m-\">\n                        <BEButton onClick={updateRate} name=\"UpgradeRateButton\" primary filled wide>\n                            {t(Translation.Step.Room.Upgrade)}\n                        </BEButton>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default LargeRateCard;\n"]}

package/dist/src/components/steps/room/LargeRoomCard.js

@@ -48,6 +48,7 @@ const Icon_1 = __importStar(require("../../generic/Icon/Icon"));
 const Text_1 = __importStar(require("../../generic/Text"));
 const Tooltip_1 = __importDefault(require("../../generic/Tooltip/Tooltip"));
 const ImageGallerySlider_1 = __importDefault(require("./ImageGallerySlider"));
+const RoomRate_1 = require("../../../models/Room/RoomRate");
 const Color_1 = require("../../../util/Color");
 const HotelPerkHelper_1 = require("../../../util/HotelPerkHelper");
 const ScreenSize_1 = __importDefault(require("../../../util/ScreenSize"));
@@ -91,8 +92,8 @@ const LargeRoomCard = (props) => {
             text: t(Translation_1.Translation.Step.Room.PetFriendly),
         });
     }
-    return (react_1.default.createElement("div", { className: "large-room-card u-border-rounded" },
-        react_1.default.createElement("div", { className: "large-room-card --image" },
+    return (react_1.default.createElement("div", { className: "upgrade-card upgrade-card--room u-border-rounded" },
+        react_1.default.createElement("div", { className: "upgrade-card__image" },
             react_1.default.createElement(ImageGallerySlider_1.default, { images: (_e = props.rate) === null || _e === void 0 ? void 0 : _e.getRoom().getImages() })),
         react_1.default.createElement("div", { className: "u-pad container" },
             react_1.default.createElement(Text_1.default, { bold: true }, (_f = props.rate) === null || _f === void 0 ? void 0 : _f.getRoom().name),
@@ -136,7 +137,12 @@ const LargeRoomCard = (props) => {
                         "/",
                         t(Translation_1.Translation.Misc.Night))),
                 react_1.default.createElement("div", { className: "u-marg-bottom" },
-                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Grey, inline: true, className: "u-nowrap" }, t(Translation_1.Translation.Step.Room.ExcludingTaxes))),
+                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Grey, inline: true, className: "u-nowrap" },
+                        react_1.default.createElement("span", { dangerouslySetInnerHTML: {
+                                __html: props.rate.getPriceType() === RoomRate_1.RoomRatePriceInclusion.IncludingFeesAndTaxes
+                                    ? t(Translation_1.Translation.Step.Room.RoomInfo.IncludesTaxes)
+                                    : t(Translation_1.Translation.Step.Room.ExcludingTaxes),
+                            } }))),
                 react_1.default.createElement("div", { className: "u-marg-top--light u-flex justify-content-end u-w-100@m-" },
                     react_1.default.createElement(BEButton_1.default, { onClick: updateRate, name: "ViewRatesNowButton", primary: true, filled: true, wide: true }, t(Translation_1.Translation.Step.Room.Upgrade)))))));
 };

package/dist/src/components/steps/room/LargeRoomCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"LargeRoomCard.js","sourceRoot":"/","sources":["src/components/steps/room/LargeRoomCard.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BookingEngineContext } from '@frontend/contexts';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport React, { useContext } from 'react';\nimport { useTranslation } from 'react-i18next';\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 Text, { TextType } from '@/components/generic/Text';\nimport Tooltip from '@/components/generic/Tooltip/Tooltip';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport { RoomRate } from '@/models/Room/RoomRate';\nimport { Color } from '@/util/Color';\nimport { getPerkIconElement } from '@/util/HotelPerkHelper';\nimport ScreenSize from '@/util/ScreenSize';\n\ninterface Props {\n    rate: RoomRate;\n    selectedRate: RoomRate;\n\n    onSelectRate: () => void;\n}\n\nconst LargeRoomCard = (props: Props) => {\n    const beContext = useContext(BookingEngineContext);\n    const { hotel } = useCurrentHotel();\n\n    const { t } = useTranslation();\n\n    const extraRoomData = hotel?.rooms[props.rate?.getRoom().code as string];\n    const roomSize = hotel?.overwrites?.[props.rate?.getRoom().code as string];\n    const trimmedDescription = props.rate?.getRoom().getShortDescription();\n    const petFriendly = !!extraRoomData?.petFriendly;\n\n    const room = props.rate.getRoom();\n    const { roomPerks, prePerkDisclaimer } = room.getRoomPerks({\n        hotel: hotel,\n        room: room,\n        perksLimitNumber: 4,\n    });\n\n    const updateRate = () => {\n        props.onSelectRate();\n    };\n\n    const roomInfo = [\n        {\n            icon: IconType.People,\n            text: t(Translation.Step.Room.Sleeps, {\n                maxOccupancy: extraRoomData?.maxOccupancy,\n            }),\n        },\n        {\n            icon: IconType.Bed,\n            text: extraRoomData?.bedTypeOverride ? extraRoomData?.bedTypeOverride : `${extraRoomData?.bedType} ${extraRoomData?.bedQuantity}`,\n        },\n        {\n            icon: IconType.RoomSize,\n            text: roomSize?.RoomDimensions,\n        },\n    ];\n\n    if (petFriendly) {\n        roomInfo.push({\n            icon: IconType.PetFriendly,\n            text: t(Translation.Step.Room.PetFriendly),\n        });\n    }\n\n    return (\n        <div className=\"large-room-card u-border-rounded\">\n            <div className=\"large-room-card --image\">\n                <ImageGallerySlider images={props.rate?.getRoom().getImages()} />\n            </div>\n            <div className=\"u-pad container\">\n                <Text bold>{props.rate?.getRoom().name}</Text>\n                <div className=\"u-flex u-marg-top-bottom\">\n                    {roomInfo.map((item, index) => {\n                        return (\n                            <div className=\"u-flex\" key={index}>\n                                <Icon icon={item.icon} />\n                                <Text className=\"u-marg-left--light\" type={TextType.Label}>\n                                    {item.text}\n                                </Text>\n                            </div>\n                        );\n                    })}\n                </div>\n                <div className=\"u-marg-bottom--light description\">\n                    <Text className=\"text\" type={TextType.Small}>\n                        <span dangerouslySetInnerHTML={{ __html: trimmedDescription?.replace(/<br(\\/|)>/g, '') || '' }} />\n                    </Text>\n                </div>\n\n                {prePerkDisclaimer?.replace(/<br(\\/|)>/g, '') && (\n                    <div className=\"u-marg-bottom--heavy\">\n                        <Text color={Color.Accent} type={TextType.Small}>\n                            <strong>{t(Translation.Step.Room.RoomInfo.Disclaimer)}</strong>\n                        </Text>\n                        <Text color={Color.DarkGrey} type={TextType.Small}>\n                            <span className=\"u-text-overflow-ellipsis-2\" dangerouslySetInnerHTML={{ __html: prePerkDisclaimer?.replace(/<br(\\/|)>/g, '') || '' }} />\n                        </Text>\n                    </div>\n                )}\n\n                <Text className=\"u-marg-bottom\" bold type={TextType.Label} color={Color.Accent}>\n                    {t(Translation.Step.Room.YouWillGetThisAllForFree)}\n                </Text>\n                <div className=\"u-flex u-flex-align-center row justify-content-center\">\n                    <div className=\"u-flex col-md-12 flex-wrap justify-content-start\">\n                        {roomPerks?.map((perk) => {\n                            const isAllPerksOpened = beContext.screenSize < ScreenSize.ExtraLarge;\n                            const perkIconElement = getPerkIconElement(perk, Color.Snow);\n\n                            return (\n                                <div className=\"u-flex justify-content-start u-flex-align-center u-marg-bottom u-w-48@l- u-pad-left--light u-pad-right--light\" key={perk.name}>\n                                    <Tooltip title={perk.name}>\n                                        <div>{perkIconElement}</div>\n                                    </Tooltip>\n                                    <div className={`u-marg-left u-marg-right ${isAllPerksOpened ? '' : 'u-none'}`}>\n                                        <Text type={TextType.Small}>\n                                            {perk?.perkNameRenderer\n                                                ? perk.perkNameRenderer({\n                                                      hotel,\n                                                      room,\n                                                  })\n                                                : perk.name}\n                                        </Text>\n                                    </div>\n                                </div>\n                            );\n                        })}\n                    </div>\n                </div>\n                <div className=\"u-flex flex-column no-gutters\">\n                    <Text type={TextType.Small} color={Color.Navy} inline>\n                        {t(Translation.Misc.From)}\n                    </Text>\n                    <div className=\"u-flex u-flex-flex-start u-flex-align-center flex-row\">\n                        <Headline bold>\n                            <span className=\"u-flex align-items-center\">\n                                +<Currency hideDecimals>{props.rate?.getAveragePrice() - props.selectedRate?.getAveragePrice()}</Currency>\n                            </span>\n                        </Headline>\n                        <Text color={Color.DarkGrey} inline>\n                            /{t(Translation.Misc.Night)}\n                        </Text>\n                    </div>\n                    <div className=\"u-marg-bottom\">\n                        <Text type={TextType.Small} color={Color.Grey} inline className=\"u-nowrap\">\n                            {t(Translation.Step.Room.ExcludingTaxes)}\n                        </Text>\n                    </div>\n                    <div className=\"u-marg-top--light u-flex justify-content-end u-w-100@m-\">\n                        <BEButton onClick={updateRate} name=\"ViewRatesNowButton\" primary filled wide>\n                            {t(Translation.Step.Room.Upgrade)}\n                        </BEButton>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default LargeRoomCard;\n"]}
+{"version":3,"file":"LargeRoomCard.js","sourceRoot":"/","sources":["src/components/steps/room/LargeRoomCard.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BookingEngineContext } from '@frontend/contexts';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport React, { useContext } from 'react';\nimport { useTranslation } from 'react-i18next';\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 Text, { TextType } from '@/components/generic/Text';\nimport Tooltip from '@/components/generic/Tooltip/Tooltip';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport { RoomRate, RoomRatePriceInclusion } from '@/models/Room/RoomRate';\nimport { Color } from '@/util/Color';\nimport { getPerkIconElement } from '@/util/HotelPerkHelper';\nimport ScreenSize from '@/util/ScreenSize';\n\ninterface Props {\n    rate: RoomRate;\n    selectedRate: RoomRate;\n\n    onSelectRate: () => void;\n}\n\nconst LargeRoomCard = (props: Props) => {\n    const beContext = useContext(BookingEngineContext);\n    const { hotel } = useCurrentHotel();\n\n    const { t } = useTranslation();\n\n    const extraRoomData = hotel?.rooms[props.rate?.getRoom().code as string];\n    const roomSize = hotel?.overwrites?.[props.rate?.getRoom().code as string];\n    const trimmedDescription = props.rate?.getRoom().getShortDescription();\n    const petFriendly = !!extraRoomData?.petFriendly;\n\n    const room = props.rate.getRoom();\n    const { roomPerks, prePerkDisclaimer } = room.getRoomPerks({\n        hotel: hotel,\n        room: room,\n        perksLimitNumber: 4,\n    });\n\n    const updateRate = () => {\n        props.onSelectRate();\n    };\n\n    const roomInfo = [\n        {\n            icon: IconType.People,\n            text: t(Translation.Step.Room.Sleeps, {\n                maxOccupancy: extraRoomData?.maxOccupancy,\n            }),\n        },\n        {\n            icon: IconType.Bed,\n            text: extraRoomData?.bedTypeOverride ? extraRoomData?.bedTypeOverride : `${extraRoomData?.bedType} ${extraRoomData?.bedQuantity}`,\n        },\n        {\n            icon: IconType.RoomSize,\n            text: roomSize?.RoomDimensions,\n        },\n    ];\n\n    if (petFriendly) {\n        roomInfo.push({\n            icon: IconType.PetFriendly,\n            text: t(Translation.Step.Room.PetFriendly),\n        });\n    }\n\n    return (\n        <div className=\"upgrade-card upgrade-card--room u-border-rounded\">\n            <div className=\"upgrade-card__image\">\n                <ImageGallerySlider images={props.rate?.getRoom().getImages()} />\n            </div>\n            <div className=\"u-pad container\">\n                <Text bold>{props.rate?.getRoom().name}</Text>\n                <div className=\"u-flex u-marg-top-bottom\">\n                    {roomInfo.map((item, index) => {\n                        return (\n                            <div className=\"u-flex\" key={index}>\n                                <Icon icon={item.icon} />\n                                <Text className=\"u-marg-left--light\" type={TextType.Label}>\n                                    {item.text}\n                                </Text>\n                            </div>\n                        );\n                    })}\n                </div>\n                <div className=\"u-marg-bottom--light description\">\n                    <Text className=\"text\" type={TextType.Small}>\n                        <span dangerouslySetInnerHTML={{ __html: trimmedDescription?.replace(/<br(\\/|)>/g, '') || '' }} />\n                    </Text>\n                </div>\n\n                {prePerkDisclaimer?.replace(/<br(\\/|)>/g, '') && (\n                    <div className=\"u-marg-bottom--heavy\">\n                        <Text color={Color.Accent} type={TextType.Small}>\n                            <strong>{t(Translation.Step.Room.RoomInfo.Disclaimer)}</strong>\n                        </Text>\n                        <Text color={Color.DarkGrey} type={TextType.Small}>\n                            <span className=\"u-text-overflow-ellipsis-2\" dangerouslySetInnerHTML={{ __html: prePerkDisclaimer?.replace(/<br(\\/|)>/g, '') || '' }} />\n                        </Text>\n                    </div>\n                )}\n\n                <Text className=\"u-marg-bottom\" bold type={TextType.Label} color={Color.Accent}>\n                    {t(Translation.Step.Room.YouWillGetThisAllForFree)}\n                </Text>\n                <div className=\"u-flex u-flex-align-center row justify-content-center\">\n                    <div className=\"u-flex col-md-12 flex-wrap justify-content-start\">\n                        {roomPerks?.map((perk) => {\n                            const isAllPerksOpened = beContext.screenSize < ScreenSize.ExtraLarge;\n                            const perkIconElement = getPerkIconElement(perk, Color.Snow);\n\n                            return (\n                                <div className=\"u-flex justify-content-start u-flex-align-center u-marg-bottom u-w-48@l- u-pad-left--light u-pad-right--light\" key={perk.name}>\n                                    <Tooltip title={perk.name}>\n                                        <div>{perkIconElement}</div>\n                                    </Tooltip>\n                                    <div className={`u-marg-left u-marg-right ${isAllPerksOpened ? '' : 'u-none'}`}>\n                                        <Text type={TextType.Small}>\n                                            {perk?.perkNameRenderer\n                                                ? perk.perkNameRenderer({\n                                                      hotel,\n                                                      room,\n                                                  })\n                                                : perk.name}\n                                        </Text>\n                                    </div>\n                                </div>\n                            );\n                        })}\n                    </div>\n                </div>\n                <div className=\"u-flex flex-column no-gutters\">\n                    <Text type={TextType.Small} color={Color.Navy} inline>\n                        {t(Translation.Misc.From)}\n                    </Text>\n                    <div className=\"u-flex u-flex-flex-start u-flex-align-center flex-row\">\n                        <Headline bold>\n                            <span className=\"u-flex align-items-center\">\n                                +<Currency hideDecimals>{props.rate?.getAveragePrice() - props.selectedRate?.getAveragePrice()}</Currency>\n                            </span>\n                        </Headline>\n                        <Text color={Color.DarkGrey} inline>\n                            /{t(Translation.Misc.Night)}\n                        </Text>\n                    </div>\n                    <div className=\"u-marg-bottom\">\n                        <Text type={TextType.Small} color={Color.Grey} inline className=\"u-nowrap\">\n                            <span\n                                dangerouslySetInnerHTML={{\n                                    __html:\n                                        props.rate.getPriceType() === RoomRatePriceInclusion.IncludingFeesAndTaxes\n                                            ? t(Translation.Step.Room.RoomInfo.IncludesTaxes)\n                                            : t(Translation.Step.Room.ExcludingTaxes),\n                                }}\n                            ></span>\n                        </Text>\n                    </div>\n                    <div className=\"u-marg-top--light u-flex justify-content-end u-w-100@m-\">\n                        <BEButton onClick={updateRate} name=\"ViewRatesNowButton\" primary filled wide>\n                            {t(Translation.Step.Room.Upgrade)}\n                        </BEButton>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default LargeRoomCard;\n"]}

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

@@ -1,4 +1,4 @@
-import { ReservationsDTO } from '@roomstay/core';
+import { IPaymentCheckoutDetails, ReservationsDTO } from '@roomstay/core';
 import type dayjs from 'dayjs';
 import type { Addon } from '../../models/Addon/Addon';
 import type BasketAddonRow from '../../models/BasketAddonRow';
@@ -7,7 +7,6 @@ import { ItemisedFee } from '../../models/Fee';
 import type { IPromotion } from '../../models/Promotion/IPromotion.type';
 import type { RoomRate } from '../../models/Room/RoomRate';
 import { RoomstaySession } from '../../models/RoomstaySession';
-import { IPaymentCheckoutDetails } from '@roomstay/core';
 export interface BasketContextType {
     selectedBasketRow: BasketRow;
     currentBasketRows: BasketRow[];

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 { ReservationsDTO } from '@roomstay/core';\nimport type dayjs from 'dayjs';\n\nimport type { Addon } from '@/models/Addon/Addon';\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';\nimport { IPaymentCheckoutDetails } from '@roomstay/core';\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    getTotalQuoteDeposit: () => number;\n    getDepositQuoteFees: () => number;\n    getTotalFees: () => number;\n    getItemisedFees: () => ItemisedFee[];\n    // Can be null if we don't know the pay now amount (SynXis)\n    getTotalPayNow: () => number | null;\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    additionalPaymentRequired: (data: IPaymentCheckoutDetails) => 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 { IPaymentCheckoutDetails, ReservationsDTO } from '@roomstay/core';\nimport type dayjs from 'dayjs';\n\nimport type { Addon } from '@/models/Addon/Addon';\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    getTotalQuoteDeposit: () => number;\n    getDepositQuoteFees: () => number;\n    getTotalFees: () => number;\n    getItemisedFees: () => ItemisedFee[];\n    // Can be null if we don't know the pay now amount (SynXis)\n    getTotalPayNow: () => number | null;\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    additionalPaymentRequired: (data: IPaymentCheckoutDetails) => 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/CompanyContext/CompanyContextWrapper.js

@@ -235,6 +235,8 @@ const CompanyContextWrapper = ({ configCompany: company, children }) => {
             updatedHotel.integrations = details.integrations;
             updatedHotel.availableCountries = details.availableCountries;
             updatedHotel.preventCancellation = details.preventCancellation;
+            updatedHotel.enableRoomUpsells = details.enableRoomUpsells;
+            updatedHotel.enableRateUpsells = details.enableRateUpsells;
             if (updatedHotel.dataSource === HotelDataSource_types_1.HotelDataSource.Roomstay) {
                 if (details.logo) {
                     updatedHotel.logo = details.logo;