@roomstay/frontend 2.6.68 → 2.6.70

package/dist/src/components/steps/confirmation/MastercardPaymentMethod.js

@@ -0,0 +1,75 @@
+"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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MastercardPaymentMethod = void 0;
+const react_1 = __importStar(require("react"));
+const contexts_1 = require("../../../contexts");
+const MastercardPaymentMethod = () => {
+    var _a, _b;
+    const basketContext = (0, react_1.useContext)(contexts_1.BasketContext);
+    const mastercardCheckoutResponse = (_b = (_a = basketContext.reservationData) === null || _a === void 0 ? void 0 : _a.payment) === null || _b === void 0 ? void 0 : _b.mastercard;
+    (0, react_1.useEffect)(() => {
+        if (!(mastercardCheckoutResponse === null || mastercardCheckoutResponse === void 0 ? void 0 : mastercardCheckoutResponse.sessionId))
+            return;
+        const existingScript = document.getElementById('mastercard-checkout-script');
+        if (existingScript) {
+            existingScript.remove();
+            window.Checkout = undefined;
+        }
+        sessionStorage.removeItem('HostedCheckout_sessionId');
+        sessionStorage.removeItem('HostedCheckout_merchantState');
+        sessionStorage.removeItem('HostedCheckout_embedContainer');
+        /**
+         * These callbacks are not used if the `returnUrl` is specified during the initiation of the checkout in the backend.
+         */
+        window.mastercardError = () => { };
+        window.mastercardCancel = () => { };
+        window.mastercardComplete = () => { };
+        const script = document.createElement('script');
+        script.id = 'mastercard-checkout-script';
+        script.src = `${mastercardCheckoutResponse.baseUrl}/static/checkout/checkout.min.js`;
+        script.dataset.error = 'mastercardError';
+        script.dataset.cancel = 'mastercardCancel';
+        script.dataset.complete = 'mastercardComplete';
+        script.onload = () => {
+            if (window.Checkout) {
+                window.Checkout.configure({ session: { id: mastercardCheckoutResponse.sessionId } });
+                if (mastercardCheckoutResponse.paymentMode === 'PaymentPage') {
+                    window.Checkout.showPaymentPage();
+                }
+                else if (mastercardCheckoutResponse.paymentMode === 'EmbeddedPage') {
+                    window.Checkout.showEmbeddedPage('#mastercard-payment-container');
+                }
+            }
+            else {
+                console.error('Mastercard Checkout SDK failed!');
+            }
+        };
+        document.head.appendChild(script);
+    }, [mastercardCheckoutResponse === null || mastercardCheckoutResponse === void 0 ? void 0 : mastercardCheckoutResponse.sessionId]);
+    return react_1.default.createElement("div", { id: "mastercard-payment-container" });
+};
+exports.MastercardPaymentMethod = MastercardPaymentMethod;
+//# sourceMappingURL=MastercardPaymentMethod.js.map

package/dist/src/components/steps/confirmation/MastercardPaymentMethod.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MastercardPaymentMethod.js","sourceRoot":"/","sources":["src/components/steps/confirmation/MastercardPaymentMethod.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAyD;AAEzD,yCAA2C;AAqBpC,MAAM,uBAAuB,GAAO,GAAG,EAAE;;IAC5C,MAAM,aAAa,GAAG,IAAA,kBAAU,EAAC,wBAAa,CAAC,CAAC;IAEhD,MAAM,0BAA0B,GAAG,MAAA,MAAA,aAAa,CAAC,eAAe,0CAAE,OAAO,0CAAE,UAAU,CAAC;IAEtF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,CAAC,CAAA,0BAA0B,aAA1B,0BAA0B,uBAA1B,0BAA0B,CAAE,SAAS,CAAA;YAAE,OAAO;QAEnD,MAAM,cAAc,GAAG,QAAQ,CAAC,cAAc,CAAC,4BAA4B,CAAC,CAAC;QAE7E,IAAI,cAAc,EAAE;YAChB,cAAc,CAAC,MAAM,EAAE,CAAC;YACxB,MAAM,CAAC,QAAQ,GAAG,SAAS,CAAC;SAC/B;QAED,cAAc,CAAC,UAAU,CAAC,0BAA0B,CAAC,CAAC;QACtD,cAAc,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC;QAC1D,cAAc,CAAC,UAAU,CAAC,+BAA+B,CAAC,CAAC;QAE3D;;WAEG;QACH,MAAM,CAAC,eAAe,GAAG,GAAG,EAAE,GAAE,CAAC,CAAC;QAClC,MAAM,CAAC,gBAAgB,GAAG,GAAG,EAAE,GAAE,CAAC,CAAC;QACnC,MAAM,CAAC,kBAAkB,GAAG,GAAG,EAAE,GAAE,CAAC,CAAC;QAErC,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;QAChD,MAAM,CAAC,EAAE,GAAG,4BAA4B,CAAC;QACzC,MAAM,CAAC,GAAG,GAAG,GAAG,0BAA0B,CAAC,OAAO,kCAAkC,CAAC;QACrF,MAAM,CAAC,OAAO,CAAC,KAAK,GAAG,iBAAiB,CAAC;QACzC,MAAM,CAAC,OAAO,CAAC,MAAM,GAAG,kBAAkB,CAAC;QAC3C,MAAM,CAAC,OAAO,CAAC,QAAQ,GAAG,oBAAoB,CAAC;QAE/C,MAAM,CAAC,MAAM,GAAG,GAAG,EAAE;YACjB,IAAI,MAAM,CAAC,QAAQ,EAAE;gBACjB,MAAM,CAAC,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,EAAE,0BAA0B,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC;gBAErF,IAAI,0BAA0B,CAAC,WAAW,KAAK,aAAa,EAAE;oBAC1D,MAAM,CAAC,QAAQ,CAAC,eAAe,EAAE,CAAC;iBACrC;qBAAM,IAAI,0BAA0B,CAAC,WAAW,KAAK,cAAc,EAAE;oBAClE,MAAM,CAAC,QAAQ,CAAC,gBAAgB,CAAC,+BAA+B,CAAC,CAAC;iBACrE;aACJ;iBAAM;gBACH,OAAO,CAAC,KAAK,CAAC,iCAAiC,CAAC,CAAC;aACpD;QACL,CAAC,CAAC;QAEF,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;IACtC,CAAC,EAAE,CAAC,0BAA0B,aAA1B,0BAA0B,uBAA1B,0BAA0B,CAAE,SAAS,CAAC,CAAC,CAAC;IAE5C,OAAO,uCAAK,EAAE,EAAC,8BAA8B,GAAG,CAAC;AACrD,CAAC,CAAC;AAnDW,QAAA,uBAAuB,2BAmDlC","sourcesContent":["import React, { FC, useContext, useEffect } from 'react';\n\nimport { BasketContext } from '@/contexts';\n\ndeclare global {\n    interface Window {\n        Checkout?: {\n            configure(opts: { session: { id: string } }): void;\n            showPaymentPage(): void;\n            showEmbeddedPage(div: string): void;\n        };\n        mastercardError: (error: {\n            explanation: string;\n            field: string;\n            result: string;\n            validationType: string;\n            cause: 'INVALID_REQUEST' | 'SERVER_BUSY' | 'SERVER_FAILED' | 'CONSTRAINT_VIOLATION' | 'REQUEST_REJECTED';\n        }) => void;\n        mastercardCancel: () => void;\n        mastercardComplete: (response: { resultIndicator: string; sessionVersion: string }) => void;\n    }\n}\n\nexport const MastercardPaymentMethod: FC = () => {\n    const basketContext = useContext(BasketContext);\n\n    const mastercardCheckoutResponse = basketContext.reservationData?.payment?.mastercard;\n\n    useEffect(() => {\n        if (!mastercardCheckoutResponse?.sessionId) return;\n\n        const existingScript = document.getElementById('mastercard-checkout-script');\n\n        if (existingScript) {\n            existingScript.remove();\n            window.Checkout = undefined;\n        }\n\n        sessionStorage.removeItem('HostedCheckout_sessionId');\n        sessionStorage.removeItem('HostedCheckout_merchantState');\n        sessionStorage.removeItem('HostedCheckout_embedContainer');\n\n        /**\n         * These callbacks are not used if the `returnUrl` is specified during the initiation of the checkout in the backend.\n         */\n        window.mastercardError = () => {};\n        window.mastercardCancel = () => {};\n        window.mastercardComplete = () => {};\n\n        const script = document.createElement('script');\n        script.id = 'mastercard-checkout-script';\n        script.src = `${mastercardCheckoutResponse.baseUrl}/static/checkout/checkout.min.js`;\n        script.dataset.error = 'mastercardError';\n        script.dataset.cancel = 'mastercardCancel';\n        script.dataset.complete = 'mastercardComplete';\n\n        script.onload = () => {\n            if (window.Checkout) {\n                window.Checkout.configure({ session: { id: mastercardCheckoutResponse.sessionId } });\n\n                if (mastercardCheckoutResponse.paymentMode === 'PaymentPage') {\n                    window.Checkout.showPaymentPage();\n                } else if (mastercardCheckoutResponse.paymentMode === 'EmbeddedPage') {\n                    window.Checkout.showEmbeddedPage('#mastercard-payment-container');\n                }\n            } else {\n                console.error('Mastercard Checkout SDK failed!');\n            }\n        };\n\n        document.head.appendChild(script);\n    }, [mastercardCheckoutResponse?.sessionId]);\n\n    return <div id=\"mastercard-payment-container\" />;\n};\n"]}

