@finos/legend-extension-dsl-data-space
Version:
Legend extension for Data Space DSL
71 lines • 6.2 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 { useApplicationStore } from '@finos/legend-application';
import { BoltIcon, clsx, BlankPanelContent, TimesCircleIcon, PanelLoadingIndicator, CustomSelectorInput, SearchIcon, Dialog, TimesIcon, ArrowRightIcon, Modal, ModalHeader, ModalTitle, ModalHeaderActions, } from '@finos/legend-art';
import { flowResult } from 'mobx';
import { observer } from 'mobx-react-lite';
import { useEffect, useRef } from 'react';
import { DataSpaceViewer } from '../DataSpaceViewer.js';
import { formatDataSpaceOptionLabel } from './DataSpaceQueryBuilder.js';
const buildDataSpaceOption = (value) => ({
label: value.title ?? value.name,
value,
});
export const DataSpaceAdvancedSearchModal = observer((props) => {
const { searchState, onClose } = props;
const applicationStore = useApplicationStore();
const dataSpaceSearchRef = useRef(null);
const handleEnter = () => dataSpaceSearchRef.current?.focus();
const proceedToCreateQuery = () => {
flowResult(searchState.proceedToCreateQuery()).catch(applicationStore.alertUnhandledError);
};
const toggleGetSnapshot = () => {
searchState.setToGetSnapShot(!searchState.toGetSnapShot);
flowResult(searchState.loadDataSpaces()).catch(applicationStore.alertUnhandledError);
};
// data product
const dataSpaceOptions = searchState.dataSpaces.map(buildDataSpaceOption);
const selectedDataSpaceOption = searchState.currentDataSpace
? buildDataSpaceOption(searchState.currentDataSpace)
: null;
const onDataSpaceOptionChange = (option) => {
searchState.setCurrentDataSpace(option?.value);
searchState.setDataSpaceViewerState(undefined);
};
// search text
useEffect(() => {
flowResult(searchState.loadDataSpaces()).catch(applicationStore.alertUnhandledError);
}, [searchState, applicationStore]);
useEffect(() => {
if (searchState.currentDataSpace) {
flowResult(searchState.loadDataSpace(searchState.currentDataSpace)).catch(applicationStore.alertUnhandledError);
}
}, [searchState, applicationStore, searchState.currentDataSpace]);
return (_jsx(Dialog, { open: true, onClose: onClose, classes: {
root: 'editor-modal__root-container',
container: 'editor-modal__container',
paper: 'editor-modal__content data-space-advanced-search__dialog__container__content',
}, slotProps: {
transition: {
onEnter: handleEnter,
},
}, children: _jsxs(Modal, { darkMode: !applicationStore.layoutService.TEMPORARY__isLightColorThemeEnabled, className: "editor-modal data-space-advanced-search__dialog", children: [_jsxs(ModalHeader, { className: "data-space-advanced-search__dialog__header", children: [_jsx(ModalTitle, { title: "Search for data product " }), _jsx(ModalHeaderActions, { children: _jsx("button", { className: "modal__header__action", title: "Close", onClick: onClose, children: _jsx(TimesIcon, {}) }) })] }), _jsxs("div", { className: "data-space-advanced-search__dialog__content", children: [_jsxs("div", { className: "data-space-advanced-search__dialog__input", children: [_jsx("div", { className: "data-space-advanced-search__dialog__input__icon", children: _jsx(SearchIcon, {}) }), _jsx(CustomSelectorInput, { inputRef: dataSpaceSearchRef, className: "data-space-advanced-search__dialog__input__selector", options: dataSpaceOptions, isLoading: searchState.loadDataSpacesState.isInProgress, onChange: onDataSpaceOptionChange, value: selectedDataSpaceOption, placeholder: "Search for data product by name...", isClearable: true, escapeClearsValue: true, darkMode: !applicationStore.layoutService
.TEMPORARY__isLightColorThemeEnabled, formatOptionLabel: formatDataSpaceOptionLabel }), _jsx("button", { className: clsx('data-space-advanced-search__dialog__input__use-snapshot-btn', {
'data-space-advanced-search__dialog__input__use-snapshot-btn--active': searchState.toGetSnapShot,
}), tabIndex: -1, title: `[${searchState.toGetSnapShot ? 'on' : 'off'}] Toggle show data products from snapshot releases instead of latest releases`, onClick: toggleGetSnapshot, children: _jsx(BoltIcon, {}) }), _jsx("button", { className: "data-space-advanced-search__dialog__input__proceed-btn", tabIndex: -1, title: "Proceed to create query", onClick: proceedToCreateQuery, children: _jsx(ArrowRightIcon, {}) })] }), _jsxs("div", { className: "data-space-advanced-search__dialog__view", children: [_jsx(PanelLoadingIndicator, { isLoading: searchState.loadDataSpaceState.isInProgress }), searchState.dataSpaceViewerState && (_jsx(DataSpaceViewer, { dataSpaceViewerState: searchState.dataSpaceViewerState })), !searchState.dataSpaceViewerState && (_jsxs(_Fragment, { children: [searchState.loadDataSpaceState.isInProgress && (_jsx(BlankPanelContent, { children: searchState.loadDataSpaceState.message })), searchState.loadDataSpaceState.hasFailed && (_jsx(BlankPanelContent, { children: _jsxs("div", { className: "data-space-advanced-search__dialog__view--failed", children: [_jsx("div", { className: "data-space-advanced-search__dialog__view--failed__icon", children: _jsx(TimesCircleIcon, {}) }), _jsx("div", { className: "data-space-advanced-search__dialog__view--failed__text", children: `Can't load data product` })] }) }))] }))] })] })] }) }));
});
//# sourceMappingURL=DataSpaceAdvancedSearchModal.js.map