@roomstay/frontend 2.1.33 → 2.2.0

package/dist/src/engines/MemberPortalWidget/MemberPortalWidget.js

@@ -0,0 +1,33 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MemberPortalWidget = void 0;
+const BaseEngine_1 = require("../BaseEngine");
+const RoomstayThemeEngine_1 = __importDefault(require("../../providers/RoomstayThemeEngine"));
+const MemberPortalWidgetElement_1 = require("./MemberPortalWidgetElement");
+class MemberPortalWidget extends BaseEngine_1.BaseEngine {
+    constructor(bookingContainer, config) {
+        super(bookingContainer, config);
+        this.source = BaseEngine_1.BookingEngineSource.Auth;
+        // TODO: Make this a more permanent solution
+        RoomstayThemeEngine_1.default.EngineContainer.classList.add('--transparent-bg');
+    }
+    render() {
+        return __awaiter(this, void 0, void 0, function* () {
+            (0, MemberPortalWidgetElement_1.renderMemberPortalWidget)(RoomstayThemeEngine_1.default.createElementOrReuseExisting('div', 'member-portal-widget'), this);
+        });
+    }
+}
+exports.MemberPortalWidget = MemberPortalWidget;
+//# sourceMappingURL=MemberPortalWidget.js.map

package/dist/src/engines/MemberPortalWidget/MemberPortalWidget.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MemberPortalWidget.js","sourceRoot":"/","sources":["src/engines/MemberPortalWidget/MemberPortalWidget.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA,qDAAyF;AACzF,0FAAkE;AAClE,2EAAuE;AAiBvE,MAAa,kBAAmB,SAAQ,uBAAoC;IACxE,YAAmB,gBAA6B,EAAE,MAAiC;QAC/E,KAAK,CAAC,gBAAgB,EAAE,MAAM,CAAC,CAAC;QAChC,IAAI,CAAC,MAAM,GAAG,gCAAmB,CAAC,IAAI,CAAC;QAEvC,4CAA4C;QAC5C,6BAAmB,CAAC,eAAe,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;IAC1E,CAAC;IAEe,MAAM;;YAClB,IAAA,oDAAwB,EAAC,6BAAmB,CAAC,4BAA4B,CAAC,KAAK,EAAE,sBAAsB,CAAC,EAAE,IAAI,CAAC,CAAC;QACpH,CAAC;KAAA;CACJ;AAZD,gDAYC","sourcesContent":["import { BaseEngine, BaseEngineConfig, BookingEngineSource } from '@/engines/BaseEngine';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\nimport { renderMemberPortalWidget } from './MemberPortalWidgetElement';\nimport { IRoomstayMember } from '@roomstay/core';\nimport { MenuItemType } from '@/components/generic/modal/SigninModal/AuthenticatedUserModal';\nimport { ConfigCompany } from '@/models/Client/Hotel/Company';\nimport { Placement } from '@popperjs/core';\nimport { Hotel } from '@/models/Client/Hotel/Hotel';\n\nexport interface MemberPortalWidgetConfig extends BaseEngineConfig {\n    company: Pick<ConfigCompany, 'colors' | 'companyShort'> & { checkoutLink?: string; hotel: string | Hotel };\n    authMenuItem?: MenuItemType[];\n    buttonClass?: string;\n    overlayPlacement?: Placement;\n    fallbackPlacements?: Placement;\n    onSignedIn?: (user: IRoomstayMember) => void;\n    onSignedOut?: () => void;\n}\n\nexport class MemberPortalWidget extends BaseEngine<MemberPortalWidgetConfig> {\n    public constructor(bookingContainer: HTMLElement, config?: MemberPortalWidgetConfig) {\n        super(bookingContainer, config);\n        this.source = BookingEngineSource.Auth;\n\n        // TODO: Make this a more permanent solution\n        RoomstayThemeEngine.EngineContainer.classList.add('--transparent-bg');\n    }\n\n    protected async render() {\n        renderMemberPortalWidget(RoomstayThemeEngine.createElementOrReuseExisting('div', 'member-portal-widget'), this);\n    }\n}\n"]}

package/dist/src/engines/MemberPortalWidget/MemberPortalWidgetElement.d.ts

@@ -0,0 +1,6 @@
+import { MemberPortalWidget, MemberPortalWidgetConfig } from './MemberPortalWidget';
+export interface MemberPortalWidgetElementProps extends Omit<MemberPortalWidgetConfig, 'company'> {
+    engine: MemberPortalWidget;
+}
+export default function MemberPortalWidgetElement({ engine }: MemberPortalWidgetElementProps): JSX.Element;
+export declare const renderMemberPortalWidget: (container: Element, engine: MemberPortalWidget) => void;

package/dist/src/engines/MemberPortalWidget/MemberPortalWidgetElement.js

@@ -0,0 +1,116 @@
+"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 });
+exports.renderMemberPortalWidget = void 0;
+const react_1 = __importStar(require("react"));
+const react_dom_1 = require("react-dom");
+const react_i18next_1 = require("react-i18next");
+const react_router_dom_1 = require("react-router-dom");
+const BEButton_1 = __importDefault(require("../../components/generic/BEButton"));
+const Icon_1 = __importStar(require("../../components/generic/Icon/Icon"));
+const SmallSpinner_1 = __importDefault(require("../../components/generic/loader/SmallSpinner"));
+const AuthenticatedUserModal_1 = require("../../components/generic/modal/SigninModal/AuthenticatedUserModal");
+const UnauthenticatedUserModal_1 = require("../../components/generic/modal/SigninModal/UnauthenticatedUserModal");
+const Translation_1 = require("../../translations/Translation");
+const Color_1 = require("../../util/Color");
+const contexts_1 = require("../../contexts/index.js");
+function MemberPortalWidgetElement({ engine }) {
+    const engineConfig = engine.getConfig();
+    const { roomstayMember } = (0, react_1.useContext)(contexts_1.RoomstayMemberContext);
+    const { loading } = (0, react_1.useContext)(contexts_1.AuthenticationContext);
+    const { t } = (0, react_i18next_1.useTranslation)();
+    const [loginModalOpen, setLoginModalOpen] = (0, react_1.useState)(false);
+    const loginAnchorEl = (0, react_1.useRef)(null);
+    const closeLoginClickHandler = () => {
+        setLoginModalOpen(false);
+    };
+    const onLoginClickHandler = () => {
+        setLoginModalOpen(true);
+    };
+    (0, react_1.useEffect)(() => {
+        var _a;
+        if (roomstayMember) {
+            (_a = engineConfig.onSignedIn) === null || _a === void 0 ? void 0 : _a.call(engineConfig, roomstayMember);
+        }
+    }, [roomstayMember]);
+    const authProps = {
+        open: loginModalOpen,
+        anchorEl: loginAnchorEl.current,
+        menuItems: engineConfig.authMenuItem,
+        placement: engineConfig.overlayPlacement || 'bottom-end',
+        fallbackPlacements: engineConfig.fallbackPlacements,
+        basePath: engineConfig.company.checkoutLink,
+        onClose: closeLoginClickHandler,
+        onSignedOut: engineConfig.onSignedOut,
+    };
+    const unauthProps = {
+        open: loginModalOpen,
+        anchorEl: loginAnchorEl.current,
+        placement: engineConfig.overlayPlacement || 'bottom-end',
+        fallbackPlacements: engineConfig.fallbackPlacements,
+        onClose: closeLoginClickHandler,
+    };
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("div", { ref: loginAnchorEl, style: { width: 'fit-content' } }, roomstayMember ? (react_1.default.createElement(BEButton_1.default, { isLoading: loading, size: "small", className: engineConfig.buttonClass, onClick: onLoginClickHandler, stopIconAnimation: true },
+            roomstayMember.forename,
+            " ",
+            roomstayMember.surname,
+            react_1.default.createElement("span", { className: "u-white u-pad-left--light", style: { marginRight: -13 } },
+                react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.ArrowDown2, size: "1.3em", color: Color_1.Color.DarkGrey })))) : (react_1.default.createElement(BEButton_1.default, { isLoading: loading, size: "small", className: engineConfig.buttonClass, onClick: onLoginClickHandler, stopIconAnimation: true },
+            t(Translation_1.Translation.Navigation.SignIn.SignIn),
+            react_1.default.createElement("span", { className: "u-white u-pad-left--light", style: { marginRight: -13 } },
+                react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.ArrowDown2, size: "1.3em", color: Color_1.Color.DarkGrey }))))),
+        react_1.default.createElement(react_1.Suspense, { fallback: SmallSpinner_1.default }, roomstayMember ? react_1.default.createElement(AuthenticatedUserModal_1.AuthenticatedUserModal, Object.assign({}, authProps)) : react_1.default.createElement(UnauthenticatedUserModal_1.UnauthenticatedUserModal, Object.assign({}, unauthProps)))));
+}
+exports.default = MemberPortalWidgetElement;
+const renderMemberPortalWidget = (container, engine) => {
+    const config = engine.getConfig();
+    const companyConfig = config.company;
+    const company = {
+        name: '',
+        logo: '',
+        companyShort: companyConfig.companyShort,
+        colors: companyConfig.colors,
+        selectedHotel: companyConfig.hotel,
+        hotels: typeof companyConfig.hotel === 'string'
+            ? [
+                {
+                    hotelID: companyConfig.hotel,
+                },
+            ]
+            : [companyConfig.hotel],
+    };
+    (0, react_dom_1.render)(react_1.default.createElement(react_1.Suspense, { fallback: react_1.default.createElement(react_1.default.Fragment, null) },
+        react_1.default.createElement(react_router_dom_1.HashRouter, null,
+            react_1.default.createElement(contexts_1.BookingEngineContextWrapper, { engine: engine },
+                react_1.default.createElement(contexts_1.CompanyContextWrapper, { configCompany: company },
+                    react_1.default.createElement(contexts_1.AuthenticationContextProvider, null,
+                        react_1.default.createElement(MemberPortalWidgetElement, { engine: engine })))))), container);
+};
+exports.renderMemberPortalWidget = renderMemberPortalWidget;
+//# sourceMappingURL=MemberPortalWidgetElement.js.map

