ydb-embedded-ui 3.4.5 → 4.0.0

package/dist/store/reducers/{executeQuery.js → executeQuery.ts}

@@ -1,35 +1,40 @@
-import {createRequestActionTypes, createApiRequest} from '../utils';
-import '../../services/api';
+import type {Reducer} from 'redux';
+
+import type {ExecuteActions} from '../../types/api/query';
+import type {
+    ExecuteQueryAction,
+    ExecuteQueryState,
+    MonacoHotKeyAction,
+} from '../../types/store/executeQuery';
+import type {QueryRequestParams, QueryModes} from '../../types/store/query';
 import {getValueFromLS, parseJson} from '../../utils/utils';
-import {QUERIES_HISTORY_KEY, QUERY_INITIAL_RUN_ACTION_KEY} from '../../utils/constants';
+import {QUERIES_HISTORY_KEY} from '../../utils/constants';
 import {parseQueryAPIExecuteResponse} from '../../utils/query';
-import {readSavedSettingsValue} from './settings';
+import {parseQueryError} from '../../utils/error';
+import '../../services/api';
+
+import {createRequestActionTypes, createApiRequest} from '../utils';
 
 const MAXIMUM_QUERIES_IN_HISTORY = 20;
 
-const SEND_QUERY = createRequestActionTypes('query', 'SEND_QUERY');
+export const SEND_QUERY = createRequestActionTypes('query', 'SEND_QUERY');
+
 const CHANGE_USER_INPUT = 'query/CHANGE_USER_INPUT';
 const SAVE_QUERY_TO_HISTORY = 'query/SAVE_QUERY_TO_HISTORY';
 const GO_TO_PREVIOUS_QUERY = 'query/GO_TO_PREVIOUS_QUERY';
 const GO_TO_NEXT_QUERY = 'query/GO_TO_NEXT_QUERY';
-const SELECT_RUN_ACTION = 'query/SELECT_RUN_ACTION';
 const MONACO_HOT_KEY = 'query/MONACO_HOT_KEY';
 
-const queriesHistoryInitial = parseJson(getValueFromLS(QUERIES_HISTORY_KEY, '[]'));
+const queriesHistoryInitial: string[] = parseJson(getValueFromLS(QUERIES_HISTORY_KEY, '[]'));
 
 const sliceLimit = queriesHistoryInitial.length - MAXIMUM_QUERIES_IN_HISTORY;
 
-export const RUN_ACTIONS_VALUES = {
-    script: 'execute-script',
-    scan: 'execute-scan',
-};
-
 export const MONACO_HOT_KEY_ACTIONS = {
     sendQuery: 'sendQuery',
     goPrev: 'goPrev',
     goNext: 'goNext',
     getExplain: 'getExplain',
-};
+} as const;
 
 const initialState = {
     loading: false,
@@ -41,11 +46,13 @@ const initialState = {
                 ? MAXIMUM_QUERIES_IN_HISTORY - 1
                 : queriesHistoryInitial.length - 1,
     },
-    runAction: readSavedSettingsValue(QUERY_INITIAL_RUN_ACTION_KEY, RUN_ACTIONS_VALUES.script),
     monacoHotKey: null,
 };
 
