var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
var __read = (this && this.__read) || function (o, n) {
    var m = typeof Symbol === "function" && o[Symbol.iterator];
    if (!m) return o;
    var i = m.call(o), r, ar = [], e;
    try {
        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
    }
    catch (error) { e = { error: error }; }
    finally {
        try {
            if (r && !r.done && (m = i["return"])) m.call(i);
        }
        finally { if (e) throw e.error; }
    }
    return ar;
};
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { useState } from 'react';
import CheckBox from 'src/components/CheckBox2/CheckBox';
import Button from 'src/components/Button';
import { useAppSelector } from 'src/app/redux/store';
import css from '../FilterBar.module.scss';
import { _cx } from 'src/utility/class';
import Modal from 'src/components/Modal/ModalModule';
var cx = _cx(css);
var Services = function (_a) {
    var _b;
    var filters = _a.filters, t = _a.t, onFilterApply = _a.onFilterApply, closeModal = _a.closeModal;
    var _c = useAppSelector(function (state) { return state.config.config; }), modalsData = _c.modalsData, servicesOfferedFilterData = _c.servicesOfferedFilterData, selectOtherPatientFinancing = _c.selectOtherPatientFinancing;
    var isOrthoDoc = filters.isOrthoDoc, patientType = filters.patientType, fehours = filters.fehours, fservice = filters.fservice;
    var _d = __read(useState(patientType || 'adult'), 2), age = _d[0], setAge = _d[1];
    var _e = __read(useState(isOrthoDoc || false), 2), orthoDoc = _e[0], setOrthoDoc = _e[1];
    var _f = __read(useState(false), 2), showModal = _f[0], setShowModal = _f[1];
    var _g = __read(useState(), 2), modalData = _g[0], setModalData = _g[1];
    var updateModalInfo = function (modal_id) {
        var modaldata = modalsData.find(function (item) { return item.id === modal_id; });
        setModalData(modaldata);
    };
    var getServicesOfferedValues = function () {
        var data = servicesOfferedFilterData === null || servicesOfferedFilterData === void 0 ? void 0 : servicesOfferedFilterData.map(function (item) {
            if (servicesOfferedState[item.key]) {
                return item.value;
            }
        });
        return data;
    };
    var services_keys = servicesOfferedFilterData === null || servicesOfferedFilterData === void 0 ? void 0 : servicesOfferedFilterData.flatMap(function (item) {
        return fservice === null || fservice === void 0 ? void 0 : fservice.map(function (item2) {
            if (item.value === item2 || item.key === item2) {
                return item.key;
            }
        }).filter(Boolean);
    });
    var _h = __read(useState({
        patient_financing: (services_keys === null || services_keys === void 0 ? void 0 : services_keys.includes('patient_financing')) || false,
        financing_no_down_payment: (services_keys === null || services_keys === void 0 ? void 0 : services_keys.includes('financing_no_down_payment')) || false,
        complimentary_consultation: (services_keys === null || services_keys === void 0 ? void 0 : services_keys.includes('complimentary_consultation')) || false,
        hfd_financing: (services_keys === null || services_keys === void 0 ? void 0 : services_keys.includes('hfd_financing')) || false,
        invisalign_pay: (services_keys === null || services_keys === void 0 ? void 0 : services_keys.includes('invisalign_pay')) || false,
        ols: (services_keys === null || services_keys === void 0 ? void 0 : services_keys.includes('ols')) || false,
        extended_hours: (fehours === null || fehours === void 0 ? void 0 : fehours.toString()) === 'true' || fehours === 'true' ? true : false,
    }), 2), servicesOfferedState = _h[0], setServicesOfferedState = _h[1];
    var applyFilter = function () {
        onFilterApply('isOrthoDoc', orthoDoc, [
            {
                key: 'fservice',
                value: getServicesOfferedValues(),
            },
            { key: 'fehours', value: servicesOfferedState.extended_hours ? true : false },
        ]);
        closeModal();
    };
    var clearFilters = function () {
        var offObject = {
            patient_financing: false,
            financing_no_down_payment: false,
            complimentary_consultation: false,
            hfd_financing: false,
            invisalign_pay: false,
            ols: false,
            extended_hours: false,
        };
        setServicesOfferedState(offObject);
        onFilterApply('isOrthoDoc', orthoDoc, [
            {
                key: 'fservice',
                value: [],
            },
            { key: 'fehours', value: false },
        ]);
        closeModal();
    };
    return (_jsxs("div", { children: [_jsxs("div", { className: cx('form-group filter-specialty'), children: [_jsx("label", { className: "filter-title", children: t.result_service_offered }), _jsxs("div", { className: cx('checkbox-wrap'), children: [(servicesOfferedFilterData === null || servicesOfferedFilterData === void 0 ? void 0 : servicesOfferedFilterData.map(function (element) { return element.key; }).includes('ols')) && (_jsx(CheckBox, { checked: servicesOfferedState.ols, onChange: function () {
                                    setServicesOfferedState(function (pre) {
                                        return __assign(__assign({}, pre), { ols: servicesOfferedState.ols ? false : true });
                                    });
                                }, label: t.online_scheduling, name: "ols", width: "100%" })), (servicesOfferedFilterData === null || servicesOfferedFilterData === void 0 ? void 0 : servicesOfferedFilterData.map(function (element) { return element.key; }).includes('patient_financing')) && (_jsx(CheckBox, { checked: servicesOfferedState.patient_financing, onChange: function () {
                                    setServicesOfferedState(function (pre) {
                                        return __assign(__assign(__assign({}, pre), { patient_financing: servicesOfferedState.patient_financing ? false : true }), (selectOtherPatientFinancing
                                            ? {
                                                financing_no_down_payment: servicesOfferedState.patient_financing
                                                    ? false
                                                    : true,
                                                hfd_financing: servicesOfferedState.patient_financing ? false : true,
                                            }
                                            : {}));
                                    });
                                }, label: t.patient_financing, name: "finance", width: "100%" })), (servicesOfferedFilterData === null || servicesOfferedFilterData === void 0 ? void 0 : servicesOfferedFilterData.map(function (element) { return element.key; }).includes('financing_no_down_payment')) && (_jsx(CheckBox, { checked: servicesOfferedState.financing_no_down_payment, onChange: function () {
                                    setServicesOfferedState(function (pre) {
                                        return __assign(__assign({}, pre), { financing_no_down_payment: servicesOfferedState.financing_no_down_payment
                                                ? false
                                                : true });
                                    });
                                }, label: t.financing_no_down_payment, name: "no_down_payment", width: "100%" })), (servicesOfferedFilterData === null || servicesOfferedFilterData === void 0 ? void 0 : servicesOfferedFilterData.map(function (element) { return element.key; }).includes('complimentary_consultation')) && (_jsx(CheckBox, { checked: servicesOfferedState.complimentary_consultation, onChange: function () {
                                    setServicesOfferedState(function (pre) {
                                        return __assign(__assign({}, pre), { complimentary_consultation: servicesOfferedState.complimentary_consultation
                                                ? false
                                                : true });
                                    });
                                }, label: t.complimentary_consultation, name: "complimentary_consultation", width: "100%" })), (servicesOfferedFilterData === null || servicesOfferedFilterData === void 0 ? void 0 : servicesOfferedFilterData.map(function (element) { return element.key; }).includes('hfd_financing')) && (_jsx(CheckBox, { checked: servicesOfferedState.hfd_financing, onChange: function () {
                                    setServicesOfferedState(function (pre) {
                                        return __assign(__assign({}, pre), { hfd_financing: servicesOfferedState.hfd_financing ? false : true });
                                    });
                                }, label: t.hfd_financing, name: "hfd", width: "100%", showInfoIcon: true, infoClickHandler: function () {
                                    updateModalInfo('hfd_financing');
                                    setShowModal(true);
                                } })), (servicesOfferedFilterData === null || servicesOfferedFilterData === void 0 ? void 0 : servicesOfferedFilterData.map(function (element) { return element.key; }).includes('invisalign_pay')) && (_jsx(CheckBox, { checked: servicesOfferedState.invisalign_pay, onChange: function () {
                                    setServicesOfferedState(function (pre) {
                                        return __assign(__assign({}, pre), { invisalign_pay: servicesOfferedState.invisalign_pay ? false : true });
                                    });
                                }, label: t.invisalign_pay, name: "invisalign_pay", width: "100%", infoClickHandler: function () {
                                    updateModalInfo('invisalign_pay');
                                    setShowModal(true);
                                } })), _jsx(CheckBox, { checked: servicesOfferedState.extended_hours, onChange: function () {
                                    setServicesOfferedState(function (pre) {
                                        return __assign(__assign({}, pre), { extended_hours: servicesOfferedState.extended_hours ? false : true });
                                    });
                                }, label: t.extended_hours, name: "extended_hours", width: "100%" })] })] }), _jsxs("div", { className: cx('form-group filter-specialty'), children: [_jsx("hr", {}), _jsxs("div", { className: "flex-space-between", children: [_jsx(Button, { type: "submit", styleType: "cancel", onClick: clearFilters, children: t.result_clear_filter }), _jsx(Button, { type: "submit", styleType: "normal", onClick: applyFilter, children: t.result_filter_button_apply })] })] }), showModal && modalData && (_jsx(Modal, { setShowModal: function () { return setShowModal(false); }, size: "sm", subTitle: modalData === null || modalData === void 0 ? void 0 : modalData.title, description: modalData === null || modalData === void 0 ? void 0 : modalData.description, closeButton: true, children: _jsxs(_Fragment, { children: [modalData.image ? (_jsx("img", { width: '264px', style: { margin: '0px auto 24px auto' }, src: modalData.image, alt: "" })) : (_jsx(_Fragment, {})), (modalData === null || modalData === void 0 ? void 0 : modalData.footnote) && (_jsx("p", { className: cx('modal_footnote'), dangerouslySetInnerHTML: {
                                __html: (_b = modalData === null || modalData === void 0 ? void 0 : modalData.footnote) === null || _b === void 0 ? void 0 : _b.replace('®', '<sup>®</sup>'),
                            } }))] }) }))] }));
};
export default Services;
