"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.CustomSortColumnWizardSection = exports.isValidCustomSortColumn = exports.renderCustomSortColumn = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const Tabs_1 = require("../../../components/Tabs");
const Tag_1 = require("../../../components/Tag");
const ColumnSelector_1 = require("../../Components/ColumnSelector");
const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
const Flex_1 = require("../../../components/Flex");
const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
const Input_1 = tslib_1.__importDefault(require("../../../components/Input"));
const renderCustomSortColumn = (data) => {
    const { api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
    return (React.createElement(Flex_1.Box, { className: "twa:text-2 twa:py-2 twa:pr-2" },
        React.createElement(Tag_1.Tag, { className: "twa:mr-2" },
            "Name: ",
            data.Name),
        React.createElement(Tag_1.Tag, null,
            "Column: ",
            api.columnApi.getFriendlyNameForColumnId(data.ColumnId))));
};
exports.renderCustomSortColumn = renderCustomSortColumn;
const isValidCustomSortColumn = (data, allCustomSorts) => {
    if (!data.Name) {
        return 'A name is required.';
    }
    if (allCustomSorts.some((customSort) => customSort.Name === data.Name && customSort.Uuid !== data.Uuid)) {
        return 'A Custom Sort with this name already exists.';
    }
    if (!data.ColumnId) {
        return 'Please select a column for the Custom Sort.';
    }
    return true;
};
exports.isValidCustomSortColumn = isValidCustomSortColumn;
const CustomSortColumnWizardSection = (props) => {
    const { data, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
    const sortableCols = React.useMemo(() => {
        const sortableColumns = api.columnApi.getSortableColumns();
        const nonComparerSortableColumns = sortableColumns.filter((c) => {
            return api.customSortApi.internalApi.columnHasCustomSortComparer(c.columnId);
        });
        const customSorts = api.customSortApi.getCustomSorts();
        const columnSortComparers = api.optionsApi.getCustomSortOptions().customSortComparers || [];
        const usedColumnIds = [
            ...customSorts.map((customSort) => customSort.ColumnId),
            ...columnSortComparers.map((comparer) => api.columnScopeApi.getColumnIdsInScope(comparer.scope)),
        ];
        // filter out used colum ids, but include the current one
        return sortableColumns.filter((column) => {
            if (api.customSortApi.internalApi.columnHasCustomSortComparer(column.columnId)) {
                return false;
            }
            if (!props.isNew && column.columnId === data?.ColumnId) {
                return true;
            }
            return usedColumnIds.every((usedColumnId) => {
                return column.columnId !== usedColumnId;
            });
        });
    }, []);
    const onNameChange = (event) => {
        props.onChange({
            ...data,
            Name: event.target.value,
        });
    };
    return (React.createElement(Flex_1.Flex, { flexDirection: "column", style: { height: '100%' } },
        React.createElement(Tabs_1.Tabs, { className: "twa:mb-3" },
            React.createElement(Tabs_1.Tabs.Tab, null, "Settings"),
            React.createElement(Tabs_1.Tabs.Content, null,
                React.createElement(Flex_1.Flex, { flexDirection: "row" },
                    React.createElement(FormLayout_1.default, { className: "twa:max-w-[300px] twa:w-full" },
                        React.createElement(FormLayout_1.FormRow, { label: "Name" },
                            React.createElement(Input_1.default, { className: "twa:w-full", "data-name": "custom-sort-name", onChange: onNameChange, value: data?.Name ?? '' })))))),
        React.createElement(Tabs_1.Tabs, { style: { flex: 1, minHeight: 0 } },
            React.createElement(Tabs_1.Tabs.Tab, null, "Column"),
            React.createElement(Tabs_1.Tabs.Content, null,
                React.createElement(ColumnSelector_1.NewColumnSelector, { availableColumns: sortableCols, selected: data.ColumnId ? [data.ColumnId] : [], singleSelect: true, onChange: (ids) => {
                        props.onChange({
                            ...data,
                            SortedValues: [],
                            ColumnId: ids[0],
                        });
                    }, allowReorder: false })))));
};
exports.CustomSortColumnWizardSection = CustomSortColumnWizardSection;