-const executeQuery = (state = initialState, action) => {
+const executeQuery: Reducer<ExecuteQueryState, ExecuteQueryAction> = (
+    state = initialState,
+    action,
+) => {
     switch (action.type) {
         case SEND_QUERY.REQUEST: {
             return {
@@ -64,22 +71,14 @@ const executeQuery = (state = initialState, action) => {
                 error: undefined,
             };
         }
-        // 401 Unauthorized error is handled by GenericAPI
         case SEND_QUERY.FAILURE: {
             return {
                 ...state,
-                error: action.error || 'Unauthorized',
+                error: parseQueryError(action.error),
                 loading: false,
             };
         }
 
-        case SELECT_RUN_ACTION: {
-            return {
-                ...state,
-                runAction: action.data,
-            };
-        }
-
         case CHANGE_USER_INPUT: {
             return {
                 ...state,
@@ -141,51 +140,57 @@ const executeQuery = (state = initialState, action) => {
     }
 };
 
-export const sendQuery = ({query, database, action}) => {
+interface SendQueryParams extends QueryRequestParams {
+    mode?: QueryModes;
+}
+
+export const sendExecuteQuery = ({query, database, mode}: SendQueryParams) => {
+    const action: ExecuteActions = mode ? `execute-${mode}` : 'execute';
+
     return createApiRequest({
-        request: window.api.sendQuery({schema: 'modern', query, database, action, stats: 'profile'}),
+        request: window.api.sendQuery({
+            schema: 'modern',
+            query,
+            database,
+            action,
+            stats: 'profile',
+        }),
         actions: SEND_QUERY,
         dataHandler: parseQueryAPIExecuteResponse,
     });
 };
 
-export const saveQueryToHistory = (query) => {
+export const saveQueryToHistory = (query: string) => {
     return {
         type: SAVE_QUERY_TO_HISTORY,
         data: query,
-    };
-};
-
-export const selectRunAction = (value) => {
-    return {
-        type: SELECT_RUN_ACTION,
-        data: value,
-    };
+    } as const;
 };
 
 export const goToPreviousQuery = () => {
     return {
         type: GO_TO_PREVIOUS_QUERY,
-    };
+    } as const;
 };
 
 export const goToNextQuery = () => {
     return {
         type: GO_TO_NEXT_QUERY,
-    };
+    } as const;
 };
 
-export const changeUserInput = ({input}) => {
-    return (dispatch) => {
-        dispatch({type: CHANGE_USER_INPUT, data: {input}});
-    };
+export const changeUserInput = ({input}: {input: string}) => {
+    return {
+        type: CHANGE_USER_INPUT,
+        data: {input},
+    } as const;
 };
 
-export const setMonacoHotKey = (value) => {
+export const setMonacoHotKey = (value: MonacoHotKeyAction) => {
     return {
         type: MONACO_HOT_KEY,
         data: value,
-    };
+    } as const;
 };
 
 export default executeQuery;

package/dist/store/reducers/executeTopQueries.ts

@@ -66,7 +66,11 @@ const getQueryText = (path: string, filters?: ITopQueriesFilters) => {
 SELECT
     CPUTime as CPUTimeUs,
     QueryText,
-    IntervalEnd
+    IntervalEnd,
+    EndTime,
+    ReadRows,
+    ReadBytes,
+    UserSID
 FROM \`${path}/.sys/top_queries_by_cpu_time_one_hour\`
 WHERE ${filterConditions || 'true'}
 `;

package/dist/store/reducers/{explainQuery.js → explainQuery.ts}

@@ -1,21 +1,33 @@
+import type {Reducer} from 'redux';
+import type {ExplainPlanNodeData, GraphNode, Link} from '@gravity-ui/paranoid';
 import _ from 'lodash';
 
 import '../../services/api';
+import type {ExplainActions} from '../../types/api/query';
+import type {
+    ExplainQueryAction,
+    ExplainQueryState,
+    PreparedExplainResponse,
+} from '../../types/store/explainQuery';
+import type {QueryRequestParams, QueryModes} from '../../types/store/query';
 
-import {getExplainNodeId, getMetaForExplainNode} from '../../utils';
 import {preparePlan} from '../../utils/prepareQueryExplain';
-import {parseQueryAPIExplainResponse} from '../../utils/query';
+import {parseQueryAPIExplainResponse, parseQueryExplainPlan} from '../../utils/query';
+import {parseQueryError} from '../../utils/error';
 
 import {createRequestActionTypes, createApiRequest} from '../utils';
 
-const GET_EXPLAIN_QUERY = createRequestActionTypes('query', 'GET_EXPLAIN_QUERY');
-const GET_EXPLAIN_QUERY_AST = createRequestActionTypes('query', 'GET_EXPLAIN_QUERY_AST');
+export const GET_EXPLAIN_QUERY = createRequestActionTypes('query', 'GET_EXPLAIN_QUERY');
+export const GET_EXPLAIN_QUERY_AST = createRequestActionTypes('query', 'GET_EXPLAIN_QUERY_AST');
 
 const initialState = {
     loading: false,
 };
 
-const explainQuery = (state = initialState, action) => {
+const explainQuery: Reducer<ExplainQueryState, ExplainQueryAction> = (
+    state = initialState,
+    action,
+) => {
     switch (action.type) {
         case GET_EXPLAIN_QUERY.REQUEST: {
             return {
@@ -36,11 +48,10 @@ const explainQuery = (state = initialState, action) => {
                 error: undefined,
             };
         }
-        // 401 Unauthorized error is handled by GenericAPI
         case GET_EXPLAIN_QUERY.FAILURE: {
             return {
                 ...state,
-                error: action.error || 'Unauthorized',
+                error: parseQueryError(action.error),
                 loading: false,
             };
         }
@@ -63,7 +74,7 @@ const explainQuery = (state = initialState, action) => {
         case GET_EXPLAIN_QUERY_AST.FAILURE: {
             return {
                 ...state,
-                errorAst: action.error || 'Unauthorized',
+                errorAst: parseQueryError(action.error),
                 loadingAst: false,
             };
         }
@@ -73,7 +84,7 @@ const explainQuery = (state = initialState, action) => {
     }
 };
 
-export const getExplainQueryAst = ({query, database}) => {
+export const getExplainQueryAst = ({query, database}: QueryRequestParams) => {
     return createApiRequest({
         request: window.api.getExplainQueryAst(query, database),
         actions: GET_EXPLAIN_QUERY_AST,
@@ -82,74 +93,48 @@ export const getExplainQueryAst = ({query, database}) => {
 };
 
 export const explainVersions = {
-    v1: '0.1',
     v2: '0.2',
 };
 
 const supportedExplainQueryVersions = Object.values(explainVersions);
 
-export const getExplainQuery = ({query, database}) => {
+interface ExplainQueryParams extends QueryRequestParams {
+    mode?: QueryModes;
+}
+
+export const getExplainQuery = ({query, database, mode}: ExplainQueryParams) => {
+    const action: ExplainActions = mode ? `explain-${mode}` : 'explain';
+
     return createApiRequest({
-        request: window.api.getExplainQuery(query, database),
+        request: window.api.getExplainQuery(query, database, action),
         actions: GET_EXPLAIN_QUERY,
-        dataHandler: (response) => {
-            const {plan: result, ast} = parseQueryAPIExplainResponse(response);
+        dataHandler: (response): PreparedExplainResponse => {
+            const {plan: rawPlan, ast} = parseQueryAPIExplainResponse(response);
 
-            if (!result) {
+            if (!rawPlan) {
                 return {ast};
             }
 
-            let links = [];
-            let nodes = [];
-            const {tables, meta, Plan} = result;
+            const {tables, meta, Plan} = parseQueryExplainPlan(rawPlan);
 
             if (supportedExplainQueryVersions.indexOf(meta.version) === -1) {
+                // Do not prepare plan for not supported versions
                 return {
-                    pristine: result,
-                    version: meta.version,
+                    plan: {
+                        pristine: rawPlan,
+                        version: meta.version,
+                    },
+                    ast,
                 };
             }
-            if (meta.version === explainVersions.v2) {
+
+            let links: Link[] = [];
+            let nodes: GraphNode<ExplainPlanNodeData>[] = [];
+
+            if (Plan) {
                 const preparedPlan = preparePlan(Plan);
                 links = preparedPlan.links;
                 nodes = preparedPlan.nodes;
-            } else {
-                _.forEach(tables, (table) => {
-                    nodes.push({
-                        name: table.name,
-                    });
-
-                    const tableTypes = {};
-
-                    const {reads = [], writes = []} = table;
-                    let prevNodeId = table.name;
-
-                    _.forEach([...reads, ...writes], (node) => {
-                        if (tableTypes[node.type]) {
-                            tableTypes[node.type] = tableTypes[node.type] + 1;
-                        } else {
-                            tableTypes[node.type] = 1;
-                        }
-
-                        const nodeId = getExplainNodeId(
-                            table.name,
-                            node.type,
-                            tableTypes[node.type],
-                        );
-
-                        links.push({
-                            from: prevNodeId,
-                            to: nodeId,
-                        });
-                        nodes.push({
-                            name: nodeId,
-                            meta: getMetaForExplainNode(node),
-                            id: nodeId,
-                        });
-
-                        prevNodeId = nodeId;
-                    });
-                });
             }
 
             return {
@@ -158,7 +143,7 @@ export const getExplainQuery = ({query, database}) => {
                     nodes,
                     tables,
                     version: meta.version,
-                    pristine: result,
+                    pristine: rawPlan,
                 },
                 ast,
             };

package/dist/store/reducers/{olapStats.js → olapStats.ts}

@@ -1,11 +1,13 @@
-import '../../services/api';
+import type {Reducer} from 'redux';
+
+import type {OlapStatsAction, OlapStatsState} from '../../types/store/olapStats';
 
+import '../../services/api';
 import {parseQueryAPIExecuteResponse} from '../../utils/query';
 
 import {createRequestActionTypes, createApiRequest} from '../utils';
 
-const FETCH_OLAP_STATS = createRequestActionTypes('query', 'SEND_OLAP_STATS_QUERY');
-const SET_OLAP_STATS_OPTIONS = createRequestActionTypes('query', 'SET_OLAP_STATS_OPTIONS');
+export const FETCH_OLAP_STATS = createRequestActionTypes('query', 'SEND_OLAP_STATS_QUERY');
 const RESET_LOADING_STATE = 'olapStats/RESET_LOADING_STATE';
 
 const initialState = {
@@ -13,13 +15,13 @@ const initialState = {
     wasLoaded: false,
 };
 
-function createOlatStatsQuery(path) {
+function createOlatStatsQuery(path: string) {
     return `SELECT * FROM \`${path}/.sys/primary_index_stats\``;
 }
 
 const queryAction = 'execute-scan';
 
-const olapStats = (state = initialState, action) => {
+const olapStats: Reducer<OlapStatsState, OlapStatsAction> = (state = initialState, action) => {
     switch (action.type) {
         case FETCH_OLAP_STATS.REQUEST: {
             return {
@@ -44,11 +46,6 @@ const olapStats = (state = initialState, action) => {
                 loading: false,
             };
         }
-        case SET_OLAP_STATS_OPTIONS:
-            return {
-                ...state,
-                ...action.data,
-            };
         case RESET_LOADING_STATE: {
             return {
                 ...state,
@@ -73,17 +70,10 @@ export const getOlapStats = ({path = ''}) => {
     });
 };
 
-export function setOlapStatsOptions(options) {
-    return {
-        type: SET_OLAP_STATS_OPTIONS,
-        data: options,
-    };
-}
-
 export function resetLoadingState() {
     return {
         type: RESET_LOADING_STATE,
-    };
+    } as const;
 }
 
 export default olapStats;

package/dist/store/reducers/settings.js

@@ -3,14 +3,16 @@ import {
     SAVED_QUERIES_KEY,
     THEME_KEY,
     TENANT_INITIAL_TAB_KEY,
-    QUERY_INITIAL_RUN_ACTION_KEY,
     INVERTED_DISKS_KEY,
     ASIDE_HEADER_COMPACT_KEY,
     USE_NODES_ENDPOINT_IN_DIAGNOSTICS_KEY,
     PARTITIONS_SELECTED_COLUMNS_KEY,
+    QUERY_INITIAL_MODE_KEY,
+    ENABLE_QUERY_MODES_FOR_EXPLAIN,
 } from '../../utils/constants';
 import '../../services/api';
-import {getValueFromLS} from '../../utils/utils';
+import {getValueFromLS, parseJson} from '../../utils/utils';
+import {QueryModes} from '../../types/store/query';
 
 const CHANGE_PROBLEM_FILTER = 'settings/CHANGE_PROBLEM_FILTER';
 const SET_SETTING_VALUE = 'settings/SET_VALUE';
@@ -38,15 +40,19 @@ export const initialState = {
     problemFilter: ALL,
     userSettings: {
         ...userSettings,
-        [THEME_KEY]: readSavedSettingsValue(THEME_KEY, 'light'),
+        [THEME_KEY]: readSavedSettingsValue(THEME_KEY, 'system'),
         [INVERTED_DISKS_KEY]: readSavedSettingsValue(INVERTED_DISKS_KEY, 'false'),
         [USE_NODES_ENDPOINT_IN_DIAGNOSTICS_KEY]: readSavedSettingsValue(
             USE_NODES_ENDPOINT_IN_DIAGNOSTICS_KEY,
             'false',
         ),
+        [ENABLE_QUERY_MODES_FOR_EXPLAIN]: readSavedSettingsValue(
+            ENABLE_QUERY_MODES_FOR_EXPLAIN,
+            'false',
+        ),
         [SAVED_QUERIES_KEY]: readSavedSettingsValue(SAVED_QUERIES_KEY, '[]'),
         [TENANT_INITIAL_TAB_KEY]: readSavedSettingsValue(TENANT_INITIAL_TAB_KEY),
-        [QUERY_INITIAL_RUN_ACTION_KEY]: readSavedSettingsValue(QUERY_INITIAL_RUN_ACTION_KEY),
+        [QUERY_INITIAL_MODE_KEY]: readSavedSettingsValue(QUERY_INITIAL_MODE_KEY, QueryModes.script),
         [ASIDE_HEADER_COMPACT_KEY]: readSavedSettingsValue(
             ASIDE_HEADER_COMPACT_KEY,
             legacyAsideNavCompactState || 'true',
@@ -97,6 +103,15 @@ export const getSettingValue = (state, name) => {
     return state.settings.userSettings[name];
 };
 
+/**
+ * Returns parsed settings value.
+ * If value cannot be parsed, returns initially stored string
+ */
+export const getParsedSettingValue = (state, name) => {
+    const value = state.settings.userSettings[name];
+    return parseJson(value);
+};
+
 export const changeFilter = (filter) => {
     return {
         type: CHANGE_PROBLEM_FILTER,

package/dist/store/reducers/storage.js

@@ -243,13 +243,11 @@ export const getFlatListStorageGroups = createSelector([getStoragePools], (stora
                     const limitSizeBytes = _.reduce(
                         group.VDisks,
                         (acc, vDisk) => {
-                            return (
-                                acc +
-                                (Number(vDisk.AvailableSize) ||
-                                    Number(vDisk.PDisk?.AvailableSize) ||
-                                    0) +
-                                (Number(vDisk.AllocatedSize) || 0)
-                            );
+                            const {AvailableSize, AllocatedSize, PDisk} = vDisk;
+                            const available = (AvailableSize ?? PDisk?.AvailableSize) || 0;
+                            const allocated = AllocatedSize || 0;
+
+                            return acc + Number(available) + Number(allocated);
                         },
                         0,
                     );

package/dist/types/api/error.ts

@@ -4,3 +4,17 @@ export interface IResponseError {
     statusText?: string;
     isCancelled?: boolean;
 }
+
+// Error on offline backend or requests blocked by CORS
+export interface NetworkError {
+    code?: unknown;
+    columnNumber?: unknown;
+    config?: Record<string, unknown>;
+    description?: unknown;
+    fileName?: unknown;
+    lineNumber?: unknown;
+    message?: 'Network Error';
+    name?: string;
+    number?: unknown;
+    stack?: string;
+}