Merge pull request #1995 from dbeaver/CB-3924

Cb 3924

webapp/packages/core-blocks/src/FormControls/InputField.m.css

@@ -29,6 +29,15 @@
     height: 100%;
   }
 }
+
+.customIconContainer {
+  composes: iconContainer;
+  right: 4px;
+  width: 24px;
+  height: 24px;
+  cursor: auto;
+}
+
 .input[disabled] + .iconContainer {
   cursor: auto;
   opacity: 0.8;

webapp/packages/core-blocks/src/FormControls/InputField.tsx

@@ -6,7 +6,7 @@
  * you may not use this file except in compliance with the License.
  */
 import { observer } from 'mobx-react-lite';
-import { forwardRef, useCallback, useContext, useLayoutEffect, useRef, useState } from 'react';
+import React, { forwardRef, useCallback, useContext, useLayoutEffect, useRef, useState } from 'react';
 import styled, { use } from 'reshadow';
 
 import type { ComponentStyle } from '@cloudbeaver/core-theming';
@@ -41,6 +41,7 @@ type BaseProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onChange' |
     style?: ComponentStyle;
     canShowPassword?: boolean;
     onCustomCopy?: () => void;
+    icon?: React.ReactElement;
   };
 
 type ControlledProps = BaseProps & {
@@ -90,6 +91,7 @@ export const InputField: InputFieldType = observer(
       canShowPassword = true,
       onChange,
       onCustomCopy,
+      icon,
       ...rest
     }: ControlledProps | ObjectProps<any, any>,
     ref,
@@ -196,6 +198,7 @@ export const InputField: InputFieldType = observer(
               <Icon name="copy" viewBox="0 0 32 32" className={styles.icon} />
             </div>
           )}
