"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.SettingsSection = exports.isSettingsValid = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const CheckBox_1 = require("../../../../components/CheckBox");
const DropdownButton_1 = tslib_1.__importDefault(require("../../../../components/DropdownButton"));
const FormLayout_1 = tslib_1.__importStar(require("../../../../components/FormLayout"));
const AdaptableInput_1 = tslib_1.__importDefault(require("../../../Components/AdaptableInput"));
const isSettingsValid = (chartDefinition, api) => {
    if (!chartDefinition.Name) {
        return 'Name is mandatory';
    }
    const allChartDefinitions = api.chartingApi.getChartDefinitions();
    if (allChartDefinitions.some((chartDefinitionLoopItem) => chartDefinitionLoopItem.Uuid !== chartDefinition.Uuid &&
        chartDefinitionLoopItem.Name === chartDefinition.Name)) {
        return 'There is already a chart with this name';
    }
    return true;
};
exports.isSettingsValid = isSettingsValid;
const SettingsSection = (props) => {
    const handleNameChange = React.useCallback((event) => {
        props.onChange({
            ...props.chartDefinition,
            Name: event.target.value,
            Model: props.chartDefinition.Model,
        });
    }, [props.chartDefinition]);
    const handleUnLinkChange = React.useCallback(() => {
        props.onChange({
            ...props.chartDefinition,
            Model: {
                ...props.chartDefinition.Model,
                unlinkChart: !props.chartDefinition.Model.unlinkChart,
            },
        });
    }, [props.chartDefinition]);
    const handleSuppressChartRanges = React.useCallback(() => {
        props.onChange({
            ...props.chartDefinition,
            Model: {
                ...props.chartDefinition.Model,
                suppressChartRanges: !props.chartDefinition.Model.suppressChartRanges,
            },
        });
    }, [props.chartDefinition]);
    const aggFuncs = ['sum', 'min', 'max', 'count', 'avg', 'first', 'last'];
    const aggFuncsOptions = aggFuncs.map((aggFunc) => ({
        label: aggFunc,
        onClick: () => {
            props.onChange({
                ...props.chartDefinition,
                Model: {
                    ...props.chartDefinition.Model,
                    aggFunc,
                },
            });
        },
    }));
    const aggFunc = props.chartDefinition.Model.aggFunc;
    const handleAggFuncClear = React.useCallback(() => {
        props.onChange({
            ...props.chartDefinition,
            Model: {
                ...props.chartDefinition.Model,
                aggFunc: '',
            },
        });
    }, [props.chartDefinition]);
    return (React.createElement(FormLayout_1.default, null,
        React.createElement(FormLayout_1.FormRow, { label: "Name" },
            React.createElement(AdaptableInput_1.default, { onChange: handleNameChange, value: props.chartDefinition.Name })),
        React.createElement(FormLayout_1.FormRow, { label: "Unlink Chart" },
            React.createElement(CheckBox_1.CheckBox, { onClick: handleUnLinkChange, checked: props.chartDefinition.Model.unlinkChart })),
        React.createElement(FormLayout_1.FormRow, { label: "Suppress Chart Ranges" },
            React.createElement(CheckBox_1.CheckBox, { onClick: handleSuppressChartRanges, checked: props.chartDefinition.Model.suppressChartRanges })),
        props.chartDefinition.Model.modelType === 'range' && typeof aggFunc !== 'function' && (React.createElement(FormLayout_1.FormRow, { label: "Agg Func" },
            React.createElement(DropdownButton_1.default, { columns: ['label'], items: aggFuncsOptions, onClear: handleAggFuncClear }, aggFunc ? aggFunc : 'Select ')))));
};
exports.SettingsSection = SettingsSection;
