@finos/legend-application-studio/lib/components/editor/EmbeddedQueryBuilder.js

Legend Studio application core

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 { Fragment, useState } from 'react';
import { observer } from 'mobx-react-lite';
import { clsx, Dialog, TimesIcon, WindowMaximizeIcon, EmptyWindowRestoreIcon, Modal, } from '@finos/legend-art';
import { flowResult } from 'mobx';
import { noop } from '@finos/legend-shared';
import { useApplicationNavigationContext, useApplicationStore, } from '@finos/legend-application';
import { QueryBuilder, } from '@finos/legend-query-builder';
import { LEGEND_STUDIO_APPLICATION_NAVIGATION_CONTEXT_KEY } from '../../__lib__/LegendStudioApplicationNavigationContext.js';
import { useEditorStore } from './EditorStoreProvider.js';
/**
 * NOTE: Query builder is by right a mini-app so we have it hosted in a full-screen modal dialog
 * See https://material.io/components/dialogs#full-screen-dialog
 */
const QueryBuilderDialog = observer((props) => {
    const { embeddedQueryBuilderState, queryBuilderState } = props;
    const applicationStore = useApplicationStore();
    const [isMaximized, setIsMaximized] = useState(false);
    const toggleMaximize = () => setIsMaximized(!isMaximized);
    const confirmCloseQueryBuilder = () => {
        queryBuilderState.changeDetectionState.alertUnsavedChanges(() => {
            flowResult(embeddedQueryBuilderState.setEmbeddedQueryBuilderConfiguration(undefined)).catch(applicationStore.alertUnhandledError);
        });
    };
    useApplicationNavigationContext(LEGEND_STUDIO_APPLICATION_NAVIGATION_CONTEXT_KEY.EMBEDDED_QUERY_BUILDER);
    return (_jsx(Dialog, { open: Boolean(embeddedQueryBuilderState.queryBuilderState), onClose: noop, classes: {
            root: 'editor-modal__root-container',
            container: 'editor-modal__container',
            paper: 'editor-modal__content query-builder__dialog__container__content',
        }, children: _jsxs(Modal, { darkMode: !applicationStore.layoutService.TEMPORARY__isLightColorThemeEnabled, className: clsx('editor-modal query-builder__dialog', {
                'query-builder__dialog--expanded': isMaximized,
            }), children: [_jsx("div", { className: "query-builder__dialog__header", children: _jsxs("div", { className: "query-builder__dialog__header__actions", children: [embeddedQueryBuilderState.actionConfigs.map((config) => (_jsx(Fragment, { children: config.renderer(queryBuilderState) }, config.key))), _jsx("button", { className: "query-builder__dialog__header__action", tabIndex: -1, onClick: toggleMaximize, title: isMaximized ? 'Minimize' : 'Maximize', children: isMaximized ? (_jsx(EmptyWindowRestoreIcon, {})) : (_jsx(WindowMaximizeIcon, {})) }), _jsx("button", { className: "query-builder__dialog__header__action", tabIndex: -1, onClick: confirmCloseQueryBuilder, title: "Close", children: _jsx(TimesIcon, {}) })] }) }), _jsx("div", { className: "query-builder__dialog__content", children: _jsx(QueryBuilder, { queryBuilderState: queryBuilderState }) })] }) }));
});
export const EmbeddedQueryBuilder = observer(() => {
    const editorStore = useEditorStore();
    const queryBuilderExtensionState = editorStore.embeddedQueryBuilderState;
    if (!queryBuilderExtensionState.queryBuilderState) {
        return null;
    }
    return (_jsx(QueryBuilderDialog, { embeddedQueryBuilderState: queryBuilderExtensionState, queryBuilderState: queryBuilderExtensionState.queryBuilderState }));
});
//# sourceMappingURL=EmbeddedQueryBuilder.js.map