"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    var desc = Object.getOwnPropertyDescriptor(m, k);
    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
      desc = { enumerable: true, get: function() { return m[k]; } };
    }
    Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
    Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
    o["default"] = v;
});
var __importStar = (this && this.__importStar) || (function () {
    var ownKeys = function(o) {
        ownKeys = Object.getOwnPropertyNames || function (o) {
            var ar = [];
            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
            return ar;
        };
        return ownKeys(o);
    };
    return function (mod) {
        if (mod && mod.__esModule) return mod;
        var result = {};
        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
        __setModuleDefault(result, mod);
        return result;
    };
})();
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = RoomListCrossSellBlock;
const contexts_1 = require("../../../contexts/index.js");
const react_1 = __importStar(require("react"));
const react_i18next_1 = require("react-i18next");
const Translation_1 = require("translations/Translation");
const BaseAPI_1 = require("../../../api/BaseAPI");
const BookingAPI_1 = __importDefault(require("../../../api/BookingAPI"));
const Currency_1 = __importDefault(require("../../generic/Currency"));
const Headline_1 = __importDefault(require("../../generic/Headline"));
const Icon_1 = __importStar(require("../../generic/Icon/Icon"));
const SmallSpinner_1 = __importDefault(require("../../generic/loader/SmallSpinner"));
const Text_1 = __importStar(require("../../generic/Text"));
const useSignedInMember_1 = require("../../../hooks/useSignedInMember");
const ImageProvider_1 = __importStar(require("../../../providers/ImageProvider"));
const Color_1 = require("../../../util/Color");
const ScreenSize_1 = __importDefault(require("../../../util/ScreenSize"));
function RoomListCrossSellBlock(props) {
    const { t } = (0, react_i18next_1.useTranslation)();
    const context = (0, react_1.useContext)(contexts_1.BookingEngineContext);
    const basketContext = (0, react_1.useContext)(contexts_1.BasketContext);
    const [isAvailable, setIsAvailable] = (0, react_1.useState)(false); // True if the dates were found with a calendar search
    const [isReallyAvailable, setIsReallyAvailable] = (0, react_1.useState)(true); // True if the dates were found with an availability search
    const [isLoading, setIsLoading] = (0, react_1.useState)(true);
    const [imageUrl, setImageUrl] = (0, react_1.useState)('');
    const [name, setName] = (0, react_1.useState)('');
    const [description, setDescription] = (0, react_1.useState)('');
    const [link, setLink] = (0, react_1.useState)('');
    const [rooms, setRooms] = (0, react_1.useState)([]);
    const { memberNumber } = (0, useSignedInMember_1.useSignedInMember)();
    (0, react_1.useEffect)(() => {
        const row = basketContext.selectedBasketRow;
        if (!row) {
            return;
        }
        BookingAPI_1.default.Availability.getCheapestPricePerDay(row.getStartDate(), row.getEndDate(), row.getAdults(), row.getChildren(), row.getInfants(), row.getPromoCode(), row.getRoomCode(), '', props.hotelId, memberNumber, true)
            .catch()
            .then((dayPrices) => {
            if (dayPrices) {
                let allFound = true;
                for (let date = row.getStartDate(); date.isBefore(row.getEndDate(), 'day'); date = date.add(1, 'day')) {
                    if (!dayPrices[date.format(BaseAPI_1.API_DATE_FORMAT)]) {
                        allFound = false;
                        break;
                    }
                }
                setIsAvailable(allFound);
                setIsReallyAvailable(true);
                if (allFound) {
                    setIsLoading(true);
                    const crossSellHotelInfo = BookingAPI_1.default.Availability.getCrossSellHotelInfo(props.hotelId);
                    setName(crossSellHotelInfo.name);
                    setImageUrl(crossSellHotelInfo.image || '');
                    setDescription(crossSellHotelInfo.description);
                    const params = ['arrive=' + row.getStartDate().format('YYYY-M-D'), 'depart=' + row.getEndDate().format('YYYY-M-D')];
                    if (row.getAdults() > 1) {
                        params.push('adults=' + row.getAdults());
                    }
                    if (row.getChildren() > 0) {
                        params.push('children=' + row.getChildren());
                    }
                    if (row.getInfants() > 0) {
                        params.push('infants=' + row.getInfants());
                    }
                    if (row.getPromoCode()) {
                        params.push('promocode=' + row.getPromoCode());
                    }
                    setLink(crossSellHotelInfo.checkoutUrl + '#/step/room/?' + params.join('&'));
                    BookingAPI_1.default.Availability.fetchAvailabilityData(row, props.hotelId, memberNumber, true)
                        .catch((_) => [])
                        .then((hotelRooms) => {
                        hotelRooms = hotelRooms === null || hotelRooms === void 0 ? void 0 : hotelRooms.filter((room) => room.isAvailable());
                        if (hotelRooms === null || hotelRooms === void 0 ? void 0 : hotelRooms.length) {
                            setRooms(hotelRooms);
                            setIsLoading(false);
                        }
                        else {
                            setIsReallyAvailable(false);
                            setIsLoading(false);
                        }
                    });
                }
            }
        });
    }, [basketContext.selectedBasketRow]);
    return isAvailable ? (react_1.default.createElement("div", { className: "u-marg-top--heavy u-marg-bottom" },
        react_1.default.createElement("div", { className: "cross-sell-module" },
            react_1.default.createElement("div", { className: "cross-sell-module--image", style: { backgroundImage: `url('${ImageProvider_1.default.resizeImage(imageUrl, ImageProvider_1.ImageSize.Original)}')` } }),
            react_1.default.createElement("div", { className: "cross-sell-module--content u-pad--heavy u-pad@m-" },
                react_1.default.createElement("div", { className: "u-marg-bottom--heavy" },
                    react_1.default.createElement("div", { className: "cross-sell-module--content-title u-marg-bottom--light" },
                        react_1.default.createElement(Headline_1.default, { bold: true, size: isReallyAvailable ? 'large' : 'normal' }, isLoading
                            ? t(Translation_1.Translation.Step.Room.CrossSellBlock.AvailabilityNearBy1)
                            : isReallyAvailable
                                ? t(Translation_1.Translation.Step.Room.CrossSellBlock.AvailabilityNearBy2)
                                : t(Translation_1.Translation.Step.Room.CrossSellBlock.DateUnavailable))),
                    isReallyAvailable && (react_1.default.createElement("div", { className: "cross-sell-module--content-description u-marg-bottom--light" },
                        react_1.default.createElement(Text_1.default, { color: Color_1.Color.DarkGrey, type: Text_1.TextType.Body },
                            react_1.default.createElement("strong", { style: { color: Color_1.Color.Accent } }, name),
                            react_1.default.createElement("div", { dangerouslySetInnerHTML: { __html: description } }))))),
                isLoading ? (react_1.default.createElement(SmallSpinner_1.default, null)) : (react_1.default.createElement(react_1.default.Fragment, null, rooms.slice(0, 4).map((room, index) => {
                    const roomLink = link + '&room=' + room.code;
                    let classNames = 'u-flex align-items-end';
                    if (index < rooms.length - 1) {
                        classNames += ' u-pad-bottom u-border-bottom u-marg-bottom';
                    }
                    return (react_1.default.createElement("a", { key: room.code, className: classNames, href: roomLink, target: "_blank", rel: "noreferrer" },
                        react_1.default.createElement("div", { className: "u-flex flex-column align-items-start justify-content-start" },
                            react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Body, color: Color_1.Color.Accent, bold: true }, room.name),
                            react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.DarkGrey }, t(Translation_1.Translation.Step.Room.Sleeps, {
                                maxOccupancy: room.occupancy,
                            }))),
                        react_1.default.createElement("div", { className: "u-flex flex-column align-items-end align-items-md-end" },
                            react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.DarkGrey, inline: true }, t(Translation_1.Translation.Misc.From)),
                            react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Body, color: Color_1.Color.Accent, bold: true },
                                react_1.default.createElement(Currency_1.default, null, room.getLowestPrice(true))))));
                }))),
                isReallyAvailable && (react_1.default.createElement("div", { className: "u-marg-top--light u-flex justify-content-start u-w-100@m- u-marg-top--heavy" },
                    react_1.default.createElement("a", { className: 'link-button --primary --filled --success --icon-right --normal' + (context.screenSize <= ScreenSize_1.default.Medium ? ' --wide' : ''), tabIndex: 0, type: "button", href: link, target: "_blank", rel: "noreferrer" },
                        react_1.default.createElement("span", null,
                            "See all ",
                            rooms.length,
                            " rooms",
                            react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.ArrowRight, size: "1em" }))))))))) : null;
}
//# sourceMappingURL=RoomListCrossSellBlock.js.map