package/dist/src/components/steps/confirmation/StepConfirmationPoliciesSection.js

@@ -30,6 +30,7 @@ const hooks_1 = require("../../../hooks/index.js");
 const react_1 = __importDefault(require("react"));
 const react_i18next_1 = require("react-i18next");
 const Translation_1 = require("translations/Translation");
+const GroupedCheckInOutTimes_1 = require("../../generic/GroupedCheckInOutTimes/GroupedCheckInOutTimes");
 const Headline_1 = __importDefault(require("../../generic/Headline"));
 const Text_1 = __importStar(require("../../generic/Text"));
 function StepConfirmationPoliciesSection() {
@@ -39,21 +40,9 @@ function StepConfirmationPoliciesSection() {
         react_1.default.createElement("div", { className: "u-marg-bottom" },
             react_1.default.createElement(Headline_1.default, { bold: true }, t(Translation_1.Translation.Step.Confirmation.Policies))),
         react_1.default.createElement("div", { className: "u-marg-bottom step-confirmation-policies-section" },
-            react_1.default.createElement("div", { className: "row" },
-                react_1.default.createElement("div", { className: "col-6 col-md-3" },
-                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
-                        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 col-md-3" },
-                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
-                        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", colClassName: "col-6 col-md-3", CheckInRender: () => (react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
+                    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 },
+                    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) }))));
 }
 exports.default = StepConfirmationPoliciesSection;
 //# sourceMappingURL=StepConfirmationPoliciesSection.js.map

