@finos/legend-extension-dsl-data-space-studio
Version:
Legend extension for Data Space DSL - Studio
93 lines • 7.41 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 { useState } from 'react';
import { observer } from 'mobx-react-lite';
import { useEditorStore } from '@finos/legend-application-studio';
import { EyeIcon, WandIcon, Panel, PanelContent, PanelHeader, Dialog, Modal, ModalHeader, ModalBody, ModalFooter, ModalFooterButton, CustomSelectorInput, } from '@finos/legend-art';
import { DataSpaceEditorState, onConvertDataSpaceToDataProduct, onMergeDataSpaceToDataProduct, } from '../stores/DataSpaceEditorState.js';
import { DataSpaceGeneralEditor } from './DataSpaceGeneralEditor/DataSpaceGeneralEditor.js';
import { DataSpacePreviewState } from '../stores/DataSpacePreviewState.js';
import { flowResult } from 'mobx';
import { isStubbed_PackageableElement, } from '@finos/legend-graph';
import { DSL_DATA_SPACE_LEGEND_STUDIO_APPLICATION_NAVIGATION_CONTEXT_KEY } from '../__lib__/DSL_DataSpace_LegendStudioDocumentation.js';
import { useApplicationNavigationContext } from '@finos/legend-application';
export const DataSpaceEditor = observer(() => {
const editorStore = useEditorStore();
const dataSpaceState = editorStore.tabManagerState.getCurrentEditorState(DataSpaceEditorState);
const dataSpace = dataSpaceState.dataSpace;
const dataSpacePreviewState = DataSpacePreviewState.retrieveNullableState(editorStore);
if (!dataSpacePreviewState) {
return null;
}
const validPreviewState = () => {
const stubDefault = Boolean(isStubbed_PackageableElement(dataSpace.defaultExecutionContext.defaultRuntime.value) &&
isStubbed_PackageableElement(dataSpace.defaultExecutionContext.mapping.value));
return Boolean(!stubDefault);
};
const previewDataSpace = () => {
flowResult(dataSpacePreviewState.previewDataSpace(dataSpaceState.dataSpace)).catch(editorStore.applicationStore.alertUnhandledError);
};
const convertDataSpace = () => {
flowResult(onConvertDataSpaceToDataProduct(dataSpace, editorStore, dataSpaceState)).catch(editorStore.applicationStore.alertUnhandledError);
};
const eligibleMergeTargets = editorStore.graphManagerState.graph.ownDataProducts.filter((dp) => dp.nativeModelAccess === undefined);
const mergeDataSpace = (targetDataProduct) => {
flowResult(onMergeDataSpaceToDataProduct(dataSpace, targetDataProduct, editorStore, dataSpaceState)).catch(editorStore.applicationStore.alertUnhandledError);
};
const [showConvertModal, setShowConvertModal] = useState(false);
const modeOptions = [
{ label: 'Merge', value: 'merge' },
{ label: 'Create', value: 'create' },
];
const [selectedMode, setSelectedMode] = useState(modeOptions[0] ?? null);
const mergeTargetOptions = eligibleMergeTargets.map((dp) => ({
label: dp.path,
value: dp,
}));
const [selectedMergeTarget, setSelectedMergeTarget] = useState(mergeTargetOptions[0] ?? null);
const onConvertButtonClick = () => {
if (eligibleMergeTargets.length === 0) {
convertDataSpace();
return;
}
setSelectedMode(modeOptions[0] ?? null);
setSelectedMergeTarget(mergeTargetOptions[0] ?? null);
setShowConvertModal(true);
};
const closeConvertModal = () => setShowConvertModal(false);
const handleConvertConfirm = () => {
closeConvertModal();
if (selectedMode?.value === 'merge' && selectedMergeTarget) {
mergeDataSpace(selectedMergeTarget.value);
}
else {
convertDataSpace();
}
};
useApplicationNavigationContext(DSL_DATA_SPACE_LEGEND_STUDIO_APPLICATION_NAVIGATION_CONTEXT_KEY.DATA_SPACE_EDITOR);
return (_jsxs(Panel, { className: "dataSpace-editor", children: [_jsx(PanelHeader, { title: "Data Product", titleContent: dataSpaceState.dataSpace.name, darkMode: true, isReadOnly: dataSpaceState.isReadOnly }), _jsx(PanelHeader, { title: "General", darkMode: true, children: _jsxs("div", { className: "panel__header__actions", children: [_jsx("div", { className: "btn__dropdown-combo btn__dropdown-combo--primary", children: _jsxs("button", { className: "btn__dropdown-combo__label", onClick: onConvertButtonClick, title: "Convert to Data Product", tabIndex: -1, style: { width: 'auto', whiteSpace: 'nowrap' }, children: [_jsx(WandIcon, { className: "btn__dropdown-combo__label__icon" }), _jsx("div", { className: "btn__dropdown-combo__label__title", children: "Convert to DataProduct" })] }) }), _jsx("div", { className: "btn__dropdown-combo btn__dropdown-combo--primary", children: _jsxs("button", { className: "btn__dropdown-combo__label", onClick: previewDataSpace, title: "Preview Data Product", tabIndex: -1, disabled: !validPreviewState(), children: [_jsx(EyeIcon, { className: "btn__dropdown-combo__label__icon" }), _jsx("div", { className: "btn__dropdown-combo__label__title", children: "Preview" })] }) })] }) }), _jsx(Dialog, { open: showConvertModal, onClose: closeConvertModal, children: _jsxs(Modal, { darkMode: true, children: [_jsx(ModalHeader, { title: "Convert to Data Product" }), _jsxs(ModalBody, { children: [_jsxs("div", { className: "panel__content__form__section", children: [_jsx("div", { className: "panel__content__form__section__header__label", children: "Mode" }), _jsx(CustomSelectorInput, { options: modeOptions, onChange: (val) => {
if (val) {
setSelectedMode(val);
if (val.value === 'merge') {
setSelectedMergeTarget(mergeTargetOptions[0] ?? null);
}
}
}, value: selectedMode, darkMode: true })] }), selectedMode?.value === 'merge' && (_jsxs("div", { className: "panel__content__form__section", children: [_jsx("div", { className: "panel__content__form__section__header__label", children: "Target Data Product" }), _jsx(CustomSelectorInput, { options: mergeTargetOptions, onChange: (val) => {
setSelectedMergeTarget(val);
}, value: selectedMergeTarget, darkMode: true })] }))] }), _jsxs(ModalFooter, { children: [_jsx(ModalFooterButton, { text: "Cancel", onClick: closeConvertModal, type: "secondary" }), _jsx(ModalFooterButton, { text: selectedMode?.value === 'merge' ? 'Merge' : 'Create', onClick: handleConvertConfirm, disabled: selectedMode?.value === 'merge' && !selectedMergeTarget })] })] }) }), _jsx(PanelContent, { children: _jsx(DataSpaceGeneralEditor, {}) })] }));
});
//# sourceMappingURL=DataSpaceEditor.js.map