@finos/legend-studio
Version:
61 lines • 6 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } 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 { ResizablePanel, ResizablePanelGroup, ResizablePanelSplitter, ResizablePanelSplitterLine, clsx, PlusIcon, ContextMenu, Dialog, BlankPanelPlaceholder, } from '@finos/legend-art';
import { observer } from 'mobx-react-lite';
import { ServiceTestDataEditor } from './ServiceTestDataEditor.js';
import { ServiceTestsEditor } from './ServiceTestsEditor.js';
import { forwardRef, useState } from 'react';
import { testSuite_setId } from '../../../../../stores/graphModifier/Testable_GraphModifierHelper.js';
import { guaranteeNonNullable } from '@finos/legend-shared';
export const ServiceTestSuiteEditor = observer((props) => {
const { serviceTestSuiteState } = props;
return (_jsx("div", { className: "service-test-suite-editor", children: _jsxs(ResizablePanelGroup, { orientation: "horizontal", children: [_jsx(ResizablePanel, { size: 300, minSize: 28, children: _jsx(ServiceTestDataEditor, { testDataState: serviceTestSuiteState.testDataState }) }), _jsx(ResizablePanelSplitter, { children: _jsx(ResizablePanelSplitterLine, { color: "var(--color-dark-grey-200)" }) }), _jsx(ResizablePanel, { minSize: 56, children: _jsx(ServiceTestsEditor, { suiteState: serviceTestSuiteState }) })] }) }));
});
const ServiceSuiteHeaderTabContextMenu = observer(forwardRef(function MappingEditorHeaderTabContextMenu(props, ref) {
const { testSuite, testableState } = props;
const deleteSuite = () => testableState.deleteSuite(testSuite);
const rename = () => testableState.setSuiteToRename(testSuite);
return (_jsxs("div", { ref: ref, className: "mapping-editor__header__tab__context-menu", children: [_jsx("button", { className: "mapping-editor__header__tab__context-menu__item", onClick: rename, children: "Rename" }), _jsx("button", { className: "mapping-editor__header__tab__context-menu__item", onClick: deleteSuite, children: "Delete" })] }));
}));
export const RenameModal = observer((props) => {
const { val, isReadOnly, showModal, closeModal, setValue } = props;
const [inputValue, setInputValue] = useState(val);
const handleSubmit = () => {
setValue(inputValue);
closeModal();
};
const changeValue = (event) => {
setInputValue(event.target.value);
};
return (_jsx(Dialog, { open: showModal, onClose: closeModal, classes: { container: 'search-modal__container' }, PaperProps: { classes: { root: 'search-modal__inner-container' } }, children: _jsxs("form", { onSubmit: handleSubmit, className: "modal modal--dark search-modal", children: [_jsx("div", { className: "modal__title", children: "Rename" }), _jsx("div", { children: _jsx("input", { className: "panel__content__form__section__input", spellCheck: false, disabled: isReadOnly, value: inputValue, onChange: changeValue }) }), _jsx("div", { className: "search-modal__actions", children: _jsx("button", { className: "btn btn--dark", disabled: isReadOnly, children: "Rename" }) })] }) }));
});
export const ServiceTestableEditor = observer((props) => {
const { serviceTestableState } = props;
const serviceEditorState = serviceTestableState.serviceEditorState;
const service = serviceEditorState.service;
const selectedSuite = serviceTestableState.selectedSuiteState?.suite;
const changeSuite = (suite) => {
serviceTestableState.changeSuite(suite);
};
const addSuite = () => serviceTestableState.addTestSuite();
const isReadOnly = serviceEditorState.isReadOnly;
const renameSuite = (val) => testSuite_setId(guaranteeNonNullable(serviceTestableState.suiteToRename), val);
return (_jsxs("div", { className: "service-test-suite-editor panel", children: [_jsxs("div", { className: "panel__header", children: [service.tests.length ? (_jsx("div", { className: "panel__header service-test-suite-editor__header service-test-suite-editor__header--with-tabs", children: _jsx("div", { className: "uml-element-editor__tabs", children: service.tests.map((suite) => (_jsx("div", { onClick: () => changeSuite(suite), className: clsx('service-test-suite-editor__tab', {
'service-test-suite-editor__tab--active': suite === selectedSuite,
}), children: _jsx(ContextMenu, { className: "mapping-editor__header__tab__content", content: _jsx(ServiceSuiteHeaderTabContextMenu, { testableState: serviceTestableState, testSuite: suite }), children: suite.id }) }, suite.id))) }) })) : (_jsx("div", {})), _jsx("div", { className: "panel__header__actions", children: _jsx("button", { className: "panel__header__action", tabIndex: -1, onClick: addSuite, title: "Add Service Suite", children: _jsx(PlusIcon, {}) }) })] }), _jsxs("div", { className: "service-test-suite-editor panel", children: [serviceTestableState.selectedSuiteState && (_jsx(ServiceTestSuiteEditor, { serviceTestSuiteState: serviceTestableState.selectedSuiteState })), !service.tests.length && (_jsx(BlankPanelPlaceholder, { placeholderText: "Add Test Suite", onClick: addSuite, clickActionType: "add", tooltipText: "Click to add test" })), serviceTestableState.suiteToRename && (_jsx(RenameModal, { val: serviceTestableState.suiteToRename.id, isReadOnly: isReadOnly, showModal: true, closeModal: () => serviceTestableState.setSuiteToRename(undefined), setValue: renameSuite }))] })] }));
});
//# sourceMappingURL=ServiceTestableEditor.js.map