package/dist/src/components/steps/confirmation/StepConfirmationPoliciesSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepConfirmationPoliciesSection.js","sourceRoot":"/","sources":["src/components/steps/confirmation/StepConfirmationPoliciesSection.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAAkD;AAClD,kDAA0B;AAC1B,iDAA+C;AAC/C,0DAAuD;AAEvD,6EAAqD;AACrD,kEAA2D;AAE3D,SAAwB,+BAA+B;IACnD,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,uBAAe,GAAE,CAAC;IAEpC,OAAO,CACH;QACI,uCAAK,SAAS,EAAC,eAAe;YAC1B,8BAAC,kBAAQ,IAAC,IAAI,UAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAY,CACnE;QACN,uCAAK,SAAS,EAAC,kDAAkD;YAC7D,uCAAK,SAAS,EAAC,KAAK;gBAChB,uCAAK,SAAS,EAAC,gBAAgB;oBAC3B,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;wBACtB,8CAAS,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAU,CAC3C;oBACP,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;wBACrB,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,KAAK,CAAC;6BAAG,KAAK,aAAL,KAAK;wBAAL,KAAK,CAAE,WAAW,CAC5C,CACL;gBACN,uCAAK,SAAS,EAAC,gBAAgB;oBAC3B,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;wBACtB,8CAAS,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAU,CAC5C;oBACP,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;wBACrB,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,MAAM,CAAC;6BAAG,KAAK,aAAL,KAAK;wBAAL,KAAK,CAAE,YAAY,CAC9C,CACL,CACJ,CACJ,CACP,CACN,CAAC;AACN,CAAC;AA/BD,kDA+BC","sourcesContent":["import { useCurrentHotel } from '@frontend/hooks';\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport Headline from '@/components/generic/Headline';\nimport Text, { TextType } from '@/components/generic/Text';\n\nexport default function StepConfirmationPoliciesSection() {\n    const { t } = useTranslation();\n    const { hotel } = useCurrentHotel();\n\n    return (\n        <>\n            <div className=\"u-marg-bottom\">\n                <Headline bold>{t(Translation.Step.Confirmation.Policies)}</Headline>\n            </div>\n            <div className=\"u-marg-bottom step-confirmation-policies-section\">\n                <div className=\"row\">\n                    <div className=\"col-6 col-md-3\">\n                        <Text type={TextType.Small}>\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 col-md-3\">\n                        <Text type={TextType.Small}>\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            </div>\n        </>\n    );\n}\n"]}
+{"version":3,"file":"StepConfirmationPoliciesSection.js","sourceRoot":"/","sources":["src/components/steps/confirmation/StepConfirmationPoliciesSection.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAAkD;AAClD,kDAA0B;AAC1B,iDAA+C;AAC/C,0DAAuD;AAEvD,+GAA4G;AAC5G,6EAAqD;AACrD,kEAA2D;AAE3D,SAAwB,+BAA+B;IACnD,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,uBAAe,GAAE,CAAC;IAEpC,OAAO,CACH;QACI,uCAAK,SAAS,EAAC,eAAe;YAC1B,8BAAC,kBAAQ,IAAC,IAAI,UAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAY,CACnE;QAEN,uCAAK,SAAS,EAAC,kDAAkD;YAC7D,8BAAC,+CAAsB,IACnB,KAAK,EAAE,KAAK,EACZ,gBAAgB,EAAC,KAAK,EACtB,YAAY,EAAC,gBAAgB,EAC7B,aAAa,EAAE,GAAG,EAAE,CAAC,CACjB,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;oBACtB,8CAAS,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAU,CAC3C,CACV,EACD,cAAc,EAAE,GAAG,EAAE,CAAC,CAClB,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;oBACtB,8CAAS,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAU,CAC5C,CACV,EACD,UAAU,EAAE,CAAC,EAAE,IAAI,EAAoB,EAAE,EAAE,CAAC,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,IAAG,IAAI,CAAQ,GACvF,CACA,CACP,CACN,CAAC;AACN,CAAC;AA9BD,kDA8BC","sourcesContent":["import { useCurrentHotel } from '@frontend/hooks';\nimport React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport { GroupedCheckInOutTimes } from '@/components/generic/GroupedCheckInOutTimes/GroupedCheckInOutTimes';\nimport Headline from '@/components/generic/Headline';\nimport Text, { TextType } from '@/components/generic/Text';\n\nexport default function StepConfirmationPoliciesSection() {\n    const { t } = useTranslation();\n    const { hotel } = useCurrentHotel();\n\n    return (\n        <>\n            <div className=\"u-marg-bottom\">\n                <Headline bold>{t(Translation.Step.Confirmation.Policies)}</Headline>\n            </div>\n\n            <div className=\"u-marg-bottom step-confirmation-policies-section\">\n                <GroupedCheckInOutTimes\n                    hotel={hotel}\n                    wrapperClassName=\"row\"\n                    colClassName=\"col-6 col-md-3\"\n                    CheckInRender={() => (\n                        <Text type={TextType.Small}>\n                            <strong>{t(Translation.Misc.CheckIn)}</strong>\n                        </Text>\n                    )}\n                    CheckOutRender={() => (\n                        <Text type={TextType.Small}>\n                            <strong>{t(Translation.Misc.CheckOut)}</strong>\n                        </Text>\n                    )}\n                    LineRender={({ line }: { line: string }) => <Text type={TextType.Small}>{line}</Text>}\n                />\n            </div>\n        </>\n    );\n}\n"]}

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\n                // TODO: RE-2211 - Look to refactor globally how we're loading the quote details to account for all other changes.\n                // This is a workaround to force the quote details to be reloaded\n                if (hotel?.requireDeposit) {\n                    basketContext.quoteOrPencilReservation(() => true);\n                }\n\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 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\n                // TODO: RE-2211 - Look to refactor globally how we're loading the quote details to account for all other changes.\n                // This is a workaround to force the quote details to be reloaded\n                if (hotel?.requireDeposit) {\n                    basketContext.quoteOrPencilReservation(() => true);\n                }\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"]}

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

@@ -43,6 +43,7 @@ const StepRoomErrorForm_1 = require("./StepRoomErrorForm");
 function RoomList() {
     const basketContext = (0, react_1.useContext)(contexts_1.BasketContext);
     const beContext = (0, react_1.useContext)(contexts_1.BookingEngineContext);
+    const { orderUnavailableRoomsLast } = (0, react_1.useContext)(contexts_1.HotelOverridesContext);
     const { hotel } = (0, hooks_1.useCurrentHotel)();
     const { rooms, loadingAttempted, isLoading, openRoom, apiHasError, retargetingRoom } = (0, RoomRateAvailabilityListFromApi_1.useRoomRateAvailabilityListFromApi)();
     const roomListRef = (0, react_1.useRef)(null);
@@ -69,10 +70,24 @@ function RoomList() {
     }, []);
     return (0, react_1.useMemo)(() => {
         var _a;
-        const sortedRooms = [...rooms];
+        let sortedRooms = [...rooms];
         if (sortedRooms.length !== 0) {
             sortedRooms.sort(RoomSortProvider_1.default.getSortByFunction(sortBy));
         }
+        if (hotel === null || hotel === void 0 ? void 0 : hotel.showUnavailableRooms) {
+            if (orderUnavailableRoomsLast) {
+                sortedRooms.sort((a, b) => {
+                    if (a.isAvailable() && !b.isAvailable())
+                        return -1;
+                    if (!a.isAvailable() && b.isAvailable())
+                        return 1;
+                    return 0;
+                });
+            }
+        }
+        else {
+            sortedRooms = sortedRooms.filter((r) => r.isAvailable());
+        }
         if (!basketContext.isDatePickerOpen && !isLoading && sortedRooms.length > 0) {
             if (timeoutRef.current) {
                 clearTimeout(timeoutRef.current);
@@ -88,7 +103,7 @@ function RoomList() {
         return (react_1.default.createElement(react_1.default.Fragment, null,
             react_1.default.createElement(RoomListAlert_1.RoomListAlert, null, !isLoading && retargetingRoom ? react_1.default.createElement(RoomDetailsRetargeting_1.RoomDetailsRetargeting, { key: retargetingRoom.code, room: retargetingRoom }) : null),
             elements));
-    }, [rooms, isLoading, loadingAttempted, openRoom, sortBy, beContext.currentFilters, basketContext.loadedPromotion, basketContext.isDatePickerOpen]);
+    }, [rooms, isLoading, loadingAttempted, openRoom, sortBy, beContext.currentFilters, basketContext.loadedPromotion, basketContext.isDatePickerOpen, orderUnavailableRoomsLast]);
 }
 exports.default = RoomList;
 //# sourceMappingURL=RoomList.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"RoomList.js","sourceRoot":"/","sources":["src/components/steps/room/RoomList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BasketContext, BookingEngineContext } from '@frontend/contexts';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport React, { useContext, useEffect, useMemo, useRef } from 'react';\n\nimport LargeLoader from '@/components/generic/loader/LargeLoader';\nimport RoomDetails from '@/components/steps/room/roomDetails/RoomDetails';\nimport RoomListCrossSellBlock from '@/components/steps/room/RoomListCrossSellBlock';\nimport { useRoomRateAvailabilityListFromApi } from '@/hooks/RoomRateAvailabilityListFromApi';\nimport { Room } from '@/models/Room/Room';\nimport RoomSortProvider from '@/providers/RoomSortProvider';\nimport DataLayer from '@/util/DataLayer';\nimport ScreenSize from '@/util/ScreenSize';\n\nimport NoRoomsFoundBlock from './NoRoomsFoundBlock';\nimport { RoomDetailsRetargeting } from './roomDetails/RoomDetailsRetargeting';\nimport { RoomListAlert } from './RoomListAlert';\nimport { StepRoomErrorForm } from './StepRoomErrorForm';\n\nexport default function RoomList() {\n    const basketContext = useContext(BasketContext);\n    const beContext = useContext(BookingEngineContext);\n\n    const { hotel } = useCurrentHotel();\n    const { rooms, loadingAttempted, isLoading, openRoom, apiHasError, retargetingRoom } = useRoomRateAvailabilityListFromApi();\n    const roomListRef = useRef<HTMLDivElement | null>(null);\n    const timeoutRef = useRef<NodeJS.Timeout | null>(null);\n\n    const sortBy = beContext.currentRoomSort;\n    let listWhenLastScrolled: Room[] | null = null;\n\n    const scrollIntoView = () => {\n        if (roomListRef.current && listWhenLastScrolled !== rooms) {\n            listWhenLastScrolled = rooms;\n            const offset = beContext.screenSize <= ScreenSize.Medium ? 185 : 350;\n\n            window.scrollTo({\n                top: window.scrollY + (roomListRef.current.getBoundingClientRect().top - offset),\n                behavior: 'smooth',\n            });\n        }\n    };\n\n    useEffect(() => {\n        return () => {\n            // Clear timeout on unmount or before next effect\n            if (timeoutRef.current) {\n                clearTimeout(timeoutRef.current);\n            }\n        };\n    }, []);\n\n    return useMemo(() => {\n        const sortedRooms = [...rooms];\n        if (sortedRooms.length !== 0) {\n            sortedRooms.sort(RoomSortProvider.getSortByFunction(sortBy));\n        }\n\n        if (!basketContext.isDatePickerOpen && !isLoading && sortedRooms.length > 0) {\n            if (timeoutRef.current) {\n                clearTimeout(timeoutRef.current);\n            }\n\n            timeoutRef.current = setTimeout(() => {\n                scrollIntoView();\n            }, 100);\n        }\n\n        const elements = (\n            <div ref={roomListRef}>\n                {isLoading || !loadingAttempted ? (\n                    <LargeLoader />\n                ) : sortedRooms.length ? (\n                    sortedRooms.map((room, index) => <RoomDetails key={room.code} room={room} disableMarginBottom={index === sortedRooms.length - 1} />)\n                ) : (\n                    <>\n                        {apiHasError ? <StepRoomErrorForm /> : <NoRoomsFoundBlock />}\n                        {hotel?.crossSellHotelIds?.map((hotelId) => (\n                            <RoomListCrossSellBlock key={hotelId} hotelId={hotelId} />\n                        ))}\n                    </>\n                )}\n            </div>\n        );\n\n        DataLayer.instance.sendRoomImpressions();\n\n        return (\n            <>\n                <RoomListAlert>{!isLoading && retargetingRoom ? <RoomDetailsRetargeting key={retargetingRoom.code} room={retargetingRoom} /> : null}</RoomListAlert>\n                {elements}\n            </>\n        );\n    }, [rooms, isLoading, loadingAttempted, openRoom, sortBy, beContext.currentFilters, basketContext.loadedPromotion, basketContext.isDatePickerOpen]);\n}\n"]}
+{"version":3,"file":"RoomList.js","sourceRoot":"/","sources":["src/components/steps/room/RoomList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BasketContext, BookingEngineContext, HotelOverridesContext } from '@frontend/contexts';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport React, { useContext, useEffect, useMemo, useRef } from 'react';\n\nimport LargeLoader from '@/components/generic/loader/LargeLoader';\nimport RoomDetails from '@/components/steps/room/roomDetails/RoomDetails';\nimport RoomListCrossSellBlock from '@/components/steps/room/RoomListCrossSellBlock';\nimport { useRoomRateAvailabilityListFromApi } from '@/hooks/RoomRateAvailabilityListFromApi';\nimport { Room } from '@/models/Room/Room';\nimport RoomSortProvider from '@/providers/RoomSortProvider';\nimport DataLayer from '@/util/DataLayer';\nimport ScreenSize from '@/util/ScreenSize';\n\nimport NoRoomsFoundBlock from './NoRoomsFoundBlock';\nimport { RoomDetailsRetargeting } from './roomDetails/RoomDetailsRetargeting';\nimport { RoomListAlert } from './RoomListAlert';\nimport { StepRoomErrorForm } from './StepRoomErrorForm';\n\nexport default function RoomList() {\n    const basketContext = useContext(BasketContext);\n    const beContext = useContext(BookingEngineContext);\n    const { orderUnavailableRoomsLast } = useContext(HotelOverridesContext);\n\n    const { hotel } = useCurrentHotel();\n    const { rooms, loadingAttempted, isLoading, openRoom, apiHasError, retargetingRoom } = useRoomRateAvailabilityListFromApi();\n    const roomListRef = useRef<HTMLDivElement | null>(null);\n    const timeoutRef = useRef<NodeJS.Timeout | null>(null);\n\n    const sortBy = beContext.currentRoomSort;\n    let listWhenLastScrolled: Room[] | null = null;\n\n    const scrollIntoView = () => {\n        if (roomListRef.current && listWhenLastScrolled !== rooms) {\n            listWhenLastScrolled = rooms;\n            const offset = beContext.screenSize <= ScreenSize.Medium ? 185 : 350;\n\n            window.scrollTo({\n                top: window.scrollY + (roomListRef.current.getBoundingClientRect().top - offset),\n                behavior: 'smooth',\n            });\n        }\n    };\n\n    useEffect(() => {\n        return () => {\n            // Clear timeout on unmount or before next effect\n            if (timeoutRef.current) {\n                clearTimeout(timeoutRef.current);\n            }\n        };\n    }, []);\n\n    return useMemo(() => {\n        let sortedRooms = [...rooms];\n        if (sortedRooms.length !== 0) {\n            sortedRooms.sort(RoomSortProvider.getSortByFunction(sortBy));\n        }\n\n        if (hotel?.showUnavailableRooms) {\n            if (orderUnavailableRoomsLast) {\n                sortedRooms.sort((a, b) => {\n                    if (a.isAvailable() && !b.isAvailable()) return -1;\n                    if (!a.isAvailable() && b.isAvailable()) return 1;\n                    return 0;\n                });\n            }\n        } else {\n            sortedRooms = sortedRooms.filter((r) => r.isAvailable());\n        }\n\n        if (!basketContext.isDatePickerOpen && !isLoading && sortedRooms.length > 0) {\n            if (timeoutRef.current) {\n                clearTimeout(timeoutRef.current);\n            }\n\n            timeoutRef.current = setTimeout(() => {\n                scrollIntoView();\n            }, 100);\n        }\n\n        const elements = (\n            <div ref={roomListRef}>\n                {isLoading || !loadingAttempted ? (\n                    <LargeLoader />\n                ) : sortedRooms.length ? (\n                    sortedRooms.map((room, index) => <RoomDetails key={room.code} room={room} disableMarginBottom={index === sortedRooms.length - 1} />)\n                ) : (\n                    <>\n                        {apiHasError ? <StepRoomErrorForm /> : <NoRoomsFoundBlock />}\n                        {hotel?.crossSellHotelIds?.map((hotelId) => (\n                            <RoomListCrossSellBlock key={hotelId} hotelId={hotelId} />\n                        ))}\n                    </>\n                )}\n            </div>\n        );\n\n        DataLayer.instance.sendRoomImpressions();\n\n        return (\n            <>\n                <RoomListAlert>{!isLoading && retargetingRoom ? <RoomDetailsRetargeting key={retargetingRoom.code} room={retargetingRoom} /> : null}</RoomListAlert>\n                {elements}\n            </>\n        );\n    }, [rooms, isLoading, loadingAttempted, openRoom, sortBy, beContext.currentFilters, basketContext.loadedPromotion, basketContext.isDatePickerOpen, orderUnavailableRoomsLast]);\n}\n"]}

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

@@ -31,6 +31,7 @@ const hooks_1 = require("../../../hooks/index.js");
 const react_1 = __importStar(require("react"));
 const react_i18next_1 = require("react-i18next");
 const Translation_1 = require("translations/Translation");
+const GroupedCheckInOutTimes_1 = require("../../generic/GroupedCheckInOutTimes/GroupedCheckInOutTimes");
 const Headline_1 = __importDefault(require("../../generic/Headline"));
 const Text_1 = __importStar(require("../../generic/Text"));
 const Color_1 = require("../../../util/Color");
@@ -47,21 +48,9 @@ function StepRoomHotelDetails() {
                 t(Translation_1.Translation.Misc.By),
                 " ",
                 ccx.name))),
