@roomstay/frontend 2.1.17 → 2.1.18
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/760.bundle.js +1 -1
- package/dist/main.bundle.js +1 -1
- package/dist/src/api/AvailabilityAPI.d.ts +9 -0
- package/dist/src/api/AvailabilityAPI.js +12 -0
- package/dist/src/api/AvailabilityAPI.js.map +1 -1
- package/dist/src/components/generic/BookingWizard/BookingWizard.js.map +1 -1
- package/dist/src/components/generic/BookingWizard/BookingWizardContent.js +37 -0
- package/dist/src/components/generic/BookingWizard/BookingWizardContent.js.map +1 -1
- package/dist/src/components/generic/BookingWizard/BookingWizardContext.d.ts +1 -0
- package/dist/src/components/generic/BookingWizard/BookingWizardContext.js.map +1 -1
- package/dist/src/components/generic/BookingWizard/BookingWizardGuestSelector/BookingWizardGuestSelector.js +1 -1
- package/dist/src/components/generic/BookingWizard/BookingWizardGuestSelector/BookingWizardGuestSelector.js.map +1 -1
- package/dist/src/components/generic/BookingWizard/BookingWizardHotelSelector/BookingWizardHotelSelector.js +1 -0
- package/dist/src/components/generic/BookingWizard/BookingWizardHotelSelector/BookingWizardHotelSelector.js.map +1 -1
- package/dist/src/components/generic/BookingWizard/BookingWizardPromoCode/BookingWizardPromoCode.d.ts +8 -0
- package/dist/src/components/generic/BookingWizard/BookingWizardPromoCode/BookingWizardPromoCode.js +64 -0
- package/dist/src/components/generic/BookingWizard/BookingWizardPromoCode/BookingWizardPromoCode.js.map +1 -0
- package/dist/src/components/generic/PromoCodeInput.d.ts +1 -0
- package/dist/src/components/generic/PromoCodeInput.js +1 -1
- package/dist/src/components/generic/PromoCodeInput.js.map +1 -1
- package/dist/src/components/generic/Select/Select.js +1 -1
- package/dist/src/components/generic/Select/Select.js.map +1 -1
- package/dist/src/components/generic/TextBox.d.ts +1 -0
- package/dist/src/components/generic/TextBox.js +1 -1
- package/dist/src/components/generic/TextBox.js.map +1 -1
- package/dist/src/components/steps/confirmation/StepConfirmationAcknowledgement.d.ts +6 -3
- package/dist/src/components/steps/confirmation/StepConfirmationAcknowledgement.js +9 -19
- package/dist/src/components/steps/confirmation/StepConfirmationAcknowledgement.js.map +1 -1
- package/dist/src/components/steps/confirmation/StepConfirmationForm.js +28 -15
- package/dist/src/components/steps/confirmation/StepConfirmationForm.js.map +1 -1
- package/dist/src/contexts/ConfirmationStepContext/ConfirmationStepContextTypes.d.ts +1 -1
- package/dist/src/contexts/ConfirmationStepContext/ConfirmationStepContextTypes.js.map +1 -1
- package/dist/src/contexts/ConfirmationStepContext/ConfirmationStepContextWrapper.js +8 -9
- package/dist/src/contexts/ConfirmationStepContext/ConfirmationStepContextWrapper.js.map +1 -1
- package/dist/src/contexts/index.d.ts +22 -22
- package/dist/src/contexts/index.js +22 -22
- package/dist/src/contexts/index.js.map +1 -1
- package/dist/src/models/Confirmation.d.ts +0 -2
- package/dist/src/models/Confirmation.js.map +1 -1
- package/dist/src/pages/steps/StepConfirmation/StepConfirmationComponent.js +2 -1
- package/dist/src/pages/steps/StepConfirmation/StepConfirmationComponent.js.map +1 -1
- package/dist/test.bundle.js +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BookingWizardPromoCode.js","sourceRoot":"/","sources":["src/components/generic/BookingWizard/BookingWizardPromoCode/BookingWizardPromoCode.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,4DAAyD;AACzD,8CAA2C;AAC3C,4DAAoC;AACpC,+CAAoE;AACpE,iDAA+C;AAC/C,oEAA4C;AAE5C,8GAA0D;AAQnD,MAAM,sBAAsB,GAAoC,CAAC,KAAK,EAAE,EAAE;IAC7E,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAC7C,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,IAAA,gBAAQ,EAAqB,EAAE,CAAC,CAAC;IAEzD,MAAM,cAAc,GAAG,IAAA,mBAAW,EAC9B,IAAA,mBAAQ,EAAC,CAAC,KAAK,EAAE,EAAE;QACf,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,KAAK,CAAC,CAAC;IACtB,CAAC,EAAE,GAAG,CAAC,EACP,EAAE,CACL,CAAC;IAEF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,cAAc,CAAC,IAAI,CAAC,CAAC;IACzB,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,SAAS,KAAK,IAAI;YAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC/C,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,MAAM,eAAe,GAAG,GAAG,EAAE;QACzB,IAAI,CAAC,SAAS;YAAE,OAAO,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAC1D,IAAI,KAAK,KAAK,KAAK;YAAE,OAAO,eAAe,IAAI,gBAAgB,CAAC;QAChE,IAAI,KAAK,KAAK,IAAI;YAAE,OAAO,eAAe,IAAI,WAAW,CAAC;QAC1D,OAAO,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IAC9C,CAAC,CAAC;IAEF,OAAO,CACH,8BAAC,iBAAO,IAAC,KAAK,EAAE,eAAe,EAAE;QAC7B,yCACI,SAAS,EAAE,IAAA,oBAAU,EAAC,4CAAM,CAAC,SAAS,EAAE,EAAE,CAAC,4CAAM,CAAC,SAAS,CAAC,CAAC,EAAE,KAAK,KAAK,KAAK,EAAE,CAAC,4CAAM,CAAC,WAAW,CAAC,CAAC,EAAE,KAAK,KAAK,IAAI,EAAE,CAAC,EACxH,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,EACX,WAAW,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,EAC/C,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,GAC1C,CACI,CACb,CAAC;AACN,CAAC,CAAC;AAvCW,QAAA,sBAAsB,0BAuCjC","sourcesContent":["import { Translation } from '@/translations/Translation';\nimport { debounce } from '@/util/Debounce';\nimport classNames from 'classnames';\nimport React, { FC, useCallback, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport Tooltip from '../../Tooltip/Tooltip';\n\nimport styles from './BookingWizardPromoCode.module.scss';\n\ninterface BookingWizardPromoCodeProps {\n promoCode?: string;\n valid?: boolean;\n onChange?: (promoCode: string) => void;\n}\n\nexport const BookingWizardPromoCode: FC<BookingWizardPromoCodeProps> = (props) => {\n const { promoCode, valid, onChange } = props;\n const { t } = useTranslation();\n\n const [code, setCode] = useState<string | undefined>('');\n\n const debounceChange = useCallback(\n debounce((value) => {\n onChange?.(value);\n }, 500),\n []\n );\n\n useEffect(() => {\n debounceChange(code);\n }, [code]);\n\n useEffect(() => {\n if (promoCode !== code) setCode(promoCode);\n }, [promoCode]);\n\n const getTooltipTitle = () => {\n if (!promoCode) return t(Translation.Step.Date.PromoCode);\n if (valid === false) return `Promo Code '${code}' is not valid`;\n if (valid === true) return `Promo Code '${code}' applied`;\n return t(Translation.Step.Date.PromoCode);\n };\n\n return (\n <Tooltip title={getTooltipTitle()}>\n <input\n className={classNames(styles.container, { [styles['--error']]: valid === false, [styles['--success']]: valid === true })}\n type=\"text\"\n value={code}\n placeholder={t(Translation.Step.Date.PromoCode)}\n onChange={(e) => setCode(e.target.value)}\n />\n </Tooltip>\n );\n};\n"]}
|
|
@@ -113,7 +113,7 @@ function PromoCodeInput(props) {
|
|
|
113
113
|
const setPromoCodeOnChange = (val) => {
|
|
114
114
|
setPromoCode(val.target.value);
|
|
115
115
|
};
|
|
116
|
-
return (react_1.default.createElement("div", { ref: firstUpdate },
|
|
116
|
+
return (react_1.default.createElement("div", { ref: firstUpdate, className: props.className },
|
|
117
117
|
react_1.default.createElement("div", { className: "u-pos-rel" },
|
|
118
118
|
react_1.default.createElement(TextBox_1.default, { value: (props.direct ? props.value : promoCode).toUpperCase().replace(' ', ''), placeholder: t(Translation_1.Translation.Step.Date.PromoCode), wide: true, validationStatus: promoCodeStatus, onChange: setPromoCodeOnChange, onKeyPress: handleKeyPress }),
|
|
119
119
|
showPromoRemove && (react_1.default.createElement(Tooltip_1.default, { title: "Remove Promo code" },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PromoCodeInput.js","sourceRoot":"/","sources":["src/components/generic/PromoCodeInput.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,2EAAmD;AACnD,0DAAuD;AACvD,mFAA2D;AAC3D,uEAAgE;AAChE,wCAAqC;AACrC,iDAA+C;AAC/C,iCAAoD;AACpD,4FAAoE;AACpE,kEAA2D;
|
|
1
|
+
{"version":3,"file":"PromoCodeInput.js","sourceRoot":"/","sources":["src/components/generic/PromoCodeInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport TextBox from '@/components/generic/TextBox';\nimport { Translation } from 'translations/Translation';\nimport Tooltip from '@/components/generic/Tooltip/Tooltip';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { Color } from '@/util/Color';\nimport { useTranslation } from 'react-i18next';\nimport { useState, useRef, useEffect } from 'react';\nimport SmallSpinner from '@/components/generic/loader/SmallSpinner';\nimport Text, { TextType } from '@/components/generic/Text';\n\ninterface PromoCodeInputProps {\n value: string;\n onChange: (code: string) => void;\n\n valid?: boolean;\n direct?: boolean;\n className?: string;\n}\n\nexport default function PromoCodeInput(props: PromoCodeInputProps) {\n const { t } = useTranslation();\n\n const [promoCode, setPromoCode] = useState(props.value ?? '');\n const [showPromoSave, setShowPromoSave] = useState(false);\n const [showPromoRemove, setShowPromoRemove] = useState(false);\n\n const [pressedChange, setPressedChange] = useState(false);\n\n const firstUpdate = useRef<HTMLDivElement | null>(null);\n\n const promoCodeStatus: 'success' | 'error' | undefined = props.valid || props.valid === false ? (props.valid ? 'success' : 'error') : undefined;\n\n useEffect(() => {\n if (props.valid || props.valid === false) {\n setShowPromoRemove(true);\n }\n }, [props.valid]);\n\n useEffect(() => {\n if (showPromoSave || showPromoRemove) {\n setPressedChange(false);\n }\n }, [showPromoSave, showPromoRemove]);\n\n useEffect(() => {\n if (firstUpdate) {\n if (promoCode) {\n if (promoCode !== props.value) {\n if (props.direct) {\n updatePromoCode(promoCode, false);\n } else {\n setShowPromoSave(true);\n }\n } else {\n setShowPromoRemove(true);\n }\n } else {\n setShowPromoSave(false);\n setShowPromoRemove(false);\n\n if (promoCode !== '') {\n updatePromoCode('', false);\n }\n }\n } else {\n if (promoCode) {\n setShowPromoRemove(true);\n }\n }\n }, [promoCode]);\n\n const updatePromoCode = (code: string, propagate = true) => {\n if (code) {\n if (props.direct) {\n setShowPromoRemove(true);\n } else {\n setPressedChange(true);\n setShowPromoSave(false);\n }\n }\n\n if (propagate) {\n setPromoCode(code);\n }\n\n props.onChange(code);\n };\n\n const handleKeyPress = (event: any) => {\n if (event.key === 'Enter') {\n updatePromoCode(promoCode);\n }\n };\n const clearPromoCode = () => {\n return updatePromoCode('');\n };\n const setUpdatedPromoCode = () => {\n return updatePromoCode(promoCode);\n };\n const setPromoCodeOnChange = (val: React.ChangeEvent<HTMLInputElement>) => {\n setPromoCode(val.target.value);\n };\n return (\n <div ref={firstUpdate} className={props.className}>\n <div className=\"u-pos-rel\">\n <TextBox\n value={(props.direct ? props.value : promoCode).toUpperCase().replace(' ', '')}\n placeholder={t(Translation.Step.Date.PromoCode)}\n wide\n validationStatus={promoCodeStatus}\n onChange={setPromoCodeOnChange}\n onKeyPress={handleKeyPress}\n />\n {showPromoRemove && (\n <Tooltip title=\"Remove Promo code\">\n <div className=\"people-picker--promo-icon\" onClick={clearPromoCode}>\n <Icon size=\"24px\" icon={IconType.Close} color={Color.Grey} />\n </div>\n </Tooltip>\n )}\n {showPromoSave && (\n <Tooltip title=\"Apply Code\">\n <div className=\"people-picker--promo-icon --success\" onClick={setUpdatedPromoCode}>\n <Icon size=\"24px\" icon={IconType.ArrowRight2} color={Color.Success} />\n </div>\n </Tooltip>\n )}\n {pressedChange && (\n <Tooltip title=\"Promo code loading\">\n <div className=\"people-picker--promo-icon\">\n <SmallSpinner />\n </div>\n </Tooltip>\n )}\n </div>\n {props.valid === true && (\n <div className=\"u-marg-top\">\n <Text type={TextType.Small} color={Color.Success}>\n Promo Code '{props.value}' applied\n </Text>\n </div>\n )}\n {props.valid === false && (\n <div className=\"u-marg-top\">\n <Text type={TextType.Small} color={Color.Alert}>\n Promo Code '{props.value}' is not valid\n </Text>\n </div>\n )}\n </div>\n );\n}\n"]}
|
|
@@ -136,7 +136,7 @@ const InnerSelect = ({ target, open, onClose, options = [], value, onChange, key
|
|
|
136
136
|
return react_1.default.createElement("option", { value: value, key: item[keyName], label: _getStringLabel(item[keyName]) });
|
|
137
137
|
}))) : (_getLabel(value)),
|
|
138
138
|
react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Dropdown, color: Color_1.Color.DarkGrey }))),
|
|
139
|
-
!native && (react_1.default.createElement(Overlay_1.Overlay, { offset: offset, usePortal: (_a = overlay === null || overlay === void 0 ? void 0 : overlay.usePortal) !== null && _a !== void 0 ? _a : true, followElement: target || targetRef.current || undefined, placement: (_b = overlay === null || overlay === void 0 ? void 0 : overlay.placement) !== null && _b !== void 0 ? _b : 'bottom-start', strategy: overlay === null || overlay === void 0 ? void 0 : overlay.strategy, open: open === undefined ? !!_open : open, onClose: _onClose, containerClassName: overlay === null || overlay === void 0 ? void 0 : overlay.containerClassName, overlayRef: overlayRef },
|
|
139
|
+
!native && (react_1.default.createElement(Overlay_1.Overlay, { offset: offset, usePortal: (_a = overlay === null || overlay === void 0 ? void 0 : overlay.usePortal) !== null && _a !== void 0 ? _a : true, followElement: target || targetRef.current || undefined, placement: (_b = overlay === null || overlay === void 0 ? void 0 : overlay.placement) !== null && _b !== void 0 ? _b : 'bottom-start', strategy: overlay === null || overlay === void 0 ? void 0 : overlay.strategy, open: open === undefined ? !!_open : open, onClose: _onClose, containerClassName: overlay === null || overlay === void 0 ? void 0 : overlay.containerClassName, overlayRef: overlayRef, hideStyles: overlay === null || overlay === void 0 ? void 0 : overlay.hideStyles },
|
|
140
140
|
react_1.default.createElement("div", { ref: optionContainerRef, className: (0, classnames_1.default)('rs-select--suggest-list', overlay === null || overlay === void 0 ? void 0 : overlay.className) }, _renderOptions(options))))));
|
|
141
141
|
};
|
|
142
142
|
exports.InnerSelect = InnerSelect;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.js","sourceRoot":"/","sources":["src/components/generic/Select/Select.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { forwardRef, ReactElement, ReactNode, Ref, useImperativeHandle, useMemo, useRef } from 'react';\nimport Icon, { IconType } from '../Icon/Icon';\n\nimport classNames from 'classnames';\n\nimport './Select.global.scss';\nimport { Overlay, OverlayProps } from '@/components/generic/Overlay/Overlay';\nimport { useKeyboardControlOnSelect } from '@/hooks/KeyboardControlOnSelect';\nimport { Color } from '@/util/Color';\nimport { useCombinedState } from '@/hooks/CombineState';\nimport { useWindowSize } from '@/hooks/WindowSize';\nimport Text, { TextType } from '@/components/generic/Text';\n\nexport type Option<KeyName extends string> = {\n [keyName in KeyName]: string;\n} & Record<any, any> & { options?: Option<KeyName>[] };\n\nexport type TOptionGroup<T> = {\n name: string;\n options: T[];\n};\n\nexport type TSelectOptionKey<T> = TOptionGroup<T> | T;\n\ntype Select<TOption extends Option<KeyName>, KeyName extends string> = {\n options: TSelectOptionKey<TOption>[];\n keyName: KeyName;\n\n value?: TOption[KeyName];\n labelName?: TOption[keyof TOption];\n target?: HTMLElement | null;\n open?: boolean;\n onClose?: (e: Event) => void;\n onChange?: (value: TOption[KeyName]) => void;\n className?: string;\n offset?: [number, number];\n renderOption?: (option?: TOption) => ReactElement | null;\n renderLabel?: (option?: TOption | null) => ReactElement | null;\n nativeOnMobile?: boolean;\n overlay?: Partial<Omit<OverlayProps, 'children' | 'open' | 'container' | 'followElement' | 'onClose' | 'overlayRef'>>;\n};\n\nconst MOBILE_BREAKPOINT = 992;\n\nexport const InnerSelect = <TOption extends Option<KeyName>, KeyName extends string>(\n {\n target,\n open,\n onClose,\n options = [],\n value,\n onChange,\n keyName,\n labelName,\n className,\n offset,\n renderOption,\n nativeOnMobile = false,\n overlay,\n renderLabel,\n }: Select<TOption, KeyName>,\n ref: Ref<HTMLDivElement | null>\n) => {\n const { width } = useWindowSize();\n const targetRef = useRef<HTMLSpanElement>(null);\n const optionRefs = useRef<{ [id: string]: HTMLDivElement | null }>({});\n const optionContainerRef = useRef<HTMLDivElement | null>(null);\n const [_open, _setIsOpen] = useCombinedState<boolean>(open, false);\n const flattenOptions = useMemo<TOption[]>(() => {\n return options.reduce<TOption[]>((result, optionGroupProbably) => {\n if (optionGroupProbably.options) return result.concat(optionGroupProbably.options);\n return result.concat(optionGroupProbably as TOption);\n }, []);\n }, [options]);\n\n // TODO: Force to fix later\n nativeOnMobile = false;\n\n const _onClose = (e: Event): void => {\n _setIsOpen(false);\n onClose?.(e);\n };\n\n const overlayRef = useRef<HTMLDivElement | null>(null);\n useImperativeHandle<HTMLDivElement | null, HTMLDivElement | null>(ref, () => overlayRef.current);\n\n const _onSelected = (value: TOption[KeyName]) => {\n onChange?.(value);\n _setIsOpen(false);\n };\n\n const _getOption = (value?: TOption[KeyName]): TOption | undefined => {\n for (const option of options) {\n if (option.options && Array.isArray(option.options)) {\n for (const childOption of option.options) {\n if (childOption[keyName] === value) {\n return childOption;\n }\n }\n } else {\n // If we're in here it means that this option doesn't have children and is in fact an individual group\n if ((option as TOption)[keyName] === value) {\n return option as TOption;\n }\n }\n }\n };\n\n const { selectingItem, onItemMouseMove, onItemMouseLeave, onItemMouseEnter } = useKeyboardControlOnSelect<TOption, KeyName>({\n onSelected: (item) => _onSelected(item[keyName]),\n isEnabled: !!_open,\n options,\n idName: keyName,\n overlayRef: overlayRef.current,\n defaultOption: _getOption(value),\n optionRefs,\n optionContainerRef,\n });\n\n const _getStringLabel = (value?: TOption[KeyName]): string => {\n const option = _getOption(value);\n return option?.[labelName] || value || '';\n };\n\n const _getLabel = (value?: TOption[KeyName]): string | ReactNode => {\n const option = _getOption(value);\n\n if (renderLabel) {\n return renderLabel(option);\n }\n\n return _getStringLabel(value);\n };\n\n const _renderOptions = (options?: TSelectOptionKey<TOption>[]): ReactElement | JSX.Element[] | null => {\n if (!options) return null;\n return options.map((option, index) => {\n const isGroup = option.options;\n\n if (isGroup) {\n return _renderGroup(option.name, option.options);\n }\n\n return _renderOption({ option: option as TOption, key: index });\n });\n };\n\n const _renderGroup = (name: string, options?: TSelectOptionKey<TOption>[]) => {\n return (\n <>\n <div className=\"rs-select--suggest-list-item --group-title\">\n <Text type={TextType.Small} color={Color.DarkGrey}>\n {name}\n </Text>\n </div>\n {_renderOptions(options)}\n </>\n );\n };\n\n const _renderOption = ({ option, key }: { option: TOption; key: any }) => {\n const isSelected = option[keyName] === value;\n const isSelecting = option[keyName] === selectingItem?.[keyName];\n\n return (\n <div\n ref={(ref) => (optionRefs.current[option[keyName]] = ref)}\n key={key}\n className={classNames('rs-select--suggest-list-item', { '--selected': isSelected || isSelecting })}\n onClick={() => _onSelected(option[keyName])}\n onMouseEnter={() => {\n onItemMouseEnter(option);\n }}\n onMouseLeave={() => onItemMouseLeave()}\n onMouseMove={() => onItemMouseMove()}\n >\n <Text type={TextType.Small} className=\"rs-select--suggest-list-option-name\">\n {renderOption ? renderOption(option) : labelName ? option[labelName] : ''}\n </Text>\n {isSelected && (\n <span className=\"rs-select--suggest-list-option-icon\">\n <Icon icon={IconType.Check} />\n </span>\n )}\n </div>\n );\n };\n\n const native = width && width < MOBILE_BREAKPOINT && nativeOnMobile;\n\n return (\n <>\n {(native || !target) && (\n <span className={classNames('be-select', className)} onClick={() => _setIsOpen(true)} ref={targetRef}>\n {native ? (\n <select value={value} onChange={(e) => onChange?.(e.target.value as TOption[KeyName])}>\n {flattenOptions.map((item) => {\n return <option value={value} key={item[keyName]} label={_getStringLabel(item[keyName])}></option>;\n })}\n </select>\n ) : (\n _getLabel(value)\n )}\n <Icon icon={IconType.Dropdown} color={Color.DarkGrey} />\n </span>\n )}\n {!native && (\n <Overlay\n offset={offset}\n usePortal={overlay?.usePortal ?? true}\n followElement={target || targetRef.current || undefined}\n placement={overlay?.placement ?? 'bottom-start'}\n strategy={overlay?.strategy}\n open={open === undefined ? !!_open : open}\n onClose={_onClose}\n containerClassName={overlay?.containerClassName}\n overlayRef={overlayRef}\n >\n <div ref={optionContainerRef} className={classNames('rs-select--suggest-list', overlay?.className)}>\n {_renderOptions(options)}\n </div>\n </Overlay>\n )}\n </>\n );\n};\n\nexport const Select = forwardRef(InnerSelect) as <TOption extends Option<KeyName>, KeyName extends string>(\n p: Select<TOption, KeyName> & { ref?: Ref<HTMLDivElement> }\n) => JSX.Element;\n\nexport interface IDefaultSelectOption {\n value: string;\n text: string;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"Select.js","sourceRoot":"/","sources":["src/components/generic/Select/Select.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { forwardRef, ReactElement, ReactNode, Ref, useImperativeHandle, useMemo, useRef } from 'react';\nimport Icon, { IconType } from '../Icon/Icon';\n\nimport classNames from 'classnames';\n\nimport './Select.global.scss';\nimport { Overlay, OverlayProps } from '@/components/generic/Overlay/Overlay';\nimport { useKeyboardControlOnSelect } from '@/hooks/KeyboardControlOnSelect';\nimport { Color } from '@/util/Color';\nimport { useCombinedState } from '@/hooks/CombineState';\nimport { useWindowSize } from '@/hooks/WindowSize';\nimport Text, { TextType } from '@/components/generic/Text';\n\nexport type Option<KeyName extends string> = {\n [keyName in KeyName]: string;\n} & Record<any, any> & { options?: Option<KeyName>[] };\n\nexport type TOptionGroup<T> = {\n name: string;\n options: T[];\n};\n\nexport type TSelectOptionKey<T> = TOptionGroup<T> | T;\n\ntype Select<TOption extends Option<KeyName>, KeyName extends string> = {\n options: TSelectOptionKey<TOption>[];\n keyName: KeyName;\n\n value?: TOption[KeyName];\n labelName?: TOption[keyof TOption];\n target?: HTMLElement | null;\n open?: boolean;\n onClose?: (e: Event) => void;\n onChange?: (value: TOption[KeyName]) => void;\n className?: string;\n offset?: [number, number];\n renderOption?: (option?: TOption) => ReactElement | null;\n renderLabel?: (option?: TOption | null) => ReactElement | null;\n nativeOnMobile?: boolean;\n overlay?: Partial<Omit<OverlayProps, 'children' | 'open' | 'container' | 'followElement' | 'onClose' | 'overlayRef'>>;\n};\n\nconst MOBILE_BREAKPOINT = 992;\n\nexport const InnerSelect = <TOption extends Option<KeyName>, KeyName extends string>(\n {\n target,\n open,\n onClose,\n options = [],\n value,\n onChange,\n keyName,\n labelName,\n className,\n offset,\n renderOption,\n nativeOnMobile = false,\n overlay,\n renderLabel,\n }: Select<TOption, KeyName>,\n ref: Ref<HTMLDivElement | null>\n) => {\n const { width } = useWindowSize();\n const targetRef = useRef<HTMLSpanElement>(null);\n const optionRefs = useRef<{ [id: string]: HTMLDivElement | null }>({});\n const optionContainerRef = useRef<HTMLDivElement | null>(null);\n const [_open, _setIsOpen] = useCombinedState<boolean>(open, false);\n const flattenOptions = useMemo<TOption[]>(() => {\n return options.reduce<TOption[]>((result, optionGroupProbably) => {\n if (optionGroupProbably.options) return result.concat(optionGroupProbably.options);\n return result.concat(optionGroupProbably as TOption);\n }, []);\n }, [options]);\n\n // TODO: Force to fix later\n nativeOnMobile = false;\n\n const _onClose = (e: Event): void => {\n _setIsOpen(false);\n onClose?.(e);\n };\n\n const overlayRef = useRef<HTMLDivElement | null>(null);\n useImperativeHandle<HTMLDivElement | null, HTMLDivElement | null>(ref, () => overlayRef.current);\n\n const _onSelected = (value: TOption[KeyName]) => {\n onChange?.(value);\n _setIsOpen(false);\n };\n\n const _getOption = (value?: TOption[KeyName]): TOption | undefined => {\n for (const option of options) {\n if (option.options && Array.isArray(option.options)) {\n for (const childOption of option.options) {\n if (childOption[keyName] === value) {\n return childOption;\n }\n }\n } else {\n // If we're in here it means that this option doesn't have children and is in fact an individual group\n if ((option as TOption)[keyName] === value) {\n return option as TOption;\n }\n }\n }\n };\n\n const { selectingItem, onItemMouseMove, onItemMouseLeave, onItemMouseEnter } = useKeyboardControlOnSelect<TOption, KeyName>({\n onSelected: (item) => _onSelected(item[keyName]),\n isEnabled: !!_open,\n options,\n idName: keyName,\n overlayRef: overlayRef.current,\n defaultOption: _getOption(value),\n optionRefs,\n optionContainerRef,\n });\n\n const _getStringLabel = (value?: TOption[KeyName]): string => {\n const option = _getOption(value);\n return option?.[labelName] || value || '';\n };\n\n const _getLabel = (value?: TOption[KeyName]): string | ReactNode => {\n const option = _getOption(value);\n\n if (renderLabel) {\n return renderLabel(option);\n }\n\n return _getStringLabel(value);\n };\n\n const _renderOptions = (options?: TSelectOptionKey<TOption>[]): ReactElement | JSX.Element[] | null => {\n if (!options) return null;\n return options.map((option, index) => {\n const isGroup = option.options;\n\n if (isGroup) {\n return _renderGroup(option.name, option.options);\n }\n\n return _renderOption({ option: option as TOption, key: index });\n });\n };\n\n const _renderGroup = (name: string, options?: TSelectOptionKey<TOption>[]) => {\n return (\n <>\n <div className=\"rs-select--suggest-list-item --group-title\">\n <Text type={TextType.Small} color={Color.DarkGrey}>\n {name}\n </Text>\n </div>\n {_renderOptions(options)}\n </>\n );\n };\n\n const _renderOption = ({ option, key }: { option: TOption; key: any }) => {\n const isSelected = option[keyName] === value;\n const isSelecting = option[keyName] === selectingItem?.[keyName];\n\n return (\n <div\n ref={(ref) => (optionRefs.current[option[keyName]] = ref)}\n key={key}\n className={classNames('rs-select--suggest-list-item', { '--selected': isSelected || isSelecting })}\n onClick={() => _onSelected(option[keyName])}\n onMouseEnter={() => {\n onItemMouseEnter(option);\n }}\n onMouseLeave={() => onItemMouseLeave()}\n onMouseMove={() => onItemMouseMove()}\n >\n <Text type={TextType.Small} className=\"rs-select--suggest-list-option-name\">\n {renderOption ? renderOption(option) : labelName ? option[labelName] : ''}\n </Text>\n {isSelected && (\n <span className=\"rs-select--suggest-list-option-icon\">\n <Icon icon={IconType.Check} />\n </span>\n )}\n </div>\n );\n };\n\n const native = width && width < MOBILE_BREAKPOINT && nativeOnMobile;\n\n return (\n <>\n {(native || !target) && (\n <span className={classNames('be-select', className)} onClick={() => _setIsOpen(true)} ref={targetRef}>\n {native ? (\n <select value={value} onChange={(e) => onChange?.(e.target.value as TOption[KeyName])}>\n {flattenOptions.map((item) => {\n return <option value={value} key={item[keyName]} label={_getStringLabel(item[keyName])}></option>;\n })}\n </select>\n ) : (\n _getLabel(value)\n )}\n <Icon icon={IconType.Dropdown} color={Color.DarkGrey} />\n </span>\n )}\n {!native && (\n <Overlay\n offset={offset}\n usePortal={overlay?.usePortal ?? true}\n followElement={target || targetRef.current || undefined}\n placement={overlay?.placement ?? 'bottom-start'}\n strategy={overlay?.strategy}\n open={open === undefined ? !!_open : open}\n onClose={_onClose}\n containerClassName={overlay?.containerClassName}\n overlayRef={overlayRef}\n hideStyles={overlay?.hideStyles}\n >\n <div ref={optionContainerRef} className={classNames('rs-select--suggest-list', overlay?.className)}>\n {_renderOptions(options)}\n </div>\n </Overlay>\n )}\n </>\n );\n};\n\nexport const Select = forwardRef(InnerSelect) as <TOption extends Option<KeyName>, KeyName extends string>(\n p: Select<TOption, KeyName> & { ref?: Ref<HTMLDivElement> }\n) => JSX.Element;\n\nexport interface IDefaultSelectOption {\n value: string;\n text: string;\n}\n"]}
|
|
@@ -10,6 +10,7 @@ export interface TextBoxProps {
|
|
|
10
10
|
label?: string;
|
|
11
11
|
validationStatus?: 'success' | 'error';
|
|
12
12
|
value?: string;
|
|
13
|
+
className?: string;
|
|
13
14
|
onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
|
|
14
15
|
inputProps?: Omit<JSX.IntrinsicElements['input'], 'id' | 'ref' | 'value' | 'onFocus' | 'onBlur' | 'onKeyPress'>;
|
|
15
16
|
onKeyPress?: JSX.IntrinsicElements['input']['onKeyPress'];
|
|
@@ -36,7 +36,7 @@ const TextBox = (props, ref) => {
|
|
|
36
36
|
'--success': props.validationStatus === 'success',
|
|
37
37
|
'--error': props.validationStatus === 'error',
|
|
38
38
|
'--disabled': inputProperties.disabled,
|
|
39
|
-
});
|
|
39
|
+
}, props.className);
|
|
40
40
|
const onFocusHandler = () => {
|
|
41
41
|
return setSelected(true);
|
|
42
42
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextBox.js","sourceRoot":"/","sources":["src/components/generic/TextBox.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAC1B,iCAAsE;AACtE,0EAAgE;AAEhE,4DAAoC;
|
|
1
|
+
{"version":3,"file":"TextBox.js","sourceRoot":"/","sources":["src/components/generic/TextBox.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAC1B,iCAAsE;AACtE,0EAAgE;AAEhE,4DAAoC;AAwBpC,MAAM,OAAO,GAA6D,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACrF,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAEhD,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC;IAC9C,MAAM,eAAe,mBACjB,IAAI,EACJ,SAAS,EAAE,YAAY,EACvB,WAAW,EAAE,KAAK,CAAC,WAAW,IAC3B,KAAK,CAAC,UAAU,CACtB,CAAC;IAEF,IAAI,KAAK,CAAC,IAAI,EAAE;QACZ,eAAe,CAAC,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC;KACrC;IAED,IAAI,KAAK,CAAC,QAAQ,EAAE;QAChB,eAAe,CAAC,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC;KAC7C;IAED,MAAM,QAAQ,GAA+C,CAAC,CAAC,EAAE,EAAE;QAC/D,IAAI,KAAK,CAAC,QAAQ,EAAE;YAChB,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;SACrB;IACL,CAAC,CAAC;IAEF,IAAI,KAAK,CAAC,QAAQ,EAAE;QAChB,eAAe,CAAC,QAAQ,GAAG,QAAQ,CAAC;KACvC;IAED,IAAI,IAAI,GAAc,EAAE,CAAC;IAEzB,IAAI,KAAK,CAAC,IAAI,EAAE;QACZ,IAAI,GAAG,8BAAC,cAAI,IAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,IAAI,EAAC,KAAK,GAAG,CAAC;KAChD;IAED,MAAM,OAAO,GAAG,IAAA,oBAAU,EACtB,iBAAiB,EACjB;QACI,YAAY,EAAE,CAAC,CAAC,IAAI;QACpB,YAAY,EAAE,QAAQ;QACtB,QAAQ,EAAE,KAAK,CAAC,IAAI;QACpB,WAAW,EAAE,KAAK,CAAC,gBAAgB,KAAK,SAAS;QACjD,SAAS,EAAE,KAAK,CAAC,gBAAgB,KAAK,OAAO;QAC7C,YAAY,EAAE,eAAe,CAAC,QAAQ;KACzC,EACD,KAAK,CAAC,SAAS,CAClB,CAAC;IACF,MAAM,cAAc,GAAG,GAAG,EAAE;QACxB,OAAO,WAAW,CAAC,IAAI,CAAC,CAAC;IAC7B,CAAC,CAAC;IACF,MAAM,aAAa,GAAG,GAAG,EAAE;QACvB,OAAO,WAAW,CAAC,KAAK,CAAC,CAAC;IAC9B,CAAC,CAAC;IAEF,MAAM,EAAE,GAAG,GAAG,KAAK,CAAC,IAAI,GAAG,IAAI,OAAO,CAAC;IAEvC,OAAO,CACH;QACK,KAAK,CAAC,KAAK,IAAI,CACZ,yCAAO,SAAS,EAAC,WAAW,EAAC,OAAO,EAAE,EAAE;YACpC;gBACK,KAAK,CAAC,KAAK;gBACX,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,QAAQ,KAAI,uCAAK,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,QAAS,CAC1D,CACC,CACX;QACD,yCAAO,SAAS,EAAE,OAAO;YACpB,IAAI;YACL,yDAAW,eAAe,IAAE,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,EAAE,aAAa,EAAE,UAAU,EAAE,KAAK,CAAC,UAAU,IAAI,CAC9I,CACT,CACN,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,eAAK,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC","sourcesContent":["import React from 'react';\nimport { ForwardRefRenderFunction, ReactNode, useState } from 'react';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\n\nimport classNames from 'classnames';\n\nexport interface TextBoxProps {\n icon?: IconType;\n placeholder?: string;\n wide?: boolean;\n type?: 'text' | 'tel' | 'password' | 'email';\n name?: string;\n required?: boolean;\n label?: string;\n\n validationStatus?: 'success' | 'error';\n\n value?: string;\n\n className?: string;\n\n onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n\n inputProps?: Omit<JSX.IntrinsicElements['input'], 'id' | 'ref' | 'value' | 'onFocus' | 'onBlur' | 'onKeyPress'>;\n\n onKeyPress?: JSX.IntrinsicElements['input']['onKeyPress'];\n}\n\nconst TextBox: ForwardRefRenderFunction<HTMLInputElement, TextBoxProps> = (props, ref) => {\n const [selected, setSelected] = useState(false);\n\n const type = props.type ? props.type : 'text';\n const inputProperties: JSX.IntrinsicElements['input'] = {\n type,\n className: 'text-small',\n placeholder: props.placeholder,\n ...props.inputProps,\n };\n\n if (props.name) {\n inputProperties.name = props.name;\n }\n\n if (props.required) {\n inputProperties.required = props.required;\n }\n\n const onChange: JSX.IntrinsicElements['input']['onChange'] = (e) => {\n if (props.onChange) {\n props.onChange(e);\n }\n };\n\n if (props.onChange) {\n inputProperties.onChange = onChange;\n }\n\n let icon: ReactNode = '';\n\n if (props.icon) {\n icon = <Icon icon={props.icon} size=\"1em\" />;\n }\n\n const classes = classNames(\n 'textbox c-input',\n {\n '--has-icon': !!icon,\n '--selected': selected,\n '--wide': props.wide,\n '--success': props.validationStatus === 'success',\n '--error': props.validationStatus === 'error',\n '--disabled': inputProperties.disabled,\n },\n props.className\n );\n const onFocusHandler = () => {\n return setSelected(true);\n };\n const onBlurHandler = () => {\n return setSelected(false);\n };\n\n const id = `${props.name}${type}Input`;\n\n return (\n <>\n {props.label && (\n <label className=\"text-bold\" htmlFor={id}>\n <>\n {props.label}\n {props?.required && <div style={{ color: 'red' }}>*</div>}\n </>\n </label>\n )}\n <label className={classes}>\n {icon}\n <input {...inputProperties} id={id} ref={ref} value={props.value} onFocus={onFocusHandler} onBlur={onBlurHandler} onKeyPress={props.onKeyPress} />\n </label>\n </>\n );\n};\n\nexport default React.forwardRef(TextBox);\n"]}
|
|
@@ -1,3 +1,6 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
import React from 'react';
|
|
2
|
+
interface AcknowledgementProps {
|
|
3
|
+
confirmationPolicyError: boolean;
|
|
4
|
+
}
|
|
5
|
+
declare const _default: React.ForwardRefExoticComponent<AcknowledgementProps & React.RefAttributes<unknown>>;
|
|
6
|
+
export default _default;
|
|
@@ -37,33 +37,23 @@ const AutoAutoHeight_1 = __importDefault(require("../../../animations/AutoAutoHe
|
|
|
37
37
|
const Alert_1 = __importStar(require("../../generic/Alert"));
|
|
38
38
|
const Icon_1 = require("../../generic/Icon/Icon");
|
|
39
39
|
const hooks_1 = require("../../../hooks/index.js");
|
|
40
|
-
|
|
41
|
-
const react_hook_form_1 = require("react-hook-form");
|
|
42
|
-
const StepConfirmationAcknowledgement = () => {
|
|
43
|
-
var _a;
|
|
40
|
+
exports.default = react_1.default.forwardRef(function StepConfirmationAcknowledgement(props, ref) {
|
|
44
41
|
const { t } = (0, react_i18next_1.useTranslation)();
|
|
42
|
+
const { confirmationPolicyError } = props;
|
|
45
43
|
const { hotel } = (0, hooks_1.useCurrentHotel)();
|
|
46
|
-
const { control, getFieldState } = (0, react_hook_form_1.useFormContext)();
|
|
47
|
-
const confirmationPolicyError = (_a = getFieldState('isPolicyConfirmed').error) === null || _a === void 0 ? void 0 : _a.message;
|
|
48
44
|
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
49
45
|
react_1.default.createElement("div", { className: "u-marg-bottom" },
|
|
50
46
|
react_1.default.createElement(Headline_1.default, { bold: true }, t(Translation_1.Translation.Step.Confirmation.Acknowledgement))),
|
|
51
47
|
react_1.default.createElement("div", null,
|
|
52
48
|
react_1.default.createElement(Checkbox_1.default, { label: t(Translation_1.Translation.Step.Confirmation.EmailSpecialOffers) })),
|
|
53
49
|
react_1.default.createElement("div", { className: "u-marg-top--light" },
|
|
54
|
-
react_1.default.createElement(
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
value: ConfirmationVerifyFeature_1.default.isActive(),
|
|
60
|
-
message: t(Translation_1.Translation.Step.Confirmation.PrivacyPolicyError),
|
|
61
|
-
},
|
|
62
|
-
} })),
|
|
63
|
-
react_1.default.createElement(AutoAutoHeight_1.default, { open: !!confirmationPolicyError },
|
|
50
|
+
react_1.default.createElement(Checkbox_1.default, { ref: ref, label: react_1.default.createElement("div", null,
|
|
51
|
+
t(Translation_1.Translation.Step.Confirmation.IHaveUnderstoodPrivacyPolicy),
|
|
52
|
+
' ',
|
|
53
|
+
react_1.default.createElement("a", { style: { color: Color_1.Color.Accent }, className: "--underlined", href: hotel === null || hotel === void 0 ? void 0 : hotel.privacyPolicyUrl, target: "_blank", rel: "noreferrer" }, t(Translation_1.Translation.Step.Confirmation.PrivacyPolicy))) })),
|
|
54
|
+
react_1.default.createElement(AutoAutoHeight_1.default, { open: confirmationPolicyError },
|
|
64
55
|
react_1.default.createElement("div", { className: "u-flex u-marg-top" },
|
|
65
56
|
react_1.default.createElement(Alert_1.default, { type: Alert_1.AlertType.Danger, icon: Icon_1.IconType.Error },
|
|
66
|
-
react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
|
|
67
|
-
};
|
|
68
|
-
exports.default = StepConfirmationAcknowledgement;
|
|
57
|
+
react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small }, t(Translation_1.Translation.Step.Confirmation.PrivacyPolicyError)))))));
|
|
58
|
+
});
|
|
69
59
|
//# sourceMappingURL=StepConfirmationAcknowledgement.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StepConfirmationAcknowledgement.js","sourceRoot":"/","sources":["src/components/steps/confirmation/StepConfirmationAcknowledgement.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,
|
|
1
|
+
{"version":3,"file":"StepConfirmationAcknowledgement.js","sourceRoot":"/","sources":["src/components/steps/confirmation/StepConfirmationAcknowledgement.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,6EAAqD;AACrD,4DAAyD;AACzD,kEAA2D;AAC3D,iDAA+C;AAC/C,sFAA8D;AAC9D,wCAAqC;AACrC,iFAAyD;AACzD,oEAA8D;AAC9D,yDAA0D;AAC1D,2CAAkD;AAMlD,kBAAe,eAAK,CAAC,UAAU,CAAC,SAAS,+BAA+B,CAAC,KAA2B,EAAE,GAAQ;IAC1G,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,MAAM,EAAE,uBAAuB,EAAE,GAAG,KAAK,CAAC;IAC1C,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,uBAAe,GAAE,CAAC;IAEpC,OAAO,CACH;QACI,uCAAK,SAAS,EAAC,eAAe;YAC1B,8BAAC,kBAAQ,IAAC,IAAI,UAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,YAAY,CAAC,eAAe,CAAC,CAAY,CAC1E;QACN;YACI,8BAAC,kBAAQ,IAAC,KAAK,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,YAAY,CAAC,kBAAkB,CAAC,GAAI,CACtE;QACN,uCAAK,SAAS,EAAC,mBAAmB;YAC9B,8BAAC,kBAAQ,IACL,GAAG,EAAE,GAAG,EACR,KAAK,EACD;oBACK,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,YAAY,CAAC,4BAA4B,CAAC;oBAAE,GAAG;oBACnE,qCAAG,KAAK,EAAE,EAAE,KAAK,EAAE,aAAK,CAAC,MAAM,EAAE,EAAE,SAAS,EAAC,cAAc,EAAC,IAAI,EAAE,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,gBAAgB,EAAE,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,YAAY,IACtH,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,CAC/C,CACF,GAEZ,CACA;QACN,8BAAC,wBAAc,IAAC,IAAI,EAAE,uBAAuB;YACzC,uCAAK,SAAS,EAAC,mBAAmB;gBAC9B,8BAAC,eAAK,IAAC,IAAI,EAAE,iBAAS,CAAC,MAAM,EAAE,IAAI,EAAE,eAAQ,CAAC,KAAK;oBAC/C,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,IAAG,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,YAAY,CAAC,kBAAkB,CAAC,CAAQ,CACpF,CACN,CACO,CAClB,CACN,CAAC;AACN,CAAC,CAAC,CAAC","sourcesContent":["import React from 'react';\nimport Headline from '@/components/generic/Headline';\nimport { Translation } from '@/translations/Translation';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { useTranslation } from 'react-i18next';\nimport Checkbox from '@/components/generic/Checkbox/Checkbox';\nimport { Color } from '@/util/Color';\nimport AutoAutoHeight from '@/animations/AutoAutoHeight';\nimport Alert, { AlertType } from '@/components/generic/Alert';\nimport { IconType } from '@/components/generic/Icon/Icon';\nimport { useCurrentHotel } from '@frontend/hooks';\n\ninterface AcknowledgementProps {\n confirmationPolicyError: boolean;\n}\n\nexport default React.forwardRef(function StepConfirmationAcknowledgement(props: AcknowledgementProps, ref: any) {\n const { t } = useTranslation();\n const { confirmationPolicyError } = props;\n const { hotel } = useCurrentHotel();\n\n return (\n <>\n <div className=\"u-marg-bottom\">\n <Headline bold>{t(Translation.Step.Confirmation.Acknowledgement)}</Headline>\n </div>\n <div>\n <Checkbox label={t(Translation.Step.Confirmation.EmailSpecialOffers)} />\n </div>\n <div className=\"u-marg-top--light\">\n <Checkbox\n ref={ref}\n label={\n <div>\n {t(Translation.Step.Confirmation.IHaveUnderstoodPrivacyPolicy)}{' '}\n <a style={{ color: Color.Accent }} className=\"--underlined\" href={hotel?.privacyPolicyUrl} target=\"_blank\" rel=\"noreferrer\">\n {t(Translation.Step.Confirmation.PrivacyPolicy)}\n </a>\n </div>\n }\n />\n </div>\n <AutoAutoHeight open={confirmationPolicyError}>\n <div className=\"u-flex u-marg-top\">\n <Alert type={AlertType.Danger} icon={IconType.Error}>\n <Text type={TextType.Small}>{t(Translation.Step.Confirmation.PrivacyPolicyError)}</Text>\n </Alert>\n </div>\n </AutoAutoHeight>\n </>\n );\n});\n"]}
|
|
@@ -35,8 +35,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
35
35
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
36
36
|
};
|
|
37
37
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
38
|
-
const react_1 =
|
|
39
|
-
const react_2 = require("react");
|
|
38
|
+
const react_1 = __importStar(require("react"));
|
|
40
39
|
const Headline_1 = __importDefault(require("../../generic/Headline"));
|
|
41
40
|
const Translation_1 = require("translations/Translation");
|
|
42
41
|
const Text_1 = __importStar(require("../../generic/Text"));
|
|
@@ -63,7 +62,6 @@ const ConfirmationVerifyFeature_1 = __importDefault(require("../../../providers/
|
|
|
63
62
|
const TextBox_1 = __importDefault(require("../../generic/TextBox"));
|
|
64
63
|
const ShowIATANumberOnCheckoutFeature_1 = __importDefault(require("../../../providers/feature/ShowIATANumberOnCheckoutFeature"));
|
|
65
64
|
const PlanpayPaymentMethod_1 = require("./PlanpayPaymentMethod");
|
|
66
|
-
const TextArea_1 = __importDefault(require("../../generic/TextArea"));
|
|
67
65
|
const ConfirmationStepContext_1 = require("contexts/ConfirmationStepContext/ConfirmationStepContext");
|
|
68
66
|
const ConfirmationQuery_1 = require("../../../hooks/ConfirmationQuery");
|
|
69
67
|
const LargeLoader_1 = __importDefault(require("../../generic/loader/LargeLoader"));
|
|
@@ -74,19 +72,24 @@ const AcceptablePaymentCard_1 = __importDefault(require("./PaymentDetails/Accept
|
|
|
74
72
|
const RoomstayThemeEngine_1 = __importDefault(require("../../../providers/RoomstayThemeEngine"));
|
|
75
73
|
const hooks_1 = require("../../../hooks/index.js");
|
|
76
74
|
const dayjs_1 = __importDefault(require("dayjs"));
|
|
75
|
+
const StepConfirmationCommentsComponent_1 = require("./StepConfirmationCommentsComponent");
|
|
77
76
|
function StepConfirmationForm() {
|
|
78
|
-
const [differenceWarning, setDifferenceWarning] = (0,
|
|
77
|
+
const [differenceWarning, setDifferenceWarning] = (0, react_1.useState)({
|
|
79
78
|
differences: [],
|
|
80
79
|
warnings: [],
|
|
81
80
|
});
|
|
82
|
-
const
|
|
81
|
+
const formContext = (0, react_1.useContext)(contexts_1.ConfirmationFormContext);
|
|
82
|
+
const [source, setSource] = (0, react_1.useState)('');
|
|
83
|
+
const [confirmationPolicyError, setConfirmationPolicyError] = (0, react_1.useState)(false);
|
|
84
|
+
const confirmationPolicy = (0, react_1.useRef)(null);
|
|
85
|
+
const commentTextbox = (0, react_1.useRef)(null);
|
|
83
86
|
const { t } = (0, react_i18next_1.useTranslation)();
|
|
84
87
|
const { queryPaymentMethod, queryRoomstayId, queryPlanpayCheckoutId } = (0, ConfirmationQuery_1.useConfirmationQuery)();
|
|
85
88
|
const context = (0, contexts_1.useBookingEngine)();
|
|
86
89
|
const methods = (0, react_hook_form_1.useFormContext)();
|
|
87
90
|
const { isBackFromPlanpay, isLoading, apiErrors, clearApiErrors, book, rollbackReservation, commitReservation } = (0, ConfirmationStepContext_1.useConfirmationStep)();
|
|
88
91
|
const basketContext = (0, contexts_1.useBasket)();
|
|
89
|
-
const tokenizerRef = (0,
|
|
92
|
+
const tokenizerRef = (0, react_1.useRef)(null);
|
|
90
93
|
const history = (0, react_router_dom_1.useHistory)();
|
|
91
94
|
const { hotel } = (0, hooks_1.useCurrentHotel)();
|
|
92
95
|
const toPaymentPayload = (paymentMethod) => __awaiter(this, void 0, void 0, function* () {
|
|
@@ -114,7 +117,7 @@ function StepConfirmationForm() {
|
|
|
114
117
|
}
|
|
115
118
|
return payment;
|
|
116
119
|
});
|
|
117
|
-
(0,
|
|
120
|
+
(0, react_1.useEffect)(() => {
|
|
118
121
|
var _a;
|
|
119
122
|
const validatedPaymentMethod = Object.values(core_1.EBookingPaymentMethod).includes(queryPaymentMethod)
|
|
120
123
|
? queryPaymentMethod
|
|
@@ -153,7 +156,22 @@ function StepConfirmationForm() {
|
|
|
153
156
|
return false;
|
|
154
157
|
});
|
|
155
158
|
const handleBook = (paymentMethod, onSuccess) => __awaiter(this, void 0, void 0, function* () {
|
|
156
|
-
|
|
159
|
+
var _b;
|
|
160
|
+
yield (book === null || book === void 0 ? void 0 : book(() => __awaiter(this, void 0, void 0, function* () { return toPaymentPayload(paymentMethod); }), (_b = commentTextbox.current) === null || _b === void 0 ? void 0 : _b.value, () => __awaiter(this, void 0, void 0, function* () {
|
|
161
|
+
var _c;
|
|
162
|
+
if (ConfirmationVerifyFeature_1.default.isActive() && !((_c = confirmationPolicy === null || confirmationPolicy === void 0 ? void 0 : confirmationPolicy.current) === null || _c === void 0 ? void 0 : _c.checked)) {
|
|
163
|
+
setConfirmationPolicyError(true);
|
|
164
|
+
return false;
|
|
165
|
+
}
|
|
166
|
+
let adhocValid = true;
|
|
167
|
+
formContext === null || formContext === void 0 ? void 0 : formContext.errorChecks.forEach((check) => {
|
|
168
|
+
if (!check().validate()) {
|
|
169
|
+
adhocValid = false;
|
|
170
|
+
}
|
|
171
|
+
});
|
|
172
|
+
if (!adhocValid) {
|
|
173
|
+
return false;
|
|
174
|
+
}
|
|
157
175
|
try {
|
|
158
176
|
if (paymentMethod === core_1.EBookingPaymentMethod.Card)
|
|
159
177
|
yield tokenizerRef.current.getTokenizedCode();
|
|
@@ -199,12 +217,7 @@ function StepConfirmationForm() {
|
|
|
199
217
|
react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small }, t(Translation_1.Translation.Step.Confirmation.Inputs.IATANumberGuide))),
|
|
200
218
|
react_1.default.createElement(TextBox_1.default, Object.assign({ placeholder: t(Translation_1.Translation.Step.Confirmation.Inputs.IATANumber), wide: true }, methods.register('IATANumber')))),
|
|
201
219
|
react_1.default.createElement(LineBreak_1.default, null))),
|
|
202
|
-
react_1.default.createElement(
|
|
203
|
-
react_1.default.createElement("div", { className: "u-marg-bottom" },
|
|
204
|
-
react_1.default.createElement(Headline_1.default, { bold: true }, t(Translation_1.Translation.Step.Confirmation.Comments))),
|
|
205
|
-
react_1.default.createElement(TextArea_1.default, Object.assign({ style: {
|
|
206
|
-
resize: 'vertical',
|
|
207
|
-
}, disabled: paymentMethod === core_1.EBookingPaymentMethod.Planpay, placeholder: t(Translation_1.Translation.Step.Confirmation.Inputs.EnterSpecialRequestsHere) }, methods.register('comment')))),
|
|
220
|
+
react_1.default.createElement(StepConfirmationCommentsComponent_1.StepConfirmationCommentsComponent, { inputRef: commentTextbox }),
|
|
208
221
|
react_1.default.createElement(LineBreak_1.default, null),
|
|
209
222
|
react_1.default.createElement("div", { className: "u-marg-bottom--heavy" },
|
|
210
223
|
react_1.default.createElement("div", { className: "u-marg-bottom" },
|
|
@@ -276,7 +289,7 @@ function StepConfirmationForm() {
|
|
|
276
289
|
ConfirmationVerifyFeature_1.default.isActive() && (react_1.default.createElement(react_1.default.Fragment, null,
|
|
277
290
|
react_1.default.createElement(LineBreak_1.default, null),
|
|
278
291
|
react_1.default.createElement("div", null,
|
|
279
|
-
react_1.default.createElement(StepConfirmationAcknowledgement_1.default,
|
|
292
|
+
react_1.default.createElement(StepConfirmationAcknowledgement_1.default, { ref: confirmationPolicy, confirmationPolicyError: confirmationPolicyError })))),
|
|
280
293
|
react_1.default.createElement("div", { className: "u-flex u-marg-top--heavy justify-content-end" },
|
|
281
294
|
react_1.default.createElement(NextStepButton_1.default, { disabled: paymentMethod === core_1.EBookingPaymentMethod.Planpay || isLoading, text: t(Translation_1.Translation.Step.Confirmation.ConfirmReservation), history: null, isLoading: isLoading, currentStep: StepConfirmation_1.default, onClick: onNextStepClicked })))),
|
|
282
295
|
react_1.default.createElement(ErrorModal_1.default, { open: !!apiErrors, onClose: clearApiErrors },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StepConfirmationForm.js","sourceRoot":"/","sources":["src/components/steps/confirmation/StepConfirmationForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { useEffect, useRef, useState } from 'react';\nimport Headline from '@/components/generic/Headline';\nimport { Translation } from 'translations/Translation';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { Color } from '@/util/Color';\nimport { Controller, useFormContext } from 'react-hook-form';\nimport RoomContactDetails from '@/components/steps/confirmation/RoomContactDetails';\nimport LineBreak from '@/components/generic/LineBreak';\nimport StepConfirmationPoliciesSection from '@/components/steps/confirmation/StepConfirmationPoliciesSection';\nimport NextStepButton from '@/components/generic/buttons/NextStepButton';\nimport { useTranslation } from 'react-i18next';\nimport { useBasket, useBookingEngine } from '@frontend/contexts';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport SSLSecureBadge from '@/components/generic/badging/SSLSecureBadge';\nimport StepConfirmationCheckoutDifferencesModal from '@/components/steps/confirmation/StepConfirmationCheckoutDifferencesModal';\nimport { useHistory } from 'react-router-dom';\nimport ErrorModal from '@/components/generic/modal/ErrorModal';\nimport StepConfirmationPolicyBlock from '@/components/steps/confirmation/StepConfirmationPolicyBlock';\n\nimport StepConfirmationAcknowledgement from '@/components/steps/confirmation/StepConfirmationAcknowledgement';\nimport BEButton from '@/components/generic/BEButton';\nimport Alert, { AlertType } from '@/components/generic/Alert';\nimport StepConfirmation from '@/pages/steps/StepConfirmation/StepConfirmation';\nimport StepRoom from '@/pages/steps/StepRoom/StepRoom';\nimport ConfirmationVerifyFeature from '@/providers/feature/ConfirmationVerifyFeature';\nimport TextBox from '@/components/generic/TextBox';\nimport ShowIATANumberOnCheckoutFeature from '@/providers/feature/ShowIATANumberOnCheckoutFeature';\nimport { PlanpayPaymentMethod } from './PlanpayPaymentMethod';\nimport { ConfirmationFormValues, FBookSuccessCallback } from '@/models/Confirmation';\nimport TextArea from '../../generic/TextArea';\nimport { useConfirmationStep } from 'contexts/ConfirmationStepContext/ConfirmationStepContext';\nimport { useConfirmationQuery } from '@/hooks/ConfirmationQuery';\nimport BasketRowDifferences from '../../../models/BasketRowDifferences';\nimport LargeLoader from '@/components/generic/loader/LargeLoader';\nimport StepConfirmationPaymentDetails from './PaymentDetails/StepConfirmationPaymentDetails';\nimport { EBookingPaymentMethod, IBookingPayment } from '@roomstay/core';\nimport RadioButtonGroup from '@/components/generic/RadioButtonGroup/RadioButtonGroup';\nimport AcceptablePaymentCard from '@/components/steps/confirmation/PaymentDetails/AcceptablePaymentCard';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport dayjs from 'dayjs';\n\nexport default function StepConfirmationForm() {\n const [differenceWarning, setDifferenceWarning] = useState<{\n differences: BasketRowDifferences[];\n warnings: string[];\n }>({\n differences: [],\n warnings: [],\n });\n\n const [source, setSource] = useState('');\n\n const { t } = useTranslation();\n const { queryPaymentMethod, queryRoomstayId, queryPlanpayCheckoutId } = useConfirmationQuery();\n const context = useBookingEngine();\n const methods = useFormContext<ConfirmationFormValues>();\n const { isBackFromPlanpay, isLoading, apiErrors, clearApiErrors, book, rollbackReservation, commitReservation } = useConfirmationStep();\n const basketContext = useBasket();\n const tokenizerRef = useRef<any | null>(null);\n const history = useHistory();\n const { hotel } = useCurrentHotel();\n\n const toPaymentPayload = async (paymentMethod: EBookingPaymentMethod): Promise<IBookingPayment> => {\n let payment: IBookingPayment;\n switch (paymentMethod) {\n case EBookingPaymentMethod.Planpay: {\n const params = new URLSearchParams(window.location.search);\n params.set('roomstayId', '{{rsId}}');\n params.set('session', context.sessionProvider.getCurrentSessionID().toString());\n params.set('paymentMethod', EBookingPaymentMethod.Planpay);\n const redirectURL = `${window.location.origin}${window.location.pathname}${window.location.search}#/step/confirmation/?${params}`;\n payment = {\n Method: EBookingPaymentMethod.Planpay,\n PlanpayCheckoutId: queryPlanpayCheckoutId || undefined,\n RedirectUrl: redirectURL,\n };\n break;\n }\n default:\n payment = {\n Method: EBookingPaymentMethod.Card,\n PaymentCard: await tokenizerRef.current?.getTokenizedCode(),\n };\n }\n\n return payment;\n };\n\n useEffect(() => {\n const validatedPaymentMethod = Object.values(EBookingPaymentMethod).includes(queryPaymentMethod as EBookingPaymentMethod)\n ? (queryPaymentMethod as EBookingPaymentMethod)\n : EBookingPaymentMethod.Card;\n methods.setValue('paymentMethod', validatedPaymentMethod);\n handleChangePaymentMethod(validatedPaymentMethod);\n if (isBackFromPlanpay) {\n if (queryRoomstayId === basketContext.reservationData?.roomstayId) {\n onPlaypayCallback(validatedPaymentMethod);\n } else {\n rollbackReservation?.();\n }\n }\n return () => {\n if (!isBackFromPlanpay) rollbackReservation?.();\n };\n }, []);\n\n const onPlaypayCallback = async (paymentMethod: EBookingPaymentMethod) => {\n await commitReservation?.(basketContext.reservationData);\n };\n\n const paymentMethod = methods.watch('paymentMethod');\n\n context.engine\n .getSessionProvider()\n .getSession()\n .then((session) => {\n setSource(session.source);\n });\n\n const returnToPickRooms = async () => {\n // TODO: What if StepRoom doesn't exist?\n history.push(StepRoom.getStepUrl());\n };\n\n const onNextStepClicked = async () => {\n await handleBook(paymentMethod, async (resData) => commitReservation?.(resData));\n return false;\n };\n\n const handleBook = async (paymentMethod: EBookingPaymentMethod, onSuccess?: FBookSuccessCallback): Promise<void> => {\n await book?.(\n async () => toPaymentPayload(paymentMethod),\n async (): Promise<boolean> => {\n try {\n if (paymentMethod === EBookingPaymentMethod.Card) await tokenizerRef.current.getTokenizedCode();\n return true;\n } catch (e) {\n return false;\n }\n },\n (validationResult) => {\n if (validationResult) {\n setDifferenceWarning(validationResult);\n }\n },\n onSuccess\n );\n };\n\n const handleChangePaymentMethod = async (paymentMethod: EBookingPaymentMethod) => {\n if (paymentMethod !== EBookingPaymentMethod.Planpay) {\n await rollbackReservation?.();\n }\n };\n\n return (\n <form>\n {isBackFromPlanpay ? (\n <LargeLoader />\n ) : (\n <>\n <div className=\"u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom--light\">\n <Headline bold>{t(Translation.Step.Confirmation.GuestDetails)}</Headline>\n </div>\n <Text type={TextType.Small} color={Color.Success}>\n <strong>{t(Translation.Step.Confirmation.AlmostDone, { required: '*' })}</strong>\n </Text>\n </div>\n <RoomContactDetails />\n {source === 'inline' ? (\n <Alert type={AlertType.Accent2} heavyPadding>\n <div className=\"u-flex u-w-100 flex-wrap flex-xl-nowrap\">\n <div>\n <Text color={Color.Accent} bold>\n {t(Translation.Step.Confirmation.WantMoreRooms)}\n </Text>\n <Text color={Color.Navy}>{t(Translation.Step.Confirmation.YouCanAddAndEditRooms)}</Text>\n </div>\n <div className=\"d-flex align-items-center u-marg-top@xl-\">\n <BEButton filled primary icon={IconType.Add} iconPosition=\"left\" onClick={returnToPickRooms}>\n {t(Translation.Step.Confirmation.AddMoreRooms)}\n </BEButton>\n </div>\n </div>\n </Alert>\n ) : (\n <></>\n )}\n {ShowIATANumberOnCheckoutFeature.isActive() && (\n <>\n <div className=\"u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom\">\n <Headline bold>Travel Agent</Headline>\n </div>\n\n <div className=\"u-marg-bottom--light\">\n <Text type={TextType.Small}>\n <strong>{t(Translation.Step.Confirmation.Inputs.IATANumber)}</strong>\n </Text>\n </div>\n <div className=\"u-marg-bottom--light\">\n <Text type={TextType.Small}>{t(Translation.Step.Confirmation.Inputs.IATANumberGuide)}</Text>\n </div>\n <TextBox placeholder={t(Translation.Step.Confirmation.Inputs.IATANumber)} wide {...methods.register('IATANumber')} />\n </div>\n <LineBreak />\n </>\n )}\n <div className=\"u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom\">\n <Headline bold>{t(Translation.Step.Confirmation.Comments)}</Headline>\n </div>\n <TextArea\n style={{\n resize: 'vertical',\n }}\n disabled={paymentMethod === EBookingPaymentMethod.Planpay}\n placeholder={t(Translation.Step.Confirmation.Inputs.EnterSpecialRequestsHere)}\n {...methods.register('comment')}\n />\n </div>\n <LineBreak />\n <div className=\"u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom\">\n <Headline bold>{t(Translation.Step.Confirmation.PaymentInformation)}</Headline>\n </div>\n <Controller\n control={methods.control}\n name=\"paymentMethod\"\n render={({ field: { onChange, value } }) => {\n return (\n <>\n <div>\n <RadioButtonGroup<EBookingPaymentMethod>\n options={[\n {\n value: EBookingPaymentMethod.Card,\n label: (\n <div className=\"u-flex u-flex-align-center\">\n <div className=\"u-marg-right--light\">{t(Translation.Step.Confirmation.CardLabel)}</div>\n <AcceptablePaymentCard\n isDefault={(cardKey: any) => {\n return true;\n }}\n style={{\n height: 16,\n width: 24,\n borderRadius: 2.5,\n border: '0.5px solid #DFE1E5',\n marginRight: 4,\n }}\n />\n </div>\n ),\n renderContent: () => <StepConfirmationPaymentDetails ref={tokenizerRef} />,\n },\n {\n value: EBookingPaymentMethod.Planpay,\n label: (\n <div className=\"u-flex u-flex-align-center\">\n <div>{t(Translation.Step.Confirmation.PlanpayLabel)}</div>\n <div\n className=\"u-flex u-flex-align-center u-marg-left--light\"\n style={{\n borderRadius: '24px',\n overflow: 'hidden',\n }}\n >\n <img height={16} src={RoomstayThemeEngine.getImageAssetUrl('planpay-logo-small.svg')} alt=\"\" />\n </div>\n {!methods.formState.isValid && (\n <Text\n color={Color.Graphite}\n className=\"u-flex u-flex-align-center\"\n style={{\n color: '#313131',\n fontSize: 10,\n }}\n >\n <Icon color={Color.DarkGrey} icon={IconType.Info} className=\"u-marg-right--lighter u-marg-left--light\" />\n {t(Translation.Step.Confirmation.PlanpayHelperText)}\n </Text>\n )}\n </div>\n ),\n disabled: !methods.formState.isValid,\n disabledReason: !methods.formState.isValid ? 'You must fill all the above details before proceeding with Planpay' : '',\n renderContent: () => <PlanpayPaymentMethod />,\n },\n ]\n .filter(({ value }) => hotel?.paymentMethods?.includes(value))\n .filter(\n ({ value }) =>\n value !== EBookingPaymentMethod.Planpay ||\n (hotel?.planpay?.minDaysShowPlanpay &&\n dayjs(basketContext.startDate).diff(dayjs(), 'day') > hotel?.planpay?.minDaysShowPlanpay)\n )}\n value={value}\n onChange={async (code: EBookingPaymentMethod) => {\n onChange(code);\n await handleChangePaymentMethod(code);\n if (code === EBookingPaymentMethod.Planpay) {\n await handleBook(code);\n }\n }}\n />\n </div>\n </>\n );\n }}\n />\n <div className=\"u-marg-top u-flex align-items-center\">\n <div className=\"u-flex align-items-center justify-content-start\">\n <Icon icon={IconType.Lock} color={Color.Success} />\n <div className=\"u-marg-left--light\">\n <Text type={TextType.Small} color={Color.Success}>\n <strong>Secured</strong>\n </Text>\n </div>\n </div>\n <SSLSecureBadge />\n </div>\n </div>\n <LineBreak />\n <StepConfirmationPoliciesSection />\n <div className=\"u-pad-top--light u-marg-bottom\">\n <StepConfirmationPolicyBlock />\n </div>\n {ConfirmationVerifyFeature.isActive() && (\n <>\n <LineBreak />\n <div>\n <StepConfirmationAcknowledgement />\n </div>\n </>\n )}\n <div className=\"u-flex u-marg-top--heavy justify-content-end\">\n <NextStepButton\n disabled={paymentMethod === EBookingPaymentMethod.Planpay || isLoading}\n text={t(Translation.Step.Confirmation.ConfirmReservation)}\n history={null}\n isLoading={isLoading}\n currentStep={StepConfirmation}\n onClick={onNextStepClicked}\n />\n </div>\n </>\n )}\n\n <ErrorModal open={!!apiErrors} onClose={clearApiErrors}>\n <Text>{apiErrors}</Text>\n </ErrorModal>\n <StepConfirmationCheckoutDifferencesModal\n differences={differenceWarning.differences}\n warnings={differenceWarning.warnings}\n isLoading={isLoading}\n onClose={async () => {\n await rollbackReservation?.();\n history.push(StepRoom.getStepUrl());\n }}\n onProceed={async () => {\n if (paymentMethod === EBookingPaymentMethod.Planpay) {\n setDifferenceWarning({\n differences: [],\n warnings: [],\n });\n } else {\n await commitReservation?.(basketContext.reservationData);\n }\n }}\n />\n </form>\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"StepConfirmationForm.js","sourceRoot":"/","sources":["src/components/steps/confirmation/StepConfirmationForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useContext, useEffect, useRef, useState } from 'react';\nimport Headline from '@/components/generic/Headline';\nimport { Translation } from 'translations/Translation';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { Color } from '@/util/Color';\nimport { Controller, useFormContext } from 'react-hook-form';\nimport RoomContactDetails from '@/components/steps/confirmation/RoomContactDetails';\nimport LineBreak from '@/components/generic/LineBreak';\nimport StepConfirmationPoliciesSection from '@/components/steps/confirmation/StepConfirmationPoliciesSection';\nimport NextStepButton from '@/components/generic/buttons/NextStepButton';\nimport { useTranslation } from 'react-i18next';\nimport { ConfirmationFormContext, useBasket, useBookingEngine } from '@frontend/contexts';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport SSLSecureBadge from '@/components/generic/badging/SSLSecureBadge';\nimport StepConfirmationCheckoutDifferencesModal from '@/components/steps/confirmation/StepConfirmationCheckoutDifferencesModal';\nimport { useHistory } from 'react-router-dom';\nimport ErrorModal from '@/components/generic/modal/ErrorModal';\nimport StepConfirmationPolicyBlock from '@/components/steps/confirmation/StepConfirmationPolicyBlock';\n\nimport StepConfirmationAcknowledgement from '@/components/steps/confirmation/StepConfirmationAcknowledgement';\nimport BEButton from '@/components/generic/BEButton';\nimport Alert, { AlertType } from '@/components/generic/Alert';\nimport StepConfirmation from '@/pages/steps/StepConfirmation/StepConfirmation';\nimport StepRoom from '@/pages/steps/StepRoom/StepRoom';\nimport ConfirmationVerifyFeature from '@/providers/feature/ConfirmationVerifyFeature';\nimport TextBox from '@/components/generic/TextBox';\nimport ShowIATANumberOnCheckoutFeature from '@/providers/feature/ShowIATANumberOnCheckoutFeature';\nimport { PlanpayPaymentMethod } from './PlanpayPaymentMethod';\nimport { ConfirmationFormValues, FBookSuccessCallback } from '@/models/Confirmation';\nimport { useConfirmationStep } from 'contexts/ConfirmationStepContext/ConfirmationStepContext';\nimport { useConfirmationQuery } from '@/hooks/ConfirmationQuery';\nimport BasketRowDifferences from '../../../models/BasketRowDifferences';\nimport LargeLoader from '@/components/generic/loader/LargeLoader';\nimport StepConfirmationPaymentDetails from './PaymentDetails/StepConfirmationPaymentDetails';\nimport { EBookingPaymentMethod, IBookingPayment } from '@roomstay/core';\nimport RadioButtonGroup from '@/components/generic/RadioButtonGroup/RadioButtonGroup';\nimport AcceptablePaymentCard from '@/components/steps/confirmation/PaymentDetails/AcceptablePaymentCard';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport dayjs from 'dayjs';\nimport { StepConfirmationCommentsComponent } from '@/components/steps/confirmation/StepConfirmationCommentsComponent';\n\nexport default function StepConfirmationForm() {\n const [differenceWarning, setDifferenceWarning] = useState<{\n differences: BasketRowDifferences[];\n warnings: string[];\n }>({\n differences: [],\n warnings: [],\n });\n const formContext = useContext(ConfirmationFormContext);\n const [source, setSource] = useState('');\n const [confirmationPolicyError, setConfirmationPolicyError] = useState(false);\n const confirmationPolicy = useRef<HTMLInputElement | null>(null);\n const commentTextbox = useRef<HTMLInputElement | HTMLTextAreaElement | null>(null);\n const { t } = useTranslation();\n const { queryPaymentMethod, queryRoomstayId, queryPlanpayCheckoutId } = useConfirmationQuery();\n const context = useBookingEngine();\n const methods = useFormContext<ConfirmationFormValues>();\n const { isBackFromPlanpay, isLoading, apiErrors, clearApiErrors, book, rollbackReservation, commitReservation } = useConfirmationStep();\n const basketContext = useBasket();\n const tokenizerRef = useRef<any | null>(null);\n const history = useHistory();\n const { hotel } = useCurrentHotel();\n\n const toPaymentPayload = async (paymentMethod: EBookingPaymentMethod): Promise<IBookingPayment> => {\n let payment: IBookingPayment;\n switch (paymentMethod) {\n case EBookingPaymentMethod.Planpay: {\n const params = new URLSearchParams(window.location.search);\n params.set('roomstayId', '{{rsId}}');\n params.set('session', context.sessionProvider.getCurrentSessionID().toString());\n params.set('paymentMethod', EBookingPaymentMethod.Planpay);\n const redirectURL = `${window.location.origin}${window.location.pathname}${window.location.search}#/step/confirmation/?${params}`;\n payment = {\n Method: EBookingPaymentMethod.Planpay,\n PlanpayCheckoutId: queryPlanpayCheckoutId || undefined,\n RedirectUrl: redirectURL,\n };\n break;\n }\n default:\n payment = {\n Method: EBookingPaymentMethod.Card,\n PaymentCard: await tokenizerRef.current?.getTokenizedCode(),\n };\n }\n\n return payment;\n };\n\n useEffect(() => {\n const validatedPaymentMethod = Object.values(EBookingPaymentMethod).includes(queryPaymentMethod as EBookingPaymentMethod)\n ? (queryPaymentMethod as EBookingPaymentMethod)\n : EBookingPaymentMethod.Card;\n methods.setValue('paymentMethod', validatedPaymentMethod);\n handleChangePaymentMethod(validatedPaymentMethod);\n if (isBackFromPlanpay) {\n if (queryRoomstayId === basketContext.reservationData?.roomstayId) {\n onPlaypayCallback(validatedPaymentMethod);\n } else {\n rollbackReservation?.();\n }\n }\n return () => {\n if (!isBackFromPlanpay) rollbackReservation?.();\n };\n }, []);\n\n const onPlaypayCallback = async (paymentMethod: EBookingPaymentMethod) => {\n await commitReservation?.(basketContext.reservationData);\n };\n\n const paymentMethod = methods.watch('paymentMethod');\n\n context.engine\n .getSessionProvider()\n .getSession()\n .then((session) => {\n setSource(session.source);\n });\n\n const returnToPickRooms = async () => {\n // TODO: What if StepRoom doesn't exist?\n history.push(StepRoom.getStepUrl());\n };\n\n const onNextStepClicked = async () => {\n await handleBook(paymentMethod, async (resData) => commitReservation?.(resData));\n return false;\n };\n\n const handleBook = async (paymentMethod: EBookingPaymentMethod, onSuccess?: FBookSuccessCallback): Promise<void> => {\n await book?.(\n async () => toPaymentPayload(paymentMethod),\n commentTextbox.current?.value,\n async (): Promise<boolean> => {\n if (ConfirmationVerifyFeature.isActive() && !confirmationPolicy?.current?.checked) {\n setConfirmationPolicyError(true);\n return false;\n }\n let adhocValid = true;\n formContext?.errorChecks.forEach((check) => {\n if (!check().validate()) {\n adhocValid = false;\n }\n });\n if (!adhocValid) {\n return false;\n }\n try {\n if (paymentMethod === EBookingPaymentMethod.Card) await tokenizerRef.current.getTokenizedCode();\n return true;\n } catch (e) {\n return false;\n }\n },\n (validationResult) => {\n if (validationResult) {\n setDifferenceWarning(validationResult);\n }\n },\n onSuccess\n );\n };\n\n const handleChangePaymentMethod = async (paymentMethod: EBookingPaymentMethod) => {\n if (paymentMethod !== EBookingPaymentMethod.Planpay) {\n await rollbackReservation?.();\n }\n };\n\n return (\n <form>\n {isBackFromPlanpay ? (\n <LargeLoader />\n ) : (\n <>\n <div className=\"u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom--light\">\n <Headline bold>{t(Translation.Step.Confirmation.GuestDetails)}</Headline>\n </div>\n <Text type={TextType.Small} color={Color.Success}>\n <strong>{t(Translation.Step.Confirmation.AlmostDone, { required: '*' })}</strong>\n </Text>\n </div>\n <RoomContactDetails />\n {source === 'inline' ? (\n <Alert type={AlertType.Accent2} heavyPadding>\n <div className=\"u-flex u-w-100 flex-wrap flex-xl-nowrap\">\n <div>\n <Text color={Color.Accent} bold>\n {t(Translation.Step.Confirmation.WantMoreRooms)}\n </Text>\n <Text color={Color.Navy}>{t(Translation.Step.Confirmation.YouCanAddAndEditRooms)}</Text>\n </div>\n <div className=\"d-flex align-items-center u-marg-top@xl-\">\n <BEButton filled primary icon={IconType.Add} iconPosition=\"left\" onClick={returnToPickRooms}>\n {t(Translation.Step.Confirmation.AddMoreRooms)}\n </BEButton>\n </div>\n </div>\n </Alert>\n ) : (\n <></>\n )}\n {ShowIATANumberOnCheckoutFeature.isActive() && (\n <>\n <div className=\"u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom\">\n <Headline bold>Travel Agent</Headline>\n </div>\n\n <div className=\"u-marg-bottom--light\">\n <Text type={TextType.Small}>\n <strong>{t(Translation.Step.Confirmation.Inputs.IATANumber)}</strong>\n </Text>\n </div>\n <div className=\"u-marg-bottom--light\">\n <Text type={TextType.Small}>{t(Translation.Step.Confirmation.Inputs.IATANumberGuide)}</Text>\n </div>\n <TextBox placeholder={t(Translation.Step.Confirmation.Inputs.IATANumber)} wide {...methods.register('IATANumber')} />\n </div>\n <LineBreak />\n </>\n )}\n <StepConfirmationCommentsComponent inputRef={commentTextbox} />\n <LineBreak />\n <div className=\"u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom\">\n <Headline bold>{t(Translation.Step.Confirmation.PaymentInformation)}</Headline>\n </div>\n <Controller\n control={methods.control}\n name=\"paymentMethod\"\n render={({ field: { onChange, value } }) => {\n return (\n <>\n <div>\n <RadioButtonGroup<EBookingPaymentMethod>\n options={[\n {\n value: EBookingPaymentMethod.Card,\n label: (\n <div className=\"u-flex u-flex-align-center\">\n <div className=\"u-marg-right--light\">{t(Translation.Step.Confirmation.CardLabel)}</div>\n <AcceptablePaymentCard\n isDefault={(cardKey: any) => {\n return true;\n }}\n style={{\n height: 16,\n width: 24,\n borderRadius: 2.5,\n border: '0.5px solid #DFE1E5',\n marginRight: 4,\n }}\n />\n </div>\n ),\n renderContent: () => <StepConfirmationPaymentDetails ref={tokenizerRef} />,\n },\n {\n value: EBookingPaymentMethod.Planpay,\n label: (\n <div className=\"u-flex u-flex-align-center\">\n <div>{t(Translation.Step.Confirmation.PlanpayLabel)}</div>\n <div\n className=\"u-flex u-flex-align-center u-marg-left--light\"\n style={{\n borderRadius: '24px',\n overflow: 'hidden',\n }}\n >\n <img height={16} src={RoomstayThemeEngine.getImageAssetUrl('planpay-logo-small.svg')} alt=\"\" />\n </div>\n {!methods.formState.isValid && (\n <Text\n color={Color.Graphite}\n className=\"u-flex u-flex-align-center\"\n style={{\n color: '#313131',\n fontSize: 10,\n }}\n >\n <Icon color={Color.DarkGrey} icon={IconType.Info} className=\"u-marg-right--lighter u-marg-left--light\" />\n {t(Translation.Step.Confirmation.PlanpayHelperText)}\n </Text>\n )}\n </div>\n ),\n disabled: !methods.formState.isValid,\n disabledReason: !methods.formState.isValid ? 'You must fill all the above details before proceeding with Planpay' : '',\n renderContent: () => <PlanpayPaymentMethod />,\n },\n ]\n .filter(({ value }) => hotel?.paymentMethods?.includes(value))\n .filter(\n ({ value }) =>\n value !== EBookingPaymentMethod.Planpay ||\n (hotel?.planpay?.minDaysShowPlanpay &&\n dayjs(basketContext.startDate).diff(dayjs(), 'day') > hotel?.planpay?.minDaysShowPlanpay)\n )}\n value={value}\n onChange={async (code: EBookingPaymentMethod) => {\n onChange(code);\n await handleChangePaymentMethod(code);\n if (code === EBookingPaymentMethod.Planpay) {\n await handleBook(code);\n }\n }}\n />\n </div>\n </>\n );\n }}\n />\n <div className=\"u-marg-top u-flex align-items-center\">\n <div className=\"u-flex align-items-center justify-content-start\">\n <Icon icon={IconType.Lock} color={Color.Success} />\n <div className=\"u-marg-left--light\">\n <Text type={TextType.Small} color={Color.Success}>\n <strong>Secured</strong>\n </Text>\n </div>\n </div>\n <SSLSecureBadge />\n </div>\n </div>\n <LineBreak />\n <StepConfirmationPoliciesSection />\n <div className=\"u-pad-top--light u-marg-bottom\">\n <StepConfirmationPolicyBlock />\n </div>\n {ConfirmationVerifyFeature.isActive() && (\n <>\n <LineBreak />\n <div>\n <StepConfirmationAcknowledgement ref={confirmationPolicy} confirmationPolicyError={confirmationPolicyError} />\n </div>\n </>\n )}\n <div className=\"u-flex u-marg-top--heavy justify-content-end\">\n <NextStepButton\n disabled={paymentMethod === EBookingPaymentMethod.Planpay || isLoading}\n text={t(Translation.Step.Confirmation.ConfirmReservation)}\n history={null}\n isLoading={isLoading}\n currentStep={StepConfirmation}\n onClick={onNextStepClicked}\n />\n </div>\n </>\n )}\n\n <ErrorModal open={!!apiErrors} onClose={clearApiErrors}>\n <Text>{apiErrors}</Text>\n </ErrorModal>\n <StepConfirmationCheckoutDifferencesModal\n differences={differenceWarning.differences}\n warnings={differenceWarning.warnings}\n isLoading={isLoading}\n onClose={async () => {\n await rollbackReservation?.();\n history.push(StepRoom.getStepUrl());\n }}\n onProceed={async () => {\n if (paymentMethod === EBookingPaymentMethod.Planpay) {\n setDifferenceWarning({\n differences: [],\n warnings: [],\n });\n } else {\n await commitReservation?.(basketContext.reservationData);\n }\n }}\n />\n </form>\n );\n}\n"]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { FBookGetPaymentDetails, FBookSuccessCallback, FBookValidateFunction, FBookValidationCallback } from '../../models/Confirmation';
|
|
2
2
|
import ReservationsDTO from '../../models/Api/ReservationsDTO';
|
|
3
3
|
export interface ConfirmationContextProps {
|
|
4
|
-
book?: (getPaymentDetails: FBookGetPaymentDetails, preValidate?: FBookValidateFunction, onPostValidationError?: FBookValidationCallback, onSuccess?: FBookSuccessCallback) => Promise<void>;
|
|
4
|
+
book?: (getPaymentDetails: FBookGetPaymentDetails, comments?: string, preValidate?: FBookValidateFunction, onPostValidationError?: FBookValidationCallback, onSuccess?: FBookSuccessCallback) => Promise<void>;
|
|
5
5
|
commitReservation?: (resData: ReservationsDTO) => Promise<void>;
|
|
6
6
|
rollbackReservation?: () => Promise<void>;
|
|
7
7
|
isLoading?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConfirmationStepContextTypes.js","sourceRoot":"/","sources":["src/contexts/ConfirmationStepContext/ConfirmationStepContextTypes.ts"],"names":[],"mappings":"","sourcesContent":["import { FBookGetPaymentDetails, FBookSuccessCallback, FBookValidateFunction, FBookValidationCallback } from '../../models/Confirmation';\nimport ReservationsDTO from '../../models/Api/ReservationsDTO';\nexport interface ConfirmationContextProps {\n book?: (\n getPaymentDetails: FBookGetPaymentDetails,\n preValidate?: FBookValidateFunction,\n onPostValidationError?: FBookValidationCallback,\n onSuccess?: FBookSuccessCallback\n ) => Promise<void>;\n commitReservation?: (resData: ReservationsDTO) => Promise<void>;\n rollbackReservation?: () => Promise<void>;\n\n isLoading?: boolean;\n apiErrors?: string;\n clearApiErrors?: () => void;\n isBackFromPlanpay?: boolean;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"ConfirmationStepContextTypes.js","sourceRoot":"/","sources":["src/contexts/ConfirmationStepContext/ConfirmationStepContextTypes.ts"],"names":[],"mappings":"","sourcesContent":["import { FBookGetPaymentDetails, FBookSuccessCallback, FBookValidateFunction, FBookValidationCallback } from '../../models/Confirmation';\nimport ReservationsDTO from '../../models/Api/ReservationsDTO';\nexport interface ConfirmationContextProps {\n book?: (\n getPaymentDetails: FBookGetPaymentDetails,\n comments?: string,\n preValidate?: FBookValidateFunction,\n onPostValidationError?: FBookValidationCallback,\n onSuccess?: FBookSuccessCallback\n ) => Promise<void>;\n commitReservation?: (resData: ReservationsDTO) => Promise<void>;\n rollbackReservation?: () => Promise<void>;\n\n isLoading?: boolean;\n apiErrors?: string;\n clearApiErrors?: () => void;\n isBackFromPlanpay?: boolean;\n}\n"]}
|