@finos/legend-application-studio
Version:
Legend Studio application core
111 lines • 12.7 kB
JavaScript
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 { ModelImporterState, ExtensionModelImporterEditorState, MODEL_IMPORT_NATIVE_INPUT_TYPE, NativeModelImporterEditorState, ExternalFormatModelImporterState, ExecuteInputDebugModelImporterEditorState, } from '../../../stores/editor/editor-state/ModelImporterState.js';
import { prettyCONSTName } from '@finos/legend-shared';
import { ControlledDropdownMenu, MenuContent, MenuContentItem, CaretDownIcon, CheckSquareIcon, TruckLoadingIcon, EmptySquareIcon, BlankPanelContent, PanelLoadingIndicator, clsx, Button, Panel, PanelHeader, PanelContent, } from '@finos/legend-art';
import { flowResult } from 'mobx';
import { useEditorStore } from '../EditorStoreProvider.js';
import { useApplicationStore, useApplicationNavigationContext, } from '@finos/legend-application';
import { LEGEND_STUDIO_APPLICATION_NAVIGATION_CONTEXT_KEY } from '../../../__lib__/LegendStudioApplicationNavigationContext.js';
import { SCHEMA_SET_TAB_TYPE } from '../../../stores/editor/editor-state/element-editor-state/external-format/DSL_ExternalFormat_SchemaSetEditorState.js';
import { SchemaSetModelGenerationEditor } from './external-format-editor/DSL_ExternalFormat_SchemaSetModelGenerationEditor.js';
import { SchemaSetGeneralEditor } from './external-format-editor/DSL_ExternalFormat_SchemaSetElementEditor.js';
import { CODE_EDITOR_LANGUAGE } from '@finos/legend-code-editor';
import { CodeEditor } from '@finos/legend-lego/code-editor';
const ExternalFormatModelImporterEditor = observer((props) => {
const { externalFormatState } = props;
const schemaSetEditorState = externalFormatState.schemaSetEditorState;
const editorStore = schemaSetEditorState.editorStore;
const schemaSet = schemaSetEditorState.schemaSet;
const currentTab = schemaSetEditorState.selectedTab;
const isFetchingDescriptions = editorStore.graphState.graphGenerationState.externalFormatState
.fetchingDescriptionsState.isInProgress;
const changeTab = (tab) => () => schemaSetEditorState.setSelectedTab(tab);
const renderMainEditPanel = () => {
if (isFetchingDescriptions) {
return (_jsx(BlankPanelContent, { children: "Fetching format descriptions" }));
}
if (currentTab === SCHEMA_SET_TAB_TYPE.SCHEMAS) {
return (_jsx(SchemaSetGeneralEditor, { schemaSetEditorState: schemaSetEditorState, isReadOnly: false }));
}
const supportsModelGeneraiton = schemaSetEditorState.schemaSetModelGenerationState.description
?.supportsModelGeneration;
return supportsModelGeneraiton ? (_jsx(SchemaSetModelGenerationEditor, { modelGenerationState: schemaSetEditorState.schemaSetModelGenerationState, isReadOnly: false })) : (_jsxs(BlankPanelContent, { children: ["Format ", schemaSet.format, " does not support Model Generation"] }));
};
useApplicationNavigationContext(LEGEND_STUDIO_APPLICATION_NAVIGATION_CONTEXT_KEY.MODEL_LOADER_EXTERNAL_FORMAT_IMPORTER);
return (_jsx(Panel, { className: "schema-set-panel", children: _jsxs(PanelContent, { className: "model-loader", children: [_jsx(PanelLoadingIndicator, { isLoading: isFetchingDescriptions }), _jsx(PanelHeader, { children: _jsx("div", { className: "uml-element-editor__tabs", children: Object.values(SCHEMA_SET_TAB_TYPE).map((tab) => (_jsx("div", { onClick: changeTab(tab), className: clsx('relational-connection-editor__tab', {
'relational-connection-editor__tab--active': tab === currentTab,
}), children: prettyCONSTName(tab) }, tab))) }) }), _jsxs(PanelContent, { className: "file-generation-editor__content", children: [currentTab === SCHEMA_SET_TAB_TYPE.SCHEMAS && (_jsx(SchemaSetGeneralEditor, { schemaSetEditorState: schemaSetEditorState, isReadOnly: false })), currentTab === SCHEMA_SET_TAB_TYPE.GENERATE_MODEL &&
renderMainEditPanel()] })] }) }));
});
export const ModelImporter = observer(() => {
const editorStore = useEditorStore();
const applicationStore = useApplicationStore();
const modelImporterState = editorStore.tabManagerState.getCurrentEditorState(ModelImporterState);
const nativeInputTypes = Object.values(MODEL_IMPORT_NATIVE_INPUT_TYPE);
const extraModelImporterExtensionsConfigs = modelImporterState.extensionConfigs;
const externalFormatDescriptions = modelImporterState.editorStore.graphState.graphGenerationState
.externalFormatState.externalFormatDescriptionsWithModelGenerationSupport;
// replace flag
const replace = modelImporterState.replace;
const toggleReplace = () => modelImporterState.setReplaceFlag(!replace);
const label = modelImporterState.modelImportEditorState.label;
const modelImportEditorState = modelImporterState.modelImportEditorState;
const loadModel = () => {
editorStore.localChangesState.alertUnsavedChanges(() => {
modelImporterState.modelImportEditorState
.loadModel()
.catch(applicationStore.alertUnhandledError);
});
};
useApplicationNavigationContext(LEGEND_STUDIO_APPLICATION_NAVIGATION_CONTEXT_KEY.MODEL_LOADER);
const renderExtraActions = () => {
if (modelImportEditorState instanceof NativeModelImporterEditorState) {
// actions
const loadCurrentProjectEntities = applicationStore.guardUnhandledError(() => flowResult(modelImportEditorState.loadCurrentProjectEntities()));
return (_jsxs("div", { className: "model-loader__header__configs__load-project-entities-btn", onClick: loadCurrentProjectEntities, title: "Load current project entities", children: [_jsx("div", { className: "model-loader__header__configs__edit-mode__icon", children: _jsx(TruckLoadingIcon, {}) }), _jsx("div", { className: "model-loader__header__configs__edit-mode__label", children: "Load from Graph" })] }));
}
return null;
};
const renderModelImporterEditor = () => {
if (modelImportEditorState instanceof ExtensionModelImporterEditorState) {
return modelImportEditorState.config.renderer(modelImportEditorState.rendererState);
}
else if (modelImportEditorState instanceof NativeModelImporterEditorState) {
const updateModel = (val) => modelImportEditorState.setModelText(val);
return (_jsx(PanelContent, { className: "model-loader__editor", children: _jsx(CodeEditor, { language: modelImportEditorState.nativeType ===
MODEL_IMPORT_NATIVE_INPUT_TYPE.PURE_GRAMMAR
? CODE_EDITOR_LANGUAGE.PURE
: CODE_EDITOR_LANGUAGE.JSON, inputValue: modelImportEditorState.modelText, updateInput: updateModel }) }));
}
else if (modelImportEditorState instanceof ExternalFormatModelImporterState) {
return (_jsx(ExternalFormatModelImporterEditor, { externalFormatState: modelImportEditorState }));
}
else if (modelImportEditorState instanceof
ExecuteInputDebugModelImporterEditorState) {
return (_jsxs(PanelContent, { className: "model-loader__editor", children: [_jsxs("div", { className: "model-loader__debugger__function-path", children: [_jsx("div", { className: "model-loader__debugger__function-path__label", children: "Debug Executable:" }), _jsx("input", { className: "panel__content__form__section__input", value: modelImportEditorState.executablePath, onChange: (event) => modelImportEditorState.setExecutablePath(event.target.value) })] }), _jsx("div", { className: "model-loader__debugger__execute-input", children: _jsx(CodeEditor, { language: CODE_EDITOR_LANGUAGE.JSON, inputValue: modelImportEditorState.executeInput, updateInput: (val) => modelImportEditorState.setExecuteInput(val) }) })] }));
}
return null;
};
return (_jsxs(Panel, { className: "model-loader", children: [_jsxs(PanelHeader, { className: "model-loader__header", children: [_jsxs("div", { className: "model-loader__header__configs", children: [_jsxs(ControlledDropdownMenu, { className: "model-loader__header__configs__type", content: _jsxs(MenuContent, { className: "model-loader__header__configs__type__menu", children: [_jsxs("div", { className: "model-loader__header__configs__type-option__group model-loader__header__configs__type-option__group--native", children: [_jsx("div", { className: "model-loader__header__configs__type-option__group__name", children: "native" }), _jsxs("div", { className: "model-loader__header__configs__type-option__group__options", children: [nativeInputTypes.map((inputType) => (_jsx(MenuContentItem, { className: "model-loader__header__configs__type-option__group__option", onClick: () => modelImporterState.setNativeImportType(inputType), children: prettyCONSTName(inputType) }, inputType))), _jsx(MenuContentItem, { className: "model-loader__header__configs__type-option__group__option", onClick: () => modelImporterState.setExecuteInputDebugModelImporter(), children: `Execute Input (DEBUG)` })] })] }), Boolean(externalFormatDescriptions.length) && (_jsxs(_Fragment, { children: [_jsx("div", { className: "model-loader__header__configs__type-option__group__separator" }), _jsxs("div", { className: "model-loader__header__configs__type-option__group model-loader__header__configs__type-option__group--external", children: [_jsx("div", { className: "model-loader__header__configs__type-option__group__name", children: "external" }), _jsx("div", { className: "model-loader__header__configs__type-option__group__options", children: externalFormatDescriptions.map((inputType) => (_jsx(MenuContentItem, { className: "model-loader__header__configs__type-option__group__option", onClick: () => modelImporterState.setExternalFormatImportFormat(inputType), children: inputType.name }, inputType.name))) })] })] })), Boolean(extraModelImporterExtensionsConfigs.length > 0) && (_jsxs(_Fragment, { children: [_jsx("div", { className: "model-loader__header__configs__type-option__group__separator" }), _jsxs("div", { className: "model-loader__header__configs__type-option__group model-loader__header__configs__type-option__group--extension", children: [_jsx("div", { className: "model-loader__header__configs__type-option__group__name", children: "extensions" }), _jsx("div", { className: "model-loader__header__configs__type-option__group__options", children: extraModelImporterExtensionsConfigs.map((config) => (_jsx(MenuContentItem, { className: "model-loader__header__configs__type-option__group__option", onClick: () => modelImporterState.setModelImporterExtension(config), children: config.label ?? prettyCONSTName(config.key) }, config.key))) })] })] }))] }), menuProps: {
anchorOrigin: { vertical: 'bottom', horizontal: 'right' },
transformOrigin: { vertical: 'top', horizontal: 'right' },
}, children: [_jsx("div", { className: "model-loader__header__configs__type__label", children: prettyCONSTName(label) }), _jsx("div", { className: "model-loader__header__configs__type__icon", children: _jsx(CaretDownIcon, {}) })] }), modelImportEditorState.allowHardReplace && (_jsxs("div", { className: "model-loader__header__configs__edit-mode", onClick: toggleReplace, children: [_jsx("div", { className: "model-loader__header__configs__edit-mode__icon", children: replace ? _jsx(CheckSquareIcon, {}) : _jsx(EmptySquareIcon, {}) }), _jsx("div", { className: "model-loader__header__configs__edit-mode__label", children: "replace" })] })), renderExtraActions()] }), _jsx("div", { className: "model-loader__header__action", children: _jsx(Button, { className: "model-loader__header__load-btn", onClick: loadModel, disabled: modelImportEditorState.loadModelActionState.isInProgress ||
modelImportEditorState.isLoadingDisabled, title: "Load model", text: "Load" }) })] }), renderModelImporterEditor()] }));
});
//# sourceMappingURL=ModelImporter.js.map