\n
\n );\n};\n\nexport default MembershipDealsModal;\n","var _path;\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nimport * as React from \"react\";\nfunction SvgBunk(_ref, svgRef) {\n let {\n title,\n titleId,\n ...props\n } = _ref;\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: 20,\n height: 20,\n viewBox: \"0 0 20 20\",\n fill: \"none\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n d: \"M19.0909 2.7272C18.8498 2.7272 18.6186 2.82308 18.4482 2.99354C18.2776 3.16399 18.1819 3.39519 18.1819 3.6364V6.36371H8.18178V5.45451C8.18178 4.7313 7.89444 4.03759 7.38308 3.52606C6.87156 3.01454 6.17786 2.72719 5.45452 2.72719H1.81822V0.909091C1.81822 0.584311 1.64488 0.284186 1.36363 0.121794C1.08238 -0.040598 0.735853 -0.040598 0.454595 0.121794C0.173345 0.284186 0 0.584307 0 0.909091V19.0909C0 19.4157 0.173345 19.7158 0.454595 19.8782C0.735846 20.0406 1.08237 20.0406 1.36363 19.8782C1.64488 19.7158 1.81822 19.4157 1.81822 19.0909V17.2728H18.1818V19.0911V19.0909C18.1818 19.4157 18.3551 19.7158 18.6364 19.8782C18.9176 20.0406 19.2641 20.0406 19.5454 19.8782C19.8267 19.7158 20 19.4157 20 19.0909V3.63641C20 3.39518 19.9041 3.164 19.7337 2.99354C19.5632 2.82308 19.332 2.7272 19.0908 2.7272L19.0909 2.7272ZM5.45459 4.54546C5.69581 4.54546 5.92699 4.64119 6.09744 4.8118C6.2679 4.98225 6.36378 5.21345 6.36378 5.45451V6.36371H1.81822V4.54545L5.45459 4.54546ZM1.8183 15.4547V13.6364H5.45459C5.69581 13.6364 5.92699 13.7323 6.09744 13.9028C6.2679 14.0732 6.36378 14.3044 6.36378 14.5456V15.4547L1.8183 15.4547ZM8.18177 15.4547V14.5457C8.18177 13.8223 7.89444 13.1286 7.38308 12.6171C6.87156 12.1057 6.17786 11.8183 5.45451 11.8183H1.81822V8.18182H18.1818V15.4548L8.18177 15.4547Z\",\n fill: \"#504D56\"\n })));\n}\nconst ForwardRef = /*#__PURE__*/React.forwardRef(SvgBunk);\nexport default __webpack_public_path__ + \"static/media/bunk.70331d6e341fc050cb6b5b1c03827550.svg\";\nexport { ForwardRef as ReactComponent };","var _path;\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nimport * as React from \"react\";\nfunction SvgCheck(_ref, svgRef) {\n let {\n title,\n titleId,\n ...props\n } = _ref;\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: 24,\n height: 24,\n viewBox: \"0 0 24 24\",\n fill: \"none\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n d: \"M20 6L9 17L4 12\",\n stroke: \"#504D56\",\n strokeWidth: 2,\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\"\n })));\n}\nconst ForwardRef = /*#__PURE__*/React.forwardRef(SvgCheck);\nexport default __webpack_public_path__ + \"static/media/check.79c68e9e5c3c07f7fcf40890a21c3cd5.svg\";\nexport { ForwardRef as ReactComponent };","var _path;\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nimport * as React from \"react\";\nfunction SvgKid(_ref, svgRef) {\n let {\n title,\n titleId,\n ...props\n } = _ref;\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n fill: \"#000000\",\n width: \"800px\",\n height: \"800px\",\n viewBox: \"0 0 24 24\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n d: \"M10,10a1,1,0,1,0-1,1A1,1,0,0,0,10,10Zm4.5,4.06a1,1,0,0,0-1.37.36,1.3,1.3,0,0,1-2.26,0,1,1,0,0,0-1.37-.36,1,1,0,0,0-.37,1.36,3.31,3.31,0,0,0,5.74,0A1,1,0,0,0,14.5,14.06ZM15,9a1,1,0,1,0,1,1A1,1,0,0,0,15,9ZM12,2A10,10,0,1,0,22,12,10,10,0,0,0,12,2Zm0,18A8,8,0,0,1,9,4.57,3,3,0,0,0,9,5a3,3,0,0,0,3,3,1,1,0,0,0,0-2,1,1,0,0,1,0-2,8,8,0,0,1,0,16Z\"\n })));\n}\nconst ForwardRef = /*#__PURE__*/React.forwardRef(SvgKid);\nexport default __webpack_public_path__ + \"static/media/kid.68f2960c600eac47082898d91d81ab72.svg\";\nexport { ForwardRef as ReactComponent };","var _path;\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nimport * as React from \"react\";\nfunction SvgMinus(_ref, svgRef) {\n let {\n title,\n titleId,\n ...props\n } = _ref;\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: 24,\n height: 24,\n viewBox: \"0 0 24 24\",\n fill: \"none\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n d: \"M5 12H19\",\n stroke: \"#3274D2\",\n strokeWidth: 2,\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\"\n })));\n}\nconst ForwardRef = /*#__PURE__*/React.forwardRef(SvgMinus);\nexport default __webpack_public_path__ + \"static/media/minus.865d540ae3526056cbf6eb0a831ba9d3.svg\";\nexport { ForwardRef as ReactComponent };","var _path, _path2;\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nimport * as React from \"react\";\nfunction SvgPlus(_ref, svgRef) {\n let {\n title,\n titleId,\n ...props\n } = _ref;\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: 24,\n height: 24,\n viewBox: \"0 0 24 24\",\n fill: \"none\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _path || (_path = /*#__PURE__*/React.createElement(\"path\", {\n d: \"M12 5V19\",\n stroke: \"#3274D2\",\n strokeWidth: 2,\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\"\n })), _path2 || (_path2 = /*#__PURE__*/React.createElement(\"path\", {\n d: \"M5 12H19\",\n stroke: \"#3274D2\",\n strokeWidth: 2,\n strokeLinecap: \"round\",\n strokeLinejoin: \"round\"\n })));\n}\nconst ForwardRef = /*#__PURE__*/React.forwardRef(SvgPlus);\nexport default __webpack_public_path__ + \"static/media/plus.eff3a5d9f82e1fdbf190bd27aa43ed06.svg\";\nexport { ForwardRef as ReactComponent };","var _g, _defs;\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nimport * as React from \"react\";\nfunction SvgViewicon3(_ref, svgRef) {\n let {\n title,\n titleId,\n ...props\n } = _ref;\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n width: 12,\n height: 12,\n viewBox: \"0 0 12 12\",\n fill: \"none\",\n xmlns: \"http://www.w3.org/2000/svg\",\n ref: svgRef,\n \"aria-labelledby\": titleId\n }, props), title ? /*#__PURE__*/React.createElement(\"title\", {\n id: titleId\n }, title) : null, _g || (_g = /*#__PURE__*/React.createElement(\"g\", {\n clipPath: \"url(#clip0_135_2825)\"\n }, /*#__PURE__*/React.createElement(\"path\", {\n d: \"M11.7447 9.20869C11.5152 9.32618 11.2327 9.23634 11.1142 9.00562H11.1142C10.3955 7.60498 8.48719 5.59697 5.99998 5.59697C3.76938 5.59697 1.78711 7.24912 0.885752 9.00565C0.767181 9.2355 0.484806 9.32623 0.254767 9.20806C0.0247515 9.08988 -0.0662798 8.80807 0.0515405 8.57787C1.08715 6.55566 3.36455 4.65947 5.99998 4.65947C9.0056 4.65947 11.1582 7.03491 11.9484 8.57787C12.0664 8.80831 11.9752 9.09075 11.7447 9.20869ZM0.182134 4.17431L1.22613 5.11612C1.41949 5.29057 1.71579 5.27311 1.88817 5.08205C2.06156 4.88981 2.04633 4.59342 1.8541 4.42001L0.810095 3.4782C0.617931 3.30483 0.321541 3.32002 0.148056 3.51227C-0.0253344 3.70451 -0.0101001 4.0009 0.182134 4.17431ZM10.7738 5.11612L11.8178 4.17431C12.01 4.0009 12.0252 3.70451 11.8519 3.51227C11.6784 3.32006 11.382 3.30478 11.1898 3.4782L10.1458 4.42001C9.9536 4.5934 9.93837 4.88981 10.1118 5.08205C10.2843 5.27332 10.5807 5.29036 10.7738 5.11612ZM5.99995 3.24736C6.25885 3.24736 6.4687 3.03748 6.4687 2.77861V1.37109C6.4687 1.11223 6.25885 0.902344 5.99995 0.902344C5.74106 0.902344 5.5312 1.11223 5.5312 1.37109V2.77861C5.53123 3.0375 5.74109 3.24736 5.99995 3.24736ZM8.30269 8.79143C8.30269 10.0631 7.26968 11.0977 5.99998 11.0977C4.73027 11.0977 3.69727 10.0631 3.69727 8.79143C3.69727 7.51978 4.73027 6.4852 5.99998 6.4852C7.26968 6.4852 8.30269 7.51978 8.30269 8.79143ZM7.36521 8.79143C7.36521 8.03672 6.75279 7.4227 6 7.4227C5.24721 7.4227 4.63477 8.03672 4.63477 8.79143C4.63477 9.54614 5.24719 10.1602 5.99998 10.1602C6.75277 10.1602 7.36521 9.54614 7.36521 8.79143Z\",\n fill: \"#026AA2\"\n }))), _defs || (_defs = /*#__PURE__*/React.createElement(\"defs\", null, /*#__PURE__*/React.createElement(\"clipPath\", {\n id: \"clip0_135_2825\"\n }, /*#__PURE__*/React.createElement(\"rect\", {\n width: 12,\n height: 12,\n fill: \"white\"\n })))));\n}\nconst ForwardRef = /*#__PURE__*/React.forwardRef(SvgViewicon3);\nexport default __webpack_public_path__ + \"static/media/view icon (3).834bb014a3be21c4ed937bc5e79f4f19.svg\";\nexport { ForwardRef as ReactComponent };","import React, { useEffect, useRef, useState } from \"react\";\nimport \"../MainPage.css\";\nimport unlockSVG from \"../../../assets/svg/unlock_svg.svg\";\nimport MembershipDealsModal from \"../../../components/Modals/MembershipDealsModal/MembershipDealsModal\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { currency } from \"../../../utils/currency\";\nimport { isValidTimeZone } from \"../../../utils/utils\";\nimport dayjs from \"dayjs\";\nimport { fetchPromotionsApi } from \"../../../Services/mainPageService\";\nimport { fetchPromotions } from \"../../../redux/actions/hotelInfoAction\";\n\nconst SecretMemberDeal = ({\n price,\n isRatePlan,\n selectRoomBtn,\n getMembershipDetails,\n getSecretMemberDealUrl,\n applyPromotion,\n}) => {\n const [showMembershipModal, setShowMembershipModal] = useState({\n isOpen: false,\n });\n const isUnlocked = sessionStorage.getItem(\"isMembershipUnlocked\") === \"true\";\n // const [isEnabled, setIsEnabled] = useState(false);\n const isEnabledRef = useRef(false);\n\n const [membershipDetails, setMembershipDetails] = useState({\n name: \"Member-Only Rate\",\n description: \"Unlock and reveal the best price for your stay.\",\n });\n\n const { hotelData, dateRange } = useSelector((state) => state.hotelInfo);\n\n const dispatch = useDispatch();\n\n const { id } = hotelData;\n\n const enableSecretMemberDeal = async () => {\n const url = getSecretMemberDealUrl();\n const response = await fetchPromotionsApi(url);\n if (response?.status === 200) {\n setMembershipDetails({\n name: response?.data?.[0]?.name || \"Member-Only Rate\",\n description:\n response?.data?.[0]?.description ||\n \"Unlock and reveal the best price for your stay.\",\n });\n // const isBeacon = hotelData?.chainName === \"beacon\" || hotelData?.chainName === \"zinc\" || hotelData?.id !== 2825;\n const isBeacon =\n hotelData?.id === 2825 ||\n hotelData?.chainName === \"beacon\" ||\n hotelData?.chainName === \"zinc\";\n if (isBeacon && response?.data?.length) {\n isEnabledRef.current = true;\n if (isUnlocked) dispatch(fetchPromotions(url, id));\n }\n if (!response?.data?.length && isUnlocked) {\n sessionStorage.setItem(\"isMembershipUnlocked\", \"false\");\n }\n getMembershipDetails(\n response?.data?.[0]?.name,\n response?.data?.[0]?.description\n );\n }\n };\n\n useEffect(() => {\n enableSecretMemberDeal();\n }, [hotelData, dateRange]);\n\n if (!isEnabledRef?.current || isUnlocked) {\n return null;\n }\n\n return (\n <>\n \n \n\n
\n \n
\n \n
\n\n \n \n
\n \n
\n {membershipDetails?.name}
\n \n{membershipDetails?.description}
\n\n
\n \n {showMembershipModal?.isOpen && (\n \n
\n \n {\" \"}\n {currency(hotelData?.currency)} {price}\n
\n per night\n\n setShowMembershipModal({ isOpen: true })}\n >\n 
\n {isUnlocked ? \"Unlocked\" : \"Unlock\"}\n \n
\n \n
\n ) : (\n (!isHourlyRoom || selectedRooms?.length > 0) && (\n \n \n {\" \"}\n {t(\"reserve\")}{\" \"}\n {isHourlyRoom && (\n
\n )\n );\n};\n\nconst AddonButton = ({\n name,\n extraChild,\n setExtraChild,\n extraAdult,\n setExtraAdult,\n maxGuestCount,\n addon,\n setPeople,\n defaultGuestCount,\n totalPeople,\n guestToDisplay,\n room,\n roomCount,\n extraInfant,\n setExtraInfant,\n adultAddons,\n}) => {\n const dispatch = useDispatch();\n\n const { selectedAddons } = useSelector((state) => state.hotelInfo);\n const { t } = useTranslation();\n\n const increment = () => {\n let guestCount = selectedAddons?.filter(\n (adn) =>\n adn?.hotel_room_id === room?.id && adn?.Addon?.category === \"person\"\n )?.length;\n if (\n extraChild + extraAdult + extraInfant <\n (maxGuestCount - defaultGuestCount) * roomCount &&\n name?.startsWith(\"Extra\") &&\n guestCount + defaultGuestCount < maxGuestCount * roomCount\n ) {\n name === \"Extra Adult\"\n ? dispatch(addAddon(adultAddons[extraAdult]))\n : dispatch(addAddon(addon));\n name === \"Extra Adult\"\n ? setExtraAdult((state) => state + 1)\n : name === \"Extra Child\" && addon?.type === \"infant\"\n ? setExtraInfant((prev) => prev + 1)\n : setExtraChild((state) => state + 1);\n setPeople((state) => state + 1);\n fireGtmEvent(\"addon_selected\", {\n addon_name: addon?.Addon?.name,\n addon_price: addon?.price,\n addon_id: addon?.id,\n hotel_room_id: addon?.hotel_room_id,\n });\n } else {\n toastr.error(t(\"maximum_occupancy_reached\"));\n }\n };\n\n const decrement = () => {\n if (name === \"Extra Adult\" && extraAdult > 0) {\n dispatch(deselectAddon(adultAddons[extraAdult - 1]));\n setExtraAdult((state) => state - 1);\n setPeople((state) => state - 1);\n\n fireGtmEvent(\"addon_removed\", {\n addonName: addon?.Addon?.name,\n addonPrice: addon?.price,\n addonId: addon?.id,\n hotelRoomId: addon?.hotel_room_id,\n });\n } else if (\n name === \"Extra Child\" &&\n extraChild > 0 &&\n addon?.type === \"child\"\n ) {\n dispatch(deselectAddon(addon));\n setExtraChild((state) => state - 1);\n setPeople((state) => state - 1);\n fireGtmEvent(\"addon_removed\", {\n addonName: addon?.Addon?.name,\n addonPrice: addon?.price,\n addonId: addon?.id,\n hotelRoomId: addon?.hotel_room_id,\n });\n } else if (\n name === \"Extra Child\" &&\n extraInfant > 0 &&\n addon?.type === \"infant\"\n ) {\n dispatch(deselectAddon(addon));\n setExtraInfant((prev) => prev - 1);\n setPeople((state) => state - 1);\n fireGtmEvent(\"addon_removed\", {\n addonName: addon?.Addon?.name,\n addonPrice: addon?.price,\n addonId: addon?.id,\n hotelRoomId: addon?.hotel_room_id,\n });\n }\n };\n return (\n \n
\n );\n};\n\nconst MealAddon = ({\n addon,\n name,\n addAddon,\n deselectAddon,\n room,\n breakfast,\n lunch,\n dinner,\n setBreakfast,\n setLunch,\n setDinner,\n maxGuestCount,\n}) => {\n const dispatch = useDispatch();\n\n const increment = () => {\n if (name === \"Breakfast\" && breakfast < maxGuestCount) {\n setBreakfast((prev) => prev + 1);\n dispatch(addAddon(addon));\n }\n if (name === \"Lunch\" && lunch < maxGuestCount) {\n setLunch((prev) => prev + 1);\n dispatch(addAddon(addon));\n }\n if (name === \"Dinner\" && dinner < maxGuestCount) {\n setDinner((prev) => prev + 1);\n dispatch(addAddon(addon));\n }\n };\n\n const decrement = () => {\n if (name === \"Breakfast\" && breakfast > 0) {\n setBreakfast((prev) => prev - 1);\n dispatch(deselectAddon(addon));\n }\n if (name === \"Lunch\" && lunch > 0) {\n setLunch((prev) => prev - 1);\n dispatch(deselectAddon(addon));\n }\n if (name === \"Dinner\" && dinner > 0) {\n setDinner((prev) => prev - 1);\n dispatch(deselectAddon(addon));\n }\n };\n\n return (\n \n -\n
\n \n {name === \"Extra Adult\"\n ? extraAdult\n : addon?.type === \"infant\"\n ? extraInfant\n : extraChild}\n
\n\n \n +\n
\n \n
\n );\n};\n\nconst NewSelectionSlot = ({\n id,\n defaultGuestCount,\n maxGuestCount,\n extraInfantPrice,\n extraChildPrice,\n room,\n childAgeSplit,\n childAgeLimit,\n}) => {\n const { selectedRooms, isRatePlans } = useSelector(\n (state) => state.hotelInfo\n );\n\n const dispatch = useDispatch();\n\n const [selectedAdultCount, setSelectedAdultCount] =\n useState(defaultGuestCount);\n const [selectedChildCount, setSelectedChildCount] = useState(0);\n const [selectedInfantCount, setSelectedInfantCount] = useState(0);\n const [thisRoom, setThisRoom] = useState();\n const [isSetRoom, setIsSetRoom] = useState(true);\n const [isRoomDescOpen, setRoomDescOpen] = useState(false);\n\n useEffect(() => {\n if (selectedRooms?.length > 0) {\n let rom =\n selectedRooms?.filter(\n (rm) => rm?.id === room?.id && Number(rm?.idx) === Number(id)\n )[0] || {};\n\n setThisRoom(rom);\n }\n }, [selectedRooms]);\n\n useEffect(() => {\n if (thisRoom) {\n setSelectedAdultCount(thisRoom?.sAdult);\n setSelectedChildCount(thisRoom?.sChild);\n setSelectedInfantCount(thisRoom?.sInfant);\n setIsSetRoom(false);\n } else {\n setIsSetRoom(true);\n }\n }, [thisRoom]);\n\n useEffect(() => {\n let rom =\n selectedRooms?.filter(\n (rm) => rm?.id === room?.id && Number(rm?.idx) === Number(id)\n )[0] || {};\n if (selectedRooms?.length > 0 && rom && !isSetRoom) {\n rom = {\n ...rom,\n sAdult: selectedAdultCount,\n sChild: selectedChildCount,\n sInfant: selectedInfantCount,\n };\n dispatch({ type: hotelInfoTypes.SET_ROOM, payload: rom });\n }\n }, [selectedAdultCount, selectedChildCount, selectedInfantCount]);\n\n const { width } = useWindowSize();\n\n const { t } = useTranslation();\n\n return (\n \n -\n
\n \n {addon?.Addon?.name === \"Breakfast\"\n ? breakfast\n : addon?.Addon?.name === \"Lunch\"\n ? lunch\n : dinner}\n
\n\n \n +\n
\n \n
\n \n {t(\"room\")} {id}\n
\n\n 901 && \"center\" }}\n >\n {/* \n {t(\"adults\")}:{\" \"}\n \n {\"Above \"}\n {childAgeLimit}\n {t(\"years\")}\n {\" \"}\n \n\n {\n setSelectedAdultCount(Number(e.target.value));\n fireGtmEvent(\"adult_dropdown_clicked\", {\n count: e.target.value,\n roomIndex: id,\n room,\n });\n }}\n >\n {Array.from({\n length: maxGuestCount - selectedChildCount - selectedInfantCount,\n }).map((_, idx) => {\n return (\n \n );\n })}\n \n
\n {extraChildPrice && (\n \n {t(\"adults\")}:{\" \"}\n {width < 901 && (\n {t(\"adult_age\")}\n )}\n
*/}\n\n \n {t(\"children\")}:{\" \"}\n \n ({childAgeSplit}\n {t(\"years\")} - {childAgeLimit}\n {t(\"years\")})\n {\" \"}\n \n {\n setSelectedChildCount(Number(e.target.value));\n fireGtmEvent(\"child_dropdown_clicked\", {\n count: e.target.value,\n roomIndex: id,\n room,\n });\n }}\n >\n {/* */}\n {Array.from({\n length:\n maxGuestCount - selectedAdultCount - selectedInfantCount + 1,\n }).map((_, idx) => {\n return (\n \n );\n })}\n \n
\n )}\n {extraInfantPrice && (\n \n \n {t(\"infants\")}:{\" \"}\n \n (0 - {childAgeSplit}\n {t(\"years\")})\n {\" \"}\n \n {\n setSelectedInfantCount(Number(e.target.value));\n fireGtmEvent(\"infant_dropdown_clicked\", {\n count: e.target.value,\n roomIndex: id,\n room,\n });\n }}\n >\n {Array.from({\n length:\n maxGuestCount - selectedAdultCount - selectedChildCount + 1,\n }).map((_, idx) => {\n return (\n \n );\n })}\n \n
\n )}\n \n \n );\n};\n\nconst RateplanSlot = ({\n id,\n thisPlan,\n maxAdultCount,\n maxGuestCount,\n extraChildPrice,\n extraInfantPrice,\n room,\n childAgeSplit,\n childAgeLimit,\n}) => {\n const { selectedRooms, isRatePlans } = useSelector(\n (state) => state.hotelInfo\n );\n\n const { maxChildCount, maxInfantCount } = room;\n const dispatch = useDispatch();\n\n const [selectedAdultCount, setSelectedAdultCount] = useState(0);\n const [selectedChildCount, setSelectedChildCount] = useState(0);\n const [selectedInfantCount, setSelectedInfantCount] = useState(0);\n const [thisRoom, setThisRoom] = useState();\n const [isSetRoom, setIsSetRoom] = useState(true);\n\n useEffect(() => {\n if (thisPlan) {\n setSelectedAdultCount(thisPlan?.sAdult);\n setSelectedChildCount(thisPlan?.sChild);\n setSelectedInfantCount(thisPlan?.sInfant);\n setIsSetRoom(false);\n } else {\n setIsSetRoom(true);\n }\n }, [thisPlan]);\n\n useEffect(() => {\n let rom =\n selectedRooms?.filter(\n (rm) => rm?.id === room?.id && Number(rm?.idx) === Number(id)\n )[0] || {};\n if (selectedRooms?.length > 0 && rom && !isSetRoom) {\n rom = {\n ...rom,\n sAdult: selectedAdultCount,\n sChild: selectedChildCount,\n sInfant: selectedInfantCount,\n };\n dispatch({ type: hotelInfoTypes.SET_ROOM, payload: rom });\n }\n }, [selectedAdultCount, selectedChildCount, selectedInfantCount]);\n\n const { width } = useWindowSize();\n\n const { t } = useTranslation();\n\n const handleChange = (e) => {\n let cnt = Number(e.target.value);\n let name = e.target.name;\n let obj = { ...thisPlan, [name]: cnt };\n dispatch({ type: hotelInfoTypes.EDIT_RP, payload: obj });\n };\n\n return (\n \n
\n \n {t(\"room\")} {id}\n
\n\n 901 && \"center\" }}\n >\n {/* \n {t(\"adults\")}:{\" \"}\n \n {\"Above \"}\n {childAgeLimit}\n {t(\"years\")}\n {\" \"}\n \n\n {\n setSelectedAdultCount(Number(e.target.value));\n fireGtmEvent(\"adult_dropdown_clicked\", {\n count: e.target.value,\n roomIndex: id,\n room,\n });\n handleChange(e);\n }}\n >\n {Array.from({\n length:\n maxGuestCount - selectedInfantCount - selectedChildCount >\n maxAdultCount\n ? maxAdultCount\n : maxGuestCount - selectedInfantCount - selectedChildCount,\n }).map((_, idx) => {\n return (\n \n );\n })}\n \n
\n {maxChildCount > 0 && (\n \n {t(\"adults\")}:{\" \"}\n {width < 901 && (\n {t(\"adult_age\")}\n )}\n
*/}\n\n\n \n {t(\"children\")}:{\" \"}\n \n ({childAgeSplit}\n {t(\"years\")} - {childAgeLimit}\n {t(\"years\")})\n {\" \"}\n \n {\n setSelectedChildCount(Number(e.target.value));\n fireGtmEvent(\"child_dropdown_clicked\", {\n count: e.target.value,\n roomIndex: id,\n room,\n });\n handleChange(e);\n }}\n >\n {/* */}\n {Array.from({\n length: Math.abs(\n (maxGuestCount - selectedAdultCount - selectedInfantCount >\n maxChildCount\n ? maxChildCount\n : maxGuestCount -\n selectedAdultCount -\n selectedInfantCount) + 1\n ),\n }).map((_, idx) => {\n return (\n \n );\n })}\n \n
\n )}\n {maxInfantCount > 0 && (\n \n \n {t(\"infants\")}:{\" \"}\n \n (0 - {childAgeSplit}\n {t(\"years\")})\n {\" \"}\n \n {\n setSelectedInfantCount(Number(e.target.value));\n fireGtmEvent(\"infant_dropdown_clicked\", {\n count: e.target.value,\n roomIndex: id,\n room,\n });\n handleChange(e);\n }}\n >\n {Array.from({\n length:\n (maxGuestCount - selectedAdultCount - selectedChildCount >\n maxInfantCount\n ? maxInfantCount\n : maxGuestCount - selectedAdultCount - selectedChildCount) +\n 1,\n }).map((_, idx) => {\n return (\n \n );\n })}\n \n
\n )}\n \n \n );\n};\n\nconst RatePlanContainer = ({\n room,\n code,\n rateplan = {},\n extraPrice = 1,\n setAvailableRooms,\n availableRooms,\n maxRoomPerBooking,\n rpRoomCount,\n setRPRoomCount,\n selectedRPRoomCount,\n setSelectedRPRoomCount,\n idx,\n notificationStyle,\n handleRoomPrice,\n pricingfornotifications, // taking from Room function who is taking it from mainpage for notifications on Room and rateplan\n getSecretMemberDealUrl,\n applyPromotion,\n}) => {\n const rpObject = {\n ...JSON.parse(rateplan?.ratePlanConfig),\n ratePlanId: rateplan?.ratePlanId,\n ratePlanId: rateplan?.ratePlanId,\n id: rateplan?.id,\n };\n\n const [arrangedPromos, setArrangedPromos] = useState([]);\n const [isLoading, setIsLoading] = useState(false);\n const [showCancellation, setShowCancellation] = useState(false);\n const [cancellationPolicy, setCancellationPolicy] = useState([]);\n const [suiteRoomsForNotifications, setsuiteRoomsForNotifications] = useState(\n []\n );\n const [secretMemberDetails, setSecretMemberDetails] = useState({\n name: \"\",\n description: \"\",\n });\n\n const isSecretMemberUnlocked =\n sessionStorage.getItem(\"isMembershipUnlocked\") === \"true\";\n\n const { policies = [] } = rpObject;\n\n const cancelShown = useMemo(() => {\n let arr = [];\n policies?.forEach((pol) => {\n arr.push(pol);\n // if (!pol?.dates?.start && !pol?.dates?.end) {\n // arr.push(pol);\n // } else if (\n // pol?.dates?.start &&\n // pol?.dates?.end &&\n // dayjs().isBetween(\n // dayjs(pol?.dates?.start),\n // dayjs(pol?.dates?.end),\n // null,\n // \"[]\"\n // )\n // ) {\n // arr.push(pol);\n // } else if (\n // !pol?.dates?.end &&\n // dayjs(pol?.dates?.start).diff(dayjs(), \"days\") <= 0\n // ) {\n // arr.push(pol);\n // } else if (\n // !pol?.dates?.start &&\n // dayjs().diff(dayjs(pol?.dates?.end), \"days\") > 0\n // ) {\n // arr.push(pol);\n // }\n });\n arr = arr\n .flatMap((ar) => ar?.result)\n .filter(\n (obj, index, self) =>\n index === self.findIndex((o) => o.Days_Before === obj.Days_Before)\n )\n .sort((a, b) => a?.Days_Before - b?.Days_Before);\n // setCancellationPolicy(arr);\n // console.log(\"pol\", arr[0]?.result);\n\n if (JSON.stringify(arr) !== JSON.stringify(cancellationPolicy)) {\n setCancellationPolicy(arr);\n }\n return arr;\n }, [policies]);\n\n const {\n pricing,\n maxAdultCount,\n maxChildCount,\n maxGuestCount,\n pricingAdditionalGuests = {},\n maxInfantCount,\n } = room;\n\n const dispatch = useDispatch();\n\n const isVRHotel = storageService.get(\"source\") === \"google_vr\";\n\n const {\n hotelData,\n totalAdult,\n totalChild,\n totalInfant,\n dateRange,\n totalPeople,\n dateCount,\n selectedRatePlans = [],\n promotions = [],\n taxes,\n isHourlyRoom,\n // pricingfornotifications = [],\n } = useSelector((state) => state.hotelInfo);\n\n useEffect(() => {\n const filterLowestPriceRooms = (roomsArray) => {\n const lowestPrices = new Map();\n\n roomsArray?.forEach((roomObj) => {\n const [[roomName, price]] = Object.entries(roomObj);\n\n if (roomName?.toLowerCase().includes(\"suite\")) {\n if (\n !lowestPrices.has(roomName) ||\n price < lowestPrices.get(roomName)\n ) {\n lowestPrices.set(roomName, price);\n }\n }\n });\n\n return Array.from(lowestPrices).map(([roomName, price]) => ({\n roomName: roomName,\n roomPrice: price,\n }));\n };\n\n if (pricingfornotifications?.length > 0) {\n let x = filterLowestPriceRooms(pricingfornotifications);\n let final = x?.slice(0, 2);\n setTimeout(() => {\n if (final?.length > 0) {\n setsuiteRoomsForNotifications(final);\n }\n }, 0);\n }\n }, [pricingfornotifications]);\n\n const [searchData, setSearchData] = useState([]);\n const [showRatePlanModal, setShowRatePlanModal] = useState(false);\n const [truncatedDesc, setTruncatedDesc] = useState({\n isTruncated: false,\n displayText: \"\",\n });\n\n useEffect(() => {\n if (promotions?.length > 0) {\n let ar = arrangePromos(promotions);\n setArrangedPromos(ar);\n } else {\n setArrangedPromos([]);\n }\n }, [promotions, hotelData?.id]);\n\n let maxAdlt =\n room?.maxAdultCount >\n pricing?.filter((rm) => rm?.ratePlanCode === code)?.length\n ? pricing?.filter((rm) => rm?.ratePlanCode === code)?.length\n : room?.maxAdultCount;\n\n let aCount = totalAdult <= maxAdlt ? totalAdult : maxAdlt;\n let cCount = 0;\n let iCount = 0;\n\n const inventoryCount = room?.availableRooms;\n\n function distributeGuests(\n totalAdults,\n totalChildren,\n totalInfants,\n roomQuantity,\n maxGuests,\n maxAdults,\n maxChildren,\n maxInfants\n ) {\n let rooms = [];\n let remainingAdults = totalAdults;\n let remainingChildren = totalChildren;\n let remainingInfants = totalInfants;\n\n if (\n (totalChildren > 0 && !maxChildren) ||\n (totalInfants > 0 && !maxInfants)\n ) {\n return [];\n }\n\n let minRoomsNeeded = Math.ceil(totalAdults / maxAdults);\n minRoomsNeeded = Math.max(\n minRoomsNeeded,\n Math.ceil((totalAdults + totalChildren + totalInfants) / maxGuests)\n );\n\n if (roomQuantity < minRoomsNeeded) {\n return [];\n }\n\n for (let i = 0; i < roomQuantity; i++) {\n let roomAdults = 0;\n let roomChildren = 0;\n let roomInfants = 0;\n\n if (remainingInfants > 0 && remainingAdults > 0) {\n roomInfants = Math.min(remainingInfants, maxInfants, maxGuests - 1); // At least one adult must be in the room\n roomAdults = Math.min(\n remainingAdults,\n maxAdults,\n maxGuests - roomInfants\n );\n\n let spaceLeft = maxGuests - roomAdults - roomInfants;\n if (spaceLeft > 0 && remainingChildren > 0) {\n roomChildren = Math.min(remainingChildren, maxChildren, spaceLeft);\n }\n }\n else if (remainingChildren > 0 && remainingAdults > 0) {\n roomChildren = Math.min(remainingChildren, maxChildren, maxGuests - 1); // At least one adult must be in the room\n roomAdults = Math.min(\n remainingAdults,\n maxAdults,\n maxGuests - roomChildren\n );\n }\n else if (remainingAdults > 0) {\n roomAdults = Math.min(remainingAdults, maxAdults, maxGuests);\n }\n\n remainingInfants -= roomInfants;\n remainingChildren -= roomChildren;\n remainingAdults -= roomAdults;\n\n rooms.push({\n adults: roomAdults,\n children: roomChildren,\n infants: roomInfants,\n });\n\n // If all guests are accommodated, break the loop\n if (\n remainingAdults === 0 &&\n remainingChildren === 0 &&\n remainingInfants === 0\n ) {\n break;\n }\n }\n\n // If there are still remaining guests after using all rooms, return an empty array\n if (remainingAdults > 0 || remainingChildren > 0 || remainingInfants > 0) {\n return [];\n }\n\n return rooms;\n }\n\n const getLowestPrice = (\n adultCount,\n childCount,\n infantCount,\n minorObj,\n pricing\n ) => {\n let totalGuest = adultCount + childCount + infantCount;\n\n let adultPricing =\n pricing?.filter((pr) => pr?.adultCount === adultCount)?.[0]\n ?.priceForPax || [];\n\n let childPricing = minorObj?.children;\n let infantPricng = minorObj?.infants;\n\n let dates = adultPricing?.map((date) => date?.checkInDate) || [];\n\n let rpArr = [];\n\n dates.forEach((date) => {\n let sum = 0,\n tax = 0;\n\n // calculate adult price\n sum += adultPricing?.filter((dt) => dt?.checkInDate === date)?.[0]\n ?.priceBeforeTax;\n\n if (childCount > 0) {\n let datePrice = childPricing?.filter(\n (dt) => dt?.checkInDate === date\n )[0]?.priceBeforeTax;\n let childPrice = 0;\n for (let i = 0; i < childCount; i++) {\n childPrice += datePrice;\n }\n\n if (pricing?.some((pr) => pr?.adultCount === adultCount + childCount)) {\n let extraAdultComparePrice =\n pricing?.filter(\n (pr) => pr?.adultCount === adultCount + childCount\n )?.[0]?.priceForPax || [];\n let priceForThis = extraAdultComparePrice?.filter(\n (pr) => pr?.checkInDate === date\n )?.[0]?.priceBeforeTax;\n sum = Math.min(priceForThis, sum + childPrice);\n }\n }\n if (infantCount > 0) {\n // compare the price with child and swap it with infant;\n let childDatePrice = childPricing?.filter(\n (dt) => dt?.checkInDate === date\n )[0]?.priceBeforeTax;\n\n let infantDatePrice = infantPricng?.filter(\n (dt) => dt?.checkInDate === date\n )[0]?.priceBeforeTax;\n\n let infantPrice = Math.min(childDatePrice, infantDatePrice);\n let price = 0;\n for (let i = 0; i < infantCount; i++) {\n price += infantPrice;\n }\n\n if (\n pricing?.some(\n (pr) => pr?.adultCount === adultCount + infantCount + childCount\n )\n ) {\n let extraAdultComparePrice =\n pricing?.filter(\n (pr) => pr?.adultCount === adultCount + infantCount + childCount\n )?.[0]?.priceForPax || [];\n let priceForThis = extraAdultComparePrice?.filter(\n (pr) => pr?.checkInDate === date\n )?.[0]?.priceBeforeTax;\n sum = Math.min(priceForThis, sum + price);\n }\n }\n let obj = {\n checkInDate: date,\n priceBeforeTax: sum,\n };\n rpArr.push(obj);\n });\n\n return rpArr;\n };\n\n const { price, taxAmount, priceReduced } = useMemo(() => {\n let sum = 0,\n tax = 0,\n promosApplied = [],\n priceReduced = 0;\n\n let searchedRooms = distributeGuests(\n totalAdult,\n totalChild,\n totalInfant,\n availableRooms,\n room?.maxGuestCount,\n maxAdlt,\n room?.maxChildCount,\n room?.maxInfantCount\n );\n\n if (searchedRooms.length > 0) {\n setSearchData(searchedRooms);\n\n for (let i = 0; i < searchedRooms.length; i++) {\n let tempArr = getLowestPrice(\n searchedRooms[i]?.adults,\n searchedRooms[i]?.children,\n searchedRooms[i]?.infants,\n pricingAdditionalGuests[code],\n pricing?.filter((r) => r?.ratePlanCode === code)\n );\n\n tempArr?.forEach((obj, idx) => {\n let tempPrice = obj?.priceBeforeTax;\n let checkInDate = obj?.checkInDate;\n\n const promo = getApplicablePromotionRoom({\n arrangedPromos: promotions,\n rp: { rpObject, roomId: room?.id },\n tempPrice,\n checkInDate,\n });\n\n if (promo) {\n promosApplied.push(promo);\n }\n\n // if (hotelData?.userId !== 63809) {\n // tempPrice = tempPrice > 7500 ? tempPrice * 1.18 : tempPrice * 1.12;\n // }\n\n let { finalValue, reducedPrice } = calculatePromotion({\n price: tempPrice,\n promo,\n idx,\n dateCount,\n });\n priceReduced += reducedPrice;\n\n const taxObj = getCalculatedTax({\n rooms: [{ id: room?.id, amount: finalValue }],\n isInclusive: hotelData?.isTaxIncluded,\n taxes: taxes,\n noOfNights: 1,\n });\n\n sum += finalValue;\n tax += taxObj?.totalRoomTax;\n });\n }\n } else {\n setSearchData([]);\n let tempArr =\n pricing?.filter(\n (pr) =>\n pr?.adultCount === aCount &&\n pr?.childCount === 0 &&\n pr?.infantCount === 0 &&\n pr?.ratePlanCode === code\n )?.[0]?.priceForPax || [];\n\n tempArr?.forEach((obj, idx) => {\n let tempPrice = obj?.priceBeforeTax;\n let checkInDate = obj?.checkInDate;\n\n const promo = getApplicablePromotionRoom({\n arrangedPromos: promotions,\n rp: { rpObject, roomId: room?.id },\n tempPrice,\n checkInDate,\n });\n\n if (promo) {\n promosApplied.push(promo);\n }\n\n // if (hotelData?.userId !== 63809) {\n // tempPrice = tempPrice > 7500 ? tempPrice * 1.18 : tempPrice * 1.12;\n // }\n\n let { finalValue, reducedPrice } = calculatePromotion({\n price: tempPrice,\n promo,\n idx,\n dateCount,\n });\n priceReduced += reducedPrice;\n\n const taxObj = getCalculatedTax({\n rooms: [{ id: room?.id, amount: finalValue }],\n isInclusive: hotelData?.isTaxIncluded,\n taxes: taxes,\n noOfNights: 1,\n });\n\n sum += finalValue;\n tax += taxObj?.totalRoomTax;\n });\n }\n\n if (sum > 0) {\n const lowestPrice = storageService.get(\"lowestPrice\") ?? Infinity;\n storageService.set(\"lowestPrice\", Math.min(lowestPrice, sum + tax));\n }\n\n return {\n price: Number(sum),\n taxAmount: Number(tax),\n priceReduced: Number(priceReduced),\n };\n }, [\n pricing,\n totalAdult,\n totalChild,\n totalInfant,\n arrangedPromos,\n taxes,\n dateRange,\n ]);\n\n useEffect(() => {\n if (!room || !price || !handleRoomPrice) return;\n handleRoomPrice(room?.roomName, price);\n }, [room, price]);\n\n // useEffect(() => {\n // if (!room || !price) return;\n // // console.log(\n // // \"room.roomName and price that will be passed to handleRoomPrice function\",\n // // room.roomName,\n // // price\n // // );\n // dispatch({\n // type: hotelInfoTypes.PRICE_FOR_NOTIFICATIONS,\n // payload: { [room.roomName]: price },\n // });\n // }, [room, price]);\n\n const selectedCount = useMemo(() => {\n return selectedRatePlans?.filter(\n (rp) => rp?.id === `${room?.id}_${code}_${idx}`\n )?.length;\n }, [selectedRatePlans]);\n\n const thisSelectedRateplans = useMemo(() => {\n return selectedRatePlans?.filter(\n (rp) => rp?.id === `${room?.id}_${code}_${idx}`\n );\n }, [selectedRatePlans]);\n\n const thisRoomCount = useMemo(() => {\n return selectedRatePlans?.filter((rp) => rp?.roomId === room?.id)?.length;\n }, [selectedRatePlans]);\n\n const [thisRoomIndex] = useMemo(() => {\n return selectedRatePlans\n ?.filter((rp) => rp?.roomId === room?.id && code === rp?.code)\n ?.sort((a, b) => a?.index - b?.index)\n ?.slice(-1);\n }, [selectedRatePlans]);\n\n const increment = async () => {\n if (isLoading) {\n return;\n }\n setIsLoading(true);\n\n if (maxRoomPerBooking && selectedRatePlans?.length >= maxRoomPerBooking) {\n toastr.error(\n `Hotel does not allow more than ${maxRoomPerBooking} rooms in a single reservation.`\n );\n setIsLoading(false);\n return;\n }\n\n let resp = await checkRoomCount(thisRoomCount + 1);\n if (!resp) {\n setIsLoading(false);\n return;\n }\n\n try {\n if (thisRoomCount < availableRooms) {\n let obj = {\n sAdult: aCount,\n sChild: 0, //cCount,\n sInfant: 0, //iCount,\n code,\n roomId: room?.id,\n rpObject,\n id: `${room?.id}_${code}_${idx}`,\n idx: (thisRoomIndex?.idx || 0) + 1,\n RoomImages: room?.RoomImages,\n roomName: room?.roomName,\n };\n fireGtmEvent(\"room_added\", obj);\n if (window) {\n window?.gtag(\"event\", \"add_to_cart\", {\n value: price,\n currency: hotelData?.currency,\n items: [\n {\n id: hotelData?.id,\n start_date: dayjs(dateRange.startDate).format(\"YYYY-MM-DD\"),\n end_date: dayjs(dateRange.endDate).format(\"YYYY-MM-DD\"),\n google_business_vertical: \"hotel_rental\",\n },\n ],\n });\n }\n if (hotelData?.userId === 103376 && window?.gtag) {\n window?.gtag(\"event\", \"add_to_cart\", {\n value: price,\n currency: hotelData?.currency,\n items: [\n {\n price: price, // Room price per night\n item_id: hotelData?.id, // Room ID or SKU\n item_name: room?.roomName, // Room name\n },\n ],\n });\n }\n let obj2 = {\n hotelId: hotelData?.id,\n roomIds: [obj?.roomId],\n checkInDate: dayjs(dateRange.startDate).format(\"YYYY-MM-DD\"),\n checkOutDate: dayjs(dateRange.endDate).format(\"YYYY-MM-DD\"),\n roomCount: thisRoomCount + 1,\n };\n dispatch(addRatePlan(obj, obj2, 0, () => setIsLoading(false)));\n addRatePlanAds();\n } else {\n toastr.error(t(\"Maximum room count reached!\"));\n setIsLoading(false);\n }\n } catch (error) {\n fireGtmEvent(\"add_rp_error\", error);\n setIsLoading(false);\n }\n };\n\n const checkRoomCount = async (roomCount = 1) => {\n let obj = {\n hotelId: hotelData?.id,\n roomIds: [room?.id],\n checkInDate: dayjs(dateRange.startDate).format(\"YYYY-MM-DD\"),\n checkOutDate: dayjs(dateRange.endDate).format(\"YYYY-MM-DD\"),\n roomCount,\n };\n const response = await isRoomAvailableApi(obj);\n\n dispatch({\n type: hotelInfoTypes.SET_UPDATED_ROOM_COUNT,\n payload: { id: room?.id, value: response?.data },\n });\n if (!response?.data) {\n setAvailableRooms(response?.data);\n toastr.error(\"Room sold out, please select other available room.\");\n }\n return response?.data;\n };\n\n const addRatePlanAds = () => {\n if (window) {\n window?.gtag(\"event\", \"conversion\", {\n send_to: \"AW-10960259904/_RXWCJnb3MwZEMCWoeoo\",\n value: price + taxAmount,\n currency: hotelData?.currency,\n event_callback: () => {},\n });\n }\n };\n\n const handleSearchData = async () => {\n if (isLoading) {\n return;\n }\n if (maxRoomPerBooking && selectedRatePlans?.length >= maxRoomPerBooking) {\n toastr.error(\n `Hotel does not allow more than ${maxRoomPerBooking} rooms in a single reservation.`\n );\n setIsLoading(false);\n return;\n }\n setIsLoading(true);\n let resp = await checkRoomCount(thisRoomCount + searchData.length);\n if (!resp) {\n setIsLoading(false);\n return;\n }\n\n try {\n fireGtmEvent(\"searchRoom_added\", { searchData, room });\n searchData.forEach((sd, indx) => {\n if (thisRoomCount >= availableRooms) {\n toastr.error(t(\"Maximum room count reached!\"));\n setIsLoading(false);\n return;\n }\n let obj = {\n sAdult: sd.adults,\n sChild: sd.children, //cCount,\n sInfant: sd.infants, //iCount,\n code,\n roomId: room?.id,\n rpObject,\n id: `${room?.id}_${code}_${idx}`,\n idx: (indx || 0) + 1,\n RoomImages: room?.RoomImages,\n roomName: room?.roomName,\n };\n let obj2 = {\n hotelId: hotelData?.id,\n roomIds: [obj?.roomId],\n checkInDate: dayjs(dateRange.startDate).format(\"YYYY-MM-DD\"),\n checkOutDate: dayjs(dateRange.endDate).format(\"YYYY-MM-DD\"),\n roomCount: thisRoomCount + searchData.length,\n };\n\n dispatch(addRatePlan(obj, obj2, indx, () => setIsLoading(false)));\n addRatePlanAds();\n });\n } catch (error) {\n fireGtmEvent(\"add_rp_error\", error);\n setIsLoading(false);\n }\n };\n\n const decrement = () => {\n if (thisRoomCount > 0) {\n fireGtmEvent(\"room_removed\", { roomId: room?.id });\n if (hotelData?.userId === 103376 && window && window?.gtag) {\n window?.gtag(\"event\", \"remove_from_cart\", {\n value: price,\n currency: hotelData?.currency,\n items: [\n {\n price: price, // Room price per night\n item_id: hotelData?.id, // Room ID or SKU\n item_name: room?.roomName, // Room name\n },\n ],\n });\n }\n dispatch({\n type: hotelInfoTypes.DESELECT_RP,\n payload: `${room?.id}_${code}_${idx}`,\n });\n }\n };\n\n const { t } = useTranslation();\n\n const truncateDescription = (description, limit) => {\n const words = description.split(\" \");\n\n if (words.length > limit) {\n setTruncatedDesc({\n isTruncated: true,\n displayText: words?.slice(0, 20).join(\" \") + \"...\",\n });\n } else {\n setTruncatedDesc({ isTruncated: false, displayText: description });\n }\n };\n\n useEffect(() => {\n truncateDescription(rpObject?.description || '', 10);\n },[]);\n\n const [dropCancellation, setDropCancellation] = useState(false);\n\n const handleToggleCancellation = () => {\n setDropCancellation(!dropCancellation);\n dropCancellation\n ? fireGtmEvent(\"cancelClosedLandingPage\")\n : fireGtmEvent(\"cancelViewedLandingPage\");\n };\n\n return (\n <>\n {price > 0 && (\n <>\n \n
\n \n \n \n \n
\n \n \n
\n {/* cancellation window */}\n \n {!room?.roomName?.toLowerCase()?.includes(\"suite\") &&\n rpObject?.name?.toLowerCase()?.includes(\"room only\") && (\n \n {`Only ${\n room?.availableRooms > 3\n ? Math.floor(Math.random() * 2) + 2\n : room?.availableRooms\n } ${\n room?.availableRooms === 1 ? \"room\" : \"rooms\"\n } left at this price!`}\n \n )}\n {room?.roomName?.toLowerCase()?.includes(\"suite\") &&\n rpObject?.name?.toLowerCase()?.includes(\"room only\") &&\n suiteRoomsForNotifications?.map((ele) =>\n ele?.roomName === room?.roomName ? (\n \n {`Hurry! Only ${\n room?.availableRooms > 3\n ? Math.floor(Math.random() * 2) + 2\n : room?.availableRooms\n } ${\n room?.availableRooms === 1 ? \"suite\" : \"suites\"\n } remaining for your dates`}\n \n ) : null\n )}\n {/* Secret Member deal */}\n {secretMemberDetails?.name &&\n secretMemberDetails?.description &&\n isSecretMemberUnlocked && (\n \n setShowRatePlanModal(true)}\n >\n Show More\n \n )}\n
\n {rpObject?.inclusions?.length &&\n rpObject?.inclusions?.slice(0, 2)?.map((inc) => (\n \n
\n )}\n\n {secretMemberDetails?.name}
\n \n{secretMemberDetails?.description}
\n\n {rpObject?.name}\n
\n\n {truncatedDesc?.displayText}\n
\n {truncatedDesc?.isTruncated && (\n\n
\n ))\n }\n \n \n 
\n
\n {inc?.inclusionName}
\n\n {\n rpObject?.inclusions?.length > 2 && (\n
\n setShowRatePlanModal(true)}>See all inclusions
\n )\n }\n {/* */}\n {\n cancelShown.length > 0 && (\n\n {t(\"cancellation_refund_policy\")}\n
\n )\n }\n \n\n \n
\n )}\n \n
\n \n {priceReduced > 0 ? (\n
\n ) : (\n \n \n \n {currencies(hotelData?.currency)}{\" \"}\n {Number(\n (priceReduced * extraPrice) / dateCount\n ).toFixed(getFixedValue(hotelData?.currency))}{\" \"}\n {t(\"off\")}\n \n \n\n \n
\n \n {currency(hotelData?.currency)}{\" \"}\n {/* {((price + priceReduced) * extraPrice).toFixed(\n getFixedValue(hotelData?.currency)\n )} */}\n {(\n ((price + priceReduced) * extraPrice) /\n dateCount\n ).toFixed(getFixedValue(hotelData?.currency))}\n
\n\n {currency(hotelData?.currency)}{\" \"}\n {((price * extraPrice) / dateCount).toFixed(\n getFixedValue(hotelData?.currency)\n )}{\" \"}\n /{\" \"}\n
\n\n {\" \"}\n {dateCount === 1 ? t(\"night\") : `${t(\"Night\")}`}\n {/* {dateCount === 1\n ? t(\"night\")\n : `${dateCount / dateCount} ${t(\"night\")}`} */}\n
\n\n
\n )}\n {taxAmount > 0 && (\n \n {currency(hotelData?.currency)}{\" \"}\n {Number(price).toFixed(\n getFixedValue(hotelData?.currency)\n )}{\" \"}\n /{\" \"}\n
\n\n {dateCount === 1\n ? t(\"night\")\n : `${dateCount} ${t(\"Nights\")}`}\n
\n\n +{\" \"}\n {Number((taxAmount * extraPrice) / dateCount).toFixed(\n getFixedValue(hotelData?.currency)\n )}{\" \"}\n {t(\"taxes\")}\n
\n )}\n {searchData.length > 0 ? (\n\n {\" \"}\n {t(\"price_for\")} {totalPeople}{\" \"}\n {t(pluralWords(totalPeople, \"guest\"))}\n
\n ) : (\n\n {\" \"}\n {t(\"price_for\")} {aCount}{\" \"}\n {t(pluralWords(aCount, \"Adult\"))}\n
\n )}\n {isVRHotel ? (\n \n (This room can accommodate up to {maxGuestCount || 1}{\" \"}\n guests)\n \n ) : null}\n\n {selectedCount === 0 ? (\n 0 ? handleSearchData : increment\n }\n >\n {isLoading ?
\n ) : (\n \n -\n
\n \n {selectedCount}\n
\n\n \n +\n
\n \n {Array.from({ length: selectedCount }).map((_, id) => {\n return (\n
\n {/* secret member rate box */}\n {availableRooms > 0 && (\n \n {cancelShown.length > 0 && (\n \n {\n setShowCancellation(true);\n fireGtmEvent(\"rpCancellationOpened\", {\n room_rp_id: `${room?.id}_${code}_${idx}`,\n });\n }}\n >\n {t(\"cancellation_policy\")}\n */}\n
\n )}\n {showCancellation && (\n \n
\n \n setShowCancellation(false)}\n >\n X\n \n
\n {t(\"cancellation_policy\")}
\n\n {cancelShown?.some((res) => res?.Days_Before == 999) ? (\n
\n \n Non Refundable - 100% of the money will be charged upon\n cancellation.\n
\n ) : (\n cancelShown.map((res, idx) => {\n let obj = {\n nights: \"nights\",\n percent: \"%\",\n fixed: hotelData?.currency,\n };\n return (\n\n •{\" \"}\n {res?.Days_Before === 0\n ? `${t(\n \"Incase of No Show / Cancelling on day of Checkin will incur\"\n )} ${res?.Penalty_Value}${\n obj[res?.Penalty_Type]\n } ${t(\"penalty\")}.`\n : res?.Penalty_Type === \"nights\"\n ? `${t(\"Cancelling\")} ${\n res?.Days_Before\n } ${pluralWords(res?.Days_Before, \"day\")} ${t(\n \"before arrival incurs a\"\n )} ${res?.Penalty_Value}${pluralWords(\n res?.Penalty_Value,\n \"night\"\n )} ${t(\"penalty\")}.`\n : `${t(\"Cancelling\")} ${\n res?.Days_Before\n } ${pluralWords(res?.Days_Before, \"day\")} ${t(\n \"before arrival incurs a\"\n )} ${res?.Penalty_Value}${\n obj[res?.Penalty_Type]\n } ${t(\"penalty\")}.`}\n
\n );\n })\n )}\n\n Someone booked this room {bookedMinutesAgo} minutes ago\n
\n );\n case 2:\n return (\n\n This room was booked {randomNumber} times in last 7 days\n
\n );\n case 3:\n return hotelData?.city ? (\n\n Highly rated by travelers visiting {hotelData.city}\n
\n ) : (\n\n Highly rated by travelers\n
\n );\n default:\n return null;\n }\n };\n //Real-Time Booking Alerts and Popularity Signals - Ends\n\n const truncateDescription = (text, wordLimit = 20) => {\n const lines = text?.split(\"\\n\") || [];\n return { truncatedLines: lines, isTruncated: true };\n const firstLineWords = lines[0]?.trim().split(\" \") || [];\n const secondLineWords = lines[1]?.trim().split(\" \") || [];\n\n let truncatedLines = [];\n let isTruncated = false;\n\n if (firstLineWords.length > wordLimit) {\n truncatedLines = [firstLineWords.slice(0, wordLimit).join(\" \") + \"...\"];\n isTruncated = true;\n } else if (secondLineWords.length > wordLimit || lines.length > 2) {\n truncatedLines = [\n lines[0],\n secondLineWords.slice(0, wordLimit).join(\" \") + \"...\",\n ];\n isTruncated = true;\n } else {\n truncatedLines = lines.slice(0, 2);\n }\n\n return { truncatedLines, isTruncated };\n };\n\n const { truncatedLines, isTruncated } = truncateDescription(\n room?.description\n );\n\n useEffect(() => {\n if (a1Rooms && a1Rooms > 0) {\n if (hotelData?.userId === 63809) {\n a1Rooms > 5 ? setARooms(5) : setARooms(a1Rooms);\n } else {\n setARooms(a1Rooms);\n }\n } else {\n setARooms(0);\n }\n }, [a1Rooms]);\n\n useEffect(() => {\n const filterRooms = selectedRooms;\n const findRoom = filterRooms?.filter((rm) => rm?.id === room?.id);\n const filterAddons = selectedAddons?.filter(\n (adn) => adn?.hotelRoomId === room?.id\n );\n setRoomCount(findRoom?.length);\n if (findRoom?.length === 0 && filterAddons?.length === 0) {\n setExtraAdult(0);\n setExtraChild(0);\n setExtraInfant(0);\n setDinner(0);\n setLunch(0);\n setBreakfast(0);\n }\n }, [roomCount, selectedAddons, selectedRooms]);\n\n useEffect(() => {\n const checkOverflow = () => {\n if (descriptionRef.current) {\n setIsOverflowing(\n descriptionRef.current.scrollHeight >\n descriptionRef.current.clientHeight\n );\n }\n };\n\n checkOverflow();\n\n window.addEventListener(\"resize\", checkOverflow);\n\n return () => {\n window.removeEventListener(\"resize\", checkOverflow);\n };\n }, [descriptionRef.current]);\n\n useEffect(() => {\n if (\n HotelRoomAmenities?.some(\n (amn) =>\n amn?.Amenity?.name === \"Bunk Beds\" &&\n amn?.Amenity?.category === \"bed_type\"\n )\n ) {\n setIsDorm(true);\n }\n }, [selectedRooms]);\n\n useEffect(() => {\n if (HotelRoomAddons?.length > 0) {\n let tempFood = HotelRoomAddons?.filter(\n (adn) => adn?.price === \"0.00\" && adn?.Addon?.category === \"meal\"\n );\n setFreeFood(tempFood);\n\n let tempGuest = HotelRoomAddons?.filter(\n (adn) => adn?.price === \"0.00\" && adn?.Addon?.category === \"person\"\n );\n setFreeGuest(tempGuest);\n }\n }, []);\n\n useEffect(() => {\n if (payments) {\n if (payments?.some((pay) => pay?.Gateway?.name === \"COD\")) {\n setIsCOD(true);\n }\n if (payments?.some((pay) => pay?.Gateway?.name === \"PartialPayment\")) {\n let val = payments?.filter(\n (pay) => pay?.Gateway?.name === \"PartialPayment\"\n )[0]?.config?.minPercentage;\n\n val > 0 && setPartialPercentage(val);\n }\n }\n }, [payments]);\n\n useEffect(() => {\n if (policies?.length > 0) {\n let temp =\n policies?.filter((pol) => pol?.type === \"cancellation_policy\") || [];\n\n if (temp?.length > 0) {\n temp[0]?.HotelPolicies?.sort(\n (a, b) =>\n b?.variables?.daysBeforeArrival - a?.variables?.daysBeforeArrival\n );\n\n setCancellationPolicy(temp[0]?.HotelPolicies);\n }\n }\n }, [policies]);\n\n useEffect(() => {\n let last, diffDays;\n if (cancellationPolicy?.length > 0) {\n if (cancellationPolicy[0]?.variables?.chargedPercentage === 0) {\n last = dayjs(dateRange?.startDate).subtract(\n cancellationPolicy[0]?.variables?.daysBeforeArrival,\n \"day\"\n );\n } else {\n last = dayjs(dateRange?.startDate).subtract(\n cancellationPolicy[0]?.variables?.daysBeforeArrival + 1,\n \"day\"\n );\n }\n diffDays = last?.diff(dayjs(), \"day\");\n if (diffDays >= 0) {\n setShowCancel(true);\n }\n setLastDate(last?.format(\"MMM DD\"));\n } else {\n diffDays = dayjs(dateRange?.startDate).diff(dayjs(), \"day\");\n\n if (diffDays >= 1) {\n last = dayjs(dateRange?.startDate).subtract(1, \"day\");\n setShowCancel(true);\n setLastDate(last?.format(\"MMM DD\"));\n }\n }\n }, [cancellationPolicy, room?.pricing]);\n\n useEffect(() => {\n if (selectedAddons?.length > 0) {\n setExtraAdult(\n selectedAddons?.filter(\n (addon) =>\n addon?.Addon?.name === \"Extra Adult\" &&\n addon?.hotelRoomId === room?.id\n )?.length\n );\n setExtraChild(\n selectedAddons?.filter(\n (addon) =>\n addon?.Addon?.name === \"Extra Child\" &&\n addon?.type === \"child\" &&\n addon?.hotelRoomId === room?.id\n )?.length\n );\n setExtraInfant(\n selectedAddons?.filter(\n (addon) =>\n addon?.Addon?.name === \"Extra Child\" &&\n addon?.type === \"infant\" &&\n addon?.hotelRoomId === room?.id\n )?.length\n );\n setDinner(\n selectedAddons?.filter(\n (addon) =>\n addon?.Addon?.name === \"Dinner\" && addon?.hotelRoomId === room?.id\n )?.length\n );\n setLunch(\n selectedAddons?.filter(\n (addon) =>\n addon?.Addon?.name === \"Lunch\" && addon?.hotelRoomId === room?.id\n )?.length\n );\n setBreakfast(\n selectedAddons?.filter(\n (addon) =>\n addon?.Addon?.name === \"Breakfast\" &&\n addon?.hotelRoomId === room?.id\n )?.length\n );\n }\n }, [selectedAddons]);\n\n useEffect(() => {\n let guestCount = selectedAddons?.filter(\n (adn) =>\n adn?.hotel_room_id === room?.id && adn?.Addon?.category === \"person\"\n )?.length;\n if (guestToDisplay && guestToDisplay === defaultGuestCount + guestCount) {\n setExtraAdult(0);\n setExtraChild(0);\n }\n }, [extraAdult, extraChild]);\n\n useEffect(() => {\n let finalPrice = 0;\n let val = totalAdult <= maxGuestCount ? totalAdult : maxGuestCount;\n\n if (\n priceConfigDifference &&\n Object.keys(priceConfigDifference).length > 0\n ) {\n pricing.forEach((pr) => {\n finalPrice =\n finalPrice +\n parseFloat(pr?.price) +\n parseFloat(priceConfigDifference[val]);\n });\n } else {\n pricing.forEach((pr) => {\n finalPrice =\n finalPrice +\n parseFloat(pr.price) * (parseFloat(priceConfig[val]) || 1);\n });\n }\n let tempPrice = pricing?.length === 0 ? defaultPrice : finalPrice;\n if (hotelData?.userId === 63809) {\n tempPrice = tempPrice > 8400 ? tempPrice / 1.18 : tempPrice / 1.12;\n }\n setPrice(tempPrice);\n setPeople(parseInt(defaultGuestCount));\n\n if (totalAdult <= maxGuestCount) {\n setPriceToDisplay(tempPrice);\n setGuestToDisplay(totalAdult);\n } else {\n setPriceToDisplay(null);\n setGuestToDisplay(maxGuestCount);\n }\n\n if (updatedRoomCount[room?.id] >= 0) {\n setAvailableRooms(updatedRoomCount[room?.id]);\n } else {\n setAvailableRooms(aRooms);\n }\n }, [totalAdult, room, extraPrice, aRooms, updatedRoomCount]);\n\n useEffect(() => {\n if (isDorm && maxGuestCount !== defaultGuestCount && availableRooms > 0) {\n setAvailableRooms(1);\n }\n }, [isDorm, room, aRooms]);\n\n useEffect(() => {\n let width = windowSize.width > 901 ? 300 : 400;\n\n setSize(width);\n }, [windowSize]);\n\n const [currentIndex, setCurrentIndex] = useState(0);\n const handleImage = (id) => {\n setViewImage(true);\n setCurrentIndex(id);\n };\n\n useEffect(() => {\n if (selectedRooms?.length === 0) {\n dispatch({ type: hotelInfoTypes.SET_SLOTS, payload: {} });\n }\n }, [selectedRooms?.length]);\n\n // NEW TYPE\n\n const testId = storageService.get(\"testId\") || 0;\n\n useEffect(() => {\n const {\n priceConfig = {},\n defaultGuestCount,\n maxGuestCount,\n HotelRoomAddons,\n pricing,\n extraChildPrice,\n childAgeSplit,\n extraInfantPrice,\n } = room;\n let guests = Object.keys(priceConfig).map(Number);\n let additionalGuestCount = guests.length - defaultGuestCount;\n let averagePrice = 0;\n pricing.forEach((pr) => {\n averagePrice += parseFloat(pr.price);\n });\n averagePrice = averagePrice / pricing?.length;\n let newAddons = [];\n let childAddons = [];\n if (maxGuestCount > defaultGuestCount) {\n for (let i = 1; i <= additionalGuestCount; i++) {\n let addonPrice =\n (priceConfig[defaultGuestCount + i] -\n priceConfig[defaultGuestCount + i - 1]) *\n averagePrice;\n let newAddonObj = {\n hotelRoomId: room?.id,\n hotel_room_id: room?.id,\n price: addonPrice.toFixed(getFixedValue(hotelData?.currency)),\n Addon: {\n name: \"Extra Adult\",\n displayName: t(\"extra_adult\"),\n category: \"person\",\n },\n };\n newAddons.push(newAddonObj);\n }\n if (extraChildPrice) {\n let obj = {\n hotelRoomId: room?.id,\n hotel_room_id: room?.id,\n price: parseFloat(extraChildPrice).toFixed(\n getFixedValue(hotelData?.currency)\n ),\n type: \"child\",\n Addon: {\n name: \"Extra Child\",\n displayName: childAgeSplit\n ? `${t(\"extra_child\")} (${childAgeSplit}-18`\n : `${t(\"extra_child\")} (12-18)`,\n category: \"person\",\n },\n };\n childAddons.push(obj);\n }\n if (extraInfantPrice) {\n let obj = {\n hotelRoomId: room?.id,\n hotel_room_id: room?.id,\n price: parseFloat(extraInfantPrice).toFixed(\n getFixedValue(hotelData?.currency)\n ),\n type: \"infant\",\n Addon: {\n name: \"Extra Child\",\n displayName: childAgeSplit\n ? `${t(\"extra_child\")} (0-${childAgeSplit})`\n : `${t(\"extra_child\")} (0-12)`,\n category: \"person\",\n },\n };\n childAddons.push(obj);\n }\n }\n let newroom = [...HotelRoomAddons, newAddons[0] || []];\n // newAddons?.sort((a, b) => b?.price - a?.price);\n setAddons([...newroom, ...childAddons]);\n setAdultAddons(newAddons);\n setCompareAdultAddons(newAddons);\n }, [selectedRooms, room]);\n\n useEffect(() => {\n if (roomCount > 1) {\n let arr = [...adultAddons, ...compareAdultAddons];\n setAdultAddons(arr);\n }\n }, [roomCount]);\n\n // useEffect(() => {\n // const calculateVisibleItems = () => {\n // return;\n // const items = truncatedLines || [];\n // console.log(items);\n // const container = descriptionRef.current;\n // console.log(\"hi\");\n // if (!container || !items?.length) return;\n // console.log(\"hello\");\n\n // // Create a temporary list to measure\n // const temp = document.createElement(\"ul\");\n // temp.style.cssText = window.getComputedStyle(\n // container.firstChild\n // ).cssText;\n // temp.style.position = \"absolute\";\n // temp.style.visibility = \"hidden\";\n // temp.style.height = \"auto\";\n // temp.style.width = `${container.clientWidth}px`;\n // document.body.appendChild(temp);\n\n // // Binary search to find the maximum number of visible items\n // let start = 0;\n // let end = items.length;\n // let visibleCount = 0;\n\n // while (start <= end) {\n // const mid = Math.floor((start + end) / 2);\n // temp.innerHTML =\n // items\n // .slice(0, mid)\n // .map((item) => `\n \n \n {RoomImages?.length === 0 ? (\n RoomImages[0]?.cdnImageUrl && setViewImage(true)}\n />\n ) : (\n {\n handleImage(id);\n fireGtmEvent(\"room_image_expanded\");\n }}\n className=\"room__topLeftContainer\"\n >\n {RoomImages?.map((image, id) => (\n
\n \n
\n )}\n \n {notifications?.some(\n (notification) =>\n notification &&\n typeof notification === \"object\" &&\n Object.keys(notification).length > 0 &&\n Object.keys(notification)[0] === room?.roomName\n ) &&\n getRoomNotification(\n notifications,\n room,\n peopleViewing,\n bookedMinutesAgo,\n randomNumber,\n hotelData\n )}\n
\n\n
\n {room?.description && (\n {roomName}
\n\n {!isModify && isFirst && availableRooms > 0 && (\n\n {hotelData?.HotelRooms?.length === 1\n ? t(\"lowest_price_ever\")\n : t(\"recommended\")}\n
\n )}\n {isSelected &&Current Selection
}\n- \n {truncatedLines.map((line, index) => (\n
- {line} \n ))}\n
{t(\"Description\")}
\n\n- \n {room?.description?.split(\"\\n\").map((line, index) => (\n
\n
\n \n \n {!isRatePlans && searchData.length === 0 ? (\n guestToDisplay ? (\n
\n \n
\n
\n
\n
\n {freeFood?.map((food, id) => {\n return (\n \n {\" \"}\n \n {\" \"}\n
\n )}\n \n {\" \"}\n
\n {\" \"}\n
\n {\" \"}\n
\n {HotelRoomAmenities?.map((am, id) => {\n return (\n
\n {\n \n
\n {availableRooms === 0 ||\n (isRatePlans && !room?.ratePlans) ||\n room?.pricing?.length === 0\n ? t(\"sold_out\")\n : availableRooms < 3 &&\n availableRooms + \" \" + t(\"room_left_hurry_up\")}\n
\n }\n {/* \n {isModify && availableRooms === 0 ? (\n
*/}\n {isHourlyRoom && availableRooms !== 0 && (\n \n
\n ) : (\n \n {t(\"you_have_selected\")} {t(\"rooms\")}\n
\n\n
\n )}\n \n {hourly?.map((slot) => {\n let isDisable = !(\n isStartTimeBeforeEndTime(\n convert24hrTo12hr(slot?.firstCheckInTime),\n hourlyTime\n ) &&\n isStartTimeBeforeEndTime(\n hourlyTime,\n convert24hrTo12hr(slot?.lastCheckInTime)\n )\n );\n\n let isDiffConfig =\n chosenPriceConfig === \"priceConfigDifference\";\n let tempAdult =\n totalAdult <= maxGuestCount ? totalAdult : maxGuestCount;\n let isTemp = totalAdult <= defaultGuestCount;\n\n return (\n handleSelectedSlots(slot, isDisable)}\n key={slot?.id}\n >\n \n {currencies(hotelData?.currency)}{\" \"}\n {isTemp\n ? (basePrice * Number(slot?.percentage)).toFixed(\n getFixedValue(hotelData?.currency)\n )\n : isDiffConfig && priceConfigDifference\n ? (\n basePrice * slot?.percentage +\n priceConfigDifference[tempAdult]\n ).toFixed(getFixedValue(hotelData?.currency))\n : (\n basePrice * slot?.percentage +\n (priceConfig[tempAdult] * basePrice - basePrice)\n ).toFixed(getFixedValue(hotelData?.currency))}\n \n\n
\n );\n })}\n \n )}\n {/* Secret Member Deal */}\n {!isRatePlans &&\n secretMemberDetails?.name &&\n secretMemberDetails?.description &&\n isSecretMemberUnlocked && (\n \n {slot?.hour} {t(\"hour\")}\n
\n{secretMemberDetails?.name}
\n \n{secretMemberDetails?.description}
\n \n )}\n\n {!isRatePlans && (\n
\n )}\n\n {!isHourlyRoom && !isRatePlans && !isModify && (\n \n \n \n \n {currencies(hotelData?.currency)}\n \n \n \n \n {(rmPrice * 1.15 * extraPrice).toFixed(\n getFixedValue(hotelData?.currency)\n )}\n \n \n
\n )}\n {availableRooms > 0 && !isHourlyRoom && !isRatePlans && (\n \n {availableRooms !== 0 && rmPriceReduced > 0 && (\n <>\n {rmPriceReduced > 0 && (\n \n \n {/* {(\n noDiscPrice -\n (!hotelData?.isTaxIncluded ? 0 : rmTax)\n ).toFixed(getFixedValue(hotelData?.currency))}{\" \"} */}\n {(\n (Number(noDiscPrice) || 0) -\n (!hotelData?.isTaxIncluded\n ? 0\n : Number(rmTax) || 0) /\n Math.max(dateCount, 1)\n ).toFixed(getFixedValue(hotelData?.currency))}\n {\" \"}\n \n {\" \"}\n {currencies(hotelData?.currency)}{\" \"}\n {rmPriceReduced.toFixed(\n getFixedValue(hotelData?.currency)\n )}{\" \"}\n {t(\"off\")}\n \n \n )}\n \n )}\n
\n {/* FAKE PRICE */}\n {promotions?.length < 1 && storageService.get(\"subscribed\") && (\n \n
\n )}\n \n \n {currencies(hotelData?.currency)}{\" \"}\n {rmPrice.toFixed(getFixedValue(hotelData?.currency))}{\" \"}\n \n
\n\n \n / {dateCount > 1 ? dateCount : null}{\" \"}\n {t(pluralWords(dateCount, \"night\"))}\n \n
\n {rmTax > 0 ? (\n\n + {currencies(hotelData?.currency)}{\" \"}\n {rmTax?.toFixed(getFixedValue(hotelData?.currency))}{\" \"}\n {t(\"taxes\")}\n
\n ) : (\n t(\"incl_of_taxes\")\n )}\n {searchData.length >= 1 && (\n\n {searchGuestCount}{\" \"}\n {t(pluralWords(searchGuestCount, \"guest\"))}{\" \"}\n {searchRoomCount}{\" \"}\n {t(\n pluralWords(searchRoomCount, isDorm ? \"bed\" : \"room\")\n )}\n
\n )}\n {isVRHotel ? (\n \n (This room can accommodate up to {maxGuestCount || 1}{\" \"}\n guests)\n \n ) : null}\n{t(\"view_room\")}
\n \n )}\n {availableRooms !== 0 && !isRatePlans && (\n <>\n {(!isHourlyRoom || selectedRooms?.length > 0) &&\n (testId === 0 ? (\n searchData.length > 0 &&\n !isHourlyRoom &&\n !selectedRooms?.some((rm) => rm?.id === room?.id) ? (\n\n {Array.from({ length: roomCount }).map((_, id) => {\n return (\n
\n \n )}\n \n {roomCount > 0 && addon.price !== \"0.00\" ? (\n addon?.Addon?.category === \"person\" ? (\n totalPeople > defaultGuestCount &&\n defaultGuestCount < maxGuestCount &&\n testId !== 0 && (\n
\n );\n })}\n \n }\n \n {!storageService.get(\"subscribed\") &&\n !sourceTest.includes(storageService.get(\"source\")) &&\n !window.location.href.includes(\"/rooms/\") &&\n showFakePrice &&\n availableRooms > 0 && (\n \n
\n )\n ) : addon?.Addon?.category === \"meal\" ? (\n \n \n {addon?.Addon?.name === \"Extra Adult\" ? (\n 
\n ) : (\n 
\n )}{\" \"}\n {t(\"add\")}{\" \"}\n {addon?.Addon?.displayName || addon?.Addon?.name}{\" \"}\n {\" \"}\n
\n \n ({currencies(hotelData?.currency)}{\" \"}\n {addon?.Addon?.name === \"Extra Adult\"\n ? adultAddons[extraAdult]?.price ||\n adultAddons[adultAddons?.length - 1]?.price\n : addon?.price}\n / {t(\"room\")} / {t(\"day\")}) ({t(\"incl_of_taxes\")})\n
\n\n rm?.id === room?.id)\n ?.length\n }\n />\n
\n ) : null\n ) : (\n <>\n )}\n \n \n 
{\" \"}\n {customAddonName}{\" \"}\n \n
\n \n ( {currencies(hotelData?.currency)} {addon?.price} /\n {t(\"person\")} / {t(\"day\")}) ({t(\"incl_of_taxes\")})\n
\n\n {\n fireGtmEvent(\"subscribe_popup_shown\", { position: \"room\" });\n showLoyal(true);\n }}\n style={{ fontSize: \"0.8rem\" }}\n >\n {t(\"unlock\")} 🔓\n \n
\n )}\n {viewImage && (\n {t(\"unlock_additional_discount\")}
\n