"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.FilterViewPanelControl = void 0;
const tslib_1 = require("tslib");
const SystemRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/SystemRedux"));
const React = tslib_1.__importStar(require("react"));
const ActiveFiltersPanel_1 = require("./ActiveFiltersPanel");
const rebass_1 = require("rebass");
const ArrayExtensions_1 = require("../../Utilities/Extensions/ArrayExtensions");
const AdaptablePopover_1 = require("../AdaptablePopover");
const ButtonClear_1 = require("../Components/Buttons/ButtonClear");
const CheckBox_1 = require("../../components/CheckBox");
const react_redux_1 = require("react-redux");
const LayoutRedux_1 = require("../../Redux/ActionsReducers/LayoutRedux");
const SimpleButton_1 = tslib_1.__importDefault(require("../../components/SimpleButton"));
const join_1 = tslib_1.__importDefault(require("../../components/utils/join"));
class FilterViewPanelComponent extends React.Component {
    constructor(props) {
        super(props);
    }
    render() {
        var _a, _b;
        const elementType = this.props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
        const showClearButton = (_a = this.props.api.optionsApi.getColumnFilterOptions()) === null || _a === void 0 ? void 0 : _a.showClearFilterButton;
        const showSuspendFilterButton = (_b = this.props.api.optionsApi.getColumnFilterOptions()) === null || _b === void 0 ? void 0 : _b.showSuspendFilterButton;
        const isAtLeastOneFilterActive = this.props.api.columnFilterApi.getActiveColumnFilters().length > 0;
        const isAtLeastOneFilter = this.props.api.columnFilterApi.getColumnFilters().length > 0;
        const handleSuspendUnsuspendAll = () => {
            if (isAtLeastOneFilterActive) {
                this.props.api.columnFilterApi.suspendAllColumnFilters();
            }
            else {
                this.props.api.columnFilterApi.unSuspendAllColumnFilters();
            }
        };
        return (React.createElement(rebass_1.Flex, { flexDirection: "row", className: `ab-${elementType}__Filter__wrap`, flexWrap: this.props.viewType === 'ToolPanel' ? 'wrap' : 'nowrap' },
            React.createElement(rebass_1.Flex, null,
                ArrayExtensions_1.ArrayExtensions.IsNotNullOrEmpty(this.props.ColumnFilters) && (React.createElement(AdaptablePopover_1.AdaptablePopover, { popupPadding: 0, className: `ab-${elementType}__Filter__info`, headerText: "", bodyText: [React.createElement(ActiveFiltersPanel_1.ActiveFiltersPanel, null)], useButton: true, showEvent: 'focus', hideEvent: "blur", popoverMinWidth: 400 })),
                showClearButton && (React.createElement(ButtonClear_1.ButtonClear, { className: `ab-${elementType}__Filter__clear`, marginLeft: 1, marginBottom: 0, marginRight: 1, onClick: () => this.onClearFilters(), tooltip: "Clear Filters", disabled: this.props.ColumnFilters.length == 0, showText: this.props.viewType === 'ToolPanel' }, this.props.viewType === 'ToolPanel' && 'Clear')),
                showSuspendFilterButton && (React.createElement(SimpleButton_1.default, { className: (0, join_1.default)(`ab-${elementType}__Filter__suspend-button`, isAtLeastOneFilterActive && `ab-${elementType}__Filter__suspend-all`, !isAtLeastOneFilterActive && `ab-${elementType}__Filter__un-suspend-all`), disabled: !isAtLeastOneFilter, onClick: handleSuspendUnsuspendAll, tone: isAtLeastOneFilterActive ? 'neutral' : 'success', variant: "text", icon: isAtLeastOneFilterActive ? 'pause' : 'play', accessLevel: this.props.accessLevel }))),
            React.createElement(rebass_1.Flex, { alignItems: "center" }, this.props.api.columnFilterApi.isQuickFilterAvailable() && (React.createElement(CheckBox_1.CheckBox, { className: `ab-${elementType}__Filter__active-check`, disabled: this.props.accessLevel === 'ReadOnly' ||
                    this.props.api.internalApi.isGridInPivotMode(), marginTop: 0, marginBottom: 0, fontSize: 2, padding: 1, checked: this.props.IsQuickFilterVisible, onChange: (checked) => {
                    checked ? this.props.onShowQuickFilterBar() : this.props.onHideQuickFilterBar();
                } }, "Filter Bar")))));
    }
    onClearFilters() {
        this.props.api.columnFilterApi.clearColumnFilters();
    }
    onClearColumnFilter(columnFilter) {
        this.props.api.columnFilterApi.clearColumnFilterForColumn(columnFilter.ColumnId);
    }
}
function mapStateToProps(state) {
    return {
        ColumnFilters: (0, LayoutRedux_1.getColumnFilterSelector)(state),
        IsQuickFilterVisible: state.System.IsQuickFilterVisible,
    };
}
function mapDispatchToProps(dispatch) {
    return {
        onHideQuickFilterBar: () => dispatch(SystemRedux.SystemQuickFilterBarHide()),
        onShowQuickFilterBar: () => dispatch(SystemRedux.SystemQuickFilterBarShow()),
    };
}
exports.FilterViewPanelControl = (0, react_redux_1.connect)(mapStateToProps, mapDispatchToProps)(FilterViewPanelComponent);
