"use strict";
var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        if (typeof b !== "function" && b !== null)
            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
Object.defineProperty(exports, "__esModule", { value: true });
require("react-dropdown/style.css");
var React = require("react");
var react_dropdown_1 = require("react-dropdown");
var ProductCategoryDropdown_1 = require("./ProductCategoryDropdown");
var sortOptions = [
    { value: '1', label: 'A-Z' },
    { value: '2', label: 'Z-A' },
    { value: '3', label: 'Nejdražší' },
    { value: '4', label: 'Nejlevnější' }
];
var itemsOnPageOptions = [
    { value: '4', label: '4' },
    { value: '8', label: '8' },
    { value: '12', label: '12' },
    { value: '16', label: '16' }
];
var ProductListHeader = /** @class */ (function (_super) {
    __extends(ProductListHeader, _super);
    function ProductListHeader() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    ProductListHeader.prototype.render = function () {
        var _a = this.props, activeFilterExpression = _a.activeFilterExpression, activePageSizeExpression = _a.activePageSizeExpression, activeSortExpression = _a.activeSortExpression, categories = _a.categories, onFilterExpressionChange = _a.onFilterExpressionChange, onPageSizeExpressionChange = _a.onPageSizeExpressionChange, onSortExpressionChange = _a.onSortExpressionChange, productItemsAmount = _a.productItemsAmount, selectedCategories = _a.selectedCategories;
        return (React.createElement(React.Fragment, null,
            React.createElement("div", { className: "row" },
                React.createElement("div", { className: "col-lg-12" },
                    React.createElement("div", { className: "section-title" },
                        React.createElement("h2", null, "Produkty")),
                    React.createElement("div", { className: "productCategory__menu" },
                        React.createElement("ul", null,
                            React.createElement("li", { className: activeFilterExpression === '0' ? 'active' : '', key: 'categoryListItem-0', onClick: function () { return onFilterExpressionChange(0); } }, "V\u0161echny"),
                            React.createElement(ProductCategoryDropdown_1.default, { activeFilterExpression: activeFilterExpression, categories: categories, level: 0, onFilterExpressionChange: onFilterExpressionChange, parentId: -1 }))),
                    selectedCategories.length > 0
                        ? React.createElement("div", null,
                            React.createElement("span", null, "Zvolen\u00E1 kategorie:"),
                            selectedCategories !== undefined && selectedCategories.length > 0
                                ? selectedCategories.map(function (category, i) {
                                    return (React.createElement("span", { key: "selectedCategory-".concat(category.id) },
                                        React.createElement("button", { className: "btn btn-link", onClick: function () { return onFilterExpressionChange(category.id); }, disabled: category.id.toString() === activeFilterExpression }, category.name),
                                        i + 1 !== selectedCategories.length
                                            ? React.createElement("i", { className: "fas fa-chevron-right" })
                                            : null));
                                })
                                : null)
                        : null)),
            React.createElement("div", { className: "filter__item" },
                React.createElement("div", { className: "filter__sort" },
                    React.createElement("div", { className: "row" },
                        React.createElement("div", { className: 'col-auto pr-0' },
                            React.createElement("span", null, "\u0158adit podle:")),
                        React.createElement("div", { className: 'col-auto pl-0' },
                            React.createElement(react_dropdown_1.default, { className: 'my-dropdown-root', controlClassName: 'my-dropdown-control', placeholderClassName: 'my-dropdown-placeholder', menuClassName: 'my-dropdown-menu', options: sortOptions, onChange: onSortExpressionChange, value: activeSortExpression })))),
                React.createElement("div", { className: "filter__found" }, productItemsAmount !== undefined && productItemsAmount > 0
                    ? React.createElement("h6", null,
                        React.createElement("span", null, productItemsAmount),
                        " Produkt\u016F nalezeno")
                    : React.createElement("h6", null,
                        React.createElement("span", null, "\u017D\u00E1dn\u00E9 produkty nenalezeny"))),
                React.createElement("div", { className: 'filter__count' },
                    React.createElement("div", { className: 'row' },
                        React.createElement("div", { className: 'col-auto pr-0' },
                            React.createElement("span", null, "Zobrazit kus\u016F:")),
                        React.createElement("div", { className: 'col-auto pl-0', style: { paddingRight: '0px' } },
                            React.createElement(react_dropdown_1.default, { className: 'my-dropdown-root', controlClassName: 'my-dropdown-control', placeholderClassName: 'my-dropdown-placeholder', menuClassName: 'my-dropdown-menu', options: itemsOnPageOptions, onChange: onPageSizeExpressionChange, value: activePageSizeExpression })))))));
    };
    return ProductListHeader;
}(React.Component));
exports.default = ProductListHeader;
//# sourceMappingURL=productListHeader.js.map