import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import React from "react";
import { PlusGrayIcon } from "../../../CommonUI/Icon/PlusGrayIcon";
import { ObserveState } from "../../../CommonUI/StateManagement/ObserveState";
import { StateManager } from "../../../CommonUI/StateManagement/StateManager";
import { RuleDesignerRender, RuleToolbarRender, RuleEditorRender, RuleTableEmptyAddColumn, RuleTableEmptyColumn, RuleTableEmptyIndexColumn, RuleEditorInTester, } from "../../DesignUI/CommonStyles";
import { Notification } from "../../../CommonUI/BuildUI/Notification";
import { LinkingDataDialog } from "../../DesignUI/LinkingDataDialog";
import { IntersectionRuleHeader } from "./IntersectionRuleHeader";
import { IntersectionRuleRow } from "./IntersectionRuleRow";
import { DataTypePicker } from "../../../CommonUI/DataTypePicker";
import { ValidationInformation } from "../../DesignUI/ValidationInformation";
import { TestContext } from "../../../Tester/TestContext";
import { TestResult } from "../../../CommonUI/Testing/TestResult";
export const IntersectionRuleDesigner = (props) => {
    const { ruleDefinition, editContext } = props;
    const testContext = React.useContext(TestContext);
    const onAddNewYAxisRule = () => {
        ruleDefinition.addYAxisExpression();
        StateManager.propertyChanged(ruleDefinition, "yaxisExpressions");
    };
    if (testContext) {
        return (_jsxs(RuleEditorInTester, { children: [_jsxs(RuleEditorRender, Object.assign({ columnCount: ruleDefinition.xaxisExpressions.length + 1, columnsGap: 6, rowsGap: 6 }, { children: [_jsx(IntersectionRuleHeader, { ruleDefinition: ruleDefinition, expressions: ruleDefinition.xaxisExpressions }, void 0),
                        _jsx(_Fragment, { children: ruleDefinition.yaxisExpressions.map((yaxisExp, index) => (_jsx(IntersectionRuleRow, { yexpression: yaxisExp, expressions: ruleDefinition.xaxisExpressions, y: index, ruleDefinition: ruleDefinition }, yaxisExp._id))) }, void 0),
                        _jsx(RuleTableEmptyIndexColumn, { "data-testid": "btn-intersectionrule-row-add", disabled: !ruleDefinition.canChangeOutputs }, void 0),
                        _jsx(RuleTableEmptyColumn, {}, void 0),
                        _jsx("div", {}, void 0),
                        ruleDefinition.xaxisExpressions.map((_, idx) => (_jsx(RuleTableEmptyColumn, {}, idx))),
                        _jsx(RuleTableEmptyAddColumn, {}, void 0)] }), void 0),
                _jsx(TestResult, { executableId: ruleDefinition._id }, void 0)] }, void 0));
    }
    return (_jsxs(RuleDesignerRender, { children: [_jsx(RuleToolbarRender, { children: _jsx(DataTypePicker, { dataDef: ruleDefinition.resultType, readonly: !ruleDefinition.canChangeOutputs, updateCallback: (newType) => {
                        ruleDefinition.setTypeResults(newType);
                        StateManager.propertyChanged(ruleDefinition, "resultType");
                    } }, void 0) }, void 0),
            _jsx(ObserveState, { listenTo: ruleDefinition, properties: ["xaxisExpressions", "resultType"], control: () => {
                    return (_jsxs(RuleEditorRender, Object.assign({ columnCount: ruleDefinition.xaxisExpressions.length + 1 }, { children: [_jsx(IntersectionRuleHeader, { ruleDefinition: ruleDefinition, expressions: ruleDefinition.xaxisExpressions }, void 0),
                            _jsx(ObserveState, { listenTo: ruleDefinition, properties: ["yaxisExpressions"], control: () => {
                                    return (_jsx(_Fragment, { children: ruleDefinition.yaxisExpressions.map((yaxisExp, index) => (_jsx(IntersectionRuleRow, { yexpression: yaxisExp, expressions: ruleDefinition.xaxisExpressions, y: index, ruleDefinition: ruleDefinition }, yaxisExp._id))) }, void 0));
                                } }, void 0),
                            _jsx(ObserveState, { listenTo: ruleDefinition, properties: ["canChangeOutputs"], control: () => (_jsx(RuleTableEmptyIndexColumn, Object.assign({ onClick: onAddNewYAxisRule, "data-testid": "btn-intersectionrule-row-add", disabled: !ruleDefinition.canChangeOutputs }, { children: _jsx(PlusGrayIcon, {}, void 0) }), void 0)) }, void 0),
                            _jsx(RuleTableEmptyColumn, {}, void 0),
                            _jsx("div", {}, void 0),
                            ruleDefinition.xaxisExpressions.map((_, idx) => (_jsx(RuleTableEmptyColumn, {}, idx))),
                            _jsx(RuleTableEmptyAddColumn, {}, void 0)] }), void 0));
                } }, void 0),
            _jsx(ObserveState, { listenTo: ruleDefinition, control: () => _jsx(ValidationInformation, { provider: ruleDefinition }, void 0) }, void 0),
            _jsx(Notification, { editContext: editContext }, void 0),
            _jsx(LinkingDataDialog, { editContext: editContext }, void 0)] }, void 0));
};
//# sourceMappingURL=IntersectionRuleDesigner.js.map