UNPKG

@finos/legend-extension-dsl-data-space

Version:
148 lines 12.6 kB
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 { CustomSelectorInput, createFilter, ControlledDropdownMenu, MenuContentItem, MenuContent, MenuContentItemIcon, CheckIcon, MenuContentItemLabel, SearchIcon, PanelHeaderActions, PanelHeader, MoreVerticalIcon, compareLabelFn, PanelHeaderActionItem, AnchorLinkIcon, } from '@finos/legend-art'; import { observer } from 'mobx-react-lite'; import { useApplicationStore } from '@finos/legend-application'; import { resolveUsableDataSpaceClasses, } from '../../stores/query-builder/DataSpaceQueryBuilderState.js'; import { buildRuntimeValueOption, getRuntimeOptionFormatter, QueryBuilderClassSelector, } from '@finos/legend-query-builder'; import { getMappingCompatibleRuntimes, PackageableElementExplicitReference, RuntimePointer, } from '@finos/legend-graph'; import { ResolvedDataSpaceEntityWithOrigin } from '../../stores/shared/DataSpaceInfo.js'; import { DepotEntityWithOrigin, generateGAVCoordinates, } from '@finos/legend-storage'; import { useEffect } from 'react'; import { guaranteeNonNullable, guaranteeType } from '@finos/legend-shared'; import { flowResult } from 'mobx'; import {} from '../../graph/metamodel/pure/model/packageableElements/dataSpace/DSL_DataSpace_DataSpace.js'; import { DataSpaceAdvancedSearchModal } from './DataSpaceAdvancedSearchModal.js'; export const formatDataSpaceOptionLabel = (option) => (_jsx("div", { className: "query-builder__setup__data-space__option", title: `${option.label} - ${option.value.path} - ${option.value.origin ? generateGAVCoordinates(option.value.origin.groupId, option.value.origin.artifactId, option.value.origin.versionId) : ''}`, children: _jsx("div", { className: "query-builder__setup__data-space__option__label", children: option.label }) })); const resolveExecutionContextRuntimes = (queryBuilderState) => { if (queryBuilderState.dataSpaceAnalysisResult) { const executionContext = Array.from(queryBuilderState.dataSpaceAnalysisResult.executionContextsIndex.values()).find((e) => e.mapping.path === queryBuilderState.executionContext.mapping.value.path); return guaranteeNonNullable(executionContext).compatibleRuntimes; } return getMappingCompatibleRuntimes(queryBuilderState.executionContext.mapping.value, queryBuilderState.graphManagerState.usableRuntimes); }; export const buildExecutionContextOption = (value) => ({ label: value.name, value, }); /** * This setup panel supports cascading in order: Data-space -> Execution context (-> Runtime) -> Class * * In other words, we will only show: * - For runtime selector: the list of compatible runtimes with the selected execution context mapping * - For class selector: the list of compatible class with the selected execution context mapping * * See details on propagation/cascading in {@link DataSpaceQueryBuilderState} */ const DataSpaceQueryBuilderSetupPanelContent = observer((props) => { const { queryBuilderState } = props; const applicationStore = useApplicationStore(); // data product const dataSpaceOptions = queryBuilderState.dataSpaceOptions; const allOptions = [ ...dataSpaceOptions, ...(queryBuilderState.extraOptionsConfig?.options ?? []), ]; const selectedDataSpaceOption = queryBuilderState.selectedDataSpaceOption; const onDataSpaceOptionChange = (option) => { const value = option?.value; if (value instanceof ResolvedDataSpaceEntityWithOrigin) { queryBuilderState.queryChatState?.abort(); queryBuilderState .onDataSpaceChange(value) .catch(queryBuilderState.applicationStore.alertUnhandledError); } else if (value instanceof DepotEntityWithOrigin && queryBuilderState.extraOptionsConfig) { queryBuilderState.queryChatState?.abort(); queryBuilderState.extraOptionsConfig.onChange(value); } }; const openDataSpaceAdvancedSearch = () => { if (queryBuilderState.isAdvancedDataSpaceSearchEnabled) { queryBuilderState.showAdvancedSearchPanel(queryBuilderState.dataSpace); } }; // execution context const executionContextOptions = queryBuilderState.dataSpace.executionContexts .map(buildExecutionContextOption) .sort(compareLabelFn); const showExecutionContextOptions = executionContextOptions.length > 1; const selectedExecutionContextOption = buildExecutionContextOption(queryBuilderState.executionContext); const onExecutionContextOptionChange = async (option) => { if (option.value === queryBuilderState.executionContext) { return; } const currentMapping = queryBuilderState.executionContext.mapping.value.path; queryBuilderState.setExecutionContext(option.value); await queryBuilderState.propagateExecutionContextChange(currentMapping === option.value.mapping.value.path); queryBuilderState.onExecutionContextChange?.(option.value); }; const handleExecutionContextOptionChange = (option) => { flowResult(onExecutionContextOptionChange(option)); }; // runtime const runtimeOptions = resolveExecutionContextRuntimes(queryBuilderState) .map((rt) => new RuntimePointer(PackageableElementExplicitReference.create(rt))) .map(buildRuntimeValueOption) .sort(compareLabelFn); const selectedRuntimeOption = queryBuilderState.executionContextState .runtimeValue ? buildRuntimeValueOption(queryBuilderState.executionContextState.runtimeValue) : null; const changeRuntime = (option) => { if (option.value === queryBuilderState.executionContextState.runtimeValue) { return; } queryBuilderState.changeRuntime(option.value); queryBuilderState.onRuntimeChange?.(option.value); }; const runtimeFilterOption = createFilter({ ignoreCase: true, ignoreAccents: false, stringify: (option) => guaranteeType(option.data.value, RuntimePointer).packageableRuntime .value.path, }); // class const classes = resolveUsableDataSpaceClasses(queryBuilderState.dataSpace, queryBuilderState.executionContext.mapping.value, queryBuilderState.graphManagerState, queryBuilderState); useEffect(() => { flowResult(queryBuilderState.loadEntities()).catch(applicationStore.alertUnhandledError); }, [queryBuilderState, applicationStore]); const copyDataSpaceLinkToClipboard = () => { if (queryBuilderState.isDataSpaceLinkable) { queryBuilderState.copyDataSpaceLinkToClipboard(); } }; return (_jsxs("div", { className: "query-builder__setup__config-group", children: [_jsx(PanelHeader, { title: "properties", children: _jsxs(PanelHeaderActions, { children: [_jsx(PanelHeaderActionItem, { title: "copy data product query set up link to clipboard", onClick: copyDataSpaceLinkToClipboard, disabled: !queryBuilderState.isDataSpaceLinkable, children: _jsx(AnchorLinkIcon, {}) }), _jsx(ControlledDropdownMenu, { className: "panel__header__action query-builder__setup__config-group__header__dropdown-trigger", title: "Show Settings...", content: _jsx(MenuContent, { children: _jsxs(MenuContentItem, { onClick: () => queryBuilderState.setShowRuntimeSelector(!queryBuilderState.showRuntimeSelector), children: [_jsx(MenuContentItemIcon, { children: queryBuilderState.showRuntimeSelector ? (_jsx(CheckIcon, {})) : null }), _jsx(MenuContentItemLabel, { children: "Show Runtime Selector" })] }) }), menuProps: { anchorOrigin: { vertical: 'bottom', horizontal: 'right' }, transformOrigin: { vertical: 'top', horizontal: 'right' }, }, children: _jsx(MoreVerticalIcon, { className: "query-builder__icon__more-options" }) })] }) }), _jsxs("div", { className: "query-builder__setup__config-group__content", children: [_jsxs("div", { className: "query-builder__setup__config-group__item", children: [_jsx("label", { className: "btn--sm query-builder__setup__config-group__data-product", title: "data product", htmlFor: "query-builder__setup__data-space-selector", children: "Data Product" }), _jsx(CustomSelectorInput, { inputId: "query-builder__setup__data-space-selector", className: "panel__content__form__section__dropdown query-builder__setup__config-group__item__selector", options: allOptions, isLoading: queryBuilderState.loadEntitiesState.isInProgress, onChange: onDataSpaceOptionChange, value: selectedDataSpaceOption, placeholder: "Search for data product...", escapeClearsValue: true, darkMode: !applicationStore.layoutService .TEMPORARY__isLightColorThemeEnabled, formatOptionLabel: formatDataSpaceOptionLabel }), queryBuilderState.isAdvancedDataSpaceSearchEnabled && (_jsxs(_Fragment, { children: [_jsx("button", { tabIndex: -1, className: "query-builder__setup__data-space-searcher__btn btn--dark", onClick: openDataSpaceAdvancedSearch, title: "Open advanced search for data product...", children: _jsx(SearchIcon, {}) }), queryBuilderState.advancedSearchState && (_jsx(DataSpaceAdvancedSearchModal, { searchState: queryBuilderState.advancedSearchState, onClose: () => queryBuilderState.hideAdvancedSearchPanel() }))] }))] }), Boolean(showExecutionContextOptions) && (_jsxs("div", { className: "query-builder__setup__config-group__item", children: [_jsx("label", { className: "btn--sm query-builder__setup__config-group__item__label", title: "execution context", htmlFor: "query-builder__setup__context-selector", children: "Context" }), _jsx(CustomSelectorInput, { inputId: "query-builder__setup__context-selector", className: "panel__content__form__section__dropdown query-builder__setup__config-group__item__selector", placeholder: "Choose an execution context...", options: executionContextOptions, disabled: executionContextOptions.length < 1 || (executionContextOptions.length === 1 && Boolean(selectedExecutionContextOption)), onChange: handleExecutionContextOptionChange, value: selectedExecutionContextOption, darkMode: !applicationStore.layoutService .TEMPORARY__isLightColorThemeEnabled })] })), queryBuilderState.showRuntimeSelector && (_jsxs("div", { className: "query-builder__setup__config-group__item", children: [_jsx("label", { className: "btn--sm query-builder__setup__config-group__item__label", title: "runtime", htmlFor: "query-builder__setup__runtime-selector", children: "Runtime" }), _jsx(CustomSelectorInput, { inputId: "query-builder__setup__runtime-selector", className: "panel__content__form__section__dropdown query-builder__setup__config-group__item__selector", placeholder: "Choose a runtime...", noMatchMessage: "No compatible runtime found for specified execution context", options: runtimeOptions, onChange: changeRuntime, value: selectedRuntimeOption, darkMode: !applicationStore.layoutService .TEMPORARY__isLightColorThemeEnabled, filterOption: runtimeFilterOption, formatOptionLabel: getRuntimeOptionFormatter({ darkMode: !applicationStore.layoutService .TEMPORARY__isLightColorThemeEnabled, }) })] })), _jsx("div", { className: "query-builder__setup__config-group__item", children: _jsx(QueryBuilderClassSelector, { queryBuilderState: queryBuilderState, classes: classes, onClassChange: queryBuilderState.onClassChange, noMatchMessage: "No compatible entity found for specified execution context" }) })] })] })); }); export const renderDataSpaceQueryBuilderSetupPanelContent = (queryBuilderState) => (_jsx(DataSpaceQueryBuilderSetupPanelContent, { queryBuilderState: queryBuilderState })); //# sourceMappingURL=DataSpaceQueryBuilder.js.map