"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.WhenEditor = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const React = tslib_1.__importStar(require("react"));
const icons_1 = require("@gravity-ui/icons");
const uikit_1 = require("@gravity-ui/uikit");
const cn_1 = require("../../utils/cn.js");
const utils_1 = require("./utils.js");
const b = (0, cn_1.formBuilderV2Cn)('when-editor');
const WhenEditor = ({ when, availableFields, onChange }) => {
    const { conditions, combinators } = (0, utils_1.parse)(when);
    const fieldOptions = React.useMemo(() => availableFields.map((name) => ({ value: name, content: name })), [availableFields]);
    const commit = (nextConditions, nextCombinators) => {
        onChange((0, utils_1.serialize)(nextConditions, nextCombinators));
    };
    const addCondition = () => {
        const nextConditions = [
            ...conditions,
            { field: availableFields[0] ?? '', operator: '===', value: '' },
        ];
        const nextCombinators = conditions.length === 0 ? combinators : [...combinators, { operator: '&&' }];
        commit(nextConditions, nextCombinators);
    };
    const removeCondition = (index) => {
        const nextConditions = conditions.filter((_, i) => i !== index);
        const nextCombinators = index === 0
            ? combinators.slice(1)
            : [...combinators.slice(0, index - 1), ...combinators.slice(index)];
        commit(nextConditions, nextCombinators);
    };
    const updateCondition = (index, patch) => {
        const nextConditions = conditions.map((c, i) => (i === index ? { ...c, ...patch } : c));
        commit(nextConditions, combinators);
    };
    const updateCombinator = (index, op) => {
        const nextCombinators = combinators.map((c, i) => (i === index ? { operator: op } : c));
        commit(conditions, nextCombinators);
    };
    const clearAll = () => {
        onChange(undefined);
    };
    if (conditions.length === 0) {
        return ((0, jsx_runtime_1.jsx)("div", { className: b(), children: (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "normal", size: "s", onClick: addCondition, children: "+ Add condition" }) }));
    }
    return ((0, jsx_runtime_1.jsxs)("div", { className: b(), children: [conditions.map((cond, i) => ((0, jsx_runtime_1.jsxs)(React.Fragment, { children: [i > 0 && ((0, jsx_runtime_1.jsx)("div", { className: b('combinator'), children: (0, jsx_runtime_1.jsx)(uikit_1.Select, { size: "s", value: [combinators[i - 1]?.operator ?? '&&'], options: utils_1.COMBINATOR_OPTIONS, onUpdate: (next) => updateCombinator(i - 1, next[0]), width: 80 }) })), (0, jsx_runtime_1.jsxs)("div", { className: b('condition'), children: [(0, jsx_runtime_1.jsx)(uikit_1.Select, { size: "s", value: [cond.field], options: fieldOptions, onUpdate: (next) => updateCondition(i, { field: next[0] ?? '' }), placeholder: "field", filterable: true, width: "max" }), (0, jsx_runtime_1.jsx)(uikit_1.Select, { size: "s", value: [cond.operator], options: utils_1.OPERATOR_OPTIONS, onUpdate: (next) => updateCondition(i, { operator: next[0] }), width: 80 }), (0, jsx_runtime_1.jsx)(uikit_1.TextInput, { size: "s", value: (0, utils_1.displayValue)(cond.value), onUpdate: (value) => updateCondition(i, { value: (0, utils_1.coerceValue)(value) }), placeholder: 'value ("true"/"false" \u2192 bool)' }), (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "flat-danger", size: "s", onClick: () => removeCondition(i), title: "Remove condition", children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.TrashBin, size: 12 }) })] })] }, i))), (0, jsx_runtime_1.jsxs)("div", { className: b('actions'), children: [(0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "normal", size: "s", onClick: addCondition, children: "+ Add condition" }), (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "flat", size: "s", onClick: clearAll, children: "Clear" })] })] }));
};
exports.WhenEditor = WhenEditor;
//# sourceMappingURL=WhenEditor.js.map