package/dist/src/engines/MemberPortalWidget/MemberPortalWidgetElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MemberPortalWidgetElement.js","sourceRoot":"/","sources":["src/engines/MemberPortalWidget/MemberPortalWidgetElement.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { Suspense, useContext, useEffect, useRef, useState } from 'react';\nimport { render } from 'react-dom';\nimport { useTranslation } from 'react-i18next';\nimport { HashRouter } from 'react-router-dom';\n\nimport BEButton from '@/components/generic/BEButton';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport SmallSpinner from '@/components/generic/loader/SmallSpinner';\nimport { AuthenticatedUserModal, AuthenticatedUserModalProps } from '@/components/generic/modal/SigninModal/AuthenticatedUserModal';\nimport { UnauthenticatedUserModal, UnauthenticatedUserModalProps } from '@/components/generic/modal/SigninModal/UnauthenticatedUserModal';\nimport { Translation } from '@/translations/Translation';\nimport { Color } from '@/util/Color';\nimport {\n    AuthenticationContext,\n    AuthenticationContextProvider,\n    BookingEngineContextWrapper,\n    CompanyContextWrapper,\n    RoomstayMemberContext,\n    RoomstayMemberContextProvider,\n} from '@frontend/contexts';\n\nimport { MemberPortalWidget, MemberPortalWidgetConfig } from './MemberPortalWidget';\nimport { ConfigCompany } from '@/models/Client/Hotel/Company';\nimport { ConfigHotel } from '@/models/Client/Hotel/Hotel';\n\nexport interface MemberPortalWidgetElementProps extends Omit<MemberPortalWidgetConfig, 'company'> {\n    engine: MemberPortalWidget;\n}\n\nexport default function MemberPortalWidgetElement({ engine }: MemberPortalWidgetElementProps) {\n    const engineConfig = engine.getConfig();\n\n    const { roomstayMember } = useContext(RoomstayMemberContext);\n    const { loading } = useContext(AuthenticationContext);\n\n    const { t } = useTranslation();\n    const [loginModalOpen, setLoginModalOpen] = useState(false);\n    const loginAnchorEl = useRef<HTMLDivElement | null>(null);\n\n    const closeLoginClickHandler = () => {\n        setLoginModalOpen(false);\n    };\n\n    const onLoginClickHandler = () => {\n        setLoginModalOpen(true);\n    };\n\n    useEffect(() => {\n        if (roomstayMember) {\n            engineConfig.onSignedIn?.(roomstayMember);\n        }\n    }, [roomstayMember]);\n\n    const authProps: AuthenticatedUserModalProps = {\n        open: loginModalOpen,\n        anchorEl: loginAnchorEl.current,\n        menuItems: engineConfig.authMenuItem,\n        placement: engineConfig.overlayPlacement || 'bottom-end',\n        fallbackPlacements: engineConfig.fallbackPlacements,\n        basePath: engineConfig.company.checkoutLink,\n        onClose: closeLoginClickHandler,\n        onSignedOut: engineConfig.onSignedOut,\n    };\n\n    const unauthProps: UnauthenticatedUserModalProps = {\n        open: loginModalOpen,\n        anchorEl: loginAnchorEl.current,\n        placement: engineConfig.overlayPlacement || 'bottom-end',\n        fallbackPlacements: engineConfig.fallbackPlacements,\n        onClose: closeLoginClickHandler,\n    };\n\n    return (\n        <>\n            <div ref={loginAnchorEl} style={{ width: 'fit-content' }}>\n                {roomstayMember ? (\n                    <BEButton isLoading={loading} size=\"small\" className={engineConfig.buttonClass} onClick={onLoginClickHandler} stopIconAnimation>\n                        {roomstayMember.forename} {roomstayMember.surname}\n                        <span className=\"u-white u-pad-left--light\" style={{ marginRight: -13 }}>\n                            <Icon icon={IconType.ArrowDown2} size=\"1.3em\" color={Color.DarkGrey} />\n                        </span>\n                    </BEButton>\n                ) : (\n                    <BEButton isLoading={loading} size=\"small\" className={engineConfig.buttonClass} onClick={onLoginClickHandler} stopIconAnimation>\n                        {t(Translation.Navigation.SignIn.SignIn)}\n                        <span className=\"u-white u-pad-left--light\" style={{ marginRight: -13 }}>\n                            <Icon icon={IconType.ArrowDown2} size=\"1.3em\" color={Color.DarkGrey} />\n                        </span>\n                    </BEButton>\n                )}\n            </div>\n            <Suspense fallback={SmallSpinner}>{roomstayMember ? <AuthenticatedUserModal {...authProps} /> : <UnauthenticatedUserModal {...unauthProps} />}</Suspense>\n        </>\n    );\n}\n\nexport const renderMemberPortalWidget = (container: Element, engine: MemberPortalWidget) => {\n    const config = engine.getConfig();\n    const companyConfig = config.company;\n\n    const company: ConfigCompany = {\n        name: '',\n        logo: '',\n        companyShort: companyConfig.companyShort,\n        colors: companyConfig.colors,\n        selectedHotel: companyConfig.hotel,\n        hotels:\n            typeof companyConfig.hotel === 'string'\n                ? [\n                      {\n                          hotelID: companyConfig.hotel,\n                      } as ConfigHotel,\n                  ]\n                : [companyConfig.hotel],\n    };\n\n    render(\n        <Suspense fallback={<></>}>\n            <HashRouter>\n                <BookingEngineContextWrapper engine={engine}>\n                    <CompanyContextWrapper configCompany={company}>\n                        <AuthenticationContextProvider>\n                            <MemberPortalWidgetElement engine={engine} />\n                        </AuthenticationContextProvider>\n                    </CompanyContextWrapper>\n                </BookingEngineContextWrapper>\n            </HashRouter>\n        </Suspense>,\n        container\n    );\n};\n"]}

package/dist/src/engines/RecentSearchesEngine/RecentSearchesEngineElement.js

@@ -36,8 +36,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.renderRecentSearchesEngineElement = exports.RecentSearchesEngineElement = void 0;
-const react_1 = __importDefault(require("react"));
-const react_2 = require("react");
+const react_1 = __importStar(require("react"));
 const react_dom_1 = require("react-dom");
 const RecentSearchesCard_1 = __importDefault(require("../../components/generic/RecentSearchesCard"));
 const BEButton_1 = __importDefault(require("../../components/generic/BEButton"));
@@ -50,11 +49,14 @@ const StepRoom_1 = __importDefault(require("../../pages/steps/StepRoom/StepRoom"
 const dayjs_1 = __importDefault(require("dayjs"));
 const hooks_1 = require("../../hooks/index.js");
 const contexts_1 = require("../../contexts/index.js");
+const react_i18next_1 = require("react-i18next");
+const Translation_1 = require("../../translations/Translation");
 const RecentSearchesEngineElement = ({ engine }) => {
     const { hotel } = (0, hooks_1.useCurrentHotel)();
-    const [currentSessions, setCurrentSessions] = (0, react_2.useState)([]);
-    const beContext = (0, react_2.useContext)(contexts_1.BookingEngineContext);
-    (0, react_2.useEffect)(() => {
+    const { t } = (0, react_i18next_1.useTranslation)();
+    const [currentSessions, setCurrentSessions] = (0, react_1.useState)([]);
+    const beContext = (0, react_1.useContext)(contexts_1.BookingEngineContext);
+    (0, react_1.useEffect)(() => {
         resetSessions();
     }, []);
     const resetSessions = () => {
@@ -95,7 +97,7 @@ const RecentSearchesEngineElement = ({ engine }) => {
         react_1.default.createElement("div", { className: "container" },
             react_1.default.createElement("div", { className: "u-pad-top-bottom--heavy" },
                 react_1.default.createElement("div", { className: "u-marg-bottom" },
-                    react_1.default.createElement(Text_1.default, { color: Color_1.Color.White, bold: true }, "Recent searches"),
+                    react_1.default.createElement(Text_1.default, { color: Color_1.Color.White, bold: true }, t(Translation_1.Translation.RecentSearch.RecentSearches)),
                     beContext.screenSize <= ScreenSize_1.default.Medium && smallBlurb),
                 react_1.default.createElement("div", { className: "row u-marg-bottom" }, !!(currentSessions === null || currentSessions === void 0 ? void 0 : currentSessions.length) &&
                     currentSessions.slice(0, 2).map((session) => {
@@ -126,10 +128,9 @@ const RecentSearchesEngineElement = ({ engine }) => {
                     })),
                 react_1.default.createElement("div", { className: "u-flex u-flex-align-center flex-column flex-md-row justify-align-content-md-center" },
                     beContext.screenSize > ScreenSize_1.default.Medium && smallBlurb,
-                    react_1.default.createElement(BEButton_1.default, { icon: Icon_1.IconType.ArrowRight, iconPosition: "right", primary: true, filled: true, onClick: redirectToCheckout },
-                        "See all ", hotel === null || hotel === void 0 ? void 0 :
-                        hotel.name,
-                        " rooms")))))) : (react_1.default.createElement(react_1.default.Fragment, null));
+                    react_1.default.createElement(BEButton_1.default, { icon: Icon_1.IconType.ArrowRight, iconPosition: "right", primary: true, filled: true, onClick: redirectToCheckout }, t(Translation_1.Translation.RecentSearch.SeeAllRooms, {
+                        hotelName: hotel === null || hotel === void 0 ? void 0 : hotel.name,
+                    }))))))) : (react_1.default.createElement(react_1.default.Fragment, null));
 };
 exports.RecentSearchesEngineElement = RecentSearchesEngineElement;
 const renderRecentSearchesEngineElement = (container, engine) => {

package/dist/src/engines/RecentSearchesEngine/RecentSearchesEngineElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"RecentSearchesEngineElement.js","sourceRoot":"/","sources":["src/engines/RecentSearchesEngine/RecentSearchesEngineElement.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { useState, useEffect, useContext } from 'react';\nimport { render } from 'react-dom';\n\nimport type { RecentSearchesEngine } from '@/engines/RecentSearchesEngine/RecentSearchesEngine';\nimport RecentSearchesCard from '@/components/generic/RecentSearchesCard';\nimport BEButton from '@/components/generic/BEButton';\nimport { Color } from '@/util/Color';\nimport { IconType } from '@/components/generic/Icon/Icon';\nimport Text, { TextType } from '@/components/generic/Text';\nimport BasketRow from '@/models/BasketRow';\nimport ScreenSize from '@/util/ScreenSize';\nimport SessionProvider from '@/providers/SessionProvider';\nimport { RoomstaySession } from '@/models/RoomstaySession';\nimport StepRoom from '@/pages/steps/StepRoom/StepRoom';\nimport dayjs from 'dayjs';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport { BookingEngineContext, BookingEngineContextWrapper } from '@frontend/contexts';\n\nexport interface RecentSearchesEngineElementProps {\n    engine: RecentSearchesEngine;\n}\n\nexport const RecentSearchesEngineElement = ({ engine }: RecentSearchesEngineElementProps) => {\n    const { hotel } = useCurrentHotel();\n\n    const [currentSessions, setCurrentSessions] = useState<RoomstaySession[]>([]);\n\n    const beContext = useContext(BookingEngineContext);\n\n    useEffect(() => {\n        resetSessions();\n    }, []);\n\n    const resetSessions = () => {\n        engine\n            .getSessionProvider()\n            .getAllSessions()\n            .then((sessions) => {\n                const sessionsToUse: RoomstaySession[] = [];\n\n                sessions.forEach((session) => {\n                    if (!hotel || (hotel?.hotelID === session.hotelID && session.basketRows?.length > 0)) {\n                        let hasValidRow = false;\n                        session.basketRows.forEach((basket) => {\n                            if (basket.isValid() && basket.getStartDate().isAfter(dayjs())) {\n                                hasValidRow = true;\n                            }\n                        });\n\n                        if (hasValidRow) {\n                            sessionsToUse.push(session);\n                        }\n                    }\n                });\n\n                sessionsToUse.reverse();\n\n                setCurrentSessions(sessionsToUse);\n            });\n    };\n\n    const smallBlurb = (\n        <Text color={Color.White} type={TextType.Small}>\n            Lorem, ipsum dolor sit amet consectetur adipisicing elit.\n        </Text>\n    );\n\n    const onRemoveCard = async (session: RoomstaySession) => {\n        const provider = new SessionProvider();\n        await provider.initialize(session.id);\n\n        provider.deleteSession();\n\n        resetSessions();\n    };\n\n    const redirectToCheckout = () => {\n        window.open(hotel?.checkoutUrl);\n    };\n\n    return currentSessions.length ? (\n        <div style={{ backgroundColor: Color.Navy }}>\n            <div className=\"container\">\n                <div className=\"u-pad-top-bottom--heavy\">\n                    <div className=\"u-marg-bottom\">\n                        <Text color={Color.White} bold>\n                            Recent searches\n                        </Text>\n                        {beContext.screenSize <= ScreenSize.Medium && smallBlurb}\n                    </div>\n                    <div className=\"row u-marg-bottom\">\n                        {!!currentSessions?.length &&\n                            currentSessions.slice(0, 2).map((session: RoomstaySession) => {\n                                let validRow: BasketRow | undefined = undefined;\n\n                                for (const row of session.basketRows) {\n                                    if (row.isValid()) {\n                                        validRow = row;\n                                        break;\n                                    }\n                                }\n\n                                const removeCard = () => {\n                                    onRemoveCard(session);\n                                };\n\n                                const onViewRates = async () => {\n                                    const manager = new SessionProvider();\n                                    await manager.initialize(session.id);\n\n                                    manager\n                                        .updateSession({\n                                            step: StepRoom.getName(),\n                                        })\n                                        .then(() => {\n                                            window.open(`${hotel?.checkoutUrl ?? '/checkout/'}#${StepRoom.getStepUrl()}?session=${session.id}`, '_self');\n                                        });\n                                };\n\n                                return (\n                                    <div key={validRow?.getID()} className=\"col-lg-6\">\n                                        <RecentSearchesCard basketRow={validRow as BasketRow} onRemove={removeCard} onViewRatesClicked={onViewRates} />\n                                    </div>\n                                );\n                            })}\n                    </div>\n                    <div className=\"u-flex u-flex-align-center flex-column flex-md-row justify-align-content-md-center\">\n                        {beContext.screenSize > ScreenSize.Medium && smallBlurb}\n                        <BEButton icon={IconType.ArrowRight} iconPosition=\"right\" primary filled onClick={redirectToCheckout}>\n                            See all {hotel?.name} rooms\n                        </BEButton>\n                    </div>\n                </div>\n            </div>\n        </div>\n    ) : (\n        <></>\n    );\n};\n\nexport const renderRecentSearchesEngineElement = (container: Element, engine: RecentSearchesEngine) => {\n    render(\n        <BookingEngineContextWrapper engine={engine}>\n            <RecentSearchesEngineElement engine={engine} />\n        </BookingEngineContextWrapper>,\n        container\n    );\n};\n"]}
+{"version":3,"file":"RecentSearchesEngineElement.js","sourceRoot":"/","sources":["src/engines/RecentSearchesEngine/RecentSearchesEngineElement.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useContext, useEffect, useState } from 'react';\nimport { render } from 'react-dom';\n\nimport type { RecentSearchesEngine } from '@/engines/RecentSearchesEngine/RecentSearchesEngine';\nimport RecentSearchesCard from '@/components/generic/RecentSearchesCard';\nimport BEButton from '@/components/generic/BEButton';\nimport { Color } from '@/util/Color';\nimport { IconType } from '@/components/generic/Icon/Icon';\nimport Text, { TextType } from '@/components/generic/Text';\nimport BasketRow from '@/models/BasketRow';\nimport ScreenSize from '@/util/ScreenSize';\nimport SessionProvider from '@/providers/SessionProvider';\nimport { RoomstaySession } from '@/models/RoomstaySession';\nimport StepRoom from '@/pages/steps/StepRoom/StepRoom';\nimport dayjs from 'dayjs';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport { BookingEngineContext, BookingEngineContextWrapper } from '@frontend/contexts';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from '@/translations/Translation';\n\nexport interface RecentSearchesEngineElementProps {\n    engine: RecentSearchesEngine;\n}\n\nexport const RecentSearchesEngineElement = ({ engine }: RecentSearchesEngineElementProps) => {\n    const { hotel } = useCurrentHotel();\n    const { t } = useTranslation();\n\n    const [currentSessions, setCurrentSessions] = useState<RoomstaySession[]>([]);\n\n    const beContext = useContext(BookingEngineContext);\n\n    useEffect(() => {\n        resetSessions();\n    }, []);\n\n    const resetSessions = () => {\n        engine\n            .getSessionProvider()\n            .getAllSessions()\n            .then((sessions) => {\n                const sessionsToUse: RoomstaySession[] = [];\n\n                sessions.forEach((session) => {\n                    if (!hotel || (hotel?.hotelID === session.hotelID && session.basketRows?.length > 0)) {\n                        let hasValidRow = false;\n                        session.basketRows.forEach((basket) => {\n                            if (basket.isValid() && basket.getStartDate().isAfter(dayjs())) {\n                                hasValidRow = true;\n                            }\n                        });\n\n                        if (hasValidRow) {\n                            sessionsToUse.push(session);\n                        }\n                    }\n                });\n\n                sessionsToUse.reverse();\n\n                setCurrentSessions(sessionsToUse);\n            });\n    };\n\n    const smallBlurb = (\n        <Text color={Color.White} type={TextType.Small}>\n            Lorem, ipsum dolor sit amet consectetur adipisicing elit.\n        </Text>\n    );\n\n    const onRemoveCard = async (session: RoomstaySession) => {\n        const provider = new SessionProvider();\n        await provider.initialize(session.id);\n\n        provider.deleteSession();\n\n        resetSessions();\n    };\n\n    const redirectToCheckout = () => {\n        window.open(hotel?.checkoutUrl);\n    };\n\n    return currentSessions.length ? (\n        <div style={{ backgroundColor: Color.Navy }}>\n            <div className=\"container\">\n                <div className=\"u-pad-top-bottom--heavy\">\n                    <div className=\"u-marg-bottom\">\n                        <Text color={Color.White} bold>\n                            {t(Translation.RecentSearch.RecentSearches)}\n                        </Text>\n                        {beContext.screenSize <= ScreenSize.Medium && smallBlurb}\n                    </div>\n                    <div className=\"row u-marg-bottom\">\n                        {!!currentSessions?.length &&\n                            currentSessions.slice(0, 2).map((session: RoomstaySession) => {\n                                let validRow: BasketRow | undefined = undefined;\n\n                                for (const row of session.basketRows) {\n                                    if (row.isValid()) {\n                                        validRow = row;\n                                        break;\n                                    }\n                                }\n\n                                const removeCard = () => {\n                                    onRemoveCard(session);\n                                };\n\n                                const onViewRates = async () => {\n                                    const manager = new SessionProvider();\n                                    await manager.initialize(session.id);\n\n                                    manager\n                                        .updateSession({\n                                            step: StepRoom.getName(),\n                                        })\n                                        .then(() => {\n                                            window.open(`${hotel?.checkoutUrl ?? '/checkout/'}#${StepRoom.getStepUrl()}?session=${session.id}`, '_self');\n                                        });\n                                };\n\n                                return (\n                                    <div key={validRow?.getID()} className=\"col-lg-6\">\n                                        <RecentSearchesCard basketRow={validRow as BasketRow} onRemove={removeCard} onViewRatesClicked={onViewRates} />\n                                    </div>\n                                );\n                            })}\n                    </div>\n                    <div className=\"u-flex u-flex-align-center flex-column flex-md-row justify-align-content-md-center\">\n                        {beContext.screenSize > ScreenSize.Medium && smallBlurb}\n                        <BEButton icon={IconType.ArrowRight} iconPosition=\"right\" primary filled onClick={redirectToCheckout}>\n                            {t(Translation.RecentSearch.SeeAllRooms, {\n                                hotelName: hotel?.name,\n                            })}\n                        </BEButton>\n                    </div>\n                </div>\n            </div>\n        </div>\n    ) : (\n        <></>\n    );\n};\n\nexport const renderRecentSearchesEngineElement = (container: Element, engine: RecentSearchesEngine) => {\n    render(\n        <BookingEngineContextWrapper engine={engine}>\n            <RecentSearchesEngineElement engine={engine} />\n        </BookingEngineContextWrapper>,\n        container\n    );\n};\n"]}

package/dist/src/errors/GetAvailabilityError.d.ts

@@ -1,7 +1,8 @@
 import dayjs from 'dayjs';
 import { RoomstayError } from 'errors/RoomstayError';
+import { TFunction } from 'i18next';
 export default class GetAvailabilityError extends RoomstayError {
     private fromMonth;
     constructor(fromMonth: dayjs.Dayjs, toMonth: dayjs.Dayjs);
-    toString(): void;
+    toString(t?: TFunction): void;
 }

package/dist/src/errors/GetAvailabilityError.js

@@ -1,8 +1,13 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 const BaseAPI_1 = require("../api/BaseAPI");
 const contexts_1 = require("../contexts/index.js");
 const RoomstayError_1 = require("errors/RoomstayError");
+const i18next_1 = __importDefault(require("i18next"));
+const Translation_1 = require("../translations/Translation");
 class GetAvailabilityError extends RoomstayError_1.RoomstayError {
     constructor(fromMonth, toMonth) {
         const fromDatePretty = fromMonth.format(BaseAPI_1.API_DATE_FORMAT);
@@ -10,10 +15,12 @@ class GetAvailabilityError extends RoomstayError_1.RoomstayError {
         super(`Failed to load calendar data for: ${fromDatePretty} - ${toDatePretty}`);
         this.fromMonth = fromMonth;
     }
-    toString() {
+    toString(t = i18next_1.default.t) {
         contexts_1.ErrorHandler.add({
-            title: 'Availability Check Failed',
-            message: `Availability check for ${this.fromMonth.format('MMMM')} failed unexpectedly`,
+            title: t(Translation_1.Translation.Step.Date.AvailabilityCheckFailed.Title),
+            message: t(Translation_1.Translation.Step.Date.AvailabilityCheckFailed.Message, {
+                month: this.fromMonth.format('MMMM'),
+            }),
         });
     }
 }

package/dist/src/errors/GetAvailabilityError.js.map

@@ -1 +1 @@
-{"version":3,"file":"GetAvailabilityError.js","sourceRoot":"/","sources":["src/errors/GetAvailabilityError.ts"],"names":[],"mappings":";;AAEA,2CAAgD;AAChD,iDAAkD;AAClD,wDAAqD;AAErD,MAAqB,oBAAqB,SAAQ,6BAAa;IAG3D,YAAmB,SAAsB,EAAE,OAAoB;QAC3D,MAAM,cAAc,GAAG,SAAS,CAAC,MAAM,CAAC,yBAAe,CAAC,CAAC;QACzD,MAAM,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC,yBAAe,CAAC,CAAC;QAErD,KAAK,CAAC,qCAAqC,cAAc,MAAM,YAAY,EAAE,CAAC,CAAC;QAE/E,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;IAC/B,CAAC;IAEM,QAAQ;QACX,uBAAY,CAAC,GAAG,CAAC;YACb,KAAK,EAAE,2BAA2B;YAClC,OAAO,EAAE,0BAA0B,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,sBAAsB;SACzF,CAAC,CAAC;IACP,CAAC;CACJ;AAlBD,uCAkBC","sourcesContent":["import dayjs from 'dayjs';\n\nimport { API_DATE_FORMAT } from '@/api/BaseAPI';\nimport { ErrorHandler } from '@frontend/contexts';\nimport { RoomstayError } from 'errors/RoomstayError';\n\nexport default class GetAvailabilityError extends RoomstayError {\n    private fromMonth: dayjs.Dayjs;\n\n    public constructor(fromMonth: dayjs.Dayjs, toMonth: dayjs.Dayjs) {\n        const fromDatePretty = fromMonth.format(API_DATE_FORMAT);\n        const toDatePretty = toMonth.format(API_DATE_FORMAT);\n\n        super(`Failed to load calendar data for: ${fromDatePretty} - ${toDatePretty}`);\n\n        this.fromMonth = fromMonth;\n    }\n\n    public toString() {\n        ErrorHandler.add({\n            title: 'Availability Check Failed',\n            message: `Availability check for ${this.fromMonth.format('MMMM')} failed unexpectedly`,\n        });\n    }\n}\n"]}
+{"version":3,"file":"GetAvailabilityError.js","sourceRoot":"/","sources":["src/errors/GetAvailabilityError.ts"],"names":[],"mappings":";;;;;AAEA,2CAAgD;AAChD,iDAAkD;AAClD,wDAAqD;AACrD,sDAA8B;AAC9B,4DAAyD;AAGzD,MAAqB,oBAAqB,SAAQ,6BAAa;IAG3D,YAAmB,SAAsB,EAAE,OAAoB;QAC3D,MAAM,cAAc,GAAG,SAAS,CAAC,MAAM,CAAC,yBAAe,CAAC,CAAC;QACzD,MAAM,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC,yBAAe,CAAC,CAAC;QAErD,KAAK,CAAC,qCAAqC,cAAc,MAAM,YAAY,EAAE,CAAC,CAAC;QAE/E,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;IAC/B,CAAC;IAEM,QAAQ,CAAC,IAAe,iBAAO,CAAC,CAAC;QACpC,uBAAY,CAAC,GAAG,CAAC;YACb,KAAK,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,uBAAuB,CAAC,KAAK,CAAC;YAC7D,OAAO,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,uBAAuB,CAAC,OAAO,EAAE;gBAC9D,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC;aACvC,CAAC;SACL,CAAC,CAAC;IACP,CAAC;CACJ;AApBD,uCAoBC","sourcesContent":["import dayjs from 'dayjs';\n\nimport { API_DATE_FORMAT } from '@/api/BaseAPI';\nimport { ErrorHandler } from '@frontend/contexts';\nimport { RoomstayError } from 'errors/RoomstayError';\nimport i18next from 'i18next';\nimport { Translation } from '@/translations/Translation';\nimport { TFunction } from 'i18next';\n\nexport default class GetAvailabilityError extends RoomstayError {\n    private fromMonth: dayjs.Dayjs;\n\n    public constructor(fromMonth: dayjs.Dayjs, toMonth: dayjs.Dayjs) {\n        const fromDatePretty = fromMonth.format(API_DATE_FORMAT);\n        const toDatePretty = toMonth.format(API_DATE_FORMAT);\n\n        super(`Failed to load calendar data for: ${fromDatePretty} - ${toDatePretty}`);\n\n        this.fromMonth = fromMonth;\n    }\n\n    public toString(t: TFunction = i18next.t) {\n        ErrorHandler.add({\n            title: t(Translation.Step.Date.AvailabilityCheckFailed.Title),\n            message: t(Translation.Step.Date.AvailabilityCheckFailed.Message, {\n                month: this.fromMonth.format('MMMM'),\n            }),\n        });\n    }\n}\n"]}

package/dist/src/hooks/HistoryConsistentPush.d.ts

@@ -0,0 +1 @@
+export declare function useHistoryConsistentPush(): (pathname: string) => void;

package/dist/src/hooks/HistoryConsistentPush.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useHistoryConsistentPush = void 0;
+const react_router_dom_1 = require("react-router-dom");
+function useHistoryConsistentPush() {
+    const history = (0, react_router_dom_1.useHistory)();
+    return (pathname) => {
+        history.push(Object.assign(Object.assign({}, history.location), { pathname }));
+    };
+}
+exports.useHistoryConsistentPush = useHistoryConsistentPush;
+//# sourceMappingURL=HistoryConsistentPush.js.map

package/dist/src/hooks/HistoryConsistentPush.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HistoryConsistentPush.js","sourceRoot":"/","sources":["src/hooks/HistoryConsistentPush.ts"],"names":[],"mappings":";;;AAAA,uDAA8C;AAE9C,SAAgB,wBAAwB;IACpC,MAAM,OAAO,GAAG,IAAA,6BAAU,GAAE,CAAC;IAC7B,OAAO,CAAC,QAAgB,EAAE,EAAE;QACxB,OAAO,CAAC,IAAI,iCACL,OAAO,CAAC,QAAQ,KACnB,QAAQ,IACV,CAAC;IACP,CAAC,CAAC;AACN,CAAC;AARD,4DAQC","sourcesContent":["import { useHistory } from 'react-router-dom';\n\nexport function useHistoryConsistentPush() {\n    const history = useHistory();\n    return (pathname: string) => {\n        history.push({\n            ...history.location,\n            pathname,\n        });\n    };\n}\n"]}

package/dist/src/hooks/LoggedInUserHook.d.ts

@@ -3,8 +3,8 @@ export declare const useMember: () => {
     user: import("@roomstay/core").IRoomstayMember | undefined;
     fullName: string;
     allBookings: IRoomstayMemberBooking[] | undefined;
-    cancelledBookings: import("../contexts/index.js").IRoomstayMemberBookingItemWithRef[] | undefined;
-    pastBookings: import("../contexts/index.js").IRoomstayMemberBookingItemWithRef[] | undefined;
-    upcomingBookings: import("../contexts/index.js").IRoomstayMemberBookingItemWithRef[] | undefined;
+    cancelledBookings: import("../contexts/index.js").IRoomstayMemberBookingItemWithRefAndHotelDetails[] | undefined;
+    pastBookings: import("../contexts/index.js").IRoomstayMemberBookingItemWithRefAndHotelDetails[] | undefined;
+    upcomingBookings: import("../contexts/index.js").IRoomstayMemberBookingItemWithRefAndHotelDetails[] | undefined;
     getItinerary: (id: string) => IRoomstayMemberBooking | null;
 };

package/dist/src/hooks/Query.js

@@ -1,18 +1,14 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useQuery = exports.useHashQuery = void 0;
 const react_router_dom_1 = require("react-router-dom");
-const react_1 = __importDefault(require("react"));
 function useHashQuery() {
     const { search } = (0, react_router_dom_1.useLocation)();
-    return react_1.default.useMemo(() => new URLSearchParams(search), [search]);
+    return new URLSearchParams(search);
 }
 exports.useHashQuery = useHashQuery;
 function useQuery() {
-    return react_1.default.useMemo(() => new URLSearchParams(window.location.search), [window.location.search]);
+    return new URLSearchParams(window.location.search);
 }
 exports.useQuery = useQuery;
 //# sourceMappingURL=Query.js.map

package/dist/src/hooks/Query.js.map

@@ -1 +1 @@
-{"version":3,"file":"Query.js","sourceRoot":"/","sources":["src/hooks/Query.ts"],"names":[],"mappings":";;;;;;AAAA,uDAA+C;AAC/C,kDAA0B;AAE1B,SAAgB,YAAY;IACxB,MAAM,EAAE,MAAM,EAAE,GAAG,IAAA,8BAAW,GAAE,CAAC;IACjC,OAAO,eAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,IAAI,eAAe,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;AACtE,CAAC;AAHD,oCAGC;AAED,SAAgB,QAAQ;IACpB,OAAO,eAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,IAAI,eAAe,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC;AACtG,CAAC;AAFD,4BAEC","sourcesContent":["import { useLocation } from 'react-router-dom';\nimport React from 'react';\n\nexport function useHashQuery() {\n    const { search } = useLocation();\n    return React.useMemo(() => new URLSearchParams(search), [search]);\n}\n\nexport function useQuery() {\n    return React.useMemo(() => new URLSearchParams(window.location.search), [window.location.search]);\n}\n"]}
+{"version":3,"file":"Query.js","sourceRoot":"/","sources":["src/hooks/Query.ts"],"names":[],"mappings":";;;AAAA,uDAA+C;AAE/C,SAAgB,YAAY;IACxB,MAAM,EAAE,MAAM,EAAE,GAAG,IAAA,8BAAW,GAAE,CAAC;IACjC,OAAO,IAAI,eAAe,CAAC,MAAM,CAAC,CAAC;AACvC,CAAC;AAHD,oCAGC;AAED,SAAgB,QAAQ;IACpB,OAAO,IAAI,eAAe,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;AACvD,CAAC;AAFD,4BAEC","sourcesContent":["import { useLocation } from 'react-router-dom';\n\nexport function useHashQuery() {\n    const { search } = useLocation();\n    return new URLSearchParams(search);\n}\n\nexport function useQuery() {\n    return new URLSearchParams(window.location.search);\n}\n"]}

package/dist/src/hooks/UpdateQueryParameters.d.ts

@@ -0,0 +1 @@
+export declare function useUpdateQueryParameters(): (queryParameters: Record<string, string>) => void;

package/dist/src/hooks/UpdateQueryParameters.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useUpdateQueryParameters = void 0;
+const react_router_dom_1 = require("react-router-dom");
+const Query_1 = require("hooks/Query");
+function useUpdateQueryParameters() {
+    const history = (0, react_router_dom_1.useHistory)();
+    const hashQuery = (0, Query_1.useHashQuery)();
+    return (queryParameters) => {
+        for (const key in queryParameters)
+            hashQuery.set(key, queryParameters[key]);
+        history.push(Object.assign(Object.assign({}, history.location), { search: hashQuery.toString() }));
+    };
+}
+exports.useUpdateQueryParameters = useUpdateQueryParameters;
+//# sourceMappingURL=UpdateQueryParameters.js.map

package/dist/src/hooks/UpdateQueryParameters.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UpdateQueryParameters.js","sourceRoot":"/","sources":["src/hooks/UpdateQueryParameters.ts"],"names":[],"mappings":";;;AAAA,uDAA8C;AAC9C,uCAA2C;AAE3C,SAAgB,wBAAwB;IACpC,MAAM,OAAO,GAAG,IAAA,6BAAU,GAAE,CAAC;IAC7B,MAAM,SAAS,GAAG,IAAA,oBAAY,GAAE,CAAC;IACjC,OAAO,CAAC,eAAuC,EAAE,EAAE;QAC/C,KAAK,MAAM,GAAG,IAAI,eAAe;YAAE,SAAS,CAAC,GAAG,CAAC,GAAG,EAAE,eAAe,CAAC,GAAG,CAAC,CAAC,CAAC;QAC5E,OAAO,CAAC,IAAI,iCACL,OAAO,CAAC,QAAQ,KACnB,MAAM,EAAE,SAAS,CAAC,QAAQ,EAAE,IAC9B,CAAC;IACP,CAAC,CAAC;AACN,CAAC;AAVD,4DAUC","sourcesContent":["import { useHistory } from 'react-router-dom';\nimport { useHashQuery } from 'hooks/Query';\n\nexport function useUpdateQueryParameters() {\n    const history = useHistory();\n    const hashQuery = useHashQuery();\n    return (queryParameters: Record<string, string>) => {\n        for (const key in queryParameters) hashQuery.set(key, queryParameters[key]);\n        history.push({\n            ...history.location,\n            search: hashQuery.toString(),\n        });\n    };\n}\n"]}

package/dist/src/hooks/VGSHooks.d.ts

@@ -1,15 +1,25 @@
 /// <reference types="react" />
 import { ECardType } from '../models/PaymentCard';
+import { IVGSVaultNames } from '../models/Client/Hotel/Hotel';
 declare global {
     interface Window {
         VGSCollect: any;
     }
 }
+type VGSVaultType = keyof IVGSVaultNames;
 type UseVgsShowProps = {
     name: string;
     value?: string;
     styles?: Record<string, any>;
+    vaultType?: VGSVaultType;
 };
+/**
+ * TODO: This only works for the Members vault right now
+ *
+ * Need to:
+ * - Update the serializer
+ * - Handle errors better
+ */
 export declare const useVgsShow: (props: UseVgsShowProps) => {
     targetRef: import("react").MutableRefObject<HTMLElement | null>;
     isLoading: boolean;
@@ -35,7 +45,7 @@ type VGSCollectInputState = {
     vgsInput: any;
     cardType?: ECardType;
 };
-export declare const useVgsCollect: (fields: VGSCollectProps[]) => {
+export declare const useVgsCollect: (fields: VGSCollectProps[], vaultType?: VGSVaultType) => {
     fields: {
         ref: import("react").MutableRefObject<HTMLDivElement | null>;
         state: VGSCollectInputState;

package/dist/src/hooks/VGSHooks.js

@@ -21,10 +21,30 @@ const AsyncAuth_1 = require("../util/AsyncAuth");
 let vgsShowLoader = null;
 let VGSShow;
 let vgsCollectLoader = null;
+const getVGSVaultKey = (vaultName = 'standard') => {
+    var _a, _b, _c, _d, _e, _f;
+    const { hotel } = (0, CurrentHotelHook_1.useCurrentHotel)();
+    const members = (_c = (_b = (_a = hotel === null || hotel === void 0 ? void 0 : hotel.vgs) === null || _a === void 0 ? void 0 : _a.vaultNames) === null || _b === void 0 ? void 0 : _b.members) !== null && _c !== void 0 ? _c : 'tntmupn9ras';
+    const standard = (_f = (_e = (_d = hotel === null || hotel === void 0 ? void 0 : hotel.vgs) === null || _d === void 0 ? void 0 : _d.vaultNames) === null || _e === void 0 ? void 0 : _e.standard) !== null && _f !== void 0 ? _f : 'tntjyo5u2pi';
+    switch (vaultName) {
+        case 'members':
+            return members;
+        case 'standard':
+        default:
+            return standard;
+    }
+};
 window.VGSCollect = window.VGSCollect || {};
+/**
+ * TODO: This only works for the Members vault right now
+ *
+ * Need to:
+ * - Update the serializer
+ * - Handle errors better
+ */
 const useVgsShow = (props) => {
-    const { hotel } = (0, CurrentHotelHook_1.useCurrentHotel)();
-    const [randomId, setRandomId] = (0, react_1.useState)(btoa((Math.random() * Math.random() * Date.now()).toString()).replace(/=/gi, ''));
+    const vgsKeys = getVGSVaultKey('members');
+    const [randomId] = (0, react_1.useState)(btoa((Math.random() * Math.random() * Date.now()).toString()).replace(/=/gi, ''));
     const [isLoading, setIsLoading] = (0, react_1.useState)(false);
     const targetRef = (0, react_1.useRef)(null);
     (0, react_1.useEffect)(() => {
@@ -32,8 +52,7 @@ const useVgsShow = (props) => {
             vgsShowLoader = (() => __awaiter(void 0, void 0, void 0, function* () {
                 try {
                     yield RoomstayThemeEngine_1.default.loadScript('https://js.verygoodvault.com/vgs-show/2.0.2/show.js', 'vgs-show');
-                    // TODO: Load this ID dynamically
-                    VGSShow = window.VGSShow.create(hotel === null || hotel === void 0 ? void 0 : hotel.vgsVaultName).setEnvironment('live');
+                    VGSShow = window.VGSShow.create(vgsKeys, (state) => { }).setEnvironment('live');
                 }
                 catch (ex) {
                     console.error('Unable to load vgs-show ' + ex.message);
@@ -76,17 +95,13 @@ const useVgsShow = (props) => {
         }
     });
     (0, react_1.useEffect)(() => {
-        let cancelled = false;
         handleReveal();
-        return () => {
-            cancelled = true;
-        };
     }, [VGSShow, targetRef, props.name, props.value]);
     return { targetRef, isLoading };
 };
 exports.useVgsShow = useVgsShow;
-const useVgsCollect = (fields) => {
-    const { hotel } = (0, CurrentHotelHook_1.useCurrentHotel)();
+const useVgsCollect = (fields, vaultType = 'standard') => {
+    const vaultKey = getVGSVaultKey(vaultType);
     const refs = fields.map(() => {
         return (0, react_1.useRef)(null);
     });
@@ -151,7 +166,7 @@ const useVgsCollect = (fields) => {
             }
         }
         if (vgsLoaded && !vgsForm) {
-            const form = window.VGSCollect.create(hotel === null || hotel === void 0 ? void 0 : hotel.vgsVaultName, 'live', (state) => {
+            const form = window.VGSCollect.create(vaultKey, 'live', (state) => {
                 setInputState((oldState) => {
                     const newState = [...oldState];
                     for (const input of newState) {