-        react_1.default.createElement("div", { className: "row" },
-            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", 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) })));
 }
 exports.default = StepRoomHotelDetails;
 //# sourceMappingURL=StepRoomHotelDetails.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"StepRoomHotelDetails.js","sourceRoot":"/","sources":["src/components/steps/room/StepRoomHotelDetails.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,iDAA2E;AAC3E,2CAAkD;AAClD,+CAA0C;AAC1C,iDAA+C;AAC/C,0DAAuD;AAEvD,6EAAqD;AACrD,kEAA2D;AAC3D,wCAAqC;AAErC,SAAwB,oBAAoB;IACxC,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,uBAAe,GAAE,CAAC;IACpC,MAAM,GAAG,GAAG,IAAA,kBAAU,EAAC,yBAAc,CAAC,CAAC;IACvC,MAAM,SAAS,GAAG,IAAA,kBAAU,EAAC,gCAAqB,CAAC,CAAC;IAEpD,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,UAAU,GAAG,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,UAAU,MAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,UAAU,CAAA,CAAC;IAE9D,OAAO,CACH;QACI,uCAAK,SAAS,EAAC,oCAAoC;YAC/C,8BAAC,kBAAQ,IAAC,SAAS,EAAC,YAAY,EAAC,KAAK,EAAE,aAAK,CAAC,IAAI,IAC7C,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,CACL;YAEV,CAAC,UAAU,IAAI,CACZ,8BAAC,cAAI,IAAC,SAAS,EAAC,cAAc,EAAC,KAAK,EAAE,aAAK,CAAC,QAAQ;gBAC/C,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,EAAE,CAAC;;gBAAG,GAAG,CAAC,IAAI,CAC/B,CACV,CACC;QACN,uCAAK,SAAS,EAAC,KAAK;YAChB,uCAAK,SAAS,EAAC,OAAO;gBAClB,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,IAAI;oBACzC,8CAAS,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAU,CAC3C;gBACP,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;oBACrB,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,KAAK,CAAC;yBAAG,KAAK,aAAL,KAAK;oBAAL,KAAK,CAAE,WAAW,CAC5C,CACL;YACN,uCAAK,SAAS,EAAC,OAAO;gBAClB,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,IAAI;oBACzC,8CAAS,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAU,CAC5C;gBACP,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;oBACrB,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,MAAM,CAAC;yBAAG,KAAK,aAAL,KAAK;oBAAL,KAAK,CAAE,YAAY,CAC9C,CACL,CACJ,CACP,CACN,CAAC;AACN,CAAC;AA1CD,uCA0CC","sourcesContent":["import { CompanyContext, HotelOverridesContext } 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 Headline from '@/components/generic/Headline';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { Color } from '@/util/Color';\n\nexport default function StepRoomHotelDetails() {\n    const { hotel } = useCurrentHotel();\n    const ccx = useContext(CompanyContext);\n    const overrides = useContext(HotelOverridesContext);\n\n    const { t } = useTranslation();\n\n    const hideByLine = overrides?.hideByLine || hotel?.hideByLine;\n\n    return (\n        <>\n            <div className=\"u-marg-bottom step-date-hotel-info\">\n                <Headline className=\"hotel-name\" color={Color.Navy}>\n                    {hotel?.name}\n                </Headline>\n\n                {!hideByLine && (\n                    <Text className=\"company-name\" color={Color.DarkGrey}>\n                        {t(Translation.Misc.By)} {ccx.name}\n                    </Text>\n                )}\n            </div>\n            <div className=\"row\">\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    );\n}\n"]}