+          {icon && <div data-testid="icon-container" className={styles.customIconContainer}>{icon}</div>}
         </div>
         {(description || passwordType) && (
           <div data-testid="field-description" className={s(styles, { fieldDescription: true, valid: !error, invalid: error })}>

webapp/packages/core-sdk/src/queries/grid/asyncSqlExecuteQuery.gql

@@ -5,6 +5,7 @@ mutation asyncSqlExecuteQuery(
     $resultId: ID
     $filter: SQLDataFilter
     $dataFormat: ResultDataFormat
+    $readLogs: Boolean
 ) {
     taskInfo: asyncSqlExecuteQuery(
         connectionId: $connectionId
@@ -13,6 +14,7 @@ mutation asyncSqlExecuteQuery(
         resultId: $resultId
         filter: $filter
         dataFormat: $dataFormat
+        readLogs: $readLogs
     ) {
         ...AsyncTaskInfo
     }

webapp/packages/plugin-codemirror6/src/Editor.tsx

@@ -19,9 +19,49 @@ import { useCodemirrorExtensions } from './useCodemirrorExtensions';
 import { type IDefaultExtensions, useEditorDefaultExtensions } from './useEditorDefaultExtensions';
 
 export const Editor = observer<IEditorProps & IDefaultExtensions, IEditorRef>(
-  forwardRef(function Editor({ lineNumbers, extensions, ...rest }, ref) {
+  forwardRef(function Editor(
+    {
+      extensions,
+      lineNumbers,
+      tooltips,
+      highlightSpecialChars,
+      syntaxHighlighting,
+      bracketMatching,
+      dropCursor,
+      crosshairCursor,
+      foldGutter,
+      highlightActiveLineGutter,
+      highlightSelectionMatches,
+      highlightActiveLine,
+      indentOnInput,
+      rectangularSelection,
+      keymap,
+      lineWrapping,
+      ...rest
+    },
+    ref,
+  ) {
     extensions = useCodemirrorExtensions(extensions);
-    const defaultExtensions = useEditorDefaultExtensions({ lineNumbers });
+
+
+    const defaultExtensions = useEditorDefaultExtensions({
+      lineNumbers,
+      tooltips,
+      highlightSpecialChars,
+      syntaxHighlighting,
+      bracketMatching,
+      dropCursor,
+      crosshairCursor,
+      foldGutter,
+      highlightActiveLineGutter,
+      highlightSelectionMatches,
+      highlightActiveLine,
+      indentOnInput,
+      rectangularSelection,
+      keymap,
+      lineWrapping,
+    });
+
     extensions.set(...defaultExtensions);
 
     return styled(EDITOR_BASE_STYLES)(

webapp/packages/plugin-codemirror6/src/useEditorDefaultExtensions.ts

@@ -12,6 +12,7 @@ import { Compartment, Extension } from '@codemirror/state';
 import {
   crosshairCursor,
   dropCursor,
+  EditorView,
   highlightActiveLine,
   highlightActiveLineGutter,
   highlightSpecialChars,
@@ -21,9 +22,9 @@ import {
   tooltips,
 } from '@codemirror/view';
 import { classHighlighter } from '@lezer/highlight';
-import { useMemo } from 'react';
+import { useRef } from 'react';
 
-import { clsx, GlobalConstants } from '@cloudbeaver/core-utils';
+import { clsx, GlobalConstants, isObjectsEqual } from '@cloudbeaver/core-utils';
 
 // @TODO allow to configure bindings outside of the component
 const DEFAULT_KEY_MAP = defaultKeymap.filter(binding => binding.mac !== 'Ctrl-f' && binding.key !== 'Mod-Enter');
@@ -34,55 +35,101 @@ DEFAULT_KEY_MAP.push({
   run: () => true,
 });
 
+const defaultExtensionsFlags: IDefaultExtensions = {
+  lineNumbers: false,
+  tooltips: true,
+  highlightSpecialChars: true,
+  syntaxHighlighting: true,
+  bracketMatching: true,
+  dropCursor: true,
+  crosshairCursor: true,
+  foldGutter: true,
+  highlightActiveLineGutter: true,
+  highlightSelectionMatches: true,
+  highlightActiveLine: true,
+  indentOnInput: true,
+  rectangularSelection: true,
+  keymap: true,
+  lineWrapping: false,
+};
+
 export interface IDefaultExtensions {
   lineNumbers?: boolean;
+  tooltips?: boolean;
+  highlightSpecialChars?: boolean;
+  syntaxHighlighting?: boolean;
+  bracketMatching?: boolean;
+  dropCursor?: boolean;
+  crosshairCursor?: boolean;
+  foldGutter?: boolean;
+  highlightActiveLineGutter?: boolean;
+  highlightSelectionMatches?: boolean;
+  highlightActiveLine?: boolean;
+  indentOnInput?: boolean;
+  rectangularSelection?: boolean;
+  keymap?: boolean;
+  lineWrapping?: boolean;
 }
 
+const extensionMap = {
+  lineNumbers,
+  tooltips: () => tooltips({ parent: document.body }),
+  highlightSpecialChars,
+  syntaxHighlighting: () => syntaxHighlighting(classHighlighter),
+  bracketMatching,
+  dropCursor,
+  highlightSelectionMatches,
+  crosshairCursor,
+  foldGutter: () =>
+    foldGutter({
+      markerDOM: (open: boolean) => {
+        const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+        svg.setAttributeNS(null, 'viewBox', '0 0 15 8');
+        svg.style.maxWidth = '100%';
+        svg.style.maxHeight = '100%';
+
+        const use = document.createElementNS('http://www.w3.org/2000/svg', 'use');
+        use.setAttributeNS('http://www.w3.org/1999/xlink', 'href', GlobalConstants.absoluteUrl('/icons/icons.svg#angle'));
+        svg.appendChild(use);
+
+        const element = document.createElement('div');
+        element.appendChild(svg);
+        element.className = clsx('cm-gutterElement-icon', open ? 'cm-foldGutter-open' : 'cm-foldGutter-folded');
+
+        return element;
+      },
+    }),
+  highlightActiveLineGutter,
+  highlightActiveLine,
+  indentOnInput,
+  rectangularSelection,
+  keymap: () => keymap.of(DEFAULT_KEY_MAP),
+  lineWrapping: () => EditorView.lineWrapping,
+};
+
 const DEFAULT_EXTENSIONS_COMPARTMENT = new Compartment();
 
 /** Provides the necessary extensions to establish a basic editor */
 export function useEditorDefaultExtensions(options?: IDefaultExtensions): [Compartment, Extension] {
-  return useMemo(() => {
-    const extensions = [];
-    if (options?.lineNumbers) {
-      extensions.push(lineNumbers());
-    }
+  const previousOptions = useRef(options);
+  const isOptionsChanged = !isObjectsEqual(options, previousOptions.current);
+  const extensions = useRef<[Compartment, Extension] | null>(null);
 
-    extensions.push(
-      tooltips({
-        parent: document.body,
-      }),
-      highlightSpecialChars(),
-      highlightSelectionMatches(),
-      syntaxHighlighting(classHighlighter),
-      bracketMatching(),
-      dropCursor(),
-      crosshairCursor(),
-      foldGutter({
-        markerDOM: (open: boolean) => {
-          const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
-          svg.setAttributeNS(null, 'viewBox', '0 0 15 8');
-          svg.style.maxWidth = '100%';
-          svg.style.maxHeight = '100%';
+  if (isOptionsChanged || extensions.current === null) {
+    previousOptions.current = options;
+    extensions.current = createExtensions(options);
+  }
 
-          const use = document.createElementNS('http://www.w3.org/2000/svg', 'use');
-          use.setAttributeNS('http://www.w3.org/1999/xlink', 'href', GlobalConstants.absoluteUrl('/icons/icons.svg#angle'));
-          svg.appendChild(use);
-
-          const element = document.createElement('div');
-          element.appendChild(svg);
-          element.className = clsx('cm-gutterElement-icon', open ? 'cm-foldGutter-open' : 'cm-foldGutter-folded');
-
-          return element;
-        },
-      }),
-      highlightActiveLineGutter(),
-      highlightActiveLine(),
-      indentOnInput(),
-      rectangularSelection(),
-      keymap.of(DEFAULT_KEY_MAP),
-    );
+  return extensions.current;
+}
 
-    return [DEFAULT_EXTENSIONS_COMPARTMENT, extensions];
-  }, [options?.lineNumbers]);
+function createExtensions(options?: IDefaultExtensions): [Compartment, Extension] {
+  const extensions = Object.entries(defaultExtensionsFlags)
+    .filter(([key, isEnabled]) => options?.[key as keyof typeof options] ?? isEnabled)
+    .map(([key]) => {
+      const extensionFunction = extensionMap[key as keyof typeof extensionMap];
+      return extensionFunction?.();
+    })
+    .filter(Boolean);
+  return [DEFAULT_EXTENSIONS_COMPARTMENT, extensions];
 }

webapp/packages/plugin-data-viewer/src/DatabaseDataModel/IDatabaseDataOptions.ts

@@ -14,4 +14,5 @@ export interface IDatabaseDataOptions {
   catalog?: string;
   whereFilter: string;
   constraints: SqlDataFilterConstraint[];
+  readLogs?: boolean;
 }

webapp/packages/plugin-sql-editor-navigation-tab/src/SqlEditorTabService.ts

@@ -309,6 +309,7 @@ export class SqlEditorTabService extends Bootstrap {
     tab.handlerState.resultTabs = observable([]);
     tab.handlerState.executionPlanTabs = observable([]);
     tab.handlerState.statisticsTabs = observable([]);
+    tab.handlerState.outputLogsTab = undefined;
 
     return true;
   }

webapp/packages/plugin-sql-editor/src/ISqlEditorTabState.ts

@@ -5,6 +5,7 @@
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
  */
+import type { IOutputLogType } from './SqlResultTabs/OutputLogs/IOutputLogTypes';
 
 export interface IResultTab {
   tabId: string;
@@ -41,6 +42,10 @@ export interface IExecutionPlanTab {
   options?: Record<string, any>;
 }
 
+export interface IOutputLogsTab extends ISqlEditorResultTab {
+  selectedLogTypes: IOutputLogType[];
+}
+
 export interface ISqlEditorTabState {
   editorId: string;
   datasourceKey: string;
@@ -54,6 +59,7 @@ export interface ISqlEditorTabState {
   resultTabs: IResultTab[];
   statisticsTabs: IStatisticsTab[];
   executionPlanTabs: IExecutionPlanTab[];
+  outputLogsTab?: IOutputLogsTab;
 
   // mode
   currentModeId?: string;

webapp/packages/plugin-sql-editor/src/MenuBootstrap.ts

@@ -22,11 +22,13 @@ import { ACTION_SQL_EDITOR_EXECUTE_NEW } from './actions/ACTION_SQL_EDITOR_EXECU
 import { ACTION_SQL_EDITOR_EXECUTE_SCRIPT } from './actions/ACTION_SQL_EDITOR_EXECUTE_SCRIPT';
 import { ACTION_SQL_EDITOR_FORMAT } from './actions/ACTION_SQL_EDITOR_FORMAT';
 import { ACTION_SQL_EDITOR_SHOW_EXECUTION_PLAN } from './actions/ACTION_SQL_EDITOR_SHOW_EXECUTION_PLAN';
+import { ACTION_SQL_EDITOR_SHOW_OUTPUT } from './actions/ACTION_SQL_EDITOR_SHOW_OUTPUT';
 import { KEY_BINDING_SQL_EDITOR_EXECUTE } from './actions/bindings/KEY_BINDING_SQL_EDITOR_EXECUTE';
 import { KEY_BINDING_SQL_EDITOR_EXECUTE_NEW } from './actions/bindings/KEY_BINDING_SQL_EDITOR_EXECUTE_NEW';
 import { KEY_BINDING_SQL_EDITOR_EXECUTE_SCRIPT } from './actions/bindings/KEY_BINDING_SQL_EDITOR_EXECUTE_SCRIPT';
 import { KEY_BINDING_SQL_EDITOR_FORMAT } from './actions/bindings/KEY_BINDING_SQL_EDITOR_FORMAT';
 import { KEY_BINDING_SQL_EDITOR_SHOW_EXECUTION_PLAN } from './actions/bindings/KEY_BINDING_SQL_EDITOR_SHOW_EXECUTION_PLAN';
+import { KEY_BINDING_SQL_EDITOR_SHOW_OUTPUT } from './actions/bindings/KEY_BINDING_SQL_EDITOR_SHOW_OUTPUT';
 import { ESqlDataSourceFeatures } from './SqlDataSource/ESqlDataSourceFeatures';
 import { DATA_CONTEXT_SQL_EDITOR_DATA } from './SqlEditor/DATA_CONTEXT_SQL_EDITOR_DATA';
 
@@ -57,11 +59,13 @@ export class MenuBootstrap extends Bootstrap {
             ACTION_SQL_EDITOR_EXECUTE_NEW,
             ACTION_SQL_EDITOR_EXECUTE_SCRIPT,
             ACTION_SQL_EDITOR_SHOW_EXECUTION_PLAN,
+            ACTION_SQL_EDITOR_SHOW_OUTPUT,
           ].includes(action)
         ) {
           return false;
         }
 
+        // TODO we have to add check for output action ?
         if (
           !sqlEditorData.dataSource?.hasFeature(ESqlDataSourceFeatures.query) &&
           [ACTION_SQL_EDITOR_EXECUTE, ACTION_SQL_EDITOR_EXECUTE_NEW, ACTION_SQL_EDITOR_SHOW_EXECUTION_PLAN].includes(action)
@@ -77,6 +81,7 @@ export class MenuBootstrap extends Bootstrap {
           ACTION_REDO,
           ACTION_UNDO,
           ACTION_SQL_EDITOR_SHOW_EXECUTION_PLAN,
+          ACTION_SQL_EDITOR_SHOW_OUTPUT,
         ].includes(action);
       },
       isDisabled: (context, action) => !context.has(DATA_CONTEXT_SQL_EDITOR_DATA),

webapp/packages/plugin-sql-editor/src/QueryDataSource.ts

@@ -199,6 +199,7 @@ export class QueryDataSource<TOptions extends IDataQueryOptions = IDataQueryOpti
           where: options.whereFilter || undefined,
         },
         dataFormat: this.dataFormat,
+        readLogs: options.readLogs,
       });
 
       return taskInfo;