@finos/legend-extension-dsl-data-space-studio/lib/components/DataSpaceGeneralEditor/DataSpaceDiagramsSection.js

Legend extension for Data Space DSL - Studio

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 { useEditorStore } from '@finos/legend-application-studio';
import { CustomSelectorInput, ListEditor, PanelFormTextField, } from '@finos/legend-art';
import { DataSpaceDiagram } from '@finos/legend-extension-dsl-data-space/graph';
import { observer } from 'mobx-react-lite';
import { DataSpaceEditorState } from '../../stores/DataSpaceEditorState.js';
import { PackageableElementExplicitReference } from '@finos/legend-graph';
import {} from '@finos/legend-extension-dsl-diagram/graph';
import { dataSpace_addDiagram, dataSpace_removeDiagram, dataSpace_setDiagramTitle, dataSpace_setDiagramDescription, } from '../../stores/studio/DSL_DataSpace_GraphModifierHelper.js';
export const DataSpaceDiagramsSection = observer(() => {
    const editorStore = useEditorStore();
    const dataSpaceState = editorStore.tabManagerState.getCurrentEditorState(DataSpaceEditorState);
    const dataSpace = dataSpaceState.dataSpace;
    // Event handlers
    const handleAddDiagram = (option) => {
        if (typeof option.value === 'object') {
            const diagramValue = option.value;
            const newDiagram = new DataSpaceDiagram();
            newDiagram.title = diagramValue.name;
            newDiagram.diagram =
                PackageableElementExplicitReference.create(diagramValue);
            dataSpace_addDiagram(dataSpace, newDiagram);
        }
    };
    const handleRemoveDiagram = (diagram) => {
        dataSpace_removeDiagram(dataSpace, diagram);
    };
    const handleDiagramTitleChange = (diagram, value) => {
        dataSpace_setDiagramTitle(diagram, value ?? '');
    };
    const handleDiagramDescriptionChange = (diagram, value) => {
        dataSpace_setDiagramDescription(diagram, value);
    };
    // ListEditor component renderers
    const DiagramComponent = observer((props) => {
        const { item } = props;
        return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "panel__content__form__section__list__item__content", children: [_jsx("div", { className: "panel__content__form__section__header__label", children: "Diagram" }), _jsx("div", { className: "panel__content__form__section__list__item__content__title", children: item.diagram.value.path })] }), _jsxs("div", { className: "panel__content__form__section__list__item__form", children: [_jsx(PanelFormTextField, { name: "Title", value: item.title, update: (value) => handleDiagramTitleChange(item, value), placeholder: "Enter title", className: "dataSpace-editor__general__diagrams__title" }), _jsx(PanelFormTextField, { name: "Description", value: item.description ?? '', update: (value) => handleDiagramDescriptionChange(item, value), placeholder: "Enter description", className: "dataSpace-editor__general__diagrams__description" })] })] }));
    });
    const NewDiagramComponent = observer((props) => {
        const { onFinishEditing } = props;
        return (_jsx("div", { className: "panel__content__form__section__list__new-item__input", children: _jsx(CustomSelectorInput, { options: dataSpaceState.getDiagramOptions(), onChange: (event) => {
                    onFinishEditing();
                    handleAddDiagram(event);
                }, placeholder: "Select a diagram to add...", darkMode: true }) }));
    });
    return (_jsx(ListEditor, { title: "Diagrams", prompt: "Add diagrams to include in this Data Product. Set a title and description for each diagram.", items: dataSpace.diagrams, keySelector: (element) => element.diagram.value.path, ItemComponent: DiagramComponent, NewItemComponent: NewDiagramComponent, handleRemoveItem: handleRemoveDiagram, isReadOnly: dataSpaceState.isReadOnly, emptyMessage: "No diagrams specified" }));
});
//# sourceMappingURL=DataSpaceDiagramsSection.js.map