+{"version":3,"file":"StepRoomHotelDetails.js","sourceRoot":"/","sources":["src/components/steps/room/StepRoomHotelDetails.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,iDAA2E;AAC3E,2CAAkD;AAClD,+CAA0C;AAC1C,iDAA+C;AAC/C,0DAAuD;AAEvD,+GAA4G;AAC5G,6EAAqD;AACrD,kEAA2D;AAC3D,wCAAqC;AAErC,SAAwB,oBAAoB;IACxC,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,uBAAe,GAAE,CAAC;IACpC,MAAM,GAAG,GAAG,IAAA,kBAAU,EAAC,yBAAc,CAAC,CAAC;IACvC,MAAM,SAAS,GAAG,IAAA,kBAAU,EAAC,gCAAqB,CAAC,CAAC;IAEpD,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,UAAU,GAAG,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,UAAU,MAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,UAAU,CAAA,CAAC;IAE9D,OAAO,CACH;QACI,uCAAK,SAAS,EAAC,oCAAoC;YAC/C,8BAAC,kBAAQ,IAAC,SAAS,EAAC,YAAY,EAAC,KAAK,EAAE,aAAK,CAAC,IAAI,IAC7C,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,CACL;YAEV,CAAC,UAAU,IAAI,CACZ,8BAAC,cAAI,IAAC,SAAS,EAAC,cAAc,EAAC,KAAK,EAAE,aAAK,CAAC,QAAQ;gBAC/C,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,EAAE,CAAC;;gBAAG,GAAG,CAAC,IAAI,CAC/B,CACV,CACC;QACN,8BAAC,+CAAsB,IACnB,KAAK,EAAE,KAAK,EACZ,gBAAgB,EAAC,KAAK,EACtB,YAAY,EAAC,OAAO,EACpB,aAAa,EAAE,GAAG,EAAE,CAAC,CACjB,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,IAAI;gBACzC,8CAAS,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAU,CAC3C,CACV,EACD,cAAc,EAAE,GAAG,EAAE,CAAC,CAClB,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,IAAI;gBACzC,8CAAS,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAU,CAC5C,CACV,EACD,UAAU,EAAE,CAAC,EAAE,IAAI,EAAoB,EAAE,EAAE,CAAC,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,IAAG,IAAI,CAAQ,GACvF,CACH,CACN,CAAC;AACN,CAAC;AAxCD,uCAwCC","sourcesContent":["import { CompanyContext, HotelOverridesContext } 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 { GroupedCheckInOutTimes } from '@/components/generic/GroupedCheckInOutTimes/GroupedCheckInOutTimes';\nimport Headline from '@/components/generic/Headline';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { Color } from '@/util/Color';\n\nexport default function StepRoomHotelDetails() {\n    const { hotel } = useCurrentHotel();\n    const ccx = useContext(CompanyContext);\n    const overrides = useContext(HotelOverridesContext);\n\n    const { t } = useTranslation();\n\n    const hideByLine = overrides?.hideByLine || hotel?.hideByLine;\n\n    return (\n        <>\n            <div className=\"u-marg-bottom step-date-hotel-info\">\n                <Headline className=\"hotel-name\" color={Color.Navy}>\n                    {hotel?.name}\n                </Headline>\n\n                {!hideByLine && (\n                    <Text className=\"company-name\" color={Color.DarkGrey}>\n                        {t(Translation.Misc.By)} {ccx.name}\n                    </Text>\n                )}\n            </div>\n            <GroupedCheckInOutTimes\n                hotel={hotel}\n                wrapperClassName=\"row\"\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    );\n}\n"]}

package/dist/src/components/steps/room/TabGroupedRooms/TabGroupedRoomList.js

@@ -31,11 +31,14 @@ const contexts_1 = require("../../../../contexts/index.js");
 const react_1 = __importStar(require("react"));
 const Headline_1 = __importDefault(require("../../../generic/Headline"));
 const Select_1 = require("../../../generic/Select/Select");
+const hooks_1 = require("../../../../hooks");
 const RoomSortProvider_1 = __importDefault(require("../../../../providers/RoomSortProvider"));
 const RoomDetails_1 = __importDefault(require("../roomDetails/RoomDetails"));
 const TabGroupedRoomList_module_scss_1 = __importDefault(require("./TabGroupedRoomList.module.scss"));
 const TabGroupedRoomList = (props) => {
     const beContext = (0, react_1.useContext)(contexts_1.BookingEngineContext);
+    const { orderUnavailableRoomsLast } = (0, react_1.useContext)(contexts_1.HotelOverridesContext);
+    const { hotel } = (0, hooks_1.useCurrentHotel)();
     const sortBy = beContext.currentRoomSort;
     const { rooms, group } = props;
     const [appliedFilters, setAppliedFilters] = (0, react_1.useState)({});
@@ -43,10 +46,24 @@ const TabGroupedRoomList = (props) => {
         return Object.keys(group.filters || {});
     }, [group.filters]);
     const roomList = (0, react_1.useMemo)(() => {
-        const sortedRooms = [...rooms];
+        let sortedRooms = [...rooms];
         if (sortedRooms.length !== 0) {
             sortedRooms.sort(RoomSortProvider_1.default.getSortByFunction(sortBy));
         }
+        if (hotel === null || hotel === void 0 ? void 0 : hotel.showUnavailableRooms) {
+            if (orderUnavailableRoomsLast) {
+                sortedRooms.sort((a, b) => {
+                    if (a.isAvailable() && !b.isAvailable())
+                        return -1;
+                    if (!a.isAvailable() && b.isAvailable())
+                        return 1;
+                    return 0;
+                });
+            }
+        }
+        else {
+            sortedRooms = sortedRooms.filter((r) => r.isAvailable());
+        }
         return sortedRooms
             .filter((room) => {
             var _a;
@@ -60,7 +77,7 @@ const TabGroupedRoomList = (props) => {
             .map((room, index) => {
             return react_1.default.createElement(RoomDetails_1.default, { key: room.code, room: room, disableMarginBottom: index === rooms.length - 1 });
         });
-    }, [rooms, appliedFilters, sortBy]);
+    }, [rooms, appliedFilters, sortBy, orderUnavailableRoomsLast]);
     return (react_1.default.createElement("div", { className: TabGroupedRoomList_module_scss_1.default.groupedRoomList },
         !!group.groupName && (react_1.default.createElement("div", { className: TabGroupedRoomList_module_scss_1.default.groupedRoomListHeader },
             react_1.default.createElement(Headline_1.default, { bold: true }, group.groupName))),

package/dist/src/components/steps/room/TabGroupedRooms/TabGroupedRoomList.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabGroupedRoomList.js","sourceRoot":"/","sources":["src/components/steps/room/TabGroupedRooms/TabGroupedRoomList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BookingEngineContext } from '@frontend/contexts';\nimport React, { useContext, useMemo, useState } from 'react';\n\nimport Headline from '@/components/generic/Headline';\nimport { Select } from '@/components/generic/Select/Select';\nimport { HotelRoomGroupsDTO } from '@/models/Api/HotelDTO';\nimport { Room } from '@/models/Room/Room';\nimport RoomSortProvider from '@/providers/RoomSortProvider';\n\nimport RoomDetails from '../roomDetails/RoomDetails';\nimport styles from './TabGroupedRoomList.module.scss';\n\ntype TabGroupedRoomListProps = {\n    rooms: Room[];\n    group: HotelRoomGroupsDTO[number];\n};\n\nexport const TabGroupedRoomList = (props: TabGroupedRoomListProps) => {\n    const beContext = useContext(BookingEngineContext);\n\n    const sortBy = beContext.currentRoomSort;\n    const { rooms, group } = props;\n    const [appliedFilters, setAppliedFilters] = useState<{ [id: string]: any }>({});\n\n    const filterKeys = useMemo(() => {\n        return Object.keys(group.filters || {});\n    }, [group.filters]);\n\n    const roomList = useMemo(() => {\n        const sortedRooms = [...rooms];\n        if (sortedRooms.length !== 0) {\n            sortedRooms.sort(RoomSortProvider.getSortByFunction(sortBy));\n        }\n        return sortedRooms\n            .filter((room) => {\n                for (const filter of Object.keys(appliedFilters)) {\n                    if (room.auxiliaryValues?.[filter] && appliedFilters[filter] && !room.auxiliaryValues[filter].includes(`${appliedFilters[filter]}`)) {\n                        return false;\n                    }\n                }\n\n                return room;\n            })\n            .map((room, index) => {\n                return <RoomDetails key={room.code} room={room} disableMarginBottom={index === rooms.length - 1} />;\n            });\n    }, [rooms, appliedFilters, sortBy]);\n\n    return (\n        <div className={styles.groupedRoomList}>\n            {!!group.groupName && (\n                <div className={styles.groupedRoomListHeader}>\n                    <Headline bold>{group.groupName}</Headline>\n                </div>\n            )}\n\n            {!!filterKeys?.length && rooms.length > 1 && (\n                <div className={styles.filterContainer}>\n                    {filterKeys.map((filterKey) => {\n                        const filter = group.filters?.[filterKey];\n\n                        if (filter.type === 'select') {\n                            const options = [{ label: 'All', value: null }, ...filter.options];\n                            const currentValue = appliedFilters?.[filterKey] ?? (options[0] as any)?.value;\n\n                            const localOnFilterChange = (value: string) => {\n                                setAppliedFilters((prev) => {\n                                    const filter = { ...prev, [filterKey]: value };\n\n                                    beContext.setCurrentGroupedRoomFilters(filter);\n\n                                    return filter;\n                                });\n                            };\n\n                            return (\n                                <div key={filterKey} className={styles.filterItem}>\n                                    <div className={styles['filterItem-label']}>{filter.name}:</div>\n                                    <Select keyName=\"value\" labelName=\"label\" options={options as any} value={currentValue} onChange={localOnFilterChange}></Select>\n                                </div>\n                            );\n                        }\n                    })}\n                </div>\n            )}\n            {roomList}\n        </div>\n    );\n};\n"]}
+{"version":3,"file":"TabGroupedRoomList.js","sourceRoot":"/","sources":["src/components/steps/room/TabGroupedRooms/TabGroupedRoomList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BookingEngineContext, HotelOverridesContext } from '@frontend/contexts';\nimport React, { useContext, useMemo, useState } from 'react';\n\nimport Headline from '@/components/generic/Headline';\nimport { Select } from '@/components/generic/Select/Select';\nimport { useCurrentHotel } from '@/hooks';\nimport { HotelRoomGroupsDTO } from '@/models/Api/HotelDTO';\nimport { Room } from '@/models/Room/Room';\nimport RoomSortProvider from '@/providers/RoomSortProvider';\n\nimport RoomDetails from '../roomDetails/RoomDetails';\nimport styles from './TabGroupedRoomList.module.scss';\n\ntype TabGroupedRoomListProps = {\n    rooms: Room[];\n    group: HotelRoomGroupsDTO[number];\n};\n\nexport const TabGroupedRoomList = (props: TabGroupedRoomListProps) => {\n    const beContext = useContext(BookingEngineContext);\n    const { orderUnavailableRoomsLast } = useContext(HotelOverridesContext);\n    const { hotel } = useCurrentHotel();\n\n    const sortBy = beContext.currentRoomSort;\n    const { rooms, group } = props;\n    const [appliedFilters, setAppliedFilters] = useState<{ [id: string]: any }>({});\n\n    const filterKeys = useMemo(() => {\n        return Object.keys(group.filters || {});\n    }, [group.filters]);\n\n    const roomList = useMemo(() => {\n        let sortedRooms = [...rooms];\n        if (sortedRooms.length !== 0) {\n            sortedRooms.sort(RoomSortProvider.getSortByFunction(sortBy));\n        }\n\n        if (hotel?.showUnavailableRooms) {\n            if (orderUnavailableRoomsLast) {\n                sortedRooms.sort((a, b) => {\n                    if (a.isAvailable() && !b.isAvailable()) return -1;\n                    if (!a.isAvailable() && b.isAvailable()) return 1;\n                    return 0;\n                });\n            }\n        } else {\n            sortedRooms = sortedRooms.filter((r) => r.isAvailable());\n        }\n\n        return sortedRooms\n            .filter((room) => {\n                for (const filter of Object.keys(appliedFilters)) {\n                    if (room.auxiliaryValues?.[filter] && appliedFilters[filter] && !room.auxiliaryValues[filter].includes(`${appliedFilters[filter]}`)) {\n                        return false;\n                    }\n                }\n\n                return room;\n            })\n            .map((room, index) => {\n                return <RoomDetails key={room.code} room={room} disableMarginBottom={index === rooms.length - 1} />;\n            });\n    }, [rooms, appliedFilters, sortBy, orderUnavailableRoomsLast]);\n\n    return (\n        <div className={styles.groupedRoomList}>\n            {!!group.groupName && (\n                <div className={styles.groupedRoomListHeader}>\n                    <Headline bold>{group.groupName}</Headline>\n                </div>\n            )}\n\n            {!!filterKeys?.length && rooms.length > 1 && (\n                <div className={styles.filterContainer}>\n                    {filterKeys.map((filterKey) => {\n                        const filter = group.filters?.[filterKey];\n\n                        if (filter.type === 'select') {\n                            const options = [{ label: 'All', value: null }, ...filter.options];\n                            const currentValue = appliedFilters?.[filterKey] ?? (options[0] as any)?.value;\n\n                            const localOnFilterChange = (value: string) => {\n                                setAppliedFilters((prev) => {\n                                    const filter = { ...prev, [filterKey]: value };\n\n                                    beContext.setCurrentGroupedRoomFilters(filter);\n\n                                    return filter;\n                                });\n                            };\n\n                            return (\n                                <div key={filterKey} className={styles.filterItem}>\n                                    <div className={styles['filterItem-label']}>{filter.name}:</div>\n                                    <Select keyName=\"value\" labelName=\"label\" options={options as any} value={currentValue} onChange={localOnFilterChange}></Select>\n                                </div>\n                            );\n                        }\n                    })}\n                </div>\n            )}\n            {roomList}\n        </div>\n    );\n};\n"]}

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

@@ -44,6 +44,7 @@ const RoomDetailsBedsBlock_1 = require("./RoomDetailsBedsBlock");
 const RoomDetailsPerkBlock_1 = require("./RoomDetailsPerkBlock");
 const RoomRatePills_1 = __importDefault(require("./roomRates/RoomRatePills"));
 const RoomRates_1 = __importDefault(require("./roomRates/RoomRates"));
+const UnavailableRoom_1 = __importDefault(require("./unavailableRoom/UnavailableRoom"));
 const RoomModal_1 = __importDefault(require("../RoomModal"));
 const Currency_2 = __importDefault(require("../../../../hooks/Currency"));
 const Planpay_1 = __importDefault(require("../../../../hooks/Planpay"));
@@ -58,9 +59,10 @@ const DataLayer_1 = __importStar(require("../../../../util/DataLayer"));
 const ScreenSize_1 = __importDefault(require("../../../../util/ScreenSize"));
 const TextAlignment_1 = require("../../../../util/TextAlignment");
 function RoomDetails(props) {
+    const { room } = props;
     const [featuredRates, setFeaturedRates] = (0, react_1.useState)([]);
     const [standardRates, setStandardRates] = (0, react_1.useState)([]);
-    const [viewingRates, setViewingRates] = (0, react_1.useState)(null);
+    const [viewingRates, setViewingRates] = (0, react_1.useState)(!room.isAvailable());
     const [viewingDescription, setViewingDescription] = (0, react_1.useState)(false);
     const { t } = (0, react_i18next_1.useTranslation)();
     const context = (0, react_1.useContext)(contexts_1.BookingEngineContext);
@@ -68,7 +70,6 @@ function RoomDetails(props) {
     const ccx = (0, react_1.useContext)(contexts_1.CompanyContext);
     const { hotel } = (0, hooks_1.useCurrentHotel)();
     const hotelOverridesContext = (0, react_1.useContext)(contexts_1.HotelOverridesContext);
-    const { room } = props;
     const classes = (0, classnames_1.default)('room-details', {
         ['+is-open']: viewingRates,
     });
@@ -168,7 +169,7 @@ function RoomDetails(props) {
                                 react_1.default.createElement("span", { dangerouslySetInnerHTML: { __html: props.room.getLongDescription() || '' } }))))),
                     react_1.default.createElement("div", { className: "col-md-6 u-flex u-marg-bottom@m- flex-column align-items-start" },
                         react_1.default.createElement(BEButton_1.default, { icon: Icon_1.IconType.ArrowRight2, isText: true, primary: true, size: "tiny", iconPosition: "right", onClick: moreDetailsOnClick }, t(Translation_1.Translation.Step.Room.RoomInfo.MoreDetails))),
-                    react_1.default.createElement("div", { className: "col-md-6 u-flex justify-content-end flex-column align-items-start align-items-md-end" },
+                    room.isAvailable() && (react_1.default.createElement("div", { className: "col-md-6 u-flex justify-content-end flex-column align-items-start align-items-md-end" },
                         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: "room-details--content-price flex-row align-items-end" },
                             react_1.default.createElement(Headline_1.default, { size: currencySize, bold: true },
@@ -181,13 +182,12 @@ function RoomDetails(props) {
                                     __html: room.getLowestPriceType() === 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-flex-direction-column u-flex u-flex-align-flex-end u-flex-align-flex-start@m- u-w-100@m-" },
                     !isLoading && hasPricePreview ? (react_1.default.createElement("div", { className: "u-marg-top--light" },
                         react_1.default.createElement(PlanpayPrice_1.PlanpayPrice, { price: price, checkin: ((selectedRow === null || selectedRow === void 0 ? void 0 : selectedRow.getStartDate()) || basketContext.endDate).format('YYYY-MM-DD'), currency: ccx.currentCurrency }))) : null,
                     react_1.default.createElement(BEButton_1.default, { className: "u-marg-top--light", name: "ViewRatesNowButton", primary: true, primaryActive: !!ratesOpen, filled: true, stopIconAnimation: true, icon: ratesOpen ? Icon_1.IconType.ArrowUp2 : Icon_1.IconType.ArrowDown2, iconPosition: "right", onClick: sendRoomClickOnClick, wide: context.screenSize <= ScreenSize_1.default.Large, textColor: (0, Color_1.getContrastTextColor)(ratesOpen ? hotel === null || hotel === void 0 ? void 0 : hotel.colors.accent3 : hotel === null || hotel === void 0 ? void 0 : hotel.colors.accent) }, ratesOpen ? t(Translation_1.Translation.Step.Room.RoomInfo.CloseRates) : t(Translation_1.Translation.Step.Room.RoomInfo.ViewRates))))),
-        react_1.default.createElement(AutoAutoHeight_1.default, { open: !!ratesOpen },
-            react_1.default.createElement(RoomRates_1.default, { roomCode: room.code, rates: standardRates, featuredRates: featuredRates })),
+        react_1.default.createElement(AutoAutoHeight_1.default, { open: !!ratesOpen }, room.isAvailable() ? react_1.default.createElement(RoomRates_1.default, { roomCode: room.code, rates: standardRates, featuredRates: featuredRates }) : react_1.default.createElement(UnavailableRoom_1.default, { room: room })),
         react_1.default.createElement(RoomModal_1.default, { open: viewingDescription, room: props.room, rates: standardRates, featuredRates: featuredRates, onClose: closeDescriptionOnClose }),
         room.getRates().map((rate) => {
             return (react_1.default.createElement("script", { key: room.code + '-' + rate.code, type: "application/ld+json" }, JSON.stringify({