@roomstay/frontend 2.1.6 → 2.1.7

package/dist/src/pages/findReservation/FindReservation.js.map

@@ -1 +1 @@
-{"version":3,"file":"FindReservation.js","sourceRoot":"/","sources":["src/pages/findReservation/FindReservation.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useEffect, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport Headline from '@/components/generic/Headline';\nimport TextBox from '@/components/generic/TextBox';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { Color } from '@/util/Color';\nimport BEButton from '@/components/generic/BEButton';\nimport { useForm } from 'react-hook-form';\nimport { IconType } from '@/components/generic/Icon/Icon';\nimport API from '@/api/BookingAPI';\nimport AutoAutoHeight from '@/animations/AutoAutoHeight';\nimport Alert, { AlertType } from '@/components/generic/Alert';\nimport { useHistory, useParams } from 'react-router-dom';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\nimport LineBreak from '@/components/generic/LineBreak';\nimport { useCurrentHotel, useEvent } from '@frontend/hooks';\nimport { Translation } from 'translations/Translation';\nimport StepManager from '@/util/StepManager';\nimport { SignInForm } from '@/components/User/Forms/SignInForm';\nimport { SignUpForm } from '@/components/User/Forms/SignUpForm';\nimport FadeAnimation from '@/animations/Fade';\nimport { ForgotPasswordForm } from '@/components/User/Forms/ForgotPasswordForm';\nimport { FindReservationViewEvent } from '@frontend/events';\nimport { EViewingScreen } from '@/components/generic/modal/SigninModal/UnauthenticatedUserModal';\nimport MemberPortalFeature from '@/providers/feature/MemberPortalFeature';\nimport { EMAIL_REGEX } from '@/util/Validation';\n\nexport const QUERY_PARAM_NAME = 'path';\n\nexport enum EFindReservationPath {\n    FindReservation = 'find-reservation',\n    Login = 'login',\n    Register = 'register',\n    Forgot = 'forgot',\n}\n\nconst pathToScreenMapping: { [path in EFindReservationPath]: EViewingScreen } = {\n    [EFindReservationPath.FindReservation]: EViewingScreen.Default,\n    [EFindReservationPath.Login]: EViewingScreen.SignIn,\n    [EFindReservationPath.Register]: EViewingScreen.SignUp,\n    [EFindReservationPath.Forgot]: EViewingScreen.ForgotPassword,\n};\n\ninterface IQueryParams {\n    [QUERY_PARAM_NAME]: EFindReservationPath;\n}\n\nexport default function FindReservation() {\n    const { hotel } = useCurrentHotel();\n\n    const { t } = useTranslation();\n\n    const { register, formState, handleSubmit, getValues } = useForm({\n        mode: 'onChange',\n    });\n\n    const errors = formState.errors;\n\n    const getValidationClass = (name: string) => {\n        if (errors && formState.touchedFields[name]) {\n            if (errors[name]) {\n                return 'error';\n            } else {\n                return 'success';\n            }\n        } else {\n            return null;\n        }\n    };\n\n    const { path }: IQueryParams = useParams<IQueryParams>();\n    const firstTime = useRef<boolean>(true);\n    const nextViewingScreen = useRef<EViewingScreen>();\n\n    const [isLoading, setIsLoading] = useState(false);\n    const [apiErrorMessages, setApiErrorMessages] = useState('');\n    const [viewingScreen, setViewingScreen] = useState<EViewingScreen>(pathToScreenMapping[path]);\n\n    useEffect(() => {\n        if (firstTime.current) {\n            firstTime.current = false;\n            setViewingScreen(pathToScreenMapping[path]);\n        } else {\n            setViewingScreen(null);\n            nextViewingScreen.current = pathToScreenMapping[path];\n        }\n    }, [path]);\n\n    const history = useHistory();\n\n    const onSubmit = () => {\n        setIsLoading(true);\n        setApiErrorMessages('');\n\n        API.Reservation.findReservation(getValues('Ref'), getValues('Email'), hotel.hotelID)\n            .then((data) => {\n                history.push(`/find-reservation/${getValues('Ref')}/${getValues('Email')}`);\n            })\n            .catch(({ Message }) => {\n                console.log(Message);\n                setApiErrorMessages(Message);\n                setIsLoading(false);\n            });\n    };\n\n    const { raise } = useEvent();\n\n    useEffect(() => {\n        const background = document.createElement('div');\n        background.classList.add('dbe-background');\n        background.style.backgroundImage = `url('${hotel?.heroImage}')`;\n\n        RoomstayThemeEngine.EngineContainer.classList.add('--transparent-bg');\n        RoomstayThemeEngine.EngineContainer.appendChild(background);\n\n        const event = new FindReservationViewEvent();\n        raise(event);\n\n        return () => {\n            try {\n                RoomstayThemeEngine.EngineContainer.removeChild(background);\n                RoomstayThemeEngine.EngineContainer.classList.remove('--transparent-bg');\n            } catch (ex) {\n                console.log('Unable to remove bg');\n            }\n        };\n    }, []);\n\n    useEffect(() => {\n        if (hotel?.forwardFindReservationToSynxis) {\n            window.open(`https://be.synxis.com/signin?hotel=` + hotel.hotelID);\n        }\n    }, [hotel]);\n\n    const onBack = async () => {\n        history.push(StepManager.getFirstStep().getStepUrl());\n    };\n\n    const handleSubmitOnClick = () => {\n        handleSubmit(onSubmit)();\n    };\n\n    const onSignInClicked = () => {\n        history.push(`/${EFindReservationPath.Login}`);\n    };\n\n    const onBackToItineraryClicked = () => {\n        history.push(`/${EFindReservationPath.FindReservation}`);\n    };\n\n    const onSignUpClicked = () => {\n        history.push(`/${EFindReservationPath.Register}`);\n    };\n\n    const onForgotPasswordClicked = () => {\n        history.push(`/${EFindReservationPath.Forgot}`);\n    };\n\n    const onExit = () => {\n        setViewingScreen(nextViewingScreen.current);\n    };\n\n    const defaultContents = (\n        <form onSubmit={handleSubmit(onSubmit)}>\n            <div className=\"u-marg-bottom--heavy\">\n                <Headline size=\"extra-large\">{t(Translation.FindReservation.FindYourReservation)}</Headline>\n            </div>\n            <AutoAutoHeight open={!!apiErrorMessages}>\n                <div className=\"u-flex\">\n                    <Alert type={AlertType.Danger} icon={IconType.Error}>\n                        <Text type={TextType.Small}>{apiErrorMessages}</Text>\n                    </Alert>\n                </div>\n            </AutoAutoHeight>\n            <div className=\"u-marg-bottom\">\n                <div className=\"u-marg-bottom--light\">\n                    <Text type={TextType.Label} color={Color.Navy}>\n                        <strong>{t(Translation.FindReservation.Confirmation)}</strong>\n                    </Text>\n                </div>\n                <TextBox\n                    placeholder=\"51244AB23101\"\n                    required={true}\n                    validationStatus={getValidationClass('Ref')}\n                    {...register('Ref', {\n                        required: true,\n                    })}\n                />\n            </div>\n            <div className=\"u-marg-bottom\">\n                <div className=\"u-marg-bottom--light\">\n                    <Text type={TextType.Label} color={Color.Navy}>\n                        <strong>{t(Translation.FindReservation.EmailAddress)}</strong>\n                    </Text>\n                </div>\n                <TextBox\n                    placeholder=\"example@mail.com\"\n                    required={true}\n                    validationStatus={getValidationClass('Email')}\n                    name={'Email'}\n                    {...register('Email', {\n                        required: true,\n                        pattern: {\n                            value: EMAIL_REGEX,\n                            message: t(Translation.FindReservation.InvalidEmailAddress),\n                        },\n                    })}\n                />\n            </div>\n            <div className=\"u-flex justify-content-end w-100\">\n                <BEButton primary={true} filled={true} mobileWidth={true} isLoading={isLoading} icon={IconType.ArrowRight} iconPosition=\"right\" onClick={handleSubmitOnClick}>\n                    {t(Translation.FindReservation.FindReservation)}\n                </BEButton>\n                <button type=\"submit\" className=\"u-none\">\n                    {t(Translation.FindReservation.Submit)}\n                </button>\n            </div>\n            <LineBreak />\n            {MemberPortalFeature.isActive() && (\n                <div className=\"u-marg-bottom--heavy\">\n                    <BEButton isText={true} primary={true} size={'small'} onClick={onSignInClicked}>\n                        Or sign in for more\n                    </BEButton>\n                </div>\n            )}\n            <div className=\"u-marg-bottom--light\">\n                <Text type={TextType.Small}>\n                    <strong>{t(Translation.FindReservation.Question)}</strong>\n                </Text>\n            </div>\n            <Text type={TextType.Small}>{t(Translation.FindReservation.Answer1)}</Text>\n            <Text type={TextType.Small}>{t(Translation.FindReservation.Answer2)}</Text>\n            <LineBreak />\n            <BEButton\n                textColor={Color.Accent}\n                primary={false}\n                filled={false}\n                mobileWidth={true}\n                size=\"small\"\n                icon={IconType.ArrowLeft2}\n                iconPosition=\"left\"\n                onClick={onBack}\n                isText={true}\n            >\n                {t(Translation.FindReservation.Back)}\n            </BEButton>\n        </form>\n    );\n\n    const signInForm = (\n        <>\n            <SignInForm onForgotPassword={onForgotPasswordClicked} />\n            <LineBreak />\n            <div className=\"u-marg-bottom--heavy\">\n                <BEButton isText={true} primary={true} size={'small'} onClick={onBackToItineraryClicked}>\n                    Or use Confirmation/Itinerary Number\n                </BEButton>\n            </div>\n            <Text type={TextType.Small} bold={true} className=\"u-marg-bottom--light\">\n                No online account?\n            </Text>\n            <Text type={TextType.Small}>\n                <BEButton isText={true} size={'small'} primary={true} onClick={onSignUpClicked}>\n                    Sign up\n                </BEButton>{' '}\n                to save time on your next booking.\n            </Text>\n        </>\n    );\n\n    const signUpForm = (\n        <>\n            <SignUpForm />\n            <LineBreak />\n            <Text type={TextType.Small} bold={true} className=\"u-marg-bottom--light\">\n                Already have an account?\n            </Text>\n            <Text type={TextType.Small}>\n                <BEButton isText={true} size={'small'} primary={true} onClick={onSignInClicked}>\n                    Sign in\n                </BEButton>{' '}\n                to login with your account.\n            </Text>\n        </>\n    );\n\n    const forgotPasswordForm = (\n        <>\n            <ForgotPasswordForm onCancelled={onSignInClicked} />\n            <LineBreak />\n            <Text type={TextType.Small} bold={true} className=\"u-marg-bottom--light\">\n                No online account?\n            </Text>\n            <Text type={TextType.Small}>\n                <BEButton isText={true} size={'small'} primary={true} onClick={onSignUpClicked}>\n                    Sign up\n                </BEButton>{' '}\n                to save time on your next booking.\n            </Text>\n        </>\n    );\n\n    return (\n        <div className=\"u-pad-left u-pad-right\">\n            <div className=\"container u-marg-top--heavy u-pad-bottom--massive\">\n                <div className=\"row u-pad-bottom--massive\">\n                    <div className=\"col-md-6 col-xl-4 u-fill-white u-pad--heavy u-shadow-accent-large u-border-rounded\">\n                        <AutoAutoHeight open={true} startOpen={true}>\n                            <FadeAnimation open={viewingScreen === 'Default'} onExitCompletely={onExit}>\n                                {defaultContents}\n                            </FadeAnimation>\n                            <FadeAnimation open={viewingScreen === 'SignIn'} onExitCompletely={onExit}>\n                                {signInForm}\n                            </FadeAnimation>\n                            <FadeAnimation open={viewingScreen === 'SignUp'} onExitCompletely={onExit}>\n                                {signUpForm}\n                            </FadeAnimation>\n                            <FadeAnimation open={viewingScreen === 'ForgotPassword'} onExitCompletely={onExit}>\n                                {forgotPasswordForm}\n                            </FadeAnimation>\n                        </AutoAutoHeight>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n}\n"]}
+{"version":3,"file":"FindReservation.js","sourceRoot":"/","sources":["src/pages/findReservation/FindReservation.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { useEffect, useRef, useState, Suspense } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport Headline from '@/components/generic/Headline';\nimport TextBox from '@/components/generic/TextBox';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { Color } from '@/util/Color';\nimport BEButton from '@/components/generic/BEButton';\nimport { useForm } from 'react-hook-form';\nimport { IconType } from '@/components/generic/Icon/Icon';\nimport API from '@/api/BookingAPI';\nimport AutoAutoHeight from '@/animations/AutoAutoHeight';\nimport Alert, { AlertType } from '@/components/generic/Alert';\nimport { useHistory, useParams } from 'react-router-dom';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\nimport LineBreak from '@/components/generic/LineBreak';\nimport { useCurrentHotel, useEvent } from '@frontend/hooks';\nimport { Translation } from 'translations/Translation';\nimport StepManager from '@/util/StepManager';\nimport FadeAnimation from '@/animations/Fade';\nimport { FindReservationViewEvent } from '@frontend/events';\nimport { EViewingScreen } from '@/components/generic/modal/SigninModal/UnauthenticatedUserModal';\nimport MemberPortalFeature from '@/providers/feature/MemberPortalFeature';\nimport { EMAIL_REGEX } from '@/util/Validation';\nimport SmallSpinner from '@/components/generic/loader/SmallSpinner';\n\nconst SignInForm = React.lazy(() =>\n    import('@/components/User/Forms/SignInForm').then(({ SignInForm }) => ({\n        default: SignInForm,\n    }))\n);\nconst SignUpForm = React.lazy(() =>\n    import('@/components/User/Forms/SignUpForm').then(({ SignUpForm }) => ({\n        default: SignUpForm,\n    }))\n);\nconst ForgotPasswordForm = React.lazy(() =>\n    import('@/components/User/Forms/ForgotPasswordForm').then(({ ForgotPasswordForm }) => ({\n        default: ForgotPasswordForm,\n    }))\n);\n\nexport const QUERY_PARAM_NAME = 'path';\n\nexport enum EFindReservationPath {\n    FindReservation = 'find-reservation',\n    Login = 'login',\n    Register = 'register',\n    Forgot = 'forgot',\n}\n\nconst pathToScreenMapping: { [path in EFindReservationPath]: EViewingScreen } = {\n    [EFindReservationPath.FindReservation]: EViewingScreen.Default,\n    [EFindReservationPath.Login]: EViewingScreen.SignIn,\n    [EFindReservationPath.Register]: EViewingScreen.SignUp,\n    [EFindReservationPath.Forgot]: EViewingScreen.ForgotPassword,\n};\n\ninterface IQueryParams {\n    [QUERY_PARAM_NAME]: EFindReservationPath;\n}\n\nexport default function FindReservation() {\n    const { hotel } = useCurrentHotel();\n\n    const { t } = useTranslation();\n\n    const { register, formState, handleSubmit, getValues } = useForm({\n        mode: 'onChange',\n    });\n\n    const errors = formState.errors;\n\n    const getValidationClass = (name: string) => {\n        if (errors && formState.touchedFields[name]) {\n            if (errors[name]) {\n                return 'error';\n            } else {\n                return 'success';\n            }\n        }\n    };\n\n    const { path }: IQueryParams = useParams<IQueryParams>();\n    const firstTime = useRef<boolean>(true);\n    const nextViewingScreen = useRef<EViewingScreen | null>(null);\n\n    const [isLoading, setIsLoading] = useState(false);\n    const [apiErrorMessages, setApiErrorMessages] = useState('');\n    const [viewingScreen, setViewingScreen] = useState<EViewingScreen | null>(pathToScreenMapping[path]);\n\n    useEffect(() => {\n        if (firstTime.current) {\n            firstTime.current = false;\n            setViewingScreen(pathToScreenMapping[path]);\n        } else {\n            setViewingScreen(null);\n            nextViewingScreen.current = pathToScreenMapping[path];\n        }\n    }, [path]);\n\n    const history = useHistory();\n\n    const onSubmit = () => {\n        setIsLoading(true);\n        setApiErrorMessages('');\n\n        API.Reservation.findReservation(getValues('Ref'), getValues('Email'), hotel?.hotelID as string)\n            .then((data) => {\n                history.push(`/find-reservation/${getValues('Ref')}/${getValues('Email')}`);\n            })\n            .catch(({ Message }) => {\n                console.log(Message);\n                setApiErrorMessages(Message);\n                setIsLoading(false);\n            });\n    };\n\n    const { raise } = useEvent();\n\n    useEffect(() => {\n        const background = document.createElement('div');\n        background.classList.add('dbe-background');\n        background.style.backgroundImage = `url('${hotel?.heroImage}')`;\n\n        RoomstayThemeEngine.EngineContainer.classList.add('--transparent-bg');\n        RoomstayThemeEngine.EngineContainer.appendChild(background);\n\n        const event = new FindReservationViewEvent();\n        raise(event);\n\n        return () => {\n            try {\n                RoomstayThemeEngine.EngineContainer.removeChild(background);\n                RoomstayThemeEngine.EngineContainer.classList.remove('--transparent-bg');\n            } catch (ex) {\n                console.log('Unable to remove bg');\n            }\n        };\n    }, []);\n\n    useEffect(() => {\n        if (hotel?.forwardFindReservationToSynxis) {\n            window.open(`https://be.synxis.com/signin?hotel=` + hotel.hotelID);\n        }\n    }, [hotel]);\n\n    const onBack = async () => {\n        history.push(StepManager.getFirstStep().getStepUrl());\n    };\n\n    const handleSubmitOnClick = () => {\n        handleSubmit(onSubmit)();\n    };\n\n    const onSignInClicked = () => {\n        history.push(`/${EFindReservationPath.Login}`);\n    };\n\n    const onBackToItineraryClicked = () => {\n        history.push(`/${EFindReservationPath.FindReservation}`);\n    };\n\n    const onSignUpClicked = () => {\n        history.push(`/${EFindReservationPath.Register}`);\n    };\n\n    const onForgotPasswordClicked = () => {\n        history.push(`/${EFindReservationPath.Forgot}`);\n    };\n\n    const onExit = () => {\n        setViewingScreen(nextViewingScreen.current);\n    };\n\n    const defaultContents = (\n        <form onSubmit={handleSubmit(onSubmit)}>\n            <div className=\"u-marg-bottom--heavy\">\n                <Headline size=\"extra-large\">{t(Translation.FindReservation.FindYourReservation)}</Headline>\n            </div>\n            <AutoAutoHeight open={!!apiErrorMessages}>\n                <div className=\"u-flex\">\n                    <Alert type={AlertType.Danger} icon={IconType.Error}>\n                        <Text type={TextType.Small}>{apiErrorMessages}</Text>\n                    </Alert>\n                </div>\n            </AutoAutoHeight>\n            <div className=\"u-marg-bottom\">\n                <div className=\"u-marg-bottom--light\">\n                    <Text type={TextType.Label} color={Color.Navy}>\n                        <strong>{t(Translation.FindReservation.Confirmation)}</strong>\n                    </Text>\n                </div>\n                <TextBox\n                    placeholder=\"51244AB23101\"\n                    required\n                    validationStatus={getValidationClass('Ref')}\n                    {...register('Ref', {\n                        required: true,\n                    })}\n                />\n            </div>\n            <div className=\"u-marg-bottom\">\n                <div className=\"u-marg-bottom--light\">\n                    <Text type={TextType.Label} color={Color.Navy}>\n                        <strong>{t(Translation.FindReservation.EmailAddress)}</strong>\n                    </Text>\n                </div>\n                <TextBox\n                    placeholder=\"example@mail.com\"\n                    required\n                    validationStatus={getValidationClass('Email')}\n                    {...register('Email', {\n                        required: true,\n                        pattern: {\n                            value: EMAIL_REGEX,\n                            message: t(Translation.FindReservation.InvalidEmailAddress),\n                        },\n                    })}\n                />\n            </div>\n            <div className=\"u-flex justify-content-end w-100\">\n                <BEButton primary filled mobileWidth isLoading={isLoading} icon={IconType.ArrowRight} iconPosition=\"right\" onClick={handleSubmitOnClick}>\n                    {t(Translation.FindReservation.FindReservation)}\n                </BEButton>\n                <button type=\"submit\" className=\"u-none\">\n                    {t(Translation.FindReservation.Submit)}\n                </button>\n            </div>\n            <LineBreak />\n            {MemberPortalFeature.isActive() && (\n                <div className=\"u-marg-bottom--heavy\">\n                    <BEButton isText primary size=\"small\" onClick={onSignInClicked}>\n                        Or sign in for more\n                    </BEButton>\n                </div>\n            )}\n            <div className=\"u-marg-bottom--light\">\n                <Text type={TextType.Small}>\n                    <strong>{t(Translation.FindReservation.Question)}</strong>\n                </Text>\n            </div>\n            <Text type={TextType.Small}>{t(Translation.FindReservation.Answer1)}</Text>\n            <Text type={TextType.Small}>{t(Translation.FindReservation.Answer2)}</Text>\n            <LineBreak />\n            <BEButton textColor={Color.Accent} primary={false} filled={false} mobileWidth size=\"small\" icon={IconType.ArrowLeft2} iconPosition=\"left\" onClick={onBack} isText>\n                {t(Translation.FindReservation.Back)}\n            </BEButton>\n        </form>\n    );\n\n    const signInForm = (\n        <>\n            <SignInForm onForgotPassword={onForgotPasswordClicked} />\n            <LineBreak />\n            <div className=\"u-marg-bottom--heavy\">\n                <BEButton isText primary size=\"small\" onClick={onBackToItineraryClicked}>\n                    Or use Confirmation/Itinerary Number\n                </BEButton>\n            </div>\n            <Text type={TextType.Small} bold className=\"u-marg-bottom--light\">\n                No online account?\n            </Text>\n            <Text type={TextType.Small}>\n                <BEButton isText size=\"small\" primary onClick={onSignUpClicked}>\n                    Sign up\n                </BEButton>{' '}\n                to save time on your next booking.\n            </Text>\n        </>\n    );\n\n    const signUpForm = (\n        <>\n            <SignUpForm />\n            <LineBreak />\n            <Text type={TextType.Small} bold className=\"u-marg-bottom--light\">\n                Already have an account?\n            </Text>\n            <Text type={TextType.Small}>\n                <BEButton isText size=\"small\" primary onClick={onSignInClicked}>\n                    Sign in\n                </BEButton>{' '}\n                to login with your account.\n            </Text>\n        </>\n    );\n\n    const forgotPasswordForm = (\n        <>\n            <ForgotPasswordForm onCancelled={onSignInClicked} />\n            <LineBreak />\n            <Text type={TextType.Small} bold className=\"u-marg-bottom--light\">\n                No online account?\n            </Text>\n            <Text type={TextType.Small}>\n                <BEButton isText size=\"small\" primary onClick={onSignUpClicked}>\n                    Sign up\n                </BEButton>{' '}\n                to save time on your next booking.\n            </Text>\n        </>\n    );\n\n    return (\n        <div className=\"u-pad-left u-pad-right\">\n            <div className=\"container u-marg-top--heavy u-pad-bottom--massive\">\n                <div className=\"row u-pad-bottom--massive\">\n                    <div className=\"col-md-6 col-xl-4 u-fill-white u-pad--heavy u-shadow-accent-large u-border-rounded\">\n                        <AutoAutoHeight open startOpen>\n                            <FadeAnimation open={viewingScreen === 'Default'} onExitCompletely={onExit}>\n                                {defaultContents}\n                            </FadeAnimation>\n                            <Suspense fallback={SmallSpinner}>\n                                <FadeAnimation open={viewingScreen === 'SignIn'} onExitCompletely={onExit}>\n                                    {signInForm}\n                                </FadeAnimation>\n                                <FadeAnimation open={viewingScreen === 'SignUp'} onExitCompletely={onExit}>\n                                    {signUpForm}\n                                </FadeAnimation>\n                                <FadeAnimation open={viewingScreen === 'ForgotPassword'} onExitCompletely={onExit}>\n                                    {forgotPasswordForm}\n                                </FadeAnimation>\n                            </Suspense>\n                        </AutoAutoHeight>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n}\n"]}

