@roomstay/frontend 2.1.6 → 2.1.8

package/dist/src/components/reservation/EmptyReservation.js

@@ -0,0 +1,52 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const RoomstayThemeEngine_1 = __importDefault(require("../../providers/RoomstayThemeEngine"));
+const Text_1 = __importStar(require("../generic/Text"));
+const react_i18next_1 = require("react-i18next");
+const Color_1 = require("../../util/Color");
+const Headline_1 = __importDefault(require("../generic/Headline"));
+const contexts_1 = require("../../contexts");
+const ScreenSize_1 = __importDefault(require("../../util/ScreenSize"));
+const EmptyReservation = ({ isCancelled }) => {
+    const { t } = (0, react_i18next_1.useTranslation)();
+    const context = (0, react_1.useContext)(contexts_1.BookingEngineContext);
+    const isMobile = context.screenSize <= ScreenSize_1.default.Medium;
+    const mainText = t(isCancelled ? 'Reservation.YourReservationPage.EmptyCancelledStays' : 'Reservation.YourReservationPage.EmptyStays');
+    const subText = t(isCancelled ? 'Reservation.YourReservationPage.EmptyCancelledDescriptionStays' : 'Reservation.YourReservationPage.EmptyStaysDescription');
+    return (react_1.default.createElement("div", { className: "u-flex u-flex-direction-column u-align-center" },
+        react_1.default.createElement("div", null,
+            react_1.default.createElement("img", { style: {
+                    maxWidth: isMobile ? 345 : 322,
+                }, src: RoomstayThemeEngine_1.default.getImageAssetUrl('/account/account-home-empty-graphic.svg'), alt: "" })),
+        react_1.default.createElement(Headline_1.default, { size: !isMobile ? 'large' : undefined, bold: true, color: Color_1.Color.Navy, className: "u-marg-top--heavy" }, mainText),
+        react_1.default.createElement(Text_1.default, { type: isMobile ? Text_1.TextType.Small : undefined, color: Color_1.Color.Navy, className: "u-marg-top" }, subText)));
+};
+exports.default = EmptyReservation;
+//# sourceMappingURL=EmptyReservation.js.map

package/dist/src/components/reservation/EmptyReservation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyReservation.js","sourceRoot":"/","sources":["src/components/reservation/EmptyReservation.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA8C;AAC9C,0FAAkE;AAClE,kEAA2D;AAC3D,iDAA+C;AAC/C,wCAAqC;AACrC,6EAAqD;AACrD,yCAAkD;AAClD,mEAA2C;AAM3C,MAAM,gBAAgB,GAA8B,CAAC,EAAE,WAAW,EAAE,EAAE,EAAE;IACpE,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,+BAAoB,CAAC,CAAC;IACjD,MAAM,QAAQ,GAAG,OAAO,CAAC,UAAU,IAAI,oBAAU,CAAC,MAAM,CAAC;IAEzD,MAAM,QAAQ,GAAG,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,qDAAqD,CAAC,CAAC,CAAC,4CAA4C,CAAC,CAAC;IACvI,MAAM,OAAO,GAAG,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,gEAAgE,CAAC,CAAC,CAAC,uDAAuD,CAAC,CAAC;IAC5J,OAAO,CACH,uCAAK,SAAS,EAAC,+CAA+C;QAC1D;YACI,uCACI,KAAK,EAAE;oBACH,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG;iBACjC,EACD,GAAG,EAAE,6BAAmB,CAAC,gBAAgB,CAAC,yCAAyC,CAAC,EACpF,GAAG,EAAC,EAAE,GACR,CACA;QACN,8BAAC,kBAAQ,IAAC,IAAI,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,EAAE,IAAI,QAAC,KAAK,EAAE,aAAK,CAAC,IAAI,EAAE,SAAS,EAAC,mBAAmB,IACjG,QAAQ,CACF;QACX,8BAAC,cAAI,IAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,eAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,EAAE,KAAK,EAAE,aAAK,CAAC,IAAI,EAAE,SAAS,EAAC,YAAY,IACvF,OAAO,CACL,CACL,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,gBAAgB,CAAC","sourcesContent":["import React, { FC, useContext } from 'react';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { useTranslation } from 'react-i18next';\nimport { Color } from '@/util/Color';\nimport Headline from '@/components/generic/Headline';\nimport { BookingEngineContext } from '@/contexts';\nimport ScreenSize from '@/util/ScreenSize';\n\nexport interface EmptyReservationProps {\n    isCancelled?: boolean;\n}\n\nconst EmptyReservation: FC<EmptyReservationProps> = ({ isCancelled }) => {\n    const { t } = useTranslation();\n    const context = useContext(BookingEngineContext);\n    const isMobile = context.screenSize <= ScreenSize.Medium;\n\n    const mainText = t(isCancelled ? 'Reservation.YourReservationPage.EmptyCancelledStays' : 'Reservation.YourReservationPage.EmptyStays');\n    const subText = t(isCancelled ? 'Reservation.YourReservationPage.EmptyCancelledDescriptionStays' : 'Reservation.YourReservationPage.EmptyStaysDescription');\n    return (\n        <div className=\"u-flex u-flex-direction-column u-align-center\">\n            <div>\n                <img\n                    style={{\n                        maxWidth: isMobile ? 345 : 322,\n                    }}\n                    src={RoomstayThemeEngine.getImageAssetUrl('/account/account-home-empty-graphic.svg')}\n                    alt=\"\"\n                />\n            </div>\n            <Headline size={!isMobile ? 'large' : undefined} bold color={Color.Navy} className=\"u-marg-top--heavy\">\n                {mainText}\n            </Headline>\n            <Text type={isMobile ? TextType.Small : undefined} color={Color.Navy} className=\"u-marg-top\">\n                {subText}\n            </Text>\n        </div>\n    );\n};\n\nexport default EmptyReservation;\n"]}

package/dist/src/components/reservation/ReservationItem.js

@@ -39,8 +39,8 @@ const dayjs_1 = __importDefault(require("dayjs"));
 const CurrentHotelHook_1 = require("../../hooks/CurrentHotelHook");
 const AccountRoutes_1 = require("../../pages/account/AccountRoutes");
 const ImageProvider_1 = require("../../providers/ImageProvider");
-const React = __importStar(require("react"));
-const react_1 = require("react");
+const react_1 = __importDefault(require("react"));
+const react_2 = require("react");
 const react_i18next_1 = require("react-i18next");
 const react_router_dom_1 = require("react-router-dom");
 const Translation_1 = require("translations/Translation");
