"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.SpecialColumnSettingsWizardStep = void 0;
const tslib_1 = require("tslib");
const chunk_1 = tslib_1.__importDefault(require("lodash/chunk"));
const React = tslib_1.__importStar(require("react"));
const rebass_1 = require("rebass");
const CheckBox_1 = require("../components/CheckBox");
const FormLayout_1 = tslib_1.__importStar(require("../components/FormLayout"));
const Tabs_1 = require("../components/Tabs");
const ModuleConstants_1 = require("../Utilities/Constants/ModuleConstants");
const AdaptableContext_1 = require("./AdaptableContext");
const SpecialColumnSettingsWizardStep = (props) => {
    var _a, _b, _c;
    const adaptable = (0, AdaptableContext_1.useAdaptable)();
    const possibleColumnTypes = (_a = adaptable.api.columnApi.getColumnTypes()) !== null && _a !== void 0 ? _a : [];
    const { Filterable, Resizable, Groupable, Sortable, Pivotable, Aggregatable, SuppressMenu, SuppressMovable, } = (_b = props.settings) !== null && _b !== void 0 ? _b : {};
    const handleColumnTypeChange = (columnType, checked) => {
        var _a, _b, _c;
        const columnTypes = (_b = (_a = props.settings) === null || _a === void 0 ? void 0 : _a.ColumnTypes) !== null && _b !== void 0 ? _b : [];
        if (checked) {
            props.onChange(Object.assign(Object.assign({}, props.settings), { ColumnTypes: [...columnTypes, columnType] }));
        }
        else {
            props.onChange(Object.assign(Object.assign({}, props.settings), { ColumnTypes: (_c = columnTypes === null || columnTypes === void 0 ? void 0 : columnTypes.filter) === null || _c === void 0 ? void 0 : _c.call(columnTypes, (item) => item !== columnType) }));
        }
    };
    const onSettingsChange = (values) => {
        props.onChange(Object.assign(Object.assign({}, props.settings), values));
    };
    return (React.createElement(React.Fragment, null,
        React.createElement(Tabs_1.Tabs, { marginTop: 2, autoFocus: false },
            React.createElement(Tabs_1.Tabs.Tab, null, "Column Properties"),
            React.createElement(Tabs_1.Tabs.Content, null,
                React.createElement(rebass_1.Flex, { flexDirection: "column" },
                    React.createElement(FormLayout_1.default, { style: { width: '100%' }, columns: [
                            { name: 'first', size: '30%' },
                            { size: '30%', name: 'second' },
                            { size: '30%', name: 'third' },
                        ] },
                        React.createElement(FormLayout_1.FormRow, null,
                            React.createElement(CheckBox_1.CheckBox, { "data-name": "filterable", checked: Filterable, onChange: (Filterable) => onSettingsChange({ Filterable }), disabled: !adaptable.api.optionsApi.getColumnFilterOptions()
                                    .enableFilterOnSpecialColumns ||
                                    adaptable.api.entitlementApi.getEntitlementAccessLevelForModule(ModuleConstants_1.ColumnFilterModuleId) == 'Hidden' }, "Filterable"),
                            React.createElement(CheckBox_1.CheckBox, { "data-name": "resizable", checked: Resizable, onChange: (Resizable) => onSettingsChange({ Resizable }) }, "Resizable"),
                            React.createElement(CheckBox_1.CheckBox, { "data-name": "groupable", checked: Groupable, onChange: (Groupable) => onSettingsChange({ Groupable }) }, "Groupable")),
                        React.createElement(FormLayout_1.FormRow, null,
                            React.createElement(CheckBox_1.CheckBox, { "data-name": "sortable", checked: Sortable, onChange: (Sortable) => onSettingsChange({ Sortable }) }, "Sortable"),
                            React.createElement(CheckBox_1.CheckBox, { "data-name": "pivotable", checked: Pivotable, onChange: (Pivotable) => onSettingsChange({ Pivotable }) }, "Pivotable"),
                            React.createElement(CheckBox_1.CheckBox, { "data-name": "aggregatable", checked: Aggregatable, onChange: (Aggregatable) => onSettingsChange({ Aggregatable }) }, "Aggregatable")),
                        React.createElement(FormLayout_1.FormRow, null,
                            React.createElement(CheckBox_1.CheckBox, { "data-name": "suppres-smenu", checked: SuppressMenu, onChange: (SuppressMenu) => onSettingsChange({ SuppressMenu }) }, "Suppress Menu"),
                            React.createElement(CheckBox_1.CheckBox, { "data-name": "suppres-movable", checked: SuppressMovable, onChange: (SuppressMovable) => onSettingsChange({ SuppressMovable }) }, "Suppress Movable"),
                            React.createElement(CheckBox_1.CheckBox, { disabled: true, checked: props.isEditable }, "Editable")))))),
        Boolean(possibleColumnTypes === null || possibleColumnTypes === void 0 ? void 0 : possibleColumnTypes.length) && (React.createElement(Tabs_1.Tabs, { marginTop: 2, autoFocus: false },
            React.createElement(Tabs_1.Tabs.Tab, null, "Column Types"),
            React.createElement(Tabs_1.Tabs.Content, null,
                React.createElement(FormLayout_1.default, { columns: [{ name: 'first', size: '30%' }, { name: 'second' }] }, (_c = (0, chunk_1.default)(possibleColumnTypes !== null && possibleColumnTypes !== void 0 ? possibleColumnTypes : [], 2)) === null || _c === void 0 ? void 0 : _c.map(([first, second]) => {
                    var _a, _b, _c, _d, _e, _f;
                    return (React.createElement(FormLayout_1.FormRow, { key: first },
                        first && (React.createElement(CheckBox_1.CheckBox, { "data-name": first, onChange: (checked) => handleColumnTypeChange(first, checked), checked: (_c = (_b = (_a = props.settings) === null || _a === void 0 ? void 0 : _a.ColumnTypes) === null || _b === void 0 ? void 0 : _b.includes) === null || _c === void 0 ? void 0 : _c.call(_b, first) }, first)),
                        second && (React.createElement(CheckBox_1.CheckBox, { "data-name": second, onChange: (checked) => handleColumnTypeChange(second, checked), checked: (_f = (_e = (_d = props.settings) === null || _d === void 0 ? void 0 : _d.ColumnTypes) === null || _e === void 0 ? void 0 : _e.includes) === null || _f === void 0 ? void 0 : _f.call(_e, second) }, second))));
                })))))));
};
exports.SpecialColumnSettingsWizardStep = SpecialColumnSettingsWizardStep;
