"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.NamedQuerySelector = exports.AvailableSearchLabel = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const rebass_1 = require("rebass");
const icons_1 = require("../../components/icons");
const Panel_1 = tslib_1.__importDefault(require("../../components/Panel"));
const SimpleButton_1 = tslib_1.__importDefault(require("../../components/SimpleButton"));
const Tag_1 = require("../../components/Tag");
const Enums_1 = require("../../AdaptableState/Common/Enums");
const ArrayExtensions_1 = tslib_1.__importDefault(require("../../Utilities/Extensions/ArrayExtensions"));
const AdaptablePopover_1 = require("../AdaptablePopover");
const ButtonOpen_1 = require("../Components/Buttons/ButtonOpen");
const AvailableSearchLabel = (props) => {
    return (React.createElement(rebass_1.Flex, { flexDirection: "column", textAlign: "start", width: "100%", justifyContent: "space-around" },
        React.createElement(rebass_1.Box, { mb: 2, flex: 1 }, props.label),
        React.createElement(Tag_1.Tag, null, props.expression)));
};
exports.AvailableSearchLabel = AvailableSearchLabel;
const NamedQuerySelector = (props) => {
    const sortedNamedQueries = ArrayExtensions_1.default.sortArrayWithProperty(Enums_1.SortOrder.Asc, props.namedQueries, 'Name') ?? [];
    const availableSearches = sortedNamedQueries.map((expression) => {
        return {
            label: (React.createElement(exports.AvailableSearchLabel, { label: expression.Name, expression: expression.BooleanExpression })),
            icon: expression.BooleanExpression === props.currentQuery ? React.createElement(icons_1.Icon, { name: 'check' }) : null,
            onClick: () => props.onSelect(expression.BooleanExpression),
        };
    });
    const cachedQueries = ArrayExtensions_1.default.IsNotNullOrEmpty(props.cachedQueries)
        ? props.cachedQueries
            .slice(-3)
            .reverse()
            .map((item) => ({
            label: (React.createElement(exports.AvailableSearchLabel, { label: `Grid Filter at ${item.time.toLocaleTimeString('en-US')}`, expression: item.expression })),
            icon: React.createElement(icons_1.Icon, { name: 'history' }),
            onClick: () => props.setGridFilterExpression(item.expression),
        }))
        : null;
    return ArrayExtensions_1.default.IsNotNullOrEmpty(cachedQueries) ||
        ArrayExtensions_1.default.IsNotNullOrEmpty(availableSearches) ? (React.createElement(AdaptablePopover_1.AdaptablePopover, { tooltipText: "Load Named Query", showIcon: false, popoverMinWidth: 300, bodyText: [
            React.createElement(rebass_1.Flex, { justifyContent: "stretch", flexDirection: "column" },
                React.createElement(Panel_1.default, { header: "Named Queries" },
                    React.createElement(rebass_1.Flex, { flexDirection: "column" }, availableSearches.map((item, index) => {
                        return (React.createElement(SimpleButton_1.default, { mb: 2, variant: "text", key: index, onClick: item.onClick }, item.label));
                    }))),
                cachedQueries ? (React.createElement(React.Fragment, null,
                    React.createElement(Panel_1.default, { mt: 2, header: "Recent Grid Filters" },
                        React.createElement(rebass_1.Flex, { flexDirection: "column" }, cachedQueries.map((cachedQuery, index) => {
                            return (React.createElement(SimpleButton_1.default, { disabled: props.disabled, mb: 2, variant: "text", key: index, onClick: cachedQuery.onClick }, cachedQuery.label));
                        }))))) : null),
        ] },
        React.createElement(SimpleButton_1.default, { disabled: props.disabled, variant: "text", icon: "folder-open" }, props.children))) : (React.createElement(ButtonOpen_1.ButtonOpen, { tooltip: "Load Named Query", disabled: true }));
};
exports.NamedQuerySelector = NamedQuerySelector;