@@ -61,7 +61,7 @@ const ReservationItem = (props) => {
     var _a, _b, _c, _d;
     const { itineraryItem, disableMarginBottom, actions = defaultActions, showCancelledNotifications = false } = props;
     const { t } = (0, react_i18next_1.useTranslation)();
-    const context = (0, react_1.useContext)(contexts_1.BookingEngineContext);
+    const context = (0, react_2.useContext)(contexts_1.BookingEngineContext);
     const { hotel } = (0, CurrentHotelHook_1.useCurrentHotel)();
     const isMobile = context.screenSize <= ScreenSize_1.default.Large;
     const nameSize = isMobile ? 'normal' : 'large';
@@ -94,78 +94,78 @@ const ReservationItem = (props) => {
         }
         switch (action) {
             case ReservationAction.Modify:
-                return (React.createElement(BEButton_1.default, Object.assign({}, defaultButtonProps, { icon: Icon_1.IconType.ArrowRight, iconPosition: "right", onClick: onActionClick }), t(Translation_1.Translation.Reservation.ModifyThisRoom)));
+                return (react_1.default.createElement(BEButton_1.default, Object.assign({}, defaultButtonProps, { icon: Icon_1.IconType.ArrowRight, iconPosition: "right", onClick: onActionClick }), t(Translation_1.Translation.Reservation.ModifyThisRoom)));
             case ReservationAction.Cancel:
-                return (React.createElement(BEButton_1.default, Object.assign({}, defaultButtonProps, { danger: true, onClick: onActionClick, disabled: !itineraryItem.isCancellable }), t(Translation_1.Translation.Reservation.CancelReservation)));
+                return (react_1.default.createElement(BEButton_1.default, Object.assign({}, defaultButtonProps, { danger: true, onClick: onActionClick, disabled: !itineraryItem.isCancellable }), t(Translation_1.Translation.Reservation.CancelReservation)));
             case ReservationAction.BookAgain:
-                return (React.createElement(react_router_dom_1.Link, { to: StepManager_1.default.getFirstStep().getStepUrl() },
-                    React.createElement(BEButton_1.default, Object.assign({}, defaultButtonProps, { icon: Icon_1.IconType.ArrowRight, iconPosition: "right", onClick: onActionClick }), t(Translation_1.Translation.Reservation.BookAgain))));
+                return (react_1.default.createElement(react_router_dom_1.Link, { to: StepManager_1.default.getFirstStep().getStepUrl() },
+                    react_1.default.createElement(BEButton_1.default, Object.assign({}, defaultButtonProps, { icon: Icon_1.IconType.ArrowRight, iconPosition: "right", onClick: onActionClick }), t(Translation_1.Translation.Reservation.BookAgain))));
             case ReservationAction.MoreDetails:
-                return (React.createElement(react_router_dom_1.Link, { to: `${AccountRoutes_1.AccountRoutes.SingleReservation.path}${itineraryItem.bookingId}/item` },
-                    React.createElement(BEButton_1.default, Object.assign({}, defaultButtonProps, { primary: true, filled: true, icon: Icon_1.IconType.ArrowRight, iconPosition: "right" }), t(Translation_1.Translation.Reservation.MoreDetails))));
+                return (react_1.default.createElement(react_router_dom_1.Link, { to: `${AccountRoutes_1.AccountRoutes.SingleReservation.path}${itineraryItem.bookingId}/item` },
+                    react_1.default.createElement(BEButton_1.default, Object.assign({}, defaultButtonProps, { primary: true, filled: true, icon: Icon_1.IconType.ArrowRight, iconPosition: "right" }), t(Translation_1.Translation.Reservation.MoreDetails))));
         }
     });
     if (!itineraryItem) {
-        return React.createElement(React.Fragment, null);
+        return react_1.default.createElement(react_1.default.Fragment, null);
     }
     const itineraryItemNights = Object.keys(itineraryItem.nights);
     const checkInDate = (0, dayjs_1.default)(itineraryItem.checkInDate);
     const checkOutDate = (0, dayjs_1.default)(itineraryItem.checkOutDate);
-    const reservationOccupancy = itineraryItem.adults + itineraryItem.children;
+    const reservationOccupancy = itineraryItem.adults + ((itineraryItem === null || itineraryItem === void 0 ? void 0 : itineraryItem.children) || 0);
     const cancelled = itineraryItem.status === core_1.IBookingStatus.Cancelled;
-    return (React.createElement(React.Fragment, null,
-        showCancelledNotifications && cancelled && (React.createElement("div", { className: ReservationItem_module_scss_1.default['cancelledNotification'] },
-            React.createElement("div", { className: ReservationItem_module_scss_1.default['cancelledNotification-icon'] },
-                React.createElement(Icon_1.default, { icon: Icon_1.IconType.Error, size: '44px', color: Color_1.Color.Danger })),
-            React.createElement("div", null,
-                React.createElement(Text_1.default, { type: Text_1.TextType.Small, bold: true, color: Color_1.Color.Danger, className: ReservationItem_module_scss_1.default['cancelledNotification-title'] }, "This room is cancelled!"),
-                React.createElement(Text_1.default, { type: Text_1.TextType.Small },
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        showCancelledNotifications && cancelled && (react_1.default.createElement("div", { className: ReservationItem_module_scss_1.default['cancelledNotification'] },
+            react_1.default.createElement("div", { className: ReservationItem_module_scss_1.default['cancelledNotification-icon'] },
+                react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Error, size: "44px", color: Color_1.Color.Danger })),
+            react_1.default.createElement("div", null,
+                react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, bold: true, color: Color_1.Color.Danger, className: ReservationItem_module_scss_1.default['cancelledNotification-title'] }, "This room is cancelled!"),
+                react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
                     "This room has been cancelled, please",
                     ' ',
-                    React.createElement("span", { style: { color: Color_1.Color.Accent } },
-                        React.createElement(react_router_dom_1.Link, { to: AccountRoutes_1.AccountRoutes.Help.path }, "get in touch")),
+                    react_1.default.createElement("span", { style: { color: Color_1.Color.Accent } },
+                        react_1.default.createElement(react_router_dom_1.Link, { to: AccountRoutes_1.AccountRoutes.Help.path }, "get in touch")),
                     ' ',
                     "if you find this to be a mistake")))),
-        React.createElement("div", { className: (0, classnames_1.default)('reservation-item-container', { 'u-marg-bottom--heavy u-marg-bottom@m-': !disableMarginBottom }) },
-            React.createElement("div", { className: "reservation-item" },
-                React.createElement("div", { className: (0, classnames_1.default)('reservation-item--image u-border-rounded u-print-none', { 'reservation-item--disabled': cancelled }) },
-                    React.createElement(ImageGallerySlider_1.default, { images: itineraryItem.images, imageSize: ImageProvider_1.ImageSize.Medium }),
-                    React.createElement("div", { className: "reservation-item--floating-date" },
-                        React.createElement(Headline_1.default, { size: 'extra-large', color: cancelled ? Color_1.Color.DarkGrey : Color_1.Color.White, align: TextAlignment_1.TextAlign.Center }, checkInDate.format('DD')),
-                        React.createElement(Text_1.default, { type: Text_1.TextType.Small, color: cancelled ? Color_1.Color.DarkGrey : Color_1.Color.White, bold: true }, checkInDate.format('MMM YYYY')))),
-                React.createElement("div", { className: "reservation-item--content u-pad--heavy u-pad-left-none@m- u-pad-right-none@m- u-pad-bottom-none@m- u-print-pad-left-none" },
-                    React.createElement("div", { className: "reservation-item--content-title u-marg-bottom--light" },
-                        React.createElement(Headline_1.default, { bold: true, size: nameSize }, itineraryItem.roomName)),
-                    React.createElement("div", { className: "text-body u-marg-bottom" }, ((_b = (_a = itineraryItem === null || itineraryItem === void 0 ? void 0 : itineraryItem.profile) === null || _a === void 0 ? void 0 : _a.firstName) !== null && _b !== void 0 ? _b : '') + ' ' + ((_d = (_c = itineraryItem === null || itineraryItem === void 0 ? void 0 : itineraryItem.profile) === null || _c === void 0 ? void 0 : _c.lastName) !== null && _d !== void 0 ? _d : '')),
-                    React.createElement("div", { className: "reservation-item--info u-marg-bottom--heavy" },
-                        React.createElement("div", { className: "u-flex u-flex-gap--light" },
-                            React.createElement("div", { className: "u-flex u-flex-nowrap u-flex-gap--light" },
-                                React.createElement(Icon_1.default, { icon: Icon_1.IconType.Calendar, color: Color_1.Color.Grey }),
-                                React.createElement(Text_1.default, { type: Text_1.TextType.Small }, checkInDate.format('D MMM, YYYY'))),
-                            React.createElement("div", { className: "u-flex u-flex-nowrap u-flex-gap--light" },
-                                React.createElement(Icon_1.default, { icon: Icon_1.IconType.ArrowRight2, color: Color_1.Color.Grey }),
-                                React.createElement(Text_1.default, { type: Text_1.TextType.Small }, checkOutDate.format('D MMM, YYYY')))),
-                        React.createElement("div", { className: "u-flex u-flex-gap" },
-                            React.createElement("div", { className: "u-flex u-flex-nowrap u-flex-gap--light" },
-                                React.createElement(Icon_1.default, { icon: Icon_1.IconType.LateCheckout, color: Color_1.Color.Grey }),
-                                React.createElement(Text_1.default, { type: Text_1.TextType.Small }, `${itineraryItemNights.length} night${itineraryItemNights.length > 1 ? 's' : ''}`)),
-                            React.createElement("div", { className: "u-flex u-flex-nowrap u-flex-gap--light" },
-                                React.createElement(Icon_1.default, { icon: Icon_1.IconType.Person, color: Color_1.Color.Grey }),
-                                React.createElement(Text_1.default, { type: Text_1.TextType.Small }, `${reservationOccupancy} guest${reservationOccupancy > 1 ? 's' : ''}`)))),
-                    React.createElement("div", { className: "reservation-item--checkin-checkout u-flex justify-content-start u-pad u-border-rounded" },
-                        React.createElement("div", { className: "u-marg-right--heavy" },
-                            React.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.DarkGrey, className: "u-marg-bottom--light" }, t(Translation_1.Translation.Misc.CheckIn)),
-                            React.createElement(CheckinCheckoutComponent, null,
+        react_1.default.createElement("div", { className: (0, classnames_1.default)('reservation-item-container', { 'u-marg-bottom--heavy u-marg-bottom@m-': !disableMarginBottom }) },
+            react_1.default.createElement("div", { className: "reservation-item" },
+                react_1.default.createElement("div", { className: (0, classnames_1.default)('reservation-item--image u-border-rounded u-print-none', { 'reservation-item--disabled': cancelled }) },
+                    react_1.default.createElement(ImageGallerySlider_1.default, { images: itineraryItem.images, imageSize: ImageProvider_1.ImageSize.Medium }),
+                    react_1.default.createElement("div", { className: "reservation-item--floating-date" },
+                        react_1.default.createElement(Headline_1.default, { size: "extra-large", color: cancelled ? Color_1.Color.DarkGrey : Color_1.Color.White, align: TextAlignment_1.TextAlign.Center }, checkInDate.format('DD')),
+                        react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: cancelled ? Color_1.Color.DarkGrey : Color_1.Color.White, bold: true }, checkInDate.format('MMM YYYY')))),
+                react_1.default.createElement("div", { className: "reservation-item--content u-pad--heavy u-pad-left-none@m- u-pad-right-none@m- u-pad-bottom-none@m- u-print-pad-left-none" },
+                    react_1.default.createElement("div", { className: "reservation-item--content-title u-marg-bottom--light" },
+                        react_1.default.createElement(Headline_1.default, { bold: true, size: nameSize }, itineraryItem.roomName)),
+                    react_1.default.createElement("div", { className: "text-body u-marg-bottom" }, ((_b = (_a = itineraryItem === null || itineraryItem === void 0 ? void 0 : itineraryItem.profile) === null || _a === void 0 ? void 0 : _a.firstName) !== null && _b !== void 0 ? _b : '') + ' ' + ((_d = (_c = itineraryItem === null || itineraryItem === void 0 ? void 0 : itineraryItem.profile) === null || _c === void 0 ? void 0 : _c.lastName) !== null && _d !== void 0 ? _d : '')),
+                    react_1.default.createElement("div", { className: "reservation-item--info u-marg-bottom--heavy" },
+                        react_1.default.createElement("div", { className: "u-flex u-flex-gap--light" },
+                            react_1.default.createElement("div", { className: "u-flex u-flex-nowrap u-flex-gap--light" },
+                                react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Calendar, color: Color_1.Color.Grey }),
+                                react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small }, checkInDate.format('D MMM, YYYY'))),
+                            react_1.default.createElement("div", { className: "u-flex u-flex-nowrap u-flex-gap--light" },
+                                react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.ArrowRight2, color: Color_1.Color.Grey }),
+                                react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small }, checkOutDate.format('D MMM, YYYY')))),
+                        react_1.default.createElement("div", { className: "u-flex u-flex-gap" },
+                            react_1.default.createElement("div", { className: "u-flex u-flex-nowrap u-flex-gap--light" },
+                                react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.LateCheckout, color: Color_1.Color.Grey }),
+                                react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small }, `${itineraryItemNights.length} night${itineraryItemNights.length > 1 ? 's' : ''}`)),
+                            react_1.default.createElement("div", { className: "u-flex u-flex-nowrap u-flex-gap--light" },
+                                react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Person, color: Color_1.Color.Grey }),
+                                react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small }, `${reservationOccupancy} guest${reservationOccupancy > 1 ? 's' : ''}`)))),
+                    react_1.default.createElement("div", { className: "reservation-item--checkin-checkout u-flex justify-content-start u-pad u-border-rounded" },
+                        react_1.default.createElement("div", { className: "u-marg-right--heavy" },
+                            react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.DarkGrey, className: "u-marg-bottom--light" }, t(Translation_1.Translation.Misc.CheckIn)),
+                            react_1.default.createElement(CheckinCheckoutComponent, null,
                                 t(Translation_1.Translation.Reservation.After),
-                                " ",
+                                " ", hotel === null || hotel === void 0 ? void 0 :
                                 hotel.checkInTime)),