package/dist/src/pages/findReservation/FindReservationResults.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 react_router_dom_1 = require("react-router-dom");
-const react_1 = require("react");
+const react_2 = require("react");
 const BookingAPI_1 = __importDefault(require("../../api/BookingAPI"));
 const Color_1 = require("../../util/Color");
 const LargeLoader_1 = __importDefault(require("../../components/generic/loader/LargeLoader"));
@@ -54,21 +54,21 @@ function FindReservationResults() {
     const params = (0, react_router_dom_1.useParams)();
     const history = (0, react_router_dom_1.useHistory)();
     const { hotel } = (0, hooks_1.useCurrentHotel)();
-    const ccx = (0, react_1.useContext)(contexts_1.CompanyContext);
+    const ccx = (0, react_2.useContext)(contexts_1.CompanyContext);
     const { t } = (0, react_i18next_1.useTranslation)();
-    const [bookingInformation, setBookingInformation] = (0, react_1.useState)(null);
-    const [isLoading, setIsLoading] = (0, react_1.useState)(false);
-    const [cancellationMessage, setCancellationMessage] = (0, react_1.useState)('');
-    const [cancellationTrigger, setCancellationTrigger] = (0, react_1.useState)(0);
-    const [data, setData] = (0, react_1.useState)(null);
+    const [bookingInformation, setBookingInformation] = (0, react_2.useState)(null);
+    const [isLoading, setIsLoading] = (0, react_2.useState)(false);
+    const [cancellationMessage, setCancellationMessage] = (0, react_2.useState)('');
+    const [cancellationTrigger, setCancellationTrigger] = (0, react_2.useState)(0);
+    const [data, setData] = (0, react_2.useState)(null);
     const pushHistoryOnClick = () => {
         history.push('../');
     };
-    (0, react_1.useEffect)(() => {
+    (0, react_2.useEffect)(() => {
         let isCancelled = false;
         setIsLoading(true);
         if (params === null || params === void 0 ? void 0 : params.ref) {
-            BookingAPI_1.default.Reservation.findReservation(params.ref, params.email, hotel.hotelID)
+            BookingAPI_1.default.Reservation.findReservation(params.ref, params.email, hotel === null || hotel === void 0 ? void 0 : hotel.hotelID)
                 .then((data) => {
                 if (!isCancelled) {
                     setBookingInformation(data);
@@ -89,14 +89,14 @@ function FindReservationResults() {
     }, [cancellationTrigger]);
     const addons = [];
     const comments = [];
-    const total = (0, react_1.useCallback)(() => {
+    const total = (0, react_2.useCallback)(() => {
         if (bookingInformation === null || bookingInformation === void 0 ? void 0 : bookingInformation.reservations) {
             return (0, TotalCalculator_1.calculateTotalForReservation)(bookingInformation);
         }
         return 0;
     }, [bookingInformation]);
     const { raise } = (0, hooks_1.useEvent)();
-    (0, react_1.useEffect)(() => {
+    (0, react_2.useEffect)(() => {
         var _a, _b;
         if (!data)
             return;
@@ -116,16 +116,16 @@ function FindReservationResults() {
         const event = new events_1.FindReservationResultsViewEvent(reservations);
         raise(event);
     }, [data]);
-    return (React.createElement("div", { className: "container u-pad--heavy-plus u-pad-left u-pad-right" }, isLoading ? (React.createElement(LargeLoader_1.default, null)) : (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: "u-marg-bottom" },
-            React.createElement(BackButton_1.default, { onClick: pushHistoryOnClick })),
-        React.createElement(Headline_1.default, { size: "extra-large" }, t(Translation_1.Translation.FindReservation.YourItinerary)),
-        React.createElement(Headline_1.default, { color: Color_1.Color.DarkGrey },
+    return (react_1.default.createElement("div", { className: "container u-pad--heavy-plus u-pad-left u-pad-right" }, isLoading ? (react_1.default.createElement(LargeLoader_1.default, null)) : (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("div", { className: "u-marg-bottom" },
+            react_1.default.createElement(BackButton_1.default, { onClick: pushHistoryOnClick })),
+        react_1.default.createElement(Headline_1.default, { size: "extra-large" }, t(Translation_1.Translation.FindReservation.YourItinerary)),
+        react_1.default.createElement(Headline_1.default, { color: Color_1.Color.DarkGrey },
             "#", bookingInformation === null || bookingInformation === void 0 ? void 0 :
             bookingInformation.itineraryNumber),
-        React.createElement("div", { className: "row u-marg-top--heavy" },
-            React.createElement(AutoAutoHeight_1.default, { open: !!cancellationMessage },
-                React.createElement(Alert_1.default, null, cancellationMessage)), (_a = bookingInformation === null || bookingInformation === void 0 ? void 0 : bookingInformation.reservations) === null || _a === void 0 ? void 0 :
+        react_1.default.createElement("div", { className: "row u-marg-top--heavy" },
+            react_1.default.createElement(AutoAutoHeight_1.default, { open: !!cancellationMessage },
+                react_1.default.createElement(Alert_1.default, null, cancellationMessage)), (_a = bookingInformation === null || bookingInformation === void 0 ? void 0 : bookingInformation.reservations) === null || _a === void 0 ? void 0 :
             _a.map((obj) => {
                 if (obj.addons) {
                     const nights = Object.keys(obj.nights);
@@ -136,20 +136,20 @@ function FindReservationResults() {
                         comments.push(comment);
                     });
                 }
-                return (React.createElement("div", { className: "col-lg-6", key: obj.reservationNumber },
-                    React.createElement(ReservationRow_1.default, { reservation: obj, key: obj.reservationNumber })));
+                return (react_1.default.createElement("div", { className: "col-lg-6", key: obj.reservationNumber },
+                    react_1.default.createElement(ReservationRow_1.default, { reservation: obj, key: obj.reservationNumber })));
             })),
-        React.createElement(LineBreak_1.default, null),
-        React.createElement(CommonAddonSummary_1.CommonAddonSummary, { addons: addons }),
-        comments.length >= 1 && (React.createElement(React.Fragment, null,
-            React.createElement("div", { className: "u-marg-bottom" },
-                React.createElement(Text_1.default, { type: Text_1.TextType.Label, color: Color_1.Color.Grey }, t(Translation_1.Translation.Step.Confirmation.Comments))),
-            comments.map((comment, index) => (React.createElement(Text_1.default, { key: index, type: Text_1.TextType.Small }, comment))),
-            React.createElement(LineBreak_1.default, null))),
-        React.createElement(Text_1.default, { type: Text_1.TextType.Small, align: TextAlignment_1.TextAlign.Right }, t(Translation_1.Translation.Misc.Total)),
-        React.createElement(Headline_1.default, { bold: true, size: 'large', align: TextAlignment_1.TextAlign.Right },
-            React.createElement(Currency_1.default, null, total)),
-        React.createElement(Text_1.default, { type: Text_1.TextType.Small, align: TextAlignment_1.TextAlign.Right, color: Color_1.Color.DarkGrey }, t(Translation_1.Translation.Step.Thanks.IncludingTaxes))))));
+        react_1.default.createElement(LineBreak_1.default, null),
+        react_1.default.createElement(CommonAddonSummary_1.CommonAddonSummary, { addons: addons }),
+        comments.length >= 1 && (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement("div", { className: "u-marg-bottom" },
+                react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Label, color: Color_1.Color.Grey }, t(Translation_1.Translation.Step.Confirmation.Comments))),
+            comments.map((comment, index) => (react_1.default.createElement(Text_1.default, { key: index, type: Text_1.TextType.Small }, comment))),
+            react_1.default.createElement(LineBreak_1.default, null))),
+        react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, align: TextAlignment_1.TextAlign.Right }, t(Translation_1.Translation.Misc.Total)),
+        react_1.default.createElement(Headline_1.default, { bold: true, size: "large", align: TextAlignment_1.TextAlign.Right },
+            react_1.default.createElement(Currency_1.default, null, total)),
+        react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, align: TextAlignment_1.TextAlign.Right, color: Color_1.Color.DarkGrey }, t(Translation_1.Translation.Step.Thanks.IncludingTaxes))))));
 }
 exports.default = FindReservationResults;
 //# sourceMappingURL=FindReservationResults.js.map

package/dist/src/pages/findReservation/FindReservationResults.js.map

@@ -1 +1 @@
-{"version":3,"file":"FindReservationResults.js","sourceRoot":"/","sources":["src/pages/findReservation/FindReservationResults.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useParams, useHistory } from 'react-router-dom';\nimport { useEffect, useState, useCallback, useContext } from 'react';\nimport API from '@/api/BookingAPI';\nimport { Color } from '@/util/Color';\nimport ReservationsDTO, { ReservationDTO, ReservationAddonDTO } from '@/models/Api/ReservationsDTO';\nimport LargeLoader from '@/components/generic/loader/LargeLoader';\nimport AutoAutoHeight from '@/animations/AutoAutoHeight';\nimport Alert from '@/components/generic/Alert';\nimport ReservationRow from '@/pages/findReservation/ReservationRow';\nimport BackButton from '@/components/generic/BackButton';\nimport Headline from '@/components/generic/Headline';\nimport LineBreak from '@/components/generic/LineBreak';\nimport Text, { TextType } from '@/components/generic/Text';\nimport Currency from '@/components/generic/Currency';\nimport { Translation } from 'translations/Translation';\nimport { TextAlign } from '@/util/TextAlignment';\nimport { useTranslation } from 'react-i18next';\nimport { useCurrentHotel, useEvent } from '@frontend/hooks';\nimport { CommonAddonSummary } from '@/components/steps/common/CommonAddonSummary/CommonAddonSummary';\nimport { calculateTotalForReservation } from '@/util/TotalCalculator';\nimport { FindReservationResultsViewEvent } from '../../events';\nimport { IEventReservation } from '@/models/Api/IEventReservation';\nimport dayjs from 'dayjs';\nimport { CompanyContext } from '@frontend/contexts';\n\nexport default function FindReservationResults() {\n    const params: any = useParams();\n    const history = useHistory();\n\n    const { hotel } = useCurrentHotel();\n    const ccx = useContext(CompanyContext);\n\n    const { t } = useTranslation();\n\n    const [bookingInformation, setBookingInformation] = useState<ReservationsDTO>(null);\n    const [isLoading, setIsLoading] = useState(false);\n\n    const [cancellationMessage, setCancellationMessage] = useState('');\n    const [cancellationTrigger, setCancellationTrigger] = useState(0);\n\n    const [data, setData] = useState(null);\n    const pushHistoryOnClick = () => {\n        history.push('../');\n    };\n    useEffect(() => {\n        let isCancelled = false;\n\n        setIsLoading(true);\n        if (params?.ref) {\n            API.Reservation.findReservation(params.ref, params.email, hotel.hotelID)\n                .then((data: ReservationsDTO) => {\n                    if (!isCancelled) {\n                        setBookingInformation(data);\n                        setIsLoading(false);\n                        setData(data);\n                    }\n                })\n                .catch(() => {\n                    history.push('/find-reservation/');\n                });\n        } else {\n            history.push('/find-reservation/');\n        }\n\n        return () => {\n            isCancelled = true;\n        };\n    }, [cancellationTrigger]);\n\n    const addons: ReservationAddonDTO[] = [];\n    const comments: string[] = [];\n\n    const total = useCallback(() => {\n        if (bookingInformation?.reservations) {\n            return calculateTotalForReservation(bookingInformation);\n        }\n\n        return 0;\n    }, [bookingInformation]);\n\n    const { raise } = useEvent();\n    useEffect(() => {\n        if (!data) return;\n\n        const reservations: IEventReservation[] =\n            data.reservations?.map((obj: ReservationDTO) => {\n                const nightKeys = Object.keys(obj.nights);\n                const dateFormat = 'YYYY-MM-DDTHH:mm:ss';\n\n                return {\n                    reservationId: obj.reservationNumber,\n                    checkInTime: dayjs(nightKeys[0]).format(dateFormat),\n                    checkOutTime: dayjs(nightKeys[nightKeys.length - 1])\n                        .add(1, 'day')\n                        .format(dateFormat),\n                    totalPrice: obj.total.afterTax,\n                    priceCurrency: ccx.currentCurrency,\n                };\n            }) ?? [];\n\n        const event = new FindReservationResultsViewEvent(reservations);\n        raise(event);\n    }, [data]);\n\n    return (\n        <div className=\"container u-pad--heavy-plus u-pad-left u-pad-right\">\n            {isLoading ? (\n                <LargeLoader />\n            ) : (\n                <>\n                    <div className=\"u-marg-bottom\">\n                        <BackButton onClick={pushHistoryOnClick} />\n                    </div>\n                    <Headline size=\"extra-large\">{t(Translation.FindReservation.YourItinerary)}</Headline>\n                    <Headline color={Color.DarkGrey}>#{bookingInformation?.itineraryNumber}</Headline>\n                    <div className=\"row u-marg-top--heavy\">\n                        <AutoAutoHeight open={!!cancellationMessage}>\n                            <Alert>{cancellationMessage}</Alert>\n                        </AutoAutoHeight>\n                        {bookingInformation?.reservations?.map((obj: ReservationDTO) => {\n                            if (obj.addons) {\n                                const nights = Object.keys(obj.nights);\n                                obj.addons.forEach((addon) => addons.push({ ...addon, nights: nights.length }));\n                            }\n\n                            if (obj.comments) {\n                                obj.comments.map((comment: string) => {\n                                    comments.push(comment);\n                                });\n                            }\n\n                            return (\n                                <div className=\"col-lg-6\" key={obj.reservationNumber}>\n                                    <ReservationRow reservation={obj} key={obj.reservationNumber} />\n                                </div>\n                            );\n                        })}\n                    </div>\n                    <LineBreak />\n                    <CommonAddonSummary addons={addons} />\n                    {comments.length >= 1 && (\n                        <>\n                            <div className=\"u-marg-bottom\">\n                                <Text type={TextType.Label} color={Color.Grey}>\n                                    {t(Translation.Step.Confirmation.Comments)}\n                                </Text>\n                            </div>\n                            {comments.map((comment, index: number) => (\n                                <Text key={index} type={TextType.Small}>\n                                    {comment}\n                                </Text>\n                            ))}\n                            <LineBreak />\n                        </>\n                    )}\n                    <Text type={TextType.Small} align={TextAlign.Right}>\n                        {t(Translation.Misc.Total)}\n                    </Text>\n                    <Headline bold={true} size={'large'} align={TextAlign.Right}>\n                        <Currency>{total}</Currency>\n                    </Headline>\n                    <Text type={TextType.Small} align={TextAlign.Right} color={Color.DarkGrey}>\n                        {t(Translation.Step.Thanks.IncludingTaxes)}\n                    </Text>\n                </>\n            )}\n        </div>\n    );\n}\n"]}
+{"version":3,"file":"FindReservationResults.js","sourceRoot":"/","sources":["src/pages/findReservation/FindReservationResults.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { useParams, useHistory } from 'react-router-dom';\nimport { useEffect, useState, useCallback, useContext } from 'react';\nimport API from '@/api/BookingAPI';\nimport { Color } from '@/util/Color';\nimport ReservationsDTO, { ReservationDTO, ReservationAddonDTO } from '@/models/Api/ReservationsDTO';\nimport LargeLoader from '@/components/generic/loader/LargeLoader';\nimport AutoAutoHeight from '@/animations/AutoAutoHeight';\nimport Alert from '@/components/generic/Alert';\nimport ReservationRow from '@/pages/findReservation/ReservationRow';\nimport BackButton from '@/components/generic/BackButton';\nimport Headline from '@/components/generic/Headline';\nimport LineBreak from '@/components/generic/LineBreak';\nimport Text, { TextType } from '@/components/generic/Text';\nimport Currency from '@/components/generic/Currency';\nimport { Translation } from 'translations/Translation';\nimport { TextAlign } from '@/util/TextAlignment';\nimport { useTranslation } from 'react-i18next';\nimport { useCurrentHotel, useEvent } from '@frontend/hooks';\nimport { CommonAddonSummary } from '@/components/steps/common/CommonAddonSummary/CommonAddonSummary';\nimport { calculateTotalForReservation } from '@/util/TotalCalculator';\nimport { FindReservationResultsViewEvent } from '@/events';\nimport { IEventReservation } from '@/models/Api/IEventReservation';\nimport dayjs from 'dayjs';\nimport { CompanyContext } from '@frontend/contexts';\n\nexport default function FindReservationResults() {\n    const params: any = useParams();\n    const history = useHistory();\n\n    const { hotel } = useCurrentHotel();\n    const ccx = useContext(CompanyContext);\n\n    const { t } = useTranslation();\n\n    const [bookingInformation, setBookingInformation] = useState<ReservationsDTO | null>(null);\n    const [isLoading, setIsLoading] = useState(false);\n\n    const [cancellationMessage, setCancellationMessage] = useState('');\n    const [cancellationTrigger, setCancellationTrigger] = useState(0);\n\n    const [data, setData] = useState<ReservationsDTO | null>(null);\n    const pushHistoryOnClick = () => {\n        history.push('../');\n    };\n    useEffect(() => {\n        let isCancelled = false;\n\n        setIsLoading(true);\n        if (params?.ref) {\n            API.Reservation.findReservation(params.ref, params.email, hotel?.hotelID as string)\n                .then((data: ReservationsDTO) => {\n                    if (!isCancelled) {\n                        setBookingInformation(data);\n                        setIsLoading(false);\n                        setData(data);\n                    }\n                })\n                .catch(() => {\n                    history.push('/find-reservation/');\n                });\n        } else {\n            history.push('/find-reservation/');\n        }\n\n        return () => {\n            isCancelled = true;\n        };\n    }, [cancellationTrigger]);\n\n    const addons: ReservationAddonDTO[] = [];\n    const comments: string[] = [];\n\n    const total = useCallback(() => {\n        if (bookingInformation?.reservations) {\n            return calculateTotalForReservation(bookingInformation);\n        }\n\n        return 0;\n    }, [bookingInformation]);\n\n    const { raise } = useEvent();\n    useEffect(() => {\n        if (!data) return;\n\n        const reservations: IEventReservation[] =\n            data.reservations?.map((obj: ReservationDTO) => {\n                const nightKeys = Object.keys(obj.nights);\n                const dateFormat = 'YYYY-MM-DDTHH:mm:ss';\n\n                return {\n                    reservationId: obj.reservationNumber,\n                    checkInTime: dayjs(nightKeys[0]).format(dateFormat),\n                    checkOutTime: dayjs(nightKeys[nightKeys.length - 1])\n                        .add(1, 'day')\n                        .format(dateFormat),\n                    totalPrice: obj.total.afterTax,\n                    priceCurrency: ccx.currentCurrency,\n                };\n            }) ?? [];\n\n        const event = new FindReservationResultsViewEvent(reservations);\n        raise(event);\n    }, [data]);\n\n    return (\n        <div className=\"container u-pad--heavy-plus u-pad-left u-pad-right\">\n            {isLoading ? (\n                <LargeLoader />\n            ) : (\n                <>\n                    <div className=\"u-marg-bottom\">\n                        <BackButton onClick={pushHistoryOnClick} />\n                    </div>\n                    <Headline size=\"extra-large\">{t(Translation.FindReservation.YourItinerary)}</Headline>\n                    <Headline color={Color.DarkGrey}>#{bookingInformation?.itineraryNumber}</Headline>\n                    <div className=\"row u-marg-top--heavy\">\n                        <AutoAutoHeight open={!!cancellationMessage}>\n                            <Alert>{cancellationMessage}</Alert>\n                        </AutoAutoHeight>\n                        {bookingInformation?.reservations?.map((obj: ReservationDTO) => {\n                            if (obj.addons) {\n                                const nights = Object.keys(obj.nights);\n                                obj.addons.forEach((addon) => addons.push({ ...addon, nights: nights.length }));\n                            }\n\n                            if (obj.comments) {\n                                obj.comments.map((comment: string) => {\n                                    comments.push(comment);\n                                });\n                            }\n\n                            return (\n                                <div className=\"col-lg-6\" key={obj.reservationNumber}>\n                                    <ReservationRow reservation={obj} key={obj.reservationNumber} />\n                                </div>\n                            );\n                        })}\n                    </div>\n                    <LineBreak />\n                    <CommonAddonSummary addons={addons} />\n                    {comments.length >= 1 && (\n                        <>\n                            <div className=\"u-marg-bottom\">\n                                <Text type={TextType.Label} color={Color.Grey}>\n                                    {t(Translation.Step.Confirmation.Comments)}\n                                </Text>\n                            </div>\n                            {comments.map((comment, index: number) => (\n                                <Text key={index} type={TextType.Small}>\n                                    {comment}\n                                </Text>\n                            ))}\n                            <LineBreak />\n                        </>\n                    )}\n                    <Text type={TextType.Small} align={TextAlign.Right}>\n                        {t(Translation.Misc.Total)}\n                    </Text>\n                    <Headline bold size=\"large\" align={TextAlign.Right}>\n                        <Currency>{total}</Currency>\n                    </Headline>\n                    <Text type={TextType.Small} align={TextAlign.Right} color={Color.DarkGrey}>\n                        {t(Translation.Step.Thanks.IncludingTaxes)}\n                    </Text>\n                </>\n            )}\n        </div>\n    );\n}\n"]}

package/dist/src/pages/findReservation/ReservationRow.js

@@ -26,8 +26,8 @@ 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 dayjs_1 = __importDefault(require("dayjs"));
 const StringHelper_1 = __importDefault(require("../../util/StringHelper"));
 const Translation_1 = require("translations/Translation");
@@ -46,14 +46,14 @@ const contexts_1 = require("../../contexts/index.js");
 const hooks_1 = require("../../hooks/index.js");
 const core_1 = require("@roomstay/core");
 function ReservationRow(props) {
-    var _a;
+    var _a, _b;
     const { t } = (0, react_i18next_1.useTranslation)();
     const { hotel } = (0, hooks_1.useCurrentHotel)();
     const obj = props.reservation;
-    const [isModalOpen, setIsModalOpen] = (0, react_1.useState)(false);
-    const [isCancelled, setIsCancelled] = (0, react_1.useState)(obj.status === 'Cancelled');
-    const [isCancelLoading, setIsCancelLoading] = (0, react_1.useState)(false);
-    const [confirmOpen, setConfirmOpen] = (0, react_1.useState)(false);
+    const [isModalOpen, setIsModalOpen] = (0, react_2.useState)(false);
+    const [isCancelled, setIsCancelled] = (0, react_2.useState)(obj.status === 'Cancelled');
+    const [isCancelLoading, setIsCancelLoading] = (0, react_2.useState)(false);
+    const [confirmOpen, setConfirmOpen] = (0, react_2.useState)(false);
     let adultsAndChildren = StringHelper_1.default.pluralWithDictAndCount(obj.guestCounts.adults, Translation_1.Translation.Step.Date.Adult, t);
     if (obj.guestCounts.children) {
         adultsAndChildren += ', ' + StringHelper_1.default.pluralWithDictAndCount(obj.guestCounts.children, Translation_1.Translation.Step.Date.Child, t);
@@ -83,7 +83,7 @@ function ReservationRow(props) {
     }
     const cancelRow = () => {
         setIsCancelLoading(true);
-        BookingAPI_1.default.Reservation.cancelReservation(obj.reservationNumber, obj.guest.email, hotel.hotelID)
+        BookingAPI_1.default.Reservation.cancelReservation(obj.reservationNumber, obj.guest.email, hotel === null || hotel === void 0 ? void 0 : hotel.hotelID)
             .then(() => {
             DataLayer_1.default.instance.sendCancellation(obj.reservationNumber);
             setIsCancelled(true);
@@ -99,76 +99,77 @@ function ReservationRow(props) {
             });
         });
     };
-    const roomName = obj.roomType ? obj.roomType : (_a = hotel.rooms[obj.roomCode]) === null || _a === void 0 ? void 0 : _a.name;
-    return (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: "reservation-row" },
-            React.createElement("div", { className: "room-details +is-open " },
-                React.createElement("div", { className: "room-details--image" },
-                    React.createElement(ImageGallerySlider_1.default, { images: images })),
-                React.createElement("div", { className: "room-details--content u-pad--heavy u-pad@m-" },
-                    React.createElement("div", { className: "u-marg-bottom" },
-                        React.createElement("div", { className: "room-details--content-title u-marg-bottom--light" }, !isCancelled ? (React.createElement(Text_1.default, null,
-                            React.createElement("strong", null, roomName),
-                            React.createElement("small", { style: { color: Color_1.Color.Grey } },
+    const roomName = obj.roomType ? obj.roomType : (_a = hotel === null || hotel === void 0 ? void 0 : hotel.rooms[obj.roomCode]) === null || _a === void 0 ? void 0 : _a.name;
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("div", { className: "reservation-row" },
+            react_1.default.createElement("div", { className: "room-details +is-open " },
+                react_1.default.createElement("div", { className: "room-details--image" },
+                    react_1.default.createElement(ImageGallerySlider_1.default, { images: images })),
+                react_1.default.createElement("div", { className: "room-details--content u-pad--heavy u-pad@m-" },
+                    react_1.default.createElement("div", { className: "u-marg-bottom" },
+                        react_1.default.createElement("div", { className: "room-details--content-title u-marg-bottom--light" }, !isCancelled ? (react_1.default.createElement(Text_1.default, null,
+                            react_1.default.createElement("strong", null, roomName),
+                            react_1.default.createElement("small", { style: { color: Color_1.Color.Grey } },
                                 " #",
-                                obj.reservationNumber))) : (React.createElement(Text_1.default, null,
-                            React.createElement("del", null,
-                                React.createElement("strong", null, roomName)),
-                            React.createElement("small", { style: { color: Color_1.Color.Alert } }, " Cancelled")))),
-                        React.createElement("div", { className: "room-details--content-description u-marg-bottom--light" },
-                            React.createElement(Text_1.default, { color: Color_1.Color.DarkGrey, type: Text_1.TextType.Small }, React.createElement(React.Fragment, null,
-                                hotel.name,
-                                " - ",
-                                hotel.address.line1)))),
-                    React.createElement("div", { className: "" },
-                        React.createElement("ul", null,
-                            React.createElement("li", { className: "u-flex justify-content-start u-marg-bottom--light" },
-                                React.createElement(Icon_1.default, { color: Color_1.Color.Grey, icon: Icon_1.IconType.Person }),
-                                React.createElement("div", { className: "u-marg-left--light" },
-                                    React.createElement(Text_1.default, { type: Text_1.TextType.Small },
+                                obj.reservationNumber))) : (react_1.default.createElement(Text_1.default, null,
+                            react_1.default.createElement("del", null,
+                                react_1.default.createElement("strong", null, roomName)),
+                            react_1.default.createElement("small", { style: { color: Color_1.Color.Alert } }, " Cancelled")))),
+                        react_1.default.createElement("div", { className: "room-details--content-description u-marg-bottom--light" },
+                            react_1.default.createElement(Text_1.default, { color: Color_1.Color.DarkGrey, type: Text_1.TextType.Small },
+                                react_1.default.createElement(react_1.default.Fragment, null, hotel === null || hotel === void 0 ? void 0 :
+                                    hotel.name,
+                                    " - ", (_b = hotel === null || hotel === void 0 ? void 0 : hotel.address) === null || _b === void 0 ? void 0 :
+                                    _b.line1)))),
+                    react_1.default.createElement("div", { className: "" },
+                        react_1.default.createElement("ul", null,
+                            react_1.default.createElement("li", { className: "u-flex justify-content-start u-marg-bottom--light" },
+                                react_1.default.createElement(Icon_1.default, { color: Color_1.Color.Grey, icon: Icon_1.IconType.Person }),
+                                react_1.default.createElement("div", { className: "u-marg-left--light" },
+                                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
                                         obj.guest.firstName,
                                         " ",
                                         obj.guest.lastName,
                                         " ",
-                                        React.createElement("span", { style: { color: Color_1.Color.DarkGrey } },
+                                        react_1.default.createElement("span", { style: { color: Color_1.Color.DarkGrey } },
                                             "- ",
                                             adultsAndChildren)))),
-                            React.createElement("li", { className: "u-flex justify-content-start u-marg-bottom--light" },
-                                React.createElement(Icon_1.default, { icon: Icon_1.IconType.Email, color: Color_1.Color.Grey }),
-                                React.createElement("div", { className: "u-marg-left--light" },
-                                    React.createElement(Text_1.default, { type: Text_1.TextType.Small }, obj.guest.email))),
-                            React.createElement("li", { className: "u-flex justify-content-start u-marg-bottom--light" },
-                                React.createElement(Icon_1.default, { icon: Icon_1.IconType.Calendar, color: Color_1.Color.Grey }),
-                                React.createElement("div", { className: "u-marg-left--light" },
-                                    React.createElement(Text_1.default, { type: Text_1.TextType.Small }, firstNight.format('dddd, MMM D, YYYY')),
-                                    React.createElement(Text_1.default, { type: Text_1.TextType.Small }, lastNight.format('dddd, MMM D, YYYY')))),
-                            React.createElement("li", { className: "u-flex justify-content-start" },
-                                React.createElement(Icon_1.default, { icon: Icon_1.IconType.CreditCard, color: Color_1.Color.Grey }),
-                                React.createElement("div", { className: "u-marg-left--light" },
-                                    React.createElement(Text_1.default, { type: Text_1.TextType.Small }, (obj === null || obj === void 0 ? void 0 : obj.paymentMethod) === core_1.EBookingPaymentMethod.Planpay ? (t(Translation_1.Translation.Step.Confirmation.PaidWithPlanpay)) : (React.createElement(React.Fragment, null,
+                            react_1.default.createElement("li", { className: "u-flex justify-content-start u-marg-bottom--light" },
+                                react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Email, color: Color_1.Color.Grey }),
+                                react_1.default.createElement("div", { className: "u-marg-left--light" },
+                                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small }, obj.guest.email))),
+                            react_1.default.createElement("li", { className: "u-flex justify-content-start u-marg-bottom--light" },
+                                react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Calendar, color: Color_1.Color.Grey }),
+                                react_1.default.createElement("div", { className: "u-marg-left--light" },
+                                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small }, firstNight.format('dddd, MMM D, YYYY')),
+                                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small }, lastNight.format('dddd, MMM D, YYYY')))),
+                            react_1.default.createElement("li", { className: "u-flex justify-content-start" },
+                                react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.CreditCard, color: Color_1.Color.Grey }),
+                                react_1.default.createElement("div", { className: "u-marg-left--light" },
+                                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small }, (obj === null || obj === void 0 ? void 0 : obj.paymentMethod) === core_1.EBookingPaymentMethod.Planpay ? (t(Translation_1.Translation.Step.Confirmation.PaidWithPlanpay)) : (react_1.default.createElement(react_1.default.Fragment, null,
                                         "\u2022\u2022\u2022\u2022 \u2022\u2022\u2022\u2022 \u2022\u2022\u2022\u2022 ",
                                         obj.paymentCard.last4,
                                         " ",
-                                        React.createElement("span", { style: { color: Color_1.Color.DarkGrey } },
+                                        react_1.default.createElement("span", { style: { color: Color_1.Color.DarkGrey } },
                                             "(",
                                             obj.paymentCard.type,
                                             ")")))))))))),
-            React.createElement("div", { className: "reservation-row--actions" },
-                React.createElement("div", { className: "u-flex justify-content-start align-items-center" },
-                    React.createElement("div", { className: "u-marg-right--heavy u-inline-flex" },
-                        React.createElement(BEButton_1.default, { icon: Icon_1.IconType.ArrowRight2, isText: true, primary: true, size: "tiny", iconPosition: "right", onClick: openModalOnClick }, t(Translation_1.Translation.Step.Room.RoomInfo.MoreDetails))),
-                    React.createElement("div", { className: "u-inline-flex" },
-                        React.createElement(BEButton_1.default, { isText: true, size: "tiny", isLoading: isCancelLoading, disabled: !obj.isCancelable || isCancelled, textColor: Color_1.Color.DarkGrey, onClick: confirmModalOnClick }, "Cancel"))),
-                React.createElement("div", { className: "u-flex u-flex-direction-row align-items-center" },
-                    React.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.DarkGrey }, t(Translation_1.Translation.Misc.Total)),
-                    React.createElement("div", { className: "u-marg-left" }, !isCancelled ? (React.createElement(Text_1.default, { color: Color_1.Color.Navy },
-                        React.createElement("strong", null,
-                            React.createElement(Currency_1.default, null, obj.total.afterTax)))) : (React.createElement(Text_1.default, { color: Color_1.Color.Navy },
-                        React.createElement("del", null,
-                            React.createElement("strong", { className: "u-flex u-flex-direction-row align-items-center" },
-                                React.createElement(Currency_1.default, null, obj.total.afterTax))))))))),
-        React.createElement(ReservationRowModal_1.default, { open: isModalOpen, onClose: closeModalOnClick, reservation: props.reservation, images: images }),
-        React.createElement(ConfirmationModal_1.default, { open: confirmOpen, message: "Are you sure you want to cancel this reservation?", onConfirm: onConfirmHandler, onClose: openConfirmationHandler })));
+            react_1.default.createElement("div", { className: "reservation-row--actions" },
+                react_1.default.createElement("div", { className: "u-flex justify-content-start align-items-center" },
+                    react_1.default.createElement("div", { className: "u-marg-right--heavy u-inline-flex" },
+                        react_1.default.createElement(BEButton_1.default, { icon: Icon_1.IconType.ArrowRight2, isText: true, primary: true, size: "tiny", iconPosition: "right", onClick: openModalOnClick }, t(Translation_1.Translation.Step.Room.RoomInfo.MoreDetails))),
+                    react_1.default.createElement("div", { className: "u-inline-flex" },
+                        react_1.default.createElement(BEButton_1.default, { isText: true, size: "tiny", isLoading: isCancelLoading, disabled: !obj.isCancelable || isCancelled, textColor: Color_1.Color.DarkGrey, onClick: confirmModalOnClick }, "Cancel"))),
+                react_1.default.createElement("div", { className: "u-flex u-flex-direction-row align-items-center" },
+                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.DarkGrey }, t(Translation_1.Translation.Misc.Total)),
+                    react_1.default.createElement("div", { className: "u-marg-left" }, !isCancelled ? (react_1.default.createElement(Text_1.default, { color: Color_1.Color.Navy },
+                        react_1.default.createElement("strong", null,
+                            react_1.default.createElement(Currency_1.default, null, obj.total.afterTax)))) : (react_1.default.createElement(Text_1.default, { color: Color_1.Color.Navy },
+                        react_1.default.createElement("del", null,
+                            react_1.default.createElement("strong", { className: "u-flex u-flex-direction-row align-items-center" },
+                                react_1.default.createElement(Currency_1.default, null, obj.total.afterTax))))))))),
+        react_1.default.createElement(ReservationRowModal_1.default, { open: isModalOpen, onClose: closeModalOnClick, reservation: props.reservation, images: images }),
+        react_1.default.createElement(ConfirmationModal_1.default, { open: confirmOpen, message: "Are you sure you want to cancel this reservation?", onConfirm: onConfirmHandler, onClose: openConfirmationHandler })));
 }
 exports.default = ReservationRow;
 //# sourceMappingURL=ReservationRow.js.map

