feat: CB-1631 show execution context information in restoration dialogue

This commit is contained in:
Wroud
2022-02-09 14:36:48 +03:00
parent 76a56d281e
commit 0331c44d04
10 changed files with 274 additions and 68 deletions
@@ -10,8 +10,9 @@ import { observer } from 'mobx-react-lite';
import { useEffect } from 'react';
import styled, { css } from 'reshadow';
import { splitStyles, Split, ResizerControls, Pane, splitHorizontalStyles, Overlay, OverlayMessage, OverlayActions, Button, useMapResource, getComputed } from '@cloudbeaver/core-blocks';
import { ConnectionExecutionContextResource, ConnectionInfoResource } from '@cloudbeaver/core-connections';
import { NodeManagerUtils } from '@cloudbeaver/core-app';
import { splitStyles, Split, ResizerControls, Pane, splitHorizontalStyles, Overlay, OverlayMessage, OverlayActions, Button, useMapResource, getComputed, OverlayHeader, OverlayHeaderIcon, OverlayHeaderTitle, OverlayHeaderSubTitle } from '@cloudbeaver/core-blocks';
import { ConnectionExecutionContextResource, ConnectionInfoResource, DBDriverResource } from '@cloudbeaver/core-connections';
import { useService } from '@cloudbeaver/core-di';
import { useTranslate } from '@cloudbeaver/core-localization';
import { useStyles } from '@cloudbeaver/core-theming';
@@ -29,6 +30,9 @@ const viewerStyles = css`
SqlEditorLoader {
composes: theme-typography--body1 from global;
}
OverlayActions {
justify-content: space-between;
}
`;
interface Props {
@@ -40,12 +44,13 @@ export const SqlEditor = observer<Props>(function SqlEditor({ state }) {
const sqlEditorService = useService(SqlEditorService);
const styles = useStyles(splitStyles, splitHorizontalStyles, viewerStyles);
const connection = useMapResource(SqlEditor, ConnectionInfoResource, state.executionContext?.connectionId ?? null);
const driver = useMapResource(SqlEditor, DBDriverResource, connection.data?.driverId ?? null);
const connected = getComputed(() => connection.data?.connected ?? false);
const context = useMapResource(
SqlEditor,
ConnectionExecutionContextResource,
SqlEditor,
ConnectionExecutionContextResource,
connected ? (state.executionContext?.id ?? null) : null
);
@@ -60,6 +65,11 @@ export const SqlEditor = observer<Props>(function SqlEditor({ state }) {
await sqlEditorService.initEditorConnection(state);
}
const dataContainer = getComputed(() => NodeManagerUtils.concatSchemaAndCatalog(
state.executionContext?.defaultCatalog,
state.executionContext?.defaultSchema
));
useEffect(() => {
if (initExecutionContext && connected) {
init();
@@ -79,6 +89,11 @@ export const SqlEditor = observer<Props>(function SqlEditor({ state }) {
</Pane>
</Split>
<Overlay active={initExecutionContext}>
<OverlayHeader>
<OverlayHeaderIcon icon={driver.data?.icon} />
<OverlayHeaderTitle>{connection.data?.name}</OverlayHeaderTitle>
{dataContainer && <OverlayHeaderSubTitle>{dataContainer}</OverlayHeaderSubTitle>}
</OverlayHeader>
<OverlayMessage>{translate('sql_editor_restore_message')}</OverlayMessage>
<OverlayActions>
<Button