-                        React.createElement("div", null,
-                            React.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.DarkGrey, className: "u-marg-bottom--light" }, t(Translation_1.Translation.Misc.CheckOut)),
-                            React.createElement(CheckinCheckoutComponent, null,
+                        react_1.default.createElement("div", null,
+                            react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.DarkGrey, className: "u-marg-bottom--light" }, t(Translation_1.Translation.Misc.CheckOut)),
+                            react_1.default.createElement(CheckinCheckoutComponent, null,
                                 t(Translation_1.Translation.Reservation.Before),
-                                " ",
+                                " ", hotel === null || hotel === void 0 ? void 0 :
                                 hotel.checkOutTime))),
-                    React.createElement("div", { className: "reservation-item--actions u-flex justify-content-start u-print-none u-marg-top--heavy" }, renderActions()))))));
+                    react_1.default.createElement("div", { className: "reservation-item--actions u-flex justify-content-start u-print-none u-marg-top--heavy" }, renderActions()))))));
 };
 exports.default = ReservationItem;
 //# sourceMappingURL=ReservationItem.js.map

package/dist/src/components/reservation/ReservationItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReservationItem.js","sourceRoot":"/","sources":["src/components/reservation/ReservationItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BookingEngineContext } from '@frontend/contexts';\nimport { IBookingStatus } from '@roomstay/core';\nimport classNames from 'classnames';\nimport BEButton, { BEButtonProps } from '@/components/generic/BEButton';\nimport Headline, { HeadlineProps } from '@/components/generic/Headline';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport Text, { TextType } from '@/components/generic/Text';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport dayjs from 'dayjs';\nimport { useCurrentHotel } from '@/hooks/CurrentHotelHook';\nimport { IRoomstayMemberBookingItemWithRef } from '@frontend/contexts';\nimport { AccountRoutes } from '@/pages/account/AccountRoutes';\nimport { ImageSize } from '@/providers/ImageProvider';\nimport * as React from 'react';\nimport { useContext } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Link } from 'react-router-dom';\nimport { Translation } from 'translations/Translation';\nimport { Color } from '@/util/Color';\nimport ScreenSize from '@/util/ScreenSize';\nimport { TextAlign } from '@/util/TextAlignment';\nimport styles from './ReservationItem.module.scss';\nimport Tooltip from '@/components/generic/Tooltip/Tooltip';\nimport StepManager from '@/util/StepManager';\n\nexport enum ReservationAction {\n    MoreDetails = 'MoreDetails',\n    BookAgain = 'BookAgain',\n    Cancel = 'Cancel',\n    Modify = 'Modify',\n}\n\nexport type ReservationItemProps = {\n    itineraryItem: IRoomstayMemberBookingItemWithRef;\n    disableMarginBottom?: boolean;\n    actions?: ReservationAction[];\n    showCancelledNotifications?: boolean;\n    onActionClick?: (action: ReservationAction, item: IRoomstayMemberBookingItemWithRef) => void;\n};\n\nconst defaultActions: ReservationAction[] = [ReservationAction.MoreDetails];\n\nconst ReservationItem = (props: ReservationItemProps) => {\n    const { itineraryItem, disableMarginBottom, actions = defaultActions, showCancelledNotifications = false } = props;\n\n    const { t } = useTranslation();\n    const context = useContext(BookingEngineContext);\n    const { hotel } = useCurrentHotel();\n\n    const isMobile = context.screenSize <= ScreenSize.Large;\n\n    const nameSize: HeadlineProps['size'] = isMobile ? 'normal' : 'large';\n    const CheckinCheckoutComponent = isMobile ? Text : Headline;\n\n    const renderActions = () =>\n        actions.map((action, index) => {\n            const defaultButtonProps: BEButtonProps = {\n                mobileWidth: true,\n                rounded: true,\n                wide: isMobile,\n                className: classNames({\n                    'u-marg-right@m': index === 0,\n                }),\n            };\n\n            const onActionClick = () => {\n                if (props.onActionClick) {\n                    props.onActionClick(action, itineraryItem);\n                }\n            };\n\n            /**\n             * Only renders Cancel if the booking is NOT cancelled\n             */\n            if (cancelled && action === ReservationAction.Cancel) {\n                return;\n            }\n\n            /**\n             * Only renders BookAgain if booking IS cancelled\n             */\n            if (!cancelled && action === ReservationAction.BookAgain) {\n                return;\n            }\n\n            switch (action) {\n                case ReservationAction.Modify:\n                    return (\n                        <BEButton {...defaultButtonProps} icon={IconType.ArrowRight} iconPosition=\"right\" onClick={onActionClick}>\n                            {t(Translation.Reservation.ModifyThisRoom)}\n                        </BEButton>\n                    );\n                case ReservationAction.Cancel:\n                    return (\n                        <BEButton {...defaultButtonProps} danger={true} onClick={onActionClick} disabled={!itineraryItem.isCancellable}>\n                            {t(Translation.Reservation.CancelReservation)}\n                        </BEButton>\n                    );\n                case ReservationAction.BookAgain:\n                    return (\n                        <Link to={StepManager.getFirstStep().getStepUrl()}>\n                            <BEButton {...defaultButtonProps} icon={IconType.ArrowRight} iconPosition=\"right\" onClick={onActionClick}>\n                                {t(Translation.Reservation.BookAgain)}\n                            </BEButton>\n                        </Link>\n                    );\n                case ReservationAction.MoreDetails:\n                    return (\n                        <Link to={`${AccountRoutes.SingleReservation.path}${itineraryItem.bookingId}/item`}>\n                            <BEButton {...defaultButtonProps} primary={true} filled={true} icon={IconType.ArrowRight} iconPosition=\"right\">\n                                {t(Translation.Reservation.MoreDetails)}\n                            </BEButton>\n                        </Link>\n                    );\n            }\n        });\n\n    if (!itineraryItem) {\n        return <></>;\n    }\n\n    const itineraryItemNights = Object.keys(itineraryItem.nights);\n\n    const checkInDate = dayjs(itineraryItem.checkInDate);\n    const checkOutDate = dayjs(itineraryItem.checkOutDate);\n\n    const reservationOccupancy = itineraryItem.adults + itineraryItem.children;\n\n    const cancelled = itineraryItem.status === IBookingStatus.Cancelled;\n\n    return (\n        <>\n            {showCancelledNotifications && cancelled && (\n                <div className={styles['cancelledNotification']}>\n                    <div className={styles['cancelledNotification-icon']}>\n                        <Icon icon={IconType.Error} size={'44px'} color={Color.Danger} />\n                    </div>\n                    <div>\n                        <Text type={TextType.Small} bold={true} color={Color.Danger} className={styles['cancelledNotification-title']}>\n                            This room is cancelled!\n                        </Text>\n                        <Text type={TextType.Small}>\n                            This room has been cancelled, please{' '}\n                            <span style={{ color: Color.Accent }}>\n                                <Link to={AccountRoutes.Help.path}>get in touch</Link>\n                            </span>{' '}\n                            if you find this to be a mistake\n                        </Text>\n                    </div>\n                </div>\n            )}\n            <div className={classNames('reservation-item-container', { 'u-marg-bottom--heavy u-marg-bottom@m-': !disableMarginBottom })}>\n                <div className=\"reservation-item\">\n                    <div className={classNames('reservation-item--image u-border-rounded u-print-none', { 'reservation-item--disabled': cancelled })}>\n                        <ImageGallerySlider images={itineraryItem.images} imageSize={ImageSize.Medium} />\n                        <div className=\"reservation-item--floating-date\">\n                            <Headline size={'extra-large'} color={cancelled ? Color.DarkGrey : Color.White} align={TextAlign.Center}>\n                                {checkInDate.format('DD')}\n                            </Headline>\n                            <Text type={TextType.Small} color={cancelled ? Color.DarkGrey : Color.White} bold={true}>\n                                {checkInDate.format('MMM YYYY')}\n                            </Text>\n                        </div>\n                    </div>\n\n                    <div className=\"reservation-item--content u-pad--heavy u-pad-left-none@m- u-pad-right-none@m- u-pad-bottom-none@m- u-print-pad-left-none\">\n                        <div className=\"reservation-item--content-title u-marg-bottom--light\">\n                            <Headline bold size={nameSize}>\n                                {itineraryItem.roomName}\n                            </Headline>\n                        </div>\n                        <div className=\"text-body u-marg-bottom\">{(itineraryItem?.profile?.firstName ?? '') + ' ' + (itineraryItem?.profile?.lastName ?? '')}</div>\n                        <div className=\"reservation-item--info u-marg-bottom--heavy\">\n                            <div className=\"u-flex u-flex-gap--light\">\n                                <div className=\"u-flex u-flex-nowrap u-flex-gap--light\">\n                                    <Icon icon={IconType.Calendar} color={Color.Grey} />\n                                    <Text type={TextType.Small}>{checkInDate.format('D MMM, YYYY')}</Text>\n                                </div>\n                                <div className=\"u-flex u-flex-nowrap u-flex-gap--light\">\n                                    <Icon icon={IconType.ArrowRight2} color={Color.Grey} />\n                                    <Text type={TextType.Small}>{checkOutDate.format('D MMM, YYYY')}</Text>\n                                </div>\n                            </div>\n                            <div className=\"u-flex u-flex-gap\">\n                                <div className=\"u-flex u-flex-nowrap u-flex-gap--light\">\n                                    <Icon icon={IconType.LateCheckout} color={Color.Grey} />\n                                    <Text type={TextType.Small}>{`${itineraryItemNights.length} night${itineraryItemNights.length > 1 ? 's' : ''}`}</Text>\n                                </div>\n                                <div className=\"u-flex u-flex-nowrap u-flex-gap--light\">\n                                    <Icon icon={IconType.Person} color={Color.Grey} />\n                                    <Text type={TextType.Small}>{`${reservationOccupancy} guest${reservationOccupancy > 1 ? 's' : ''}`}</Text>\n                                </div>\n                            </div>\n                        </div>\n                        <div className=\"reservation-item--checkin-checkout u-flex justify-content-start u-pad u-border-rounded\">\n                            <div className=\"u-marg-right--heavy\">\n                                <Text type={TextType.Small} color={Color.DarkGrey} className=\"u-marg-bottom--light\">\n                                    {t(Translation.Misc.CheckIn)}\n                                </Text>\n                                <CheckinCheckoutComponent>\n                                    {t(Translation.Reservation.After)} {hotel.checkInTime}\n                                </CheckinCheckoutComponent>\n                            </div>\n                            <div>\n                                <Text type={TextType.Small} color={Color.DarkGrey} className=\"u-marg-bottom--light\">\n                                    {t(Translation.Misc.CheckOut)}\n                                </Text>\n                                <CheckinCheckoutComponent>\n                                    {t(Translation.Reservation.Before)} {hotel.checkOutTime}\n                                </CheckinCheckoutComponent>\n                            </div>\n                        </div>\n                        <div className=\"reservation-item--actions u-flex justify-content-start u-print-none u-marg-top--heavy\">{renderActions()}</div>\n                    </div>\n                </div>\n            </div>\n        </>\n    );\n};\n\nexport default ReservationItem;\n"]}
+{"version":3,"file":"ReservationItem.js","sourceRoot":"/","sources":["src/components/reservation/ReservationItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { BookingEngineContext } from '@frontend/contexts';\nimport { IBookingStatus } from '@roomstay/core';\nimport classNames from 'classnames';\nimport BEButton, { BEButtonProps } from '@/components/generic/BEButton';\nimport Headline, { HeadlineProps } from '@/components/generic/Headline';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport Text, { TextType } from '@/components/generic/Text';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport dayjs from 'dayjs';\nimport { useCurrentHotel } from '@/hooks/CurrentHotelHook';\nimport { IRoomstayMemberBookingItemWithRef } from '@frontend/contexts';\nimport { AccountRoutes } from '@/pages/account/AccountRoutes';\nimport { ImageSize } from '@/providers/ImageProvider';\nimport React from 'react';\nimport { useContext } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Link } from 'react-router-dom';\nimport { Translation } from 'translations/Translation';\nimport { Color } from '@/util/Color';\nimport ScreenSize from '@/util/ScreenSize';\nimport { TextAlign } from '@/util/TextAlignment';\nimport styles from './ReservationItem.module.scss';\nimport Tooltip from '@/components/generic/Tooltip/Tooltip';\nimport StepManager from '@/util/StepManager';\n\nexport enum ReservationAction {\n    MoreDetails = 'MoreDetails',\n    BookAgain = 'BookAgain',\n    Cancel = 'Cancel',\n    Modify = 'Modify',\n}\n\nexport type ReservationItemProps = {\n    itineraryItem: IRoomstayMemberBookingItemWithRef;\n    disableMarginBottom?: boolean;\n    actions?: ReservationAction[];\n    showCancelledNotifications?: boolean;\n    onActionClick?: (action: ReservationAction, item: IRoomstayMemberBookingItemWithRef) => void;\n};\n\nconst defaultActions: ReservationAction[] = [ReservationAction.MoreDetails];\n\nconst ReservationItem = (props: ReservationItemProps) => {\n    const { itineraryItem, disableMarginBottom, actions = defaultActions, showCancelledNotifications = false } = props;\n\n    const { t } = useTranslation();\n    const context = useContext(BookingEngineContext);\n    const { hotel } = useCurrentHotel();\n\n    const isMobile = context.screenSize <= ScreenSize.Large;\n\n    const nameSize: HeadlineProps['size'] = isMobile ? 'normal' : 'large';\n    const CheckinCheckoutComponent = isMobile ? Text : Headline;\n\n    const renderActions = () =>\n        actions.map((action, index) => {\n            const defaultButtonProps: BEButtonProps = {\n                mobileWidth: true,\n                rounded: true,\n                wide: isMobile,\n                className: classNames({\n                    'u-marg-right@m': index === 0,\n                }),\n            };\n\n            const onActionClick = () => {\n                if (props.onActionClick) {\n                    props.onActionClick(action, itineraryItem);\n                }\n            };\n\n            /**\n             * Only renders Cancel if the booking is NOT cancelled\n             */\n            if (cancelled && action === ReservationAction.Cancel) {\n                return;\n            }\n\n            /**\n             * Only renders BookAgain if booking IS cancelled\n             */\n            if (!cancelled && action === ReservationAction.BookAgain) {\n                return;\n            }\n\n            switch (action) {\n                case ReservationAction.Modify:\n                    return (\n                        <BEButton {...defaultButtonProps} icon={IconType.ArrowRight} iconPosition=\"right\" onClick={onActionClick}>\n                            {t(Translation.Reservation.ModifyThisRoom)}\n                        </BEButton>\n                    );\n                case ReservationAction.Cancel:\n                    return (\n                        <BEButton {...defaultButtonProps} danger onClick={onActionClick} disabled={!itineraryItem.isCancellable}>\n                            {t(Translation.Reservation.CancelReservation)}\n                        </BEButton>\n                    );\n                case ReservationAction.BookAgain:\n                    return (\n                        <Link to={StepManager.getFirstStep().getStepUrl()}>\n                            <BEButton {...defaultButtonProps} icon={IconType.ArrowRight} iconPosition=\"right\" onClick={onActionClick}>\n                                {t(Translation.Reservation.BookAgain)}\n                            </BEButton>\n                        </Link>\n                    );\n                case ReservationAction.MoreDetails:\n                    return (\n                        <Link to={`${AccountRoutes.SingleReservation.path}${itineraryItem.bookingId}/item`}>\n                            <BEButton {...defaultButtonProps} primary filled icon={IconType.ArrowRight} iconPosition=\"right\">\n                                {t(Translation.Reservation.MoreDetails)}\n                            </BEButton>\n                        </Link>\n                    );\n            }\n        });\n\n    if (!itineraryItem) {\n        return <></>;\n    }\n\n    const itineraryItemNights = Object.keys(itineraryItem.nights);\n\n    const checkInDate = dayjs(itineraryItem.checkInDate);\n    const checkOutDate = dayjs(itineraryItem.checkOutDate);\n\n    const reservationOccupancy = itineraryItem.adults + (itineraryItem?.children || 0);\n\n    const cancelled = itineraryItem.status === IBookingStatus.Cancelled;\n\n    return (\n        <>\n            {showCancelledNotifications && cancelled && (\n                <div className={styles['cancelledNotification']}>\n                    <div className={styles['cancelledNotification-icon']}>\n                        <Icon icon={IconType.Error} size=\"44px\" color={Color.Danger} />\n                    </div>\n                    <div>\n                        <Text type={TextType.Small} bold color={Color.Danger} className={styles['cancelledNotification-title']}>\n                            This room is cancelled!\n                        </Text>\n                        <Text type={TextType.Small}>\n                            This room has been cancelled, please{' '}\n                            <span style={{ color: Color.Accent }}>\n                                <Link to={AccountRoutes.Help.path}>get in touch</Link>\n                            </span>{' '}\n                            if you find this to be a mistake\n                        </Text>\n                    </div>\n                </div>\n            )}\n            <div className={classNames('reservation-item-container', { 'u-marg-bottom--heavy u-marg-bottom@m-': !disableMarginBottom })}>\n                <div className=\"reservation-item\">\n                    <div className={classNames('reservation-item--image u-border-rounded u-print-none', { 'reservation-item--disabled': cancelled })}>\n                        <ImageGallerySlider images={itineraryItem.images} imageSize={ImageSize.Medium} />\n                        <div className=\"reservation-item--floating-date\">\n                            <Headline size=\"extra-large\" color={cancelled ? Color.DarkGrey : Color.White} align={TextAlign.Center}>\n                                {checkInDate.format('DD')}\n                            </Headline>\n                            <Text type={TextType.Small} color={cancelled ? Color.DarkGrey : Color.White} bold>\n                                {checkInDate.format('MMM YYYY')}\n                            </Text>\n                        </div>\n                    </div>\n\n                    <div className=\"reservation-item--content u-pad--heavy u-pad-left-none@m- u-pad-right-none@m- u-pad-bottom-none@m- u-print-pad-left-none\">\n                        <div className=\"reservation-item--content-title u-marg-bottom--light\">\n                            <Headline bold size={nameSize}>\n                                {itineraryItem.roomName}\n                            </Headline>\n                        </div>\n                        <div className=\"text-body u-marg-bottom\">{(itineraryItem?.profile?.firstName ?? '') + ' ' + (itineraryItem?.profile?.lastName ?? '')}</div>\n                        <div className=\"reservation-item--info u-marg-bottom--heavy\">\n                            <div className=\"u-flex u-flex-gap--light\">\n                                <div className=\"u-flex u-flex-nowrap u-flex-gap--light\">\n                                    <Icon icon={IconType.Calendar} color={Color.Grey} />\n                                    <Text type={TextType.Small}>{checkInDate.format('D MMM, YYYY')}</Text>\n                                </div>\n                                <div className=\"u-flex u-flex-nowrap u-flex-gap--light\">\n                                    <Icon icon={IconType.ArrowRight2} color={Color.Grey} />\n                                    <Text type={TextType.Small}>{checkOutDate.format('D MMM, YYYY')}</Text>\n                                </div>\n                            </div>\n                            <div className=\"u-flex u-flex-gap\">\n                                <div className=\"u-flex u-flex-nowrap u-flex-gap--light\">\n                                    <Icon icon={IconType.LateCheckout} color={Color.Grey} />\n                                    <Text type={TextType.Small}>{`${itineraryItemNights.length} night${itineraryItemNights.length > 1 ? 's' : ''}`}</Text>\n                                </div>\n                                <div className=\"u-flex u-flex-nowrap u-flex-gap--light\">\n                                    <Icon icon={IconType.Person} color={Color.Grey} />\n                                    <Text type={TextType.Small}>{`${reservationOccupancy} guest${reservationOccupancy > 1 ? 's' : ''}`}</Text>\n                                </div>\n                            </div>\n                        </div>\n                        <div className=\"reservation-item--checkin-checkout u-flex justify-content-start u-pad u-border-rounded\">\n                            <div className=\"u-marg-right--heavy\">\n                                <Text type={TextType.Small} color={Color.DarkGrey} className=\"u-marg-bottom--light\">\n                                    {t(Translation.Misc.CheckIn)}\n                                </Text>\n                                <CheckinCheckoutComponent>\n                                    {t(Translation.Reservation.After)} {hotel?.checkInTime}\n                                </CheckinCheckoutComponent>\n                            </div>\n                            <div>\n                                <Text type={TextType.Small} color={Color.DarkGrey} className=\"u-marg-bottom--light\">\n                                    {t(Translation.Misc.CheckOut)}\n                                </Text>\n                                <CheckinCheckoutComponent>\n                                    {t(Translation.Reservation.Before)} {hotel?.checkOutTime}\n                                </CheckinCheckoutComponent>\n                            </div>\n                        </div>\n                        <div className=\"reservation-item--actions u-flex justify-content-start u-print-none u-marg-top--heavy\">{renderActions()}</div>\n                    </div>\n                </div>\n            </div>\n        </>\n    );\n};\n\nexport default ReservationItem;\n"]}

package/dist/src/components/reservation/ReservationList.d.ts

@@ -1,7 +1,8 @@
-import * as React from 'react';
+import React from 'react';
 import { ReservationItemProps } from './ReservationItem';
 import { IRoomstayMemberBookingItemWithRef } from '../../contexts/index.js';
-interface ReservationListProps {
+import { EmptyReservationProps } from './EmptyReservation';
+interface ReservationListProps extends EmptyReservationProps {
     reservationItems: IRoomstayMemberBookingItemWithRef[];
     actions?: ReservationItemProps['actions'];
     onActionClick?: ReservationItemProps['onActionClick'];

package/dist/src/components/reservation/ReservationList.js

@@ -1,36 +1,17 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = __importStar(require("react"));
+const react_1 = __importDefault(require("react"));
 const ReservationItem_1 = __importDefault(require("./ReservationItem"));
+const EmptyReservation_1 = __importDefault(require("./EmptyReservation"));
 const ReservationList = (props) => {
-    const { reservationItems = [], actions } = props;
-    return (React.createElement("div", null, reservationItems.map((reservationItem, index) => (React.createElement(ReservationItem_1.default, { key: reservationItem.id, itineraryItem: reservationItem, disableMarginBottom: index === reservationItems.length - 1, actions: actions, onActionClick: props.onActionClick, showCancelledNotifications: props.showCancelledNotifications })))));
+    const { reservationItems = [], actions, isCancelled } = props;
+    if (!reservationItems.length) {
+        return react_1.default.createElement(EmptyReservation_1.default, { isCancelled: isCancelled });
+    }
+    return (react_1.default.createElement("div", null, reservationItems.map((reservationItem, index) => (react_1.default.createElement(ReservationItem_1.default, { key: reservationItem.id, itineraryItem: reservationItem, disableMarginBottom: index === reservationItems.length - 1, actions: actions, onActionClick: props.onActionClick, showCancelledNotifications: props.showCancelledNotifications })))));
 };
 exports.default = ReservationList;
 //# sourceMappingURL=ReservationList.js.map

package/dist/src/components/reservation/ReservationList.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReservationList.js","sourceRoot":"/","sources":["src/components/reservation/ReservationList.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAC/B,+FAAiG;AAUjG,MAAM,eAAe,GAAmC,CAAC,KAAK,EAAE,EAAE;IAC9D,MAAM,EAAE,gBAAgB,GAAG,EAAE,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC;IAEjD,OAAO,CACH,iCACK,gBAAgB,CAAC,GAAG,CAAC,CAAC,eAAe,EAAE,KAAK,EAAE,EAAE,CAAC,CAC9C,oBAAC,yBAAe,IACZ,GAAG,EAAE,eAAe,CAAC,EAAE,EACvB,aAAa,EAAE,eAAe,EAC9B,mBAAmB,EAAE,KAAK,KAAK,gBAAgB,CAAC,MAAM,GAAG,CAAC,EAC1D,OAAO,EAAE,OAAO,EAChB,aAAa,EAAE,KAAK,CAAC,aAAa,EAClC,0BAA0B,EAAE,KAAK,CAAC,0BAA0B,GAC9D,CACL,CAAC,CACA,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,eAAe,CAAC","sourcesContent":["import * as React from 'react';\nimport ReservationItem, { ReservationItemProps } from '@/components/reservation/ReservationItem';\nimport { IRoomstayMemberBookingItemWithRef } from '@frontend/contexts';\n\ninterface ReservationListProps {\n    reservationItems: IRoomstayMemberBookingItemWithRef[];\n    actions?: ReservationItemProps['actions'];\n    onActionClick?: ReservationItemProps['onActionClick'];\n    showCancelledNotifications?: boolean;\n}\n\nconst ReservationList: React.FC<ReservationListProps> = (props) => {\n    const { reservationItems = [], actions } = props;\n\n    return (\n        <div>\n            {reservationItems.map((reservationItem, index) => (\n                <ReservationItem\n                    key={reservationItem.id}\n                    itineraryItem={reservationItem}\n                    disableMarginBottom={index === reservationItems.length - 1}\n                    actions={actions}\n                    onActionClick={props.onActionClick}\n                    showCancelledNotifications={props.showCancelledNotifications}\n                />\n            ))}\n        </div>\n    );\n};\n\nexport default ReservationList;\n"]}
+{"version":3,"file":"ReservationList.js","sourceRoot":"/","sources":["src/components/reservation/ReservationList.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAC1B,+FAAiG;AAEjG,iGAAoG;AASpG,MAAM,eAAe,GAAmC,CAAC,KAAK,EAAE,EAAE;IAC9D,MAAM,EAAE,gBAAgB,GAAG,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;IAE9D,IAAI,CAAC,gBAAgB,CAAC,MAAM,EAAE;QAC1B,OAAO,8BAAC,0BAAgB,IAAC,WAAW,EAAE,WAAW,GAAI,CAAC;KACzD;IAED,OAAO,CACH,2CACK,gBAAgB,CAAC,GAAG,CAAC,CAAC,eAAe,EAAE,KAAK,EAAE,EAAE,CAAC,CAC9C,8BAAC,yBAAe,IACZ,GAAG,EAAE,eAAe,CAAC,EAAE,EACvB,aAAa,EAAE,eAAe,EAC9B,mBAAmB,EAAE,KAAK,KAAK,gBAAgB,CAAC,MAAM,GAAG,CAAC,EAC1D,OAAO,EAAE,OAAO,EAChB,aAAa,EAAE,KAAK,CAAC,aAAa,EAClC,0BAA0B,EAAE,KAAK,CAAC,0BAA0B,GAC9D,CACL,CAAC,CACA,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,eAAe,CAAC","sourcesContent":["import React from 'react';\nimport ReservationItem, { ReservationItemProps } from '@/components/reservation/ReservationItem';\nimport { IRoomstayMemberBookingItemWithRef } from '@frontend/contexts';\nimport EmptyReservation, { EmptyReservationProps } from '@/components/reservation/EmptyReservation';\n\ninterface ReservationListProps extends EmptyReservationProps {\n    reservationItems: IRoomstayMemberBookingItemWithRef[];\n    actions?: ReservationItemProps['actions'];\n    onActionClick?: ReservationItemProps['onActionClick'];\n    showCancelledNotifications?: boolean;\n}\n\nconst ReservationList: React.FC<ReservationListProps> = (props) => {\n    const { reservationItems = [], actions, isCancelled } = props;\n\n    if (!reservationItems.length) {\n        return <EmptyReservation isCancelled={isCancelled} />;\n    }\n\n    return (\n        <div>\n            {reservationItems.map((reservationItem, index) => (\n                <ReservationItem\n                    key={reservationItem.id}\n                    itineraryItem={reservationItem}\n                    disableMarginBottom={index === reservationItems.length - 1}\n                    actions={actions}\n                    onActionClick={props.onActionClick}\n                    showCancelledNotifications={props.showCancelledNotifications}\n                />\n            ))}\n        </div>\n    );\n};\n\nexport default ReservationList;\n"]}

package/dist/src/components/steps/DaysSelectedInformer.js

@@ -22,27 +22,30 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __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 = __importStar(require("react"));
-const react_1 = require("react");
+const react_1 = __importDefault(require("react"));
+const react_2 = require("react");
 const Text_1 = __importStar(require("../generic/Text"));
 const Color_1 = require("../../util/Color");
 const contexts_1 = require("../../contexts/index.js");
 function DaysSelectedInformer() {
-    const dpContext = (0, react_1.useContext)(contexts_1.DatePickerContext);
+    const dpContext = (0, react_2.useContext)(contexts_1.DatePickerContext);
     const { startDate, endDate, hoveredMonth: hoveredDate } = dpContext;
     let daysPicked = 0;
     const correctEndDate = hoveredDate !== null && hoveredDate !== void 0 ? hoveredDate : endDate;
     if (startDate && correctEndDate) {
         daysPicked = correctEndDate.diff(dpContext.startDate, 'day');
     }
-    return (React.createElement(Text_1.default, { bold: true, color: Color_1.Color.Success, type: Text_1.TextType.Small }, daysPicked > 0 ? (React.createElement(React.Fragment, null,
+    return (react_1.default.createElement(Text_1.default, { bold: true, color: Color_1.Color.Success, type: Text_1.TextType.Small }, daysPicked > 0 ? (react_1.default.createElement(react_1.default.Fragment, null,
         "Selected ",
         daysPicked,
         " nights, ", startDate === null || startDate === void 0 ? void 0 :
         startDate.format('D MMM'),
-        ", to ",
-        correctEndDate.format('D MMM'))) : (React.createElement(React.Fragment, null, "Please select your dates"))));
+        ", to ", correctEndDate === null || correctEndDate === void 0 ? void 0 :
+        correctEndDate.format('D MMM'))) : (react_1.default.createElement(react_1.default.Fragment, null, "Please select your dates"))));
 }
 exports.default = DaysSelectedInformer;
 //# sourceMappingURL=DaysSelectedInformer.js.map

package/dist/src/components/steps/DaysSelectedInformer.js.map

@@ -1 +1 @@
-{"version":3,"file":"DaysSelectedInformer.js","sourceRoot":"/","sources":["src/components/steps/DaysSelectedInformer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAC/B,iCAAmC;AAEnC,kEAA2D;AAC3D,wCAAqC;AAErC,iDAAuD;AAEvD,SAAwB,oBAAoB;IACxC,MAAM,SAAS,GAAG,IAAA,kBAAU,EAAC,4BAAiB,CAAC,CAAC;IAEhD,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,GAAG,SAAS,CAAC;IAEpE,IAAI,UAAU,GAAG,CAAC,CAAC;IACnB,MAAM,cAAc,GAAG,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,OAAO,CAAC;IAE9C,IAAI,SAAS,IAAI,cAAc,EAAE;QAC7B,UAAU,GAAG,cAAc,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;KAChE;IAED,OAAO,CACH,oBAAC,cAAI,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,aAAK,CAAC,OAAO,EAAE,IAAI,EAAE,eAAQ,CAAC,KAAK,IACvD,UAAU,GAAG,CAAC,CAAC,CAAC,CAAC,CACd;;QACc,UAAU;qBAAW,SAAS,aAAT,SAAS;QAAT,SAAS,CAAE,MAAM,CAAC,OAAO,CAAC;;QAAO,cAAc,CAAC,MAAM,CAAC,OAAO,CAAC,CAC/F,CACN,CAAC,CAAC,CAAC,CACA,qEAA6B,CAChC,CACE,CACV,CAAC;AACN,CAAC;AAvBD,uCAuBC","sourcesContent":["import * as React from 'react';\nimport { useContext } from 'react';\n\nimport Text, { TextType } from '@/components/generic/Text';\nimport { Color } from '@/util/Color';\n\nimport { DatePickerContext } from '@frontend/contexts';\n\nexport default function DaysSelectedInformer() {\n    const dpContext = useContext(DatePickerContext);\n\n    const { startDate, endDate, hoveredMonth: hoveredDate } = dpContext;\n\n    let daysPicked = 0;\n    const correctEndDate = hoveredDate ?? endDate;\n\n    if (startDate && correctEndDate) {\n        daysPicked = correctEndDate.diff(dpContext.startDate, 'day');\n    }\n\n    return (\n        <Text bold={true} color={Color.Success} type={TextType.Small}>\n            {daysPicked > 0 ? (\n                <>\n                    Selected {daysPicked} nights, {startDate?.format('D MMM')}, to {correctEndDate.format('D MMM')}\n                </>\n            ) : (\n                <>Please select your dates</>\n            )}\n        </Text>\n    );\n}\n"]}
+{"version":3,"file":"DaysSelectedInformer.js","sourceRoot":"/","sources":["src/components/steps/DaysSelectedInformer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,iCAAmC;AAEnC,kEAA2D;AAC3D,wCAAqC;AAErC,iDAAuD;AAEvD,SAAwB,oBAAoB;IACxC,MAAM,SAAS,GAAG,IAAA,kBAAU,EAAC,4BAAiB,CAAC,CAAC;IAEhD,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,GAAG,SAAS,CAAC;IAEpE,IAAI,UAAU,GAAG,CAAC,CAAC;IACnB,MAAM,cAAc,GAAG,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,OAAO,CAAC;IAE9C,IAAI,SAAS,IAAI,cAAc,EAAE;QAC7B,UAAU,GAAG,cAAc,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;KAChE;IAED,OAAO,CACH,8BAAC,cAAI,IAAC,IAAI,QAAC,KAAK,EAAE,aAAK,CAAC,OAAO,EAAE,IAAI,EAAE,eAAQ,CAAC,KAAK,IAChD,UAAU,GAAG,CAAC,CAAC,CAAC,CAAC,CACd;;QACc,UAAU;qBAAW,SAAS,aAAT,SAAS;QAAT,SAAS,CAAE,MAAM,CAAC,OAAO,CAAC;iBAAO,cAAc,aAAd,cAAc;QAAd,cAAc,CAAE,MAAM,CAAC,OAAO,CAAC,CAChG,CACN,CAAC,CAAC,CAAC,CACA,yFAA6B,CAChC,CACE,CACV,CAAC;AACN,CAAC;AAvBD,uCAuBC","sourcesContent":["import React from 'react';\nimport { useContext } from 'react';\n\nimport Text, { TextType } from '@/components/generic/Text';\nimport { Color } from '@/util/Color';\n\nimport { DatePickerContext } from '@frontend/contexts';\n\nexport default function DaysSelectedInformer() {\n    const dpContext = useContext(DatePickerContext);\n\n    const { startDate, endDate, hoveredMonth: hoveredDate } = dpContext;\n\n    let daysPicked = 0;\n    const correctEndDate = hoveredDate ?? endDate;\n\n    if (startDate && correctEndDate) {\n        daysPicked = correctEndDate.diff(dpContext.startDate, 'day');\n    }\n\n    return (\n        <Text bold color={Color.Success} type={TextType.Small}>\n            {daysPicked > 0 ? (\n                <>\n                    Selected {daysPicked} nights, {startDate?.format('D MMM')}, to {correctEndDate?.format('D MMM')}\n                </>\n            ) : (\n                <>Please select your dates</>\n            )}\n        </Text>\n    );\n}\n"]}

package/dist/src/components/steps/MinimumNightStayPill.d.ts

@@ -1 +1 @@
-export default function MinimumNightStayPill(): JSX.Element;
+export default function MinimumNightStayPill(): JSX.Element | null;

package/dist/src/components/steps/MinimumNightStayPill.js

@@ -26,9 +26,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = __importStar(require("react"));
+const react_1 = __importDefault(require("react"));
 const browser_1 = require("@sentry/browser");
-const react_1 = require("react");
+const react_2 = require("react");
 const react_i18next_1 = require("react-i18next");
 const BookingAPI_1 = __importDefault(require("../../api/BookingAPI"));
 const contexts_1 = require("../../contexts/index.js");
@@ -41,15 +41,15 @@ const hooks_1 = require("../../hooks/index.js");
 function MinimumNightStayPill() {
     var _a;
     const { hotel } = (0, hooks_1.useCurrentHotel)();
-    const basketContext = (0, react_1.useContext)(contexts_1.BasketContext);
+    const basketContext = (0, react_2.useContext)(contexts_1.BasketContext);
     const { t } = (0, react_i18next_1.useTranslation)();
-    const [isLoading, setIsLoading] = (0, react_1.useState)(false);
-    const [minNights, setMinNights] = (0, react_1.useState)(-1);
-    const [loadIndex, setLoadIndex] = (0, react_1.useState)(0);
+    const [isLoading, setIsLoading] = (0, react_2.useState)(false);
+    const [minNights, setMinNights] = (0, react_2.useState)(-1);
+    const [loadIndex, setLoadIndex] = (0, react_2.useState)(0);
     const selectedBasketRow = (_a = basketContext.selectedBasketRow) !== null && _a !== void 0 ? _a : basketContext.currentBasketRows[0];
     const startDate = selectedBasketRow === null || selectedBasketRow === void 0 ? void 0 : selectedBasketRow.getStartDate();
     const endDate = selectedBasketRow === null || selectedBasketRow === void 0 ? void 0 : selectedBasketRow.getEndDate();
-    (0, react_1.useEffect)(() => {
+    (0, react_2.useEffect)(() => {
         if (!hotel) {
             return;
         }
@@ -82,7 +82,7 @@ function MinimumNightStayPill() {
     if (!hotel) {
         return null;
     }
-    return (React.createElement("div", { className: "u-mh-30" }, isLoading ? (React.createElement(SmallSpinner_1.default, null)) : minNights !== -1 ? (React.createElement(Pill_1.default, { type: Pill_1.PillType.Primary, icon: Icon_1.IconType.Info }, t(Translation_1.Translation.Step.Room.NoRoomsFound.MinNightStay, { minNightStay: minNights }))) : (React.createElement(React.Fragment, null))));
+    return (react_1.default.createElement("div", { className: "u-mh-30" }, isLoading ? (react_1.default.createElement(SmallSpinner_1.default, null)) : minNights !== -1 ? (react_1.default.createElement(Pill_1.default, { type: Pill_1.PillType.Primary, icon: Icon_1.IconType.Info }, t(Translation_1.Translation.Step.Room.NoRoomsFound.MinNightStay, { minNightStay: minNights }))) : (react_1.default.createElement(react_1.default.Fragment, null))));
 }
 exports.default = MinimumNightStayPill;
 //# sourceMappingURL=MinimumNightStayPill.js.map

package/dist/src/components/steps/MinimumNightStayPill.js.map

@@ -1 +1 @@
-{"version":3,"file":"MinimumNightStayPill.js","sourceRoot":"/","sources":["src/components/steps/MinimumNightStayPill.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { captureException } from '@sentry/browser';\n\nimport { useContext, useState, useEffect } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport API from '@/api/BookingAPI';\n\nimport { BasketContext } from '@frontend/contexts';\nimport { NoHotelSelectedError } from 'errors/NoHotelSelectedError';\nimport { Translation } from 'translations/Translation';\nimport { IconType } from '@/components/generic/Icon/Icon';\nimport SmallSpinner from '@/components/generic/loader/SmallSpinner';\nimport Pill, { PillType } from '@/components/generic/Pill';\nimport { useCurrentHotel } from '@frontend/hooks';\n\nexport default function MinimumNightStayPill() {\n    const { hotel } = useCurrentHotel();\n    const basketContext = useContext(BasketContext);\n    const { t } = useTranslation();\n\n    const [isLoading, setIsLoading] = useState(false);\n    const [minNights, setMinNights] = useState(-1);\n\n    const [loadIndex, setLoadIndex] = useState(0);\n\n    const selectedBasketRow = basketContext.selectedBasketRow ?? basketContext.currentBasketRows[0];\n\n    const startDate = selectedBasketRow?.getStartDate();\n    const endDate = selectedBasketRow?.getEndDate();\n\n    useEffect(() => {\n        if (!hotel) {\n            return;\n        }\n\n        let cancelled = false;\n        setLoadIndex((oldLoadIndex) => oldLoadIndex + 1);\n\n        if (endDate?.isValid()) {\n            setIsLoading(true);\n\n            API.Availability.fetchMinNightStayData(selectedBasketRow, hotel.hotelID)\n                .then((response) => {\n                    if (!cancelled) {\n                        setIsLoading(false);\n                        if (response.Status === 'MinStay' && endDate?.diff(startDate, 'day') < response.Quantity) {\n                            setMinNights(response.Quantity);\n                        } else {\n                            setMinNights(-1);\n                        }\n                    }\n                })\n                .catch((ex) => {\n                    if (!(ex instanceof NoHotelSelectedError)) {\n                        captureException(ex);\n                    }\n                });\n        }\n\n        return () => {\n            cancelled = true;\n        };\n    }, [selectedBasketRow, startDate, endDate]);\n\n    if (!hotel) {\n        return null;\n    }\n\n    return (\n        <div className=\"u-mh-30\">\n            {isLoading ? (\n                <SmallSpinner />\n            ) : minNights !== -1 ? (\n                <Pill type={PillType.Primary} icon={IconType.Info}>\n                    {t(Translation.Step.Room.NoRoomsFound.MinNightStay, { minNightStay: minNights })}\n                </Pill>\n            ) : (\n                <></>\n            )}\n        </div>\n    );\n}\n"]}
+{"version":3,"file":"MinimumNightStayPill.js","sourceRoot":"/","sources":["src/components/steps/MinimumNightStayPill.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { captureException } from '@sentry/browser';\n\nimport { useContext, useState, useEffect } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport API from '@/api/BookingAPI';\n\nimport { BasketContext } from '@frontend/contexts';\nimport { NoHotelSelectedError } from 'errors/NoHotelSelectedError';\nimport { Translation } from 'translations/Translation';\nimport { IconType } from '@/components/generic/Icon/Icon';\nimport SmallSpinner from '@/components/generic/loader/SmallSpinner';\nimport Pill, { PillType } from '@/components/generic/Pill';\nimport { useCurrentHotel } from '@frontend/hooks';\n\nexport default function MinimumNightStayPill() {\n    const { hotel } = useCurrentHotel();\n    const basketContext = useContext(BasketContext);\n    const { t } = useTranslation();\n\n    const [isLoading, setIsLoading] = useState(false);\n    const [minNights, setMinNights] = useState(-1);\n\n    const [loadIndex, setLoadIndex] = useState(0);\n\n    const selectedBasketRow = basketContext.selectedBasketRow ?? basketContext.currentBasketRows[0];\n\n    const startDate = selectedBasketRow?.getStartDate();\n    const endDate = selectedBasketRow?.getEndDate();\n\n    useEffect(() => {\n        if (!hotel) {\n            return;\n        }\n\n        let cancelled = false;\n        setLoadIndex((oldLoadIndex) => oldLoadIndex + 1);\n\n        if (endDate?.isValid()) {\n            setIsLoading(true);\n\n            API.Availability.fetchMinNightStayData(selectedBasketRow, hotel.hotelID)\n                .then((response) => {\n                    if (!cancelled) {\n                        setIsLoading(false);\n                        if (response.Status === 'MinStay' && endDate?.diff(startDate, 'day') < response.Quantity) {\n                            setMinNights(response.Quantity);\n                        } else {\n                            setMinNights(-1);\n                        }\n                    }\n                })\n                .catch((ex) => {\n                    if (!(ex instanceof NoHotelSelectedError)) {\n                        captureException(ex);\n                    }\n                });\n        }\n\n        return () => {\n            cancelled = true;\n        };\n    }, [selectedBasketRow, startDate, endDate]);\n\n    if (!hotel) {\n        return null;\n    }\n\n    return (\n        <div className=\"u-mh-30\">\n            {isLoading ? (\n                <SmallSpinner />\n            ) : minNights !== -1 ? (\n                <Pill type={PillType.Primary} icon={IconType.Info}>\n                    {t(Translation.Step.Room.NoRoomsFound.MinNightStay, { minNightStay: minNights })}\n                </Pill>\n            ) : (\n                <></>\n            )}\n        </div>\n    );\n}\n"]}