package/dist/src/pages/findReservation/ReservationRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReservationRow.js","sourceRoot":"/","sources":["src/pages/findReservation/ReservationRow.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useState } from 'react';\nimport { ReservationDTO } from '@/models/Api/ReservationsDTO';\nimport dayjs from 'dayjs';\nimport StringHelper from '@/util/StringHelper';\nimport { Translation } from 'translations/Translation';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport { Color } from '@/util/Color';\nimport Text, { TextType } from '@/components/generic/Text';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport BEButton from '@/components/generic/BEButton';\nimport Currency from '@/components/generic/Currency';\nimport { useTranslation } from 'react-i18next';\nimport ReservationRowModal from '@/pages/findReservation/ReservationRowModal';\nimport API from '@/api/BookingAPI';\nimport DataLayer from '@/util/DataLayer';\nimport ConfirmationModal from '@/components/generic/modal/ConfirmationModal';\n\nimport { ErrorHandler } from '@frontend/contexts';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport { EBookingPaymentMethod } from '@roomstay/core';\n\ninterface ReservationRowProps {\n    reservation: ReservationDTO;\n    onCancelled?: () => void;\n}\n\nexport default function ReservationRow(props: ReservationRowProps) {\n    const { t } = useTranslation();\n    const { hotel } = useCurrentHotel();\n\n    const obj = props.reservation;\n\n    const [isModalOpen, setIsModalOpen] = useState(false);\n    const [isCancelled, setIsCancelled] = useState(obj.status === 'Cancelled');\n    const [isCancelLoading, setIsCancelLoading] = useState(false);\n\n    const [confirmOpen, setConfirmOpen] = useState(false);\n\n    let adultsAndChildren = StringHelper.pluralWithDictAndCount(obj.guestCounts.adults, Translation.Step.Date.Adult, t);\n\n    if (obj.guestCounts.children) {\n        adultsAndChildren += ', ' + StringHelper.pluralWithDictAndCount(obj.guestCounts.children, Translation.Step.Date.Child, t);\n    }\n\n    const nightKeys = Object.keys(obj.nights);\n\n    const openModalOnClick = () => {\n        setIsModalOpen(true);\n    };\n    const closeModalOnClick = () => {\n        setIsModalOpen(false);\n    };\n    const confirmModalOnClick = () => {\n        setConfirmOpen(true);\n    };\n    const onConfirmHandler = () => {\n        cancelRow();\n        setConfirmOpen(false);\n    };\n    const openConfirmationHandler = () => {\n        setConfirmOpen(false);\n    };\n\n    const firstNight = dayjs(nightKeys[0]);\n    const lastNight = dayjs(nightKeys[nightKeys.length - 1]).add(1, 'day');\n\n    let images: string[] = obj.images;\n\n    if ((!images || !images.length) && hotel?.rooms[obj.roomCode]) {\n        images = hotel?.rooms[obj.roomCode].images;\n    }\n\n    const cancelRow = () => {\n        setIsCancelLoading(true);\n\n        API.Reservation.cancelReservation(obj.reservationNumber, obj.guest.email, hotel.hotelID)\n            .then(() => {\n                DataLayer.instance.sendCancellation(obj.reservationNumber);\n\n                setIsCancelled(true);\n                setIsCancelLoading(false);\n\n                if (props.onCancelled) {\n                    props.onCancelled();\n                }\n            })\n            .catch((ex) => {\n                ErrorHandler.add({\n                    title: 'Error while cancelling reservation',\n                    message: ex.Message,\n                });\n            });\n    };\n\n    const roomName = obj.roomType ? obj.roomType : hotel.rooms[obj.roomCode]?.name;\n\n    return (\n        <>\n            <div className=\"reservation-row\">\n                <div className=\"room-details +is-open \">\n                    <div className=\"room-details--image\">\n                        <ImageGallerySlider images={images} />\n                    </div>\n                    <div className=\"room-details--content u-pad--heavy u-pad@m-\">\n                        <div className=\"u-marg-bottom\">\n                            <div className=\"room-details--content-title u-marg-bottom--light\">\n                                {!isCancelled ? (\n                                    <Text>\n                                        <strong>{roomName}</strong>\n                                        <small style={{ color: Color.Grey }}> #{obj.reservationNumber}</small>\n                                    </Text>\n                                ) : (\n                                    <Text>\n                                        <del>\n                                            <strong>{roomName}</strong>\n                                        </del>\n                                        <small style={{ color: Color.Alert }}> Cancelled</small>\n                                    </Text>\n                                )}\n                            </div>\n                            <div className=\"room-details--content-description u-marg-bottom--light\">\n                                <Text color={Color.DarkGrey} type={TextType.Small}>\n                                    {\n                                        <>\n                                            {hotel.name} - {hotel.address.line1}\n                                        </>\n                                    }\n                                </Text>\n                            </div>\n                        </div>\n\n                        <div className=\"\">\n                            <ul>\n                                <li className=\"u-flex justify-content-start u-marg-bottom--light\">\n                                    <Icon color={Color.Grey} icon={IconType.Person} />\n                                    <div className=\"u-marg-left--light\">\n                                        <Text type={TextType.Small}>\n                                            {obj.guest.firstName} {obj.guest.lastName} <span style={{ color: Color.DarkGrey }}>- {adultsAndChildren}</span>\n                                        </Text>\n                                    </div>\n                                </li>\n                                <li className=\"u-flex justify-content-start u-marg-bottom--light\">\n                                    <Icon icon={IconType.Email} color={Color.Grey} />\n                                    <div className=\"u-marg-left--light\">\n                                        <Text type={TextType.Small}>{obj.guest.email}</Text>\n                                    </div>\n                                </li>\n                                <li className=\"u-flex justify-content-start u-marg-bottom--light\">\n                                    <Icon icon={IconType.Calendar} color={Color.Grey} />\n                                    <div className=\"u-marg-left--light\">\n                                        <Text type={TextType.Small}>{firstNight.format('dddd, MMM D, YYYY')}</Text>\n                                        <Text type={TextType.Small}>{lastNight.format('dddd, MMM D, YYYY')}</Text>\n                                    </div>\n                                </li>\n                                <li className=\"u-flex justify-content-start\">\n                                    <Icon icon={IconType.CreditCard} color={Color.Grey} />\n                                    <div className=\"u-marg-left--light\">\n                                        <Text type={TextType.Small}>\n                                            {obj?.paymentMethod === EBookingPaymentMethod.Planpay ? (\n                                                t(Translation.Step.Confirmation.PaidWithPlanpay)\n                                            ) : (\n                                                <>\n                                                    •••• •••• •••• {obj.paymentCard.last4} <span style={{ color: Color.DarkGrey }}>({obj.paymentCard.type})</span>\n                                                </>\n                                            )}\n                                        </Text>\n                                    </div>\n                                </li>\n                            </ul>\n                        </div>\n                    </div>\n                </div>\n                <div className=\"reservation-row--actions\">\n                    <div className=\"u-flex justify-content-start align-items-center\">\n                        <div className=\"u-marg-right--heavy u-inline-flex\">\n                            <BEButton icon={IconType.ArrowRight2} isText={true} primary={true} size=\"tiny\" iconPosition=\"right\" onClick={openModalOnClick}>\n                                {t(Translation.Step.Room.RoomInfo.MoreDetails)}\n                            </BEButton>\n                        </div>\n                        {\n                            <div className=\"u-inline-flex\">\n                                <BEButton\n                                    isText={true}\n                                    size=\"tiny\"\n                                    isLoading={isCancelLoading}\n                                    disabled={!obj.isCancelable || isCancelled}\n                                    textColor={Color.DarkGrey}\n                                    onClick={confirmModalOnClick}\n                                >\n                                    Cancel\n                                </BEButton>\n                            </div>\n                        }\n                    </div>\n                    <div className=\"u-flex u-flex-direction-row align-items-center\">\n                        <Text type={TextType.Small} color={Color.DarkGrey}>\n                            {t(Translation.Misc.Total)}\n                        </Text>\n                        <div className=\"u-marg-left\">\n                            {!isCancelled ? (\n                                <Text color={Color.Navy}>\n                                    <strong>\n                                        <Currency>{obj.total.afterTax}</Currency>\n                                    </strong>\n                                </Text>\n                            ) : (\n                                <Text color={Color.Navy}>\n                                    <del>\n                                        <strong className=\"u-flex u-flex-direction-row align-items-center\">\n                                            <Currency>{obj.total.afterTax}</Currency>\n                                        </strong>\n                                    </del>\n                                </Text>\n                            )}\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <ReservationRowModal open={isModalOpen} onClose={closeModalOnClick} reservation={props.reservation} images={images} />\n            <ConfirmationModal open={confirmOpen} message=\"Are you sure you want to cancel this reservation?\" onConfirm={onConfirmHandler} onClose={openConfirmationHandler} />\n        </>\n    );\n}\n"]}
+{"version":3,"file":"ReservationRow.js","sourceRoot":"/","sources":["src/pages/findReservation/ReservationRow.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { useState } from 'react';\nimport { ReservationDTO } from '@/models/Api/ReservationsDTO';\nimport dayjs from 'dayjs';\nimport StringHelper from '@/util/StringHelper';\nimport { Translation } from 'translations/Translation';\nimport ImageGallerySlider from '@/components/steps/room/ImageGallerySlider';\nimport { Color } from '@/util/Color';\nimport Text, { TextType } from '@/components/generic/Text';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport BEButton from '@/components/generic/BEButton';\nimport Currency from '@/components/generic/Currency';\nimport { useTranslation } from 'react-i18next';\nimport ReservationRowModal from '@/pages/findReservation/ReservationRowModal';\nimport API from '@/api/BookingAPI';\nimport DataLayer from '@/util/DataLayer';\nimport ConfirmationModal from '@/components/generic/modal/ConfirmationModal';\n\nimport { ErrorHandler } from '@frontend/contexts';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport { EBookingPaymentMethod } from '@roomstay/core';\n\ninterface ReservationRowProps {\n    reservation: ReservationDTO;\n    onCancelled?: () => void;\n}\n\nexport default function ReservationRow(props: ReservationRowProps) {\n    const { t } = useTranslation();\n    const { hotel } = useCurrentHotel();\n\n    const obj = props.reservation;\n\n    const [isModalOpen, setIsModalOpen] = useState(false);\n    const [isCancelled, setIsCancelled] = useState(obj.status === 'Cancelled');\n    const [isCancelLoading, setIsCancelLoading] = useState(false);\n\n    const [confirmOpen, setConfirmOpen] = useState(false);\n\n    let adultsAndChildren = StringHelper.pluralWithDictAndCount(obj.guestCounts.adults, Translation.Step.Date.Adult, t);\n\n    if (obj.guestCounts.children) {\n        adultsAndChildren += ', ' + StringHelper.pluralWithDictAndCount(obj.guestCounts.children, Translation.Step.Date.Child, t);\n    }\n\n    const nightKeys = Object.keys(obj.nights);\n\n    const openModalOnClick = () => {\n        setIsModalOpen(true);\n    };\n    const closeModalOnClick = () => {\n        setIsModalOpen(false);\n    };\n    const confirmModalOnClick = () => {\n        setConfirmOpen(true);\n    };\n    const onConfirmHandler = () => {\n        cancelRow();\n        setConfirmOpen(false);\n    };\n    const openConfirmationHandler = () => {\n        setConfirmOpen(false);\n    };\n\n    const firstNight = dayjs(nightKeys[0]);\n    const lastNight = dayjs(nightKeys[nightKeys.length - 1]).add(1, 'day');\n\n    let images: string[] = obj.images;\n\n    if ((!images || !images.length) && hotel?.rooms[obj.roomCode]) {\n        images = hotel?.rooms[obj.roomCode].images;\n    }\n\n    const cancelRow = () => {\n        setIsCancelLoading(true);\n\n        API.Reservation.cancelReservation(obj.reservationNumber, obj.guest.email, hotel?.hotelID as string)\n            .then(() => {\n                DataLayer.instance.sendCancellation(obj.reservationNumber);\n\n                setIsCancelled(true);\n                setIsCancelLoading(false);\n\n                if (props.onCancelled) {\n                    props.onCancelled();\n                }\n            })\n            .catch((ex) => {\n                ErrorHandler.add({\n                    title: 'Error while cancelling reservation',\n                    message: ex.Message,\n                });\n            });\n    };\n\n    const roomName = obj.roomType ? obj.roomType : hotel?.rooms[obj.roomCode]?.name;\n\n    return (\n        <>\n            <div className=\"reservation-row\">\n                <div className=\"room-details +is-open \">\n                    <div className=\"room-details--image\">\n                        <ImageGallerySlider images={images} />\n                    </div>\n                    <div className=\"room-details--content u-pad--heavy u-pad@m-\">\n                        <div className=\"u-marg-bottom\">\n                            <div className=\"room-details--content-title u-marg-bottom--light\">\n                                {!isCancelled ? (\n                                    <Text>\n                                        <strong>{roomName}</strong>\n                                        <small style={{ color: Color.Grey }}> #{obj.reservationNumber}</small>\n                                    </Text>\n                                ) : (\n                                    <Text>\n                                        <del>\n                                            <strong>{roomName}</strong>\n                                        </del>\n                                        <small style={{ color: Color.Alert }}> Cancelled</small>\n                                    </Text>\n                                )}\n                            </div>\n                            <div className=\"room-details--content-description u-marg-bottom--light\">\n                                <Text color={Color.DarkGrey} type={TextType.Small}>\n                                    <>\n                                        {hotel?.name} - {hotel?.address?.line1}\n                                    </>\n                                </Text>\n                            </div>\n                        </div>\n\n                        <div className=\"\">\n                            <ul>\n                                <li className=\"u-flex justify-content-start u-marg-bottom--light\">\n                                    <Icon color={Color.Grey} icon={IconType.Person} />\n                                    <div className=\"u-marg-left--light\">\n                                        <Text type={TextType.Small}>\n                                            {obj.guest.firstName} {obj.guest.lastName} <span style={{ color: Color.DarkGrey }}>- {adultsAndChildren}</span>\n                                        </Text>\n                                    </div>\n                                </li>\n                                <li className=\"u-flex justify-content-start u-marg-bottom--light\">\n                                    <Icon icon={IconType.Email} color={Color.Grey} />\n                                    <div className=\"u-marg-left--light\">\n                                        <Text type={TextType.Small}>{obj.guest.email}</Text>\n                                    </div>\n                                </li>\n                                <li className=\"u-flex justify-content-start u-marg-bottom--light\">\n                                    <Icon icon={IconType.Calendar} color={Color.Grey} />\n                                    <div className=\"u-marg-left--light\">\n                                        <Text type={TextType.Small}>{firstNight.format('dddd, MMM D, YYYY')}</Text>\n                                        <Text type={TextType.Small}>{lastNight.format('dddd, MMM D, YYYY')}</Text>\n                                    </div>\n                                </li>\n                                <li className=\"u-flex justify-content-start\">\n                                    <Icon icon={IconType.CreditCard} color={Color.Grey} />\n                                    <div className=\"u-marg-left--light\">\n                                        <Text type={TextType.Small}>\n                                            {obj?.paymentMethod === EBookingPaymentMethod.Planpay ? (\n                                                t(Translation.Step.Confirmation.PaidWithPlanpay)\n                                            ) : (\n                                                <>\n                                                    •••• •••• •••• {obj.paymentCard.last4} <span style={{ color: Color.DarkGrey }}>({obj.paymentCard.type})</span>\n                                                </>\n                                            )}\n                                        </Text>\n                                    </div>\n                                </li>\n                            </ul>\n                        </div>\n                    </div>\n                </div>\n                <div className=\"reservation-row--actions\">\n                    <div className=\"u-flex justify-content-start align-items-center\">\n                        <div className=\"u-marg-right--heavy u-inline-flex\">\n                            <BEButton icon={IconType.ArrowRight2} isText primary size=\"tiny\" iconPosition=\"right\" onClick={openModalOnClick}>\n                                {t(Translation.Step.Room.RoomInfo.MoreDetails)}\n                            </BEButton>\n                        </div>\n                        <div className=\"u-inline-flex\">\n                            <BEButton\n                                isText\n                                size=\"tiny\"\n                                isLoading={isCancelLoading}\n                                disabled={!obj.isCancelable || isCancelled}\n                                textColor={Color.DarkGrey}\n                                onClick={confirmModalOnClick}\n                            >\n                                Cancel\n                            </BEButton>\n                        </div>\n                    </div>\n                    <div className=\"u-flex u-flex-direction-row align-items-center\">\n                        <Text type={TextType.Small} color={Color.DarkGrey}>\n                            {t(Translation.Misc.Total)}\n                        </Text>\n                        <div className=\"u-marg-left\">\n                            {!isCancelled ? (\n                                <Text color={Color.Navy}>\n                                    <strong>\n                                        <Currency>{obj.total.afterTax}</Currency>\n                                    </strong>\n                                </Text>\n                            ) : (\n                                <Text color={Color.Navy}>\n                                    <del>\n                                        <strong className=\"u-flex u-flex-direction-row align-items-center\">\n                                            <Currency>{obj.total.afterTax}</Currency>\n                                        </strong>\n                                    </del>\n                                </Text>\n                            )}\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <ReservationRowModal open={isModalOpen} onClose={closeModalOnClick} reservation={props.reservation} images={images} />\n            <ConfirmationModal open={confirmOpen} message=\"Are you sure you want to cancel this reservation?\" onConfirm={onConfirmHandler} onClose={openConfirmationHandler} />\n        </>\n    );\n}\n"]}