diff --git a/webapp/packages/plugin-data-viewer/src/ScriptPreview/ScriptPreviewDialog.tsx b/webapp/packages/plugin-data-viewer/src/ScriptPreview/ScriptPreviewDialog.tsx index 4701da0667..eb12f92e69 100644 --- a/webapp/packages/plugin-data-viewer/src/ScriptPreview/ScriptPreviewDialog.tsx +++ b/webapp/packages/plugin-data-viewer/src/ScriptPreview/ScriptPreviewDialog.tsx @@ -6,11 +6,12 @@ * you may not use this file except in compliance with the License. */ +import { computed, observable } from 'mobx'; import { observer } from 'mobx-react-lite'; import { useEffect, useState } from 'react'; import styled, { css } from 'reshadow'; -import { Button, useClipboard } from '@cloudbeaver/core-blocks'; +import { Button, useClipboard, useObjectRef } from '@cloudbeaver/core-blocks'; import { useService } from '@cloudbeaver/core-di'; import { CommonDialogWrapper, DialogComponentProps } from '@cloudbeaver/core-dialogs'; import { useTranslate } from '@cloudbeaver/core-localization'; @@ -59,26 +60,31 @@ export const ScriptPreviewDialog: React.FC> = obse const copy = useClipboard(); const sqlDialectInfoService = useService(SqlDialectInfoService); + const connectionId = payload.model.source.executionContext?.context?.connectionId; - const [dialect, setDialect] = useState(null); + const dialect = useObjectRef({ + connectionId, + sqlDialectInfoService, + get dialect(): SqlDialectInfo | undefined { + if (!this.connectionId) { + return undefined; + } + return this.sqlDialectInfoService.getDialectInfo(this.connectionId); + }, + + }, { connectionId, sqlDialectInfoService }, { connectionId: observable.ref, dialect: computed }); useEffect(() => { - const connectionId = payload.model.source.executionContext?.context?.connectionId; - if (!connectionId || dialect) { + if (!connectionId) { return; } sqlDialectInfoService.loadSqlDialectInfo(connectionId) - .then(dialect => { - if (dialect) { - setDialect(dialect); - } - }) .catch(exception => { console.error(exception); console.warn(`Can't get dialect for connection: '${connectionId}'. Default dialect will be used`); }); - }, [sqlDialectInfoService, payload.model, dialect]); + }, [sqlDialectInfoService, connectionId]); const apply = () => { payload.model.source.saveData(); @@ -105,7 +111,7 @@ export const ScriptPreviewDialog: React.FC> = obse autoCursor: false, }} value={payload.script} - dialect={dialect || undefined} + dialect={dialect.dialect} readonly /> diff --git a/webapp/packages/plugin-data-viewer/src/ScriptPreview/ScriptPreviewService.ts b/webapp/packages/plugin-data-viewer/src/ScriptPreview/ScriptPreviewService.ts index 7576131c13..9d2a132018 100644 --- a/webapp/packages/plugin-data-viewer/src/ScriptPreview/ScriptPreviewService.ts +++ b/webapp/packages/plugin-data-viewer/src/ScriptPreview/ScriptPreviewService.ts @@ -27,10 +27,10 @@ export class ScriptPreviewService { async open(model: IDatabaseDataModel, resultIndex: number): Promise { try { - const response = await model.source.runTask(() => this.tryGetScript(model, resultIndex)); + const script = await model.source.runTask(() => this.tryGetScript(model, resultIndex)); this.commonDialogService.open(ScriptPreviewDialog, { - script: response.result, + script, model, }); } catch (exception) { @@ -38,7 +38,10 @@ export class ScriptPreviewService { } } - private async tryGetScript(model: IDatabaseDataModel, resultIndex: number) { + private async tryGetScript( + model: IDatabaseDataModel, + resultIndex: number + ): Promise { const executionContext = model.source.executionContext; if (!executionContext) { @@ -66,6 +69,8 @@ export class ScriptPreviewService { editor.fillBatch(updateVariables); } - return this.graphQLService.sdk.updateResultsDataBatchScript(updateVariables); + const response = await this.graphQLService.sdk.updateResultsDataBatchScript(updateVariables); + + return response.result; } }