import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
/**
 * Copyright (c) 2020-present, Goldman Sachs
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
import { observer } from 'mobx-react-lite';
import { ModelStore, Database, getMappingCompatibleClasses, isStubbed_RawLambda, stub_RawLambda, MappingTest, PackageableElementExplicitReference, DataElementReference, RelationalCSVData, ModelStoreData, ExternalFormatData, ModelEmbeddedData, } from '@finos/legend-graph';
import { forwardRef, useEffect, useRef, useState } from 'react';
import { BlankPanelPlaceholder, CaretDownIcon, clsx, compareLabelFn, CustomSelectorInput, Dialog, ControlledDropdownMenu, MenuContent, MenuContentItem, Modal, ModalBody, ModalFooter, ModalFooterButton, ModalTitle, PanelContent, PanelFormTextField, PencilIcon, PlusIcon, ResizablePanel, ResizablePanelGroup, ResizablePanelSplitter, ResizablePanelSplitterLine, RunAllIcon, RunErrorsIcon, PanelLoadingIndicator, ContextMenu, ModalHeader, PanelFormSection, PlayIcon, } from '@finos/legend-art';
import { assertErrorThrown, filterByType, prettyCONSTName, returnUndefOnError, uniq, } from '@finos/legend-shared';
import { useApplicationNavigationContext, useApplicationStore, } from '@finos/legend-application';
import { flowResult } from 'mobx';
import { ExecutionPlanViewer, QueryBuilderTextEditorMode, } from '@finos/legend-query-builder';
import { MappingExecutionQueryBuilderState } from '../../../../stores/editor/editor-state/element-editor-state/mapping/MappingExecutionQueryBuilderState.js';
import { CODE_EDITOR_LANGUAGE } from '@finos/legend-code-editor';
import { CodeEditor } from '@finos/legend-lego/code-editor';
import { atomicTest_setDoc } from '../../../../stores/graph-modifier/Testable_GraphModifierHelper.js';
import { RenameModal, SharedDataElementModal, TestAssertionEditor, } from '../testable/TestableSharedComponents.js';
import { EmbeddedDataEditor } from '../data-editor/EmbeddedDataEditor.js';
import { TESTABLE_RESULT, getTestableResultFromTestResult, getTestableResultFromTestResults, } from '../../../../stores/editor/sidebar-state/testable/GlobalTestRunnerState.js';
import { getTestableResultIcon } from '../../side-bar/testable/GlobalTestRunner.js';
import { EmbeddedDataCreatorFromEmbeddedData, validateTestableId, } from '../../../../stores/editor/utils/TestableUtils.js';
import { getMappingStores } from '../../../../stores/editor/editor-state/element-editor-state/mapping/MappingEditorState.js';
import { EmbeddedDataType } from '../../../../stores/editor/editor-state/ExternalFormatState.js';
import { buildElementOption, getPackageableElementOptionFormatter, } from '@finos/legend-lego/graph-editor';
import { LEGEND_STUDIO_APPLICATION_NAVIGATION_CONTEXT_KEY } from '../../../../__lib__/LegendStudioApplicationNavigationContext.js';
import { TestExecutionPlanDebugState, TestUnknownDebugState, } from '../../../../stores/editor/editor-state/element-editor-state/testable/TestableEditorState.js';
const CreateTestSuiteModal = observer((props) => {
    const { creatorState } = props;
    const mappingTestableState = creatorState.mappingTestableState;
    const mappingEditorState = mappingTestableState.mappingEditorState;
    const mapping = mappingEditorState.mapping;
    const editorStore = mappingEditorState.editorStore;
    const applicationStore = editorStore.applicationStore;
    // Class mapping selector
    const compatibleClasses = getMappingCompatibleClasses(mapping, editorStore.graphManagerState.usableClasses);
    const inputRef = useRef(null);
    const handleEnter = () => inputRef.current?.focus();
    const mappedClassOptions = uniq(compatibleClasses)
        .map((e) => ({
        label: e.name,
        value: e,
    }))
        .sort(compareLabelFn);
    const [selectedClass, setSelectedClass] = useState(compatibleClasses[0]);
    const selectedClassOption = selectedClass
        ? {
            value: selectedClass,
            label: selectedClass.name,
        }
        : null;
    // init states
    const [suiteName, setSuiteName] = useState(undefined);
    const [testName, setTestName] = useState(undefined);
    const isValid = selectedClass && suiteName && testName;
    const changeClassOption = (val) => {
        if (val?.value) {
            setSelectedClass(val.value);
        }
        else {
            setSelectedClass(undefined);
        }
    };
    // model
    const close = () => mappingTestableState.closeCreateModal();
    const create = () => {
        if (selectedClass && suiteName && testName) {
            flowResult(creatorState.createAndAddTestSuite(selectedClass, suiteName, testName)).catch(editorStore.applicationStore.alertUnhandledError);
        }
    };
    return (_jsx(Dialog, { open: true, onClose: close, classes: { container: 'search-modal__container' }, slotProps: {
            transition: {
                onEnter: handleEnter,
            },
            paper: {
                classes: { root: 'search-modal__inner-container' },
            },
        }, children: _jsxs(Modal, { darkMode: !applicationStore.layoutService.TEMPORARY__isLightColorThemeEnabled, children: [_jsx(ModalHeader, { children: _jsx(ModalTitle, { title: "Create Mapping Test Suite" }) }), _jsxs(ModalBody, { children: [_jsx(PanelLoadingIndicator, { className: "panel-loading-indicator--in__modal", isLoading: creatorState.isCreatingSuiteState.isInProgress }), creatorState.isCreatingSuiteState.message && (_jsx(PanelFormSection, { children: _jsx("div", { className: "service-registration-editor__progress-msg", children: `${creatorState.isCreatingSuiteState.message}...` }) })), _jsx(PanelFormTextField, { ref: inputRef, name: "Test Suite Name", prompt: "Unique Identifier for Test suite i.e Person_suite", value: suiteName, placeholder: "Suite Name", update: (value) => setSuiteName(value ?? ''), errorMessage: validateTestableId(suiteName, undefined) }), _jsx(PanelFormTextField, { name: "Test Name", prompt: "Unique Identifier for first test in suite", placeholder: "Test Name", value: testName, update: (value) => setTestName(value ?? ''), errorMessage: validateTestableId(testName, undefined) }), _jsxs("div", { className: "panel__content__form__section", children: [_jsx("div", { className: "panel__content__form__section__header__label", children: "Class Mapping" }), _jsx("div", { className: "panel__content__form__section__header__prompt", children: "Mapped Class for which you would like to build test suite for" }), _jsx(CustomSelectorInput, { options: mappedClassOptions, onChange: changeClassOption, value: selectedClassOption, formatOptionLabel: getPackageableElementOptionFormatter({}), darkMode: !applicationStore.layoutService
                                        .TEMPORARY__isLightColorThemeEnabled, placeholder: "Choose a class...", isClearable: true })] })] }), _jsxs(ModalFooter, { children: [_jsx(ModalFooterButton, { disabled: !isValid || creatorState.isCreatingSuiteState.isInProgress, title: !isValid
                                ? 'Suite Name and Test Name Required'
                                : 'Create Test Suite', onClick: create, text: "Create" }), _jsx(ModalFooterButton, { onClick: close, text: "Close", type: "secondary" })] })] }) }));
});
const CreateTestModal = observer((props) => {
    const { mappingSuiteState } = props;
    const mapping = mappingSuiteState.mappingTestableState.mapping;
    const suite = mappingSuiteState.suite;
    const testData = suite.tests.filter(filterByType(MappingTest))[0]
        ?.storeTestData[0];
    const editorStore = mappingSuiteState.editorStore;
    const applicationStore = editorStore.applicationStore;
    // test name
    const [id, setId] = useState(undefined);
    const isValid = id && !id.includes(' ');
    const errorMessage = validateTestableId(id, suite.tests.map((t) => t.id));
    const mappedClassSelectorRef = useRef(null);
    // const firstTest = mapp
    // Class mapping selector
    const compatibleClasses = getMappingCompatibleClasses(mapping, editorStore.graphManagerState.usableClasses);
    const mappedClassOptions = uniq(compatibleClasses)
        .map((e) => ({
        label: e.name,
        value: e,
    }))
        .sort(compareLabelFn);
    // class if required
    const [selectedClass, setSelectedClass] = useState(compatibleClasses[0]);
    const changeClassOption = (val) => {
        setSelectedClass(val?.value);
    };
    const selectedClassOption = selectedClass
        ? {
            value: selectedClass,
            label: selectedClass.name,
        }
        : null;
    // model
    const close = () => mappingSuiteState.setShowModal(false);
    const create = () => {
        if (id) {
            mappingSuiteState.addNewTest(id, selectedClass);
            close();
        }
    };
    return (_jsx(Dialog, { open: mappingSuiteState.showCreateModal, onClose: close, classes: { container: 'search-modal__container' }, slotProps: {
            paper: {
                classes: { root: 'search-modal__inner-container' },
            },
        }, children: _jsxs(Modal, { darkMode: !applicationStore.layoutService.TEMPORARY__isLightColorThemeEnabled, children: [_jsx(ModalHeader, { children: _jsx(ModalTitle, { title: "Create Mapping Test" }) }), _jsxs(ModalBody, { children: [_jsx(PanelFormTextField, { name: "Name", prompt: "", value: id, update: (value) => setId(value ?? ''), errorMessage: errorMessage }), !testData && (_jsxs("div", { className: "panel__content__form__section", children: [_jsx("div", { className: "panel__content__form__section__header__label", children: "Class Mapping" }), _jsx("div", { className: "panel__content__form__section__header__prompt", children: "Mapped Class for which you would like to build test suite for" }), _jsx(CustomSelectorInput, { inputRef: mappedClassSelectorRef, options: mappedClassOptions, onChange: changeClassOption, value: selectedClassOption, darkMode: !applicationStore.layoutService
                                        .TEMPORARY__isLightColorThemeEnabled, placeholder: "Choose a class...", isClearable: true })] }))] }), _jsxs(ModalFooter, { children: [_jsx(ModalFooterButton, { disabled: !isValid, onClick: create, text: "Create" }), _jsx(ModalFooterButton, { onClick: close, text: "Close", type: "secondary" })] })] }) }));
});
const CreateStoreTestDataModal = observer((props) => {
    const { mappingTestState } = props;
    const mappingTestableDataState = mappingTestState.dataState;
    const editorStore = mappingTestableDataState.editorStore;
    const applicationStore = editorStore.applicationStore;
    const mapping = mappingTestableDataState.mappingTestableState.mapping;
    const isReadOnly = mappingTestableDataState.mappingTestableState.mappingEditorState
        .isReadOnly;
    // options
    const dataElementOptions = editorStore.graphManagerState.usableDataElements.map(buildElementOption);
    const extraOptionTypes = editorStore.pluginManager
        .getApplicationPlugins()
        .flatMap((plugin) => plugin.getExtraEmbeddedDataTypeOptions?.() ?? []);
    const embeddedOptions = [
        ...Object.values(EmbeddedDataType)
            .filter((e) => e !== EmbeddedDataType.DATA_ELEMENT || dataElementOptions.length)
            .map((typeOption) => ({
            label: prettyCONSTName(typeOption),
            value: typeOption,
        })),
        ...extraOptionTypes,
    ];
    const getDefaultTypeFromStore = (_store) => {
        if (_store instanceof ModelStore) {
            return EmbeddedDataType.EXTERNAL_FORMAT_DATA;
        }
        else if (_store instanceof Database) {
            return EmbeddedDataType.RELATIONAL_CSV;
        }
        return undefined;
    };
    const compatibleStores = Array.from(getMappingStores(mapping, editorStore.pluginManager.getApplicationPlugins()));
    // set states
    const [selectedStore, setSelectedStore] = useState(compatibleStores[0]);
    const [embeddedDataType, setEmbeddedDataType] = useState(getDefaultTypeFromStore(selectedStore) ?? embeddedOptions[0]?.value);
    // data reference
    const [dataElement, setDataElement] = useState(dataElementOptions[0]?.value);
    const selectedDataElement = dataElement
        ? buildElementOption(dataElement)
        : null;
    const onDataElementChange = (val) => {
        setDataElement(val?.value);
    };
    // data type
    const onEmbeddedTypeChange = (val) => {
        setEmbeddedDataType(val?.value);
    };
    const embeddedDataTypeOption = embeddedDataType
        ? {
            value: embeddedDataType,
            label: prettyCONSTName(embeddedDataType),
        }
        : undefined;
    // store
    const mappedStoreRef = useRef(null);
    const selectedStoreOptions = compatibleStores
        .map((e) => ({
        label: e.name,
        value: e,
    }))
        .sort(compareLabelFn);
    const selectedStoreOption = selectedStore
        ? {
            value: selectedStore,
            label: selectedStore.name,
        }
        : null;
    const changeStoreOption = (val) => {
        setSelectedStore(val?.value);
        const store = val?.value;
        if (store instanceof ModelStore) {
            setEmbeddedDataType(EmbeddedDataType.EXTERNAL_FORMAT_DATA);
        }
        else if (store instanceof Database) {
            setEmbeddedDataType(EmbeddedDataType.RELATIONAL_CSV);
        }
    };
    // validation
    const isValid = (Boolean(selectedStore) && Boolean(embeddedDataType)) ||
        (embeddedDataType === EmbeddedDataType.DATA_ELEMENT && dataElement);
    const close = () => mappingTestableDataState.setShowModal(false);
    const create = () => {
        if (selectedStore && embeddedDataType) {
            mappingTestableDataState.addStoreTestData(selectedStore, embeddedDataType, dataElement);
            close();
        }
    };
    return (_jsx(Dialog, { open: mappingTestableDataState.showNewModal, onClose: close, classes: { container: 'search-modal__container' }, slotProps: {
            paper: {
                classes: { root: 'search-modal__inner-container' },
            },
        }, children: _jsxs(Modal, { darkMode: !applicationStore.layoutService.TEMPORARY__isLightColorThemeEnabled, className: "search-modal", children: [_jsx(ModalTitle, { title: "Create Store Test Data" }), _jsxs(ModalBody, { children: [_jsxs("div", { className: "panel__content__form__section", children: [_jsx("div", { className: "panel__content__form__section__header__label", children: "Store to add test data" }), _jsx(CustomSelectorInput, { inputRef: mappedStoreRef, options: selectedStoreOptions, onChange: changeStoreOption, formatOptionLabel: getPackageableElementOptionFormatter({}), value: selectedStoreOption, darkMode: !applicationStore.layoutService
                                        .TEMPORARY__isLightColorThemeEnabled, placeholder: "Choose a store...", isClearable: true })] }), _jsxs("div", { className: "panel__content__form__section", children: [_jsx("div", { className: "panel__content__form__section__header__label", children: "Data Type" }), _jsx("div", { className: "panel__content__form__section__header__prompt", children: "Test data type that will be used to mock store (defaulted based on store)" }), _jsx("div", { className: "explorer__new-element-modal__driver", children: _jsx(CustomSelectorInput, { className: "explorer__new-element-modal__driver__dropdown", options: embeddedOptions, onChange: onEmbeddedTypeChange, value: embeddedDataTypeOption, isClearable: false, darkMode: !applicationStore.layoutService
                                            .TEMPORARY__isLightColorThemeEnabled }) })] }), embeddedDataType === EmbeddedDataType.DATA_ELEMENT && (_jsxs("div", { className: "panel__content__form__section", children: [_jsx("div", { className: "panel__content__form__section__header__label", children: "Data Element" }), _jsx("div", { className: "explorer__new-element-modal__driver", children: _jsx(CustomSelectorInput, { className: "panel__content__form__section__dropdown data-element-reference-editor__value__dropdown", disabled: isReadOnly, options: dataElementOptions, onChange: onDataElementChange, value: selectedDataElement, darkMode: !applicationStore.layoutService
                                            .TEMPORARY__isLightColorThemeEnabled }) })] }))] }), _jsxs(ModalFooter, { children: [_jsx(ModalFooterButton, { disabled: !isValid, onClick: create, text: "Create" }), _jsx(ModalFooterButton, { onClick: close, text: "Close", type: "secondary" })] })] }) }));
});
const MappingTestSuiteQueryEditor = observer((props) => {
    const { testSuiteState, mappingTestableState, isReadOnly } = props;
    const testableQueryState = testSuiteState.queryState;
    const mapping = mappingTestableState.mapping;
    const editorStore = mappingTestableState.mappingEditorState.editorStore;
    const applicationStore = useApplicationStore();
    // actions
    const editWithQueryBuilder = (openInTextMode = false) => applicationStore.guardUnhandledError(async () => {
        const embeddedQueryBuilderState = editorStore.embeddedQueryBuilderState;
        await flowResult(embeddedQueryBuilderState.setEmbeddedQueryBuilderConfiguration({
            setupQueryBuilderState: async () => {
                const queryBuilderState = new MappingExecutionQueryBuilderState(embeddedQueryBuilderState.editorStore.applicationStore, embeddedQueryBuilderState.editorStore.graphManagerState, mapping, editorStore.applicationStore.config.options.queryBuilderConfig, editorStore.editorMode.getSourceInfo());
                queryBuilderState.initializeWithQuery(testableQueryState.query);
                if (openInTextMode) {
                    queryBuilderState.textEditorState.openModal(QueryBuilderTextEditorMode.TEXT);
                }
                return queryBuilderState;
            },
            actionConfigs: [
                {
                    key: 'save-query-btn',
                    renderer: (queryBuilderState) => {
                        const save = applicationStore.guardUnhandledError(async () => {
                            try {
                                const rawLambda = queryBuilderState.buildQuery();
                                await flowResult(testableQueryState.updateLamba(rawLambda));
                                applicationStore.notificationService.notifySuccess(`Mapping testable query is updated`);
                                embeddedQueryBuilderState.setEmbeddedQueryBuilderConfiguration(undefined);
                            }
                            catch (error) {
                                assertErrorThrown(error);
                                applicationStore.notificationService.notifyError(`Can't save query: ${error.message}`);
                            }
                        });
                        return (_jsx("button", { className: "query-builder__dialog__header__custom-action", tabIndex: -1, disabled: isReadOnly, onClick: save, children: "Save Query" }));
                    },
                },
            ],
            disableCompile: isStubbed_RawLambda(testableQueryState.query),
        }));
    });
    const clearQuery = applicationStore.guardUnhandledError(() => flowResult(testableQueryState.updateLamba(stub_RawLambda())));
    // debug
    const disableDebug = !testSuiteState.selectTestState;
    const debugQuery = () => {
        flowResult(testSuiteState.debug()).catch(testSuiteState.editorStore.applicationStore.alertUnhandledError);
    };
    const debugState = testSuiteState.selectTestState?.debugTestResultState;
    const renderDebug = (val) => {
        const closeDebug = () => testSuiteState.selectTestState?.setDebugState(undefined);
        if (val instanceof TestExecutionPlanDebugState) {
            return (_jsx(ExecutionPlanViewer, { executionPlanState: val.executionPlanState }));
        }
        if (val instanceof TestUnknownDebugState) {
            return (_jsx(Dialog, { open: Boolean(debugState), onClose: closeDebug, classes: {
                    root: 'editor-modal__root-container',
                    container: 'editor-modal__container',
                    paper: 'editor-modal__content',
                }, children: _jsxs(Modal, { className: clsx('editor-modal query-builder-text-mode__modal'), children: [_jsx(ModalHeader, { children: _jsx("div", { className: "modal__title", children: `Debug` }) }), _jsx(ModalBody, { children: _jsx("div", { className: clsx('query-builder-text-mode__modal__content'), children: _jsx(CodeEditor, { language: CODE_EDITOR_LANGUAGE.JSON, inputValue: JSON.stringify(val.testDebug.value), isReadOnly: true }) }) }), _jsx(ModalFooter, { children: _jsx(ModalFooterButton, { onClick: closeDebug, type: "primary", children: "Close" }) })] }) }));
        }
        return null;
    };
    return (_jsxs("div", { className: "panel mapping-test-editor__query-panel", children: [_jsx(PanelLoadingIndicator, { isLoading: Boolean(testSuiteState.selectTestState?.debuggingTestAction.isInProgress) }), _jsxs("div", { className: "panel__header", children: [_jsx("div", { className: "panel__header__title", children: _jsx("div", { className: "panel__header__title__label", children: "query" }) }), _jsxs("div", { className: "panel__header__actions", children: [_jsxs("div", { className: "btn__dropdown-combo", children: [_jsxs("button", { className: "btn__dropdown-combo__label", onClick: editWithQueryBuilder(), title: "Edit Query", tabIndex: -1, children: [_jsx(PencilIcon, { className: "btn__dropdown-combo__label__icon" }), _jsx("div", { className: "btn__dropdown-combo__label__title", children: "Edit Query" })] }), _jsx(ControlledDropdownMenu, { className: "btn__dropdown-combo__dropdown-btn", content: _jsxs(MenuContent, { children: [_jsx(MenuContentItem, { className: "btn__dropdown-combo__option", onClick: editWithQueryBuilder(true), children: "Text Mode" }), _jsx(MenuContentItem, { className: "btn__dropdown-combo__option", onClick: clearQuery, children: "Clear Query" })] }), menuProps: {
                                            anchorOrigin: { vertical: 'bottom', horizontal: 'right' },
                                            transformOrigin: { vertical: 'top', horizontal: 'right' },
                                        }, children: _jsx(CaretDownIcon, {}) })] }), _jsx("div", { className: "btn__dropdown-combo btn__dropdown-combo--primary", children: _jsxs("button", { className: "btn__dropdown-combo__label", onClick: debugQuery, title: "Debug Test With Exec Plan", disabled: disableDebug, tabIndex: -1, children: [_jsx(PlayIcon, { className: "btn__dropdown-combo__label__icon" }), _jsx("div", { className: "btn__dropdown-combo__label__title", children: "Debug" })] }) })] })] }), !isStubbed_RawLambda(testableQueryState.query) && (_jsx(PanelContent, { children: _jsx("div", { className: "mapping-test-editor__query-panel__query", children: _jsx(CodeEditor, { inputValue: testableQueryState.lambdaString, isReadOnly: true, language: CODE_EDITOR_LANGUAGE.PURE, hideMinimap: true }) }) })), debugState && renderDebug(debugState)] }));
});
const StoreTestDataEditor = observer((props) => {
    const { mappingTestState, storeTestDataState } = props;
    const isReadOnly = mappingTestState.mappingTestableState.mappingEditorState.isReadOnly;
    const dataElements = storeTestDataState.editorStore.graphManagerState.graph.dataElements;
    const currentData = storeTestDataState.storeTestData.data;
    const isUsingReference = currentData instanceof DataElementReference;
    const open = () => storeTestDataState.setDataElementModal(true);
    const close = () => storeTestDataState.setDataElementModal(false);
    const changeToUseMyOwn = () => {
        if (isUsingReference) {
            const newBare = returnUndefOnError(() => currentData.accept_EmbeddedDataVisitor(new EmbeddedDataCreatorFromEmbeddedData(mappingTestState.editorStore)));
            if (newBare) {
                storeTestDataState.changeEmbeddedData(newBare);
            }
        }
    };
    const sharedDataHandler = (val) => {
        const dataRef = new DataElementReference();
        dataRef.dataElement = PackageableElementExplicitReference.create(val);
        const dataElementValue = val.data;
        let embeddedData = dataRef;
        if (currentData instanceof ModelStoreData &&
            dataElementValue instanceof ExternalFormatData) {
            const modelStoreVal = currentData.modelData?.[0];
            if (modelStoreVal instanceof ModelEmbeddedData) {
                const newModelEmbeddedData = new ModelEmbeddedData();
                newModelEmbeddedData.model =
                    PackageableElementExplicitReference.create(modelStoreVal.model.value);
                newModelEmbeddedData.data = dataRef;
                const modelStoreData = new ModelStoreData();
                modelStoreData.modelData = [newModelEmbeddedData];
                embeddedData = modelStoreData;
            }
        }
        storeTestDataState.changeEmbeddedData(embeddedData);
    };
    const filter = (val) => {
        const dataElementData = val.data;
        if (currentData instanceof RelationalCSVData) {
            if (dataElementData instanceof RelationalCSVData) {
                return true;
            }
            return false;
        }
        else if (currentData instanceof ModelStoreData) {
            if (dataElementData instanceof ExternalFormatData ||
                dataElementData instanceof ModelStoreData) {
                return true;
            }
            return false;
        }
        // TODO add extensions
        return true;
    };
    return (_jsxs("div", { className: "service-test-data-editor", children: [_jsxs("div", { className: "service-test-suite-editor__header", children: [_jsx("div", { className: "service-test-suite-editor__header__title", children: _jsx("div", { className: "service-test-suite-editor__header__title__label", children: "input data" }) }), _jsx("div", { className: "panel__header__actions", children: isUsingReference ? (_jsx("button", { className: "panel__header__action service-execution-editor__test-data__generate-btn", onClick: changeToUseMyOwn, disabled: !isUsingReference, title: "Use own data", tabIndex: -1, children: _jsx("div", { className: "service-execution-editor__test-data__generate-btn__label", children: _jsx("div", { className: "service-execution-editor__test-data__generate-btn__label__title", children: "Own Data" }) }) })) : (_jsx("button", { className: "panel__header__action service-execution-editor__test-data__generate-btn", onClick: open, title: "Use Shared Data via Defined Data Element", disabled: !dataElements.length, tabIndex: -1, children: _jsx("div", { className: "service-execution-editor__test-data__generate-btn__label", children: _jsx("div", { className: "service-execution-editor__test-data__generate-btn__label__title", children: "Shared Data" }) }) })) })] }), storeTestDataState.dataElementModal && (_jsx(SharedDataElementModal, { isReadOnly: false, editorStore: storeTestDataState.editorStore, close: close, filterBy: filter, handler: sharedDataHandler })), _jsx(EmbeddedDataEditor, { isReadOnly: isReadOnly, embeddedDataEditorState: storeTestDataState.embeddedEditorState })] }));
});
const MappingTestEditor = observer((props) => {
    const { mappingTestState } = props;
    const mappingTest = mappingTestState.test;
    const mappingTestableDataState = mappingTestState.dataState;
    const addStoreTestData = () => {
        mappingTestableDataState.setShowModal(true);
    };
    return (_jsx("div", { className: "service-test-editor panel", children: _jsx("div", { className: "panel mapping-testable-editor", children: _jsx("div", { className: "mapping-testable-editor__content", children: _jsxs(ResizablePanelGroup, { orientation: "horizontal", children: [_jsx(ResizablePanel, { size: 120, children: _jsx("div", { className: "service-test-data-editor panel", children: _jsx("div", { className: "service-test-editor__setup__configuration", children: _jsxs("div", { className: "panel__content__form__section", children: [_jsx("div", { className: "panel__content__form__section__header__label", children: "Test Documentation" }), _jsx("textarea", { className: "panel__content__form__section__textarea mapping-testable-editor__doc__textarea", spellCheck: false, value: mappingTest.doc ?? '', onChange: (event) => {
                                                    atomicTest_setDoc(mappingTest, event.target.value ? event.target.value : undefined);
                                                } })] }) }) }) }), _jsx(ResizablePanelSplitter, { children: _jsx(ResizablePanelSplitterLine, { color: "var(--color-dark-grey-200)" }) }), _jsx(ResizablePanel, { children: _jsxs(ResizablePanelGroup, { orientation: "vertical", children: [_jsx(ResizablePanel, { children: _jsxs("div", { className: "service-test-data-editor panel", children: [mappingTestableDataState.dataHolder.storeTestData
                                                    .length ? (_jsx(_Fragment, { children: mappingTestableDataState.selectedDataState && (_jsx(StoreTestDataEditor, { storeTestDataState: mappingTestableDataState.selectedDataState, mappingTestState: mappingTestState })) })) : (_jsx(BlankPanelPlaceholder, { text: "Add Store Test Data", onClick: addStoreTestData, clickActionType: "add", tooltipText: "Click to add store test data" })), mappingTestableDataState.showNewModal && (_jsx(CreateStoreTestDataModal, { mappingTestState: mappingTestState }))] }) }), _jsx(ResizablePanelSplitter, { children: _jsx(ResizablePanelSplitterLine, { color: "var(--color-dark-grey-200)" }) }), _jsx(ResizablePanel, { children: mappingTestState.selectedAsertionState && (_jsx(TestAssertionEditor, { testAssertionState: mappingTestState.selectedAsertionState })) })] }) })] }) }) }) }));
});
const MappingTestableContextMenu = observer(forwardRef(function TestContainerContextMenu(props, ref) {
    const { addName, add, rename, _delete } = props;
    const addTest = () => {
        add?.();
    };
    const remove = () => _delete?.();
    const handleRename = () => rename?.();
    return (_jsxs(MenuContent, { ref: ref, children: [rename && (_jsx(MenuContentItem, { onClick: handleRename, children: "Rename" })), _delete && _jsx(MenuContentItem, { onClick: remove, children: "Delete" }), addName && rename && (_jsx(MenuContentItem, { onClick: addTest, children: `Add ${addName}` }))] }));
}));
const MappingTestItem = observer((props) => {
    const { mappingTestState, suiteState } = props;
    const mappingTest = mappingTestState.test;
    const isRunning = mappingTestState.runningTestAction.isInProgress;
    const [isSelectedFromContextMenu, setIsSelectedFromContextMenu] = useState(false);
    const isReadOnly = suiteState.mappingTestableState.mappingEditorState.isReadOnly;
    const openTest = () => suiteState.changeTest(mappingTest);
    const isActive = suiteState.selectTestState?.test === mappingTest;
    const _testableResult = getTestableResultFromTestResult(mappingTestState.testResultState.result);
    const testableResult = isRunning
        ? TESTABLE_RESULT.IN_PROGRESS
        : _testableResult;
    const resultIcon = getTestableResultIcon(testableResult);
    const onContextMenuOpen = () => setIsSelectedFromContextMenu(true);
    const onContextMenuClose = () => setIsSelectedFromContextMenu(false);
    const add = () => {
        suiteState.setShowModal(true);
    };
    const _delete = () => {
        suiteState.deleteTest(mappingTest);
    };
    const rename = () => {
        suiteState.mappingTestableState.setRenameComponent(mappingTest);
    };
    const runTest = () => {
        flowResult(mappingTestState.runTest()).catch(mappingTestState.editorStore.applicationStore.alertUnhandledError);
    };
    return (_jsx(ContextMenu, { className: clsx('testable-test-explorer__item', {
            'testable-test-explorer__item--selected-from-context-menu': !isActive && isSelectedFromContextMenu,
        }, { 'testable-test-explorer__item--active': isActive }), disabled: isReadOnly, content: _jsx(MappingTestableContextMenu, { addName: "Test", add: add, _delete: _delete, rename: rename }), menuProps: { elevation: 7 }, onOpen: onContextMenuOpen, onClose: onContextMenuClose, children: _jsxs("button", { className: clsx('testable-test-explorer__item__label'), onClick: openTest, tabIndex: -1, children: [_jsx("div", { className: "testable-test-explorer__item__label__icon", children: resultIcon }), _jsx("div", { className: "testable-test-explorer__item__label__text", children: mappingTest.id }), _jsx("div", { className: "mapping-test-explorer__item__actions", children: _jsx("button", { className: "mapping-test-explorer__item__action mapping-test-explorer__run-test-btn", onClick: runTest, disabled: mappingTestState.runningTestAction.isInProgress, tabIndex: -1, title: `Run ${mappingTestState.test.id}`, children: _jsx(PlayIcon, {}) }) })] }) }));
});
const MappingTestSuiteEditor = observer((props) => {
    const { mappingTestSuiteState } = props;
    const editorStore = mappingTestSuiteState.editorStore;
    const selectedTestState = mappingTestSuiteState.selectTestState;
    const isReadOnly = mappingTestSuiteState.mappingTestableState.mappingEditorState.isReadOnly;
    const addTest = () => mappingTestSuiteState.setShowModal(true);
    const runTests = () => {
        flowResult(mappingTestSuiteState.runSuite()).catch(editorStore.applicationStore.alertUnhandledError);
    };
    const runFailingTests = () => {
        flowResult(mappingTestSuiteState.runFailingTests()).catch(editorStore.applicationStore.alertUnhandledError);
    };
    const renderMappingTestEditor = () => {
        if (selectedTestState) {
            return _jsx(MappingTestEditor, { mappingTestState: selectedTestState });
        }
        else if (!mappingTestSuiteState.suite.tests.length) {
            return (_jsx(BlankPanelPlaceholder, { text: "Add Mapping Test", onClick: addTest, clickActionType: "add", tooltipText: "Click to add mapping test" }));
        }
        return null;
    };
    return (_jsxs(ResizablePanelGroup, { orientation: "horizontal", children: [_jsx(ResizablePanel, { size: 300, minSize: 28, children: _jsx(MappingTestSuiteQueryEditor, { testSuiteState: mappingTestSuiteState, mappingTestableState: mappingTestSuiteState.mappingTestableState, isReadOnly: isReadOnly }, mappingTestSuiteState.queryState.uuid) }), _jsx(ResizablePanelSplitter, { children: _jsx(ResizablePanelSplitterLine, { color: "var(--color-dark-grey-200)" }) }), _jsx(ResizablePanel, { minSize: 56, children: _jsxs(ResizablePanelGroup, { orientation: "vertical", children: [_jsxs(ResizablePanel, { size: 200, minSize: 28, children: [_jsxs("div", { className: "binding-editor__header", children: [_jsx("div", { className: "binding-editor__header__title", children: _jsx("div", { className: "panel__header__title__content", children: "Tests" }) }), _jsxs("div", { className: "panel__header__actions", children: [_jsx("button", { className: "panel__header__action testable-test-explorer__play__all__icon", tabIndex: -1, onClick: runTests, title: "Run All Tests", children: _jsx(RunAllIcon, {}) }), _jsx("button", { className: "panel__header__action testable-test-explorer__play__all__icon", tabIndex: -1, onClick: runFailingTests, title: "Run All Failing Tests", children: _jsx(RunErrorsIcon, {}) }), _jsx("button", { className: "panel__header__action", tabIndex: -1, onClick: addTest, title: "Add Mapping Test", children: _jsx(PlusIcon, {}) })] })] }), _jsxs(PanelContent, { children: [mappingTestSuiteState.testStates.map((test) => (_jsx(MappingTestItem, { mappingTestState: test, suiteState: mappingTestSuiteState }, test.uuid))), mappingTestSuiteState.showCreateModal && (_jsx(CreateTestModal, { mappingSuiteState: mappingTestSuiteState }))] })] }), _jsx(ResizablePanelSplitter, { children: _jsx(ResizablePanelSplitterLine, { color: "var(--color-dark-grey-200)" }) }), _jsx(ResizablePanel, { minSize: 28, children: renderMappingTestEditor() })] }) })] }));
});
const MappingTestSuiteItem = observer((props) => {
    const { suite, mappingTestableState } = props;
    const [isSelectedFromContextMenu, setIsSelectedFromContextMenu] = useState(false);
    const isReadOnly = mappingTestableState.mappingEditorState.isReadOnly;
    const openSuite = () => mappingTestableState.changeSuite(suite);
    const results = mappingTestableState.testableResults?.filter((t) => t.parentSuite?.id === suite.id);
    const isRunning = mappingTestableState.isRunningTestableSuitesState.isInProgress ||
        (mappingTestableState.isRunningFailingSuitesState.isInProgress &&
            mappingTestableState.failingSuites.includes(suite)) ||
        mappingTestableState.runningSuite === suite;
    const isActive = mappingTestableState.selectedTestSuite?.suite === suite;
    const _testableResult = getTestableResultFromTestResults(results);
    const testableResult = isRunning
        ? TESTABLE_RESULT.IN_PROGRESS
        : _testableResult;
    const resultIcon = getTestableResultIcon(testableResult);
    const onContextMenuOpen = () => setIsSelectedFromContextMenu(true);
    const onContextMenuClose = () => setIsSelectedFromContextMenu(false);
    const add = () => {
        mappingTestableState.openCreateModal();
    };
    const _delete = () => {
        mappingTestableState.deleteTestSuite(suite);
    };
    const rename = () => {
        mappingTestableState.setRenameComponent(suite);
    };
    const runSuite = () => {
        flowResult(mappingTestableState.runSuite(suite)).catch(mappingTestableState.editorStore.applicationStore.alertUnhandledError);
    };
    return (_jsx(ContextMenu, { className: clsx('testable-test-explorer__item', {
            'testable-test-explorer__item--selected-from-context-menu': !isActive && isSelectedFromContextMenu,
        }, { 'testable-test-explorer__item--active': isActive }), disabled: isReadOnly, content: _jsx(MappingTestableContextMenu, { addName: "Suite", add: add, _delete: _delete, rename: rename }), menuProps: { elevation: 7 }, onOpen: onContextMenuOpen, onClose: onContextMenuClose, children: _jsxs("button", { className: clsx('testable-test-explorer__item__label'), onClick: openSuite, tabIndex: -1, children: [_jsx("div", { className: "testable-test-explorer__item__label__icon", children: resultIcon }), _jsx("div", { className: "testable-test-explorer__item__label__text", children: suite.id }), _jsx("div", { className: "mapping-test-explorer__item__actions", children: _jsx("button", { className: "mapping-test-explorer__item__action mapping-test-explorer__run-test-btn", onClick: runSuite, disabled: isRunning, tabIndex: -1, title: `Run ${suite.id}`, children: _jsx(PlayIcon, {}) }) })] }) }));
});
export const MappingTestableEditor = observer((props) => {
    const { mappingTestableState } = props;
    const mappingEditorState = mappingTestableState.mappingEditorState;
    useEffect(() => {
        mappingTestableState.init();
    }, [mappingTestableState]);
    const isReadOnly = mappingEditorState.isReadOnly;
    const suites = mappingTestableState.mapping.tests;
    const selectedSuiteState = mappingTestableState.selectedTestSuite;
    const addSuite = () => mappingTestableState.openCreateModal();
    const runSuites = () => {
        mappingTestableState.runTestable();
    };
    const runFailingTests = () => {
        mappingTestableState.runAllFailingSuites();
    };
    const renderSuiteState = () => {
        if (selectedSuiteState) {
            return (_jsx(MappingTestSuiteEditor, { mappingTestSuiteState: selectedSuiteState }));
        }
        else if (!suites.length) {
            return (_jsx(BlankPanelPlaceholder, { text: "Add Test Suite", onClick: addSuite, clickActionType: "add", tooltipText: "Click to add test suite" }));
        }
        return null;
    };
    const renameTestingComponent = (val) => {
        mappingTestableState.renameTestableComponent(val);
    };
    useApplicationNavigationContext(LEGEND_STUDIO_APPLICATION_NAVIGATION_CONTEXT_KEY.MAPPING_EDITOR_TEST);
    return (_jsx("div", { className: "service-test-suite-editor panel", children: _jsxs("div", { className: "service-test-suite-editor", children: [_jsxs(ResizablePanelGroup, { orientation: "vertical", children: [_jsxs(ResizablePanel, { size: 200, minSize: 28, children: [_jsxs("div", { className: "binding-editor__header", children: [_jsx("div", { className: "binding-editor__header__title", children: _jsx("div", { className: "panel__header__title__content", children: "Test Suites" }) }), _jsxs("div", { className: "panel__header__actions", children: [_jsx("button", { className: "panel__header__action testable-test-explorer__play__all__icon", tabIndex: -1, onClick: runSuites, title: "Run All Suites", children: _jsx(RunAllIcon, {}) }), _jsx("button", { className: "panel__header__action testable-test-explorer__play__all__icon", tabIndex: -1, onClick: runFailingTests, title: "Run All Failing Tests", children: _jsx(RunErrorsIcon, {}) }), _jsx("button", { className: "panel__header__action", tabIndex: -1, onClick: addSuite, title: "Add Mapping Suite", children: _jsx(PlusIcon, {}) })] })] }), _jsxs(PanelContent, { children: [suites.map((suite) => (_jsx(MappingTestSuiteItem, { mappingTestableState: mappingTestableState, suite: suite }, suite.id))), !suites.length && (_jsx(BlankPanelPlaceholder, { text: "Add Test Suite", onClick: addSuite, clickActionType: "add", tooltipText: "Click to add test suite" }))] }), !suites.length && (_jsx(BlankPanelPlaceholder, { disabled: mappingEditorState.isReadOnly, onClick: addSuite, text: "Add a Test Suite", clickActionType: "add", tooltipText: "Click to add a new mapping test suite" }))] }), _jsx(ResizablePanelSplitter, { children: _jsx(ResizablePanelSplitterLine, { color: "var(--color-dark-grey-200)" }) }), _jsx(ResizablePanel, { minSize: 56, children: _jsx("div", { className: "panel mapping-testable-editorr", children: _jsx("div", { className: "mapping-testable-editor__content", children: renderSuiteState() }) }) })] }), mappingTestableState.createSuiteState && (_jsx(CreateTestSuiteModal, { creatorState: mappingTestableState.createSuiteState })), mappingTestableState.testableComponentToRename && (_jsx(RenameModal, { val: mappingTestableState.testableComponentToRename.id, isReadOnly: isReadOnly, showModal: true, closeModal: () => mappingTestableState.setRenameComponent(undefined), setValue: (val) => renameTestingComponent(val), errorMessageFunc: (_val) => validateTestableId(_val, undefined) }))] }) }));
});
//# sourceMappingURL=MappingTestableEditor.js.map