import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import React, { useState } from "react";
import { PlusGrayIcon } from "../../../../CommonUI/Icon/PlusGrayIcon";
import { ObserveState } from "../../../../CommonUI/StateManagement/ObserveState";
import { StateManager } from "../../../../CommonUI/StateManagement/StateManager";
import { RuleDesignerRender, RuleToolbarRender, RuleTableEmptyAddColumn, RuleTableEmptyColumn, RuleTableEmptyIndexColumn, RuleEditorRender, RuleLabelColumn, RuleEditorInTester, } from "../../../DesignUI/CommonStyles";
import { Notification } from "../../../../CommonUI/BuildUI/Notification";
import { LinkingDataDialog } from "../../../DesignUI/LinkingDataDialog";
import { SettingButton } from "../../../DesignUI/SettingButton";
import { ValueRuleTableHeader } from "./ValueTableRuleHeader";
import { StyledSwitch } from "../../../../CommonUI/Components/Switch";
import { StyledFormControlLabel } from "../../../../CommonUI/Components/FormControlLabel";
import { ValueTableResultDefaultCell } from "./ValueTableResultDefaultCell";
import { DockedSidebar } from "../../../../CommonUI/BuildUI/DockSidebar";
import { EditLayerConfigArea, EditLayerStyledAccordion, EditLayerStyledAccordionDetails, EditLayerStyledAccordionSummary, EditLayerStyledTypography, } from "../../../../CommonUI/CommonStyles";
import { ValidationInformation } from "../../../DesignUI/ValidationInformation";
import { ObserveMultiState } from "../../../../CommonUI/StateManagement/ObserveMultiState";
import { XValueTableRow } from "./ValueTableRow";
import { TestContext } from "../../../../Tester/TestContext";
import { ITableRowTestValue, TableRowTestContext } from "../../Common/TableRowTestContext";
import { XResultCell } from "../../CommonUI/XResultCell";
import { PassedTestRow } from "../../CommonStyles";
import { TestResult } from "../../../../CommonUI/Testing/TestResult";
export const ValueTableRuleDesigner = (props) => {
    const { ruleDefinition, editContext } = props;
    const [openSettingsLayer, setOpenSettingsLayer] = useState(false);
    const testContext = React.useContext(TestContext);
    const isDefaultTestResult = !!testContext &&
        !testContext.isError &&
        !((testContext === null || testContext === void 0 ? void 0 : testContext.items) || []).find((rowResult) => rowResult.result === "true");
    const onAddNewRow = () => {
        ruleDefinition.addRow();
        StateManager.propertyChanged(ruleDefinition, "rows");
    };
    if (testContext) {
        return (_jsxs(RuleEditorInTester, { children: [_jsxs(RuleEditorRender, Object.assign({ columnCount: ruleDefinition.columns.length + ruleDefinition.resultColumns.length + 1, rowsGap: 6, className: "RuleEditorRender" }, { children: [_jsx(ValueRuleTableHeader, Object.assign({}, props), void 0),
                        ruleDefinition.rows.map((row, idx) => {
                            return (_jsx(XValueTableRow, { row: row, index: idx, ruleDefinition: ruleDefinition, editContext: editContext }, row._id));
                        }),
                        _jsx(RuleTableEmptyIndexColumn, { onClick: onAddNewRow, "data-testid": "btn-value-table-add-new-row" }, void 0),
                        ruleDefinition.columns.map((_, idx) => (_jsx(RuleTableEmptyColumn, {}, idx))),
                        _jsx(RuleTableEmptyAddColumn, {}, void 0),
                        ruleDefinition.resultColumns.map((col) => {
                            return _jsx(RuleTableEmptyColumn, {}, col._id);
                        }),
                        _jsx(RuleTableEmptyAddColumn, {}, void 0),
                        _jsx(RuleTableEmptyAddColumn, {}, void 0),
                        ruleDefinition.allowDefaultResults && (_jsxs(TableRowTestContext.Provider, Object.assign({ value: isDefaultTestResult ? ITableRowTestValue.PASSED : undefined }, { children: [isDefaultTestResult && (_jsx(PassedTestRow, { "data-testid": "passedtestrow", x: ruleDefinition.columns.length + 3, y: ruleDefinition.rows.length + 4, columnsSpan: ruleDefinition.resultColumns.length }, void 0)),
                                _jsx(RuleLabelColumn, Object.assign({ colSpan: ruleDefinition.columns.length + 1, colStart: 1, y: ruleDefinition.rows.length + 4 }, { children: "Default Result Values" }), void 0),
                                ruleDefinition.resultColumns.map((rescol, index2) => {
                                    return (_jsx(XResultCell, { ruleDefinition: ruleDefinition, resultColumn: rescol, resultCell: ruleDefinition.defaultResult[rescol._id], editContext: editContext, rowIndex: ruleDefinition.rows.length + 4, cellIndex: ruleDefinition.columns.length + 2 + index2 }, rescol._id));
                                })] }), void 0))] }), void 0),
                _jsx(TestResult, { executableId: ruleDefinition._id }, void 0)] }, void 0));
    }
    return (_jsxs(RuleDesignerRender, { children: [_jsx(RuleToolbarRender, { children: _jsx(SettingButton, { onClick: () => setOpenSettingsLayer(true) }, void 0) }, void 0),
            _jsx(DockedSidebar, { sidebar: () => {
                    return (_jsx(EditLayerConfigArea, { children: _jsxs(EditLayerStyledAccordion, Object.assign({ expanded: true, onChange: () => { }, defaultExpanded: true }, { children: [_jsx(EditLayerStyledAccordionSummary, { children: _jsx(EditLayerStyledTypography, Object.assign({ variant: "subtitle1", classes: { root: "config-form-header" } }, { children: "Settings" }), void 0) }, void 0),
                                _jsx(EditLayerStyledAccordionDetails, Object.assign({ classes: { root: "config-form-content" } }, { children: _jsx(ObserveState, { listenTo: ruleDefinition, control: () => (_jsx(StyledFormControlLabel, { control: _jsx(StyledSwitch, { color: "primary", checked: ruleDefinition.allowDefaultResults, onChange: (event) => {
                                                    ruleDefinition.allowDefaultResults = event.target.checked;
                                                    StateManager.propertyChanged(ruleDefinition, "allowDefaultResults");
                                                } }, void 0), label: "Allow Default Results" }, void 0)) }, void 0) }), void 0)] }), void 0) }, void 0));
                }, content: () => (_jsx(ObserveState, { listenTo: ruleDefinition, properties: ["columns", "resultColumns"], control: () => {
                        return (_jsxs(RuleEditorRender, Object.assign({ columnCount: ruleDefinition.columns.length + ruleDefinition.resultColumns.length + 1 }, { children: [_jsx(ValueRuleTableHeader, Object.assign({}, props), void 0),
                                _jsx(ObserveState, { listenTo: ruleDefinition, properties: ["rows"], control: () => {
                                        return (_jsx(_Fragment, { children: ruleDefinition.rows.map((row, idx) => {
                                                return (_jsx(XValueTableRow, { row: row, index: idx, ruleDefinition: ruleDefinition, editContext: editContext }, row._id));
                                            }) }, void 0));
                                    } }, void 0),
                                _jsx(RuleTableEmptyIndexColumn, Object.assign({ onClick: onAddNewRow, "data-testid": "btn-value-table-add-new-row" }, { children: _jsx(PlusGrayIcon, {}, void 0) }), void 0),
                                ruleDefinition.columns.map((_, idx) => (_jsx(RuleTableEmptyColumn, {}, idx))),
                                _jsx(RuleTableEmptyAddColumn, {}, void 0),
                                ruleDefinition.resultColumns.map((col) => {
                                    return _jsx(RuleTableEmptyColumn, {}, col._id);
                                }),
                                _jsx(RuleTableEmptyAddColumn, {}, void 0),
                                _jsx(RuleTableEmptyAddColumn, {}, void 0),
                                _jsx(ObserveState, { listenTo: ruleDefinition, properties: ["allowDefaultResults"], control: () => {
                                        if (!ruleDefinition.allowDefaultResults)
                                            return null;
                                        return (_jsxs(_Fragment, { children: [_jsx(RuleLabelColumn, Object.assign({ colSpan: ruleDefinition.columns.length + 1, colStart: 1 }, { children: "Default Result Values" }), void 0),
                                                ruleDefinition.resultColumns.map((rescol) => {
                                                    return (_jsx(ValueTableResultDefaultCell, { ruleDefinition: ruleDefinition, resultColumn: rescol, editContext: editContext }, rescol._id));
                                                })] }, void 0));
                                    } }, void 0)] }), void 0));
                    } }, void 0)), sidebarWidth: 350, open: openSettingsLayer, onClose: () => setOpenSettingsLayer(false) }, void 0),
            _jsx(ObserveMultiState, { listenTo: [
                    ...props.ruleDefinition.columns,
                    ...props.ruleDefinition.resultColumns,
                    props.ruleDefinition,
                ], control: () => _jsx(ValidationInformation, { provider: ruleDefinition }, void 0) }, void 0),
            _jsx(ObserveState, { listenTo: editContext, control: () => {
                    return _jsx(Notification, { editContext: editContext }, void 0);
                } }, void 0),
            _jsx(LinkingDataDialog, { editContext: editContext }, void 0)] }, void 0));
};
//# sourceMappingURL=ValueTableRuleDesigner.js.map