ydb-embedded-ui 4.5.2 → 4.7.0

package/dist/store/state-url-mapping.js

@@ -45,7 +45,10 @@ const paramSetup = {
         general: {
             stateKey: 'tenant.topLevelTab',
         },
-        generalTab: {
+        queryTab: {
+            stateKey: 'tenant.queryTab',
+        },
+        diagnosticsTab: {
             stateKey: 'tenant.diagnosticsTab',
         },
         shardsMode: {

package/dist/types/api/query.ts

@@ -24,17 +24,17 @@ interface TKqpStatsCompile {}
 interface TDqTableStats {
     TablePath?: string;
     /** uint64 */
-    ReadRows?: string;
+    ReadRows?: string | number;
     /** uint64 */
-    ReadBytes?: string;
+    ReadBytes?: string | number;
     /** uint64 */
-    WriteRows?: string;
+    WriteRows?: string | number;
     /** uint64 */
-    WriteBytes?: string;
+    WriteBytes?: string | number;
     /** uint64 */
-    EraseRows?: string;
+    EraseRows?: string | number;
     /** uint64 */
-    EraseBytes?: string;
+    EraseBytes?: string | number;
     AffectedPartitions?: number;
     Extra?: unknown;
 }
@@ -42,24 +42,24 @@ interface TDqTableStats {
 /** source: https://github.com/ydb-platform/ydb/blob/main/ydb/library/yql/dq/actors/protos/dq_stats.proto */
 interface TDqExecutionStats {
     /** uint64 */
-    CpuTimeUs?: string;
+    CpuTimeUs?: string | number;
     /** uint64 */
-    DurationUs?: string;
+    DurationUs?: string | number;
     /** uint64 */
-    ResultRows?: string;
+    ResultRows?: string | number;
     /** uint64 */
-    ResultBytes?: string;
+    ResultBytes?: string | number;
 
     Tables?: TDqTableStats[];
 
     /** uint64 */
-    ExecuterCpuTimeUs?: string;
+    ExecuterCpuTimeUs?: string | number;
     /** uint64 */
-    StartTimeMs?: string;
+    StartTimeMs?: string | number;
     /** uint64 */
-    FinishTimeMs?: string;
+    FinishTimeMs?: string | number;
     /** uint64 */
-    FirstRowTimeMs?: string;
+    FirstRowTimeMs?: string | number;
 
     Stages?: TDqStageStats[];
     TxPlansWithStats?: string[];
@@ -70,17 +70,17 @@ interface TDqExecutionStats {
 /** source: https://github.com/ydb-platform/ydb/blob/main/ydb/core/protos/kqp_stats.proto */
 export interface TKqpStatsQuery {
     /** uint64 */
-    DurationUs?: string;
+    DurationUs?: string | number;
     Compilation?: TKqpStatsCompile;
 
     /** uint64 */
-    WorkerCpuTimeUs?: string;
+    WorkerCpuTimeUs?: string | number;
     /** uint64 */
-    ReadSetsCount?: string;
+    ReadSetsCount?: string | number;
     /** uint64 */
-    MaxShardProgramSize?: string;
+    MaxShardProgramSize?: string | number;
     /** uint64 */
-    MaxShardReplySize?: string;
+    MaxShardReplySize?: string | number;
 
     Executions?: TDqExecutionStats[];
 }
@@ -120,6 +120,10 @@ interface PlanNodeStats {
     TotalOutputBytes?: number;
     TotalDurationMs?: number;
     TotalOutputRows?: number;
+
+    ComputeNodes?: unknown[];
+    NodesScanShards?: unknown[];
+    UseLlvm?: unknown;
 }
 
 interface PlanNodeOperator {
@@ -128,6 +132,7 @@ interface PlanNodeOperator {
     ReadLimit?: string;
     ReadColumns?: string[];
     ReadRanges?: string[];
+    ReadRange?: string[];
     Table?: string;
     Iterator?: string;
 }
@@ -153,7 +158,7 @@ export interface ScriptPlan {
     meta: PlanMeta;
 }
 
-export interface ScanPlan {
+export interface QueryPlan {
     Plan?: PlanNode;
     tables?: PlanTable[];
     meta: PlanMeta;
@@ -177,15 +182,22 @@ export interface ColumnType {
 /** undefined = 'classic' */
 export type Schemas = 'classic' | 'modern' | 'ydb' | undefined;
 
-/**
- * undefined = 'execute'
- *
- * execute and execute-script have similar responses
- */
-export type ExecuteActions = 'execute' | 'execute-scan' | 'execute-script' | undefined;
-
-/** explain, explain-scan and explain-ast have similar responses */
-export type ExplainActions = 'explain' | 'explain-scan' | 'explain-script' | 'explain-ast';
+/** undefined = 'execute' */
+export type ExecuteActions =
+    | 'execute'
+    | 'execute-scan'
+    | 'execute-script'
+    | 'execute-data'
+    | 'execute-query'
+    | undefined;
+
+export type ExplainActions =
+    | 'explain'
+    | 'explain-scan'
+    | 'explain-script'
+    | 'explain-data'
+    | 'explain-query'
+    | 'explain-ast';
 
 export type Actions = ExecuteActions | ExplainActions;
 
@@ -197,19 +209,27 @@ export interface ErrorResponse {
 }
 
 // ==== Explain Responses ====
-
+/**
+ * meta.type = 'script'
+ *
+ * explain-script
+ */
 export interface ExplainScriptResponse {
     plan?: ScriptPlan;
 }
-
-export interface ExplainScanResponse {
+/**
+ * meta.type = 'query'
+ *
+ * explain, explain-scan, explain-data, explain-query, explain-ast
+ */
+export interface ExplainQueryResponse {
     ast?: string;
-    plan?: ScanPlan;
+    plan?: QueryPlan;
 }
 
 export type ExplainResponse<Action extends ExplainActions> = Action extends 'explain-script'
     ? ExplainScriptResponse
-    : ExplainScanResponse;
+    : ExplainQueryResponse;
 
 // ==== Execute Responses ====
 
@@ -222,22 +242,34 @@ type ResultFields<Schema extends Schemas> = Schema extends 'modern'
           result?: KeyValueRow[];
       };
 
-export type ExecuteScanResponse<Schema extends Schemas> = {
-    plan?: ScanPlan;
+/**
+ * meta.type = 'query'
+ *
+ * execute-scan, execute-data, execute-query
+ */
+export type ExecuteQueryResponse<Schema extends Schemas> = {
+    plan?: QueryPlan;
     ast?: string;
     stats?: TKqpStatsQuery;
 } & ResultFields<Schema>;
 
+/**
+ * meta.type = 'script'
+ *
+ * execute, execute-script
+ */
 export type ExecuteScriptResponse<Schema extends Schemas> = {
     plan?: ScriptPlan;
     ast?: string;
     stats?: TKqpStatsQuery;
 } & ResultFields<Schema>;
 
-export type ExecuteResponse<
-    Action extends ExecuteActions,
-    Schema extends Schemas,
-> = Action extends 'execute-scan' ? ExecuteScanResponse<Schema> : ExecuteScriptResponse<Schema>;
+export type ExecuteResponse<Action extends ExecuteActions, Schema extends Schemas> = Action extends
+    | 'execute-scan'
+    | 'execute-data'
+    | 'execute-query'
+    ? ExecuteQueryResponse<Schema>
+    : ExecuteScriptResponse<Schema>;
 
 // ==== Combined API response ====
 export type QueryAPIResponse<
@@ -250,13 +282,15 @@ export type QueryAPIResponse<
     : unknown;
 
 // ==== types to use in query result preparation ====
-export type AnyExplainResponse = ExplainScanResponse | ExplainScriptResponse;
+export type AnyExplainResponse = ExplainQueryResponse | ExplainScriptResponse;
 
-export type ExecuteModernResponse = ExecuteScanResponse<'modern'> | ExecuteScriptResponse<'modern'>;
+export type ExecuteModernResponse =
+    | ExecuteQueryResponse<'modern'>
+    | ExecuteScriptResponse<'modern'>;
 export type ExecuteClassicResponse =
-    | ExecuteScanResponse<'classic'>
+    | ExecuteQueryResponse<'classic'>
     | ExecuteScriptResponse<'classic'>;
-export type ExecuteYdbResponse = ExecuteScanResponse<'ydb'> | ExecuteScriptResponse<'ydb'>;
+export type ExecuteYdbResponse = ExecuteQueryResponse<'ydb'> | ExecuteScriptResponse<'ydb'>;
 
 export type AnyExecuteResponse =
     | ExecuteModernResponse

package/dist/types/store/explainQuery.ts

@@ -2,7 +2,7 @@ import type {ExplainPlanNodeData, GraphNode, Link} from '@gravity-ui/paranoid';
 
 import {GET_EXPLAIN_QUERY, GET_EXPLAIN_QUERY_AST} from '../../store/reducers/explainQuery';
 import type {ApiRequestAction} from '../../store/utils';
-import type {PlanTable, ErrorResponse, ScanPlan, ScriptPlan} from '../api/query';
+import type {PlanTable, ErrorResponse, QueryPlan, ScriptPlan} from '../api/query';
 import type {IQueryResult, QueryError} from './query';
 
 export interface PreparedExplainResponse {
@@ -11,7 +11,7 @@ export interface PreparedExplainResponse {
         nodes?: GraphNode<ExplainPlanNodeData>[];
         tables?: PlanTable[];
         version?: string;
-        pristine?: ScanPlan | ScriptPlan;
+        pristine?: QueryPlan | ScriptPlan;
     };
     ast?: string;
 }

package/dist/types/store/query.ts

@@ -4,7 +4,7 @@ import type {
     ColumnType,
     ErrorResponse,
     ScriptPlan,
-    ScanPlan,
+    QueryPlan,
     TKqpStatsQuery,
 } from '../api/query';
 
@@ -12,7 +12,7 @@ export interface IQueryResult {
     result?: KeyValueRow[];
     columns?: ColumnType[];
     stats?: TKqpStatsQuery;
-    plan?: ScriptPlan | ScanPlan;
+    plan?: ScriptPlan | QueryPlan;
     ast?: string;
 }
 
@@ -26,4 +26,11 @@ export type QueryError = NetworkError | ErrorResponse;
 export enum QueryModes {
     scan = 'scan',
     script = 'script',
+    data = 'data',
+    query = 'query',
+}
+
+export interface SavedQuery {
+    name: string;
+    body: string;
 }

package/dist/types/store/tablet.ts

@@ -1,8 +1,8 @@
+import type {ApiRequestAction} from '../../store/utils';
 import type {IResponseError} from '../api/error';
 import type {ETabletState, TTabletStateInfo} from '../api/tablet';
 
-import {FETCH_TABLET, FETCH_TABLET_DESCRIBE} from '../../store/reducers/tablet';
-import {ApiRequestAction} from '../../store/utils';
+import {FETCH_TABLET, FETCH_TABLET_DESCRIBE, clearTabletData} from '../../store/reducers/tablet';
 
 export interface ITabletPreparedHistoryItem {
     nodeId: string;
@@ -16,7 +16,7 @@ export interface ITabletPreparedHistoryItem {
 
 export interface ITabletState {
     loading: boolean;
-    tenantPath: string;
+    tenantPath?: string;
     error?: IResponseError;
     id?: string;
     history?: ITabletPreparedHistoryItem[];
@@ -44,7 +44,10 @@ type ITabletDescribeApiRequestAction = ApiRequestAction<
     IResponseError
 >;
 
-export type ITabletAction = ITabletApiRequestAction | ITabletDescribeApiRequestAction;
+export type ITabletAction =
+    | ITabletApiRequestAction
+    | ITabletDescribeApiRequestAction
+    | ReturnType<typeof clearTabletData>;
 
 export interface ITabletRootStateSlice {
     tablet: ITabletState;

package/dist/utils/constants.ts

@@ -75,10 +75,12 @@ export const COLORS_PRIORITY = {
     grey: 1,
 };
 
+export const DEVELOPER_UI = 'Developer UI';
+
 export const THEME_KEY = 'theme';
 export const INVERTED_DISKS_KEY = 'invertedDisks';
 export const USE_NODES_ENDPOINT_IN_DIAGNOSTICS_KEY = 'useNodesEndpointInDiagnostics';
-export const ENABLE_QUERY_MODES_FOR_EXPLAIN = 'enableQueryModesForExplain';
+export const ENABLE_ADDITIONAL_QUERY_MODES = 'enableAdditionalQueryModes';
 export const SAVED_QUERIES_KEY = 'saved_queries';
 export const ASIDE_HEADER_COMPACT_KEY = 'asideHeaderCompact';
 export const QUERIES_HISTORY_KEY = 'queries_history';
@@ -106,3 +108,5 @@ export const TENANT_INITIAL_TAB_KEY = 'saved_tenant_initial_tab';
 export const QUERY_INITIAL_MODE_KEY = 'query_initial_mode';
 
 export const PARTITIONS_HIDDEN_COLUMNS_KEY = 'partitionsHiddenColumns';
+
+export const CLUSTER_INFO_HIDDEN_KEY = 'clusterInfoHidden';

package/dist/utils/nodes.ts

@@ -20,7 +20,7 @@ export const isUnavailableNode = (node: INodesPreparedEntity | TSystemStateInfo)
 export type NodeAddress = Pick<TSystemStateInfo, 'Host' | 'Endpoints'>;
 
 export interface AdditionalNodesInfo extends Record<string, unknown> {
-    getNodeRef?: (node?: NodeAddress) => string;
+    getNodeRef?: (node?: NodeAddress) => string | null;
 }
 
 export const prepareNodesMap = (nodesList?: TNodeInfo[]) => {

package/dist/utils/query.ts

@@ -4,7 +4,7 @@ import type {
     AnyExplainResponse,
     ExecuteModernResponse,
     KeyValueRow,
-    ScanPlan,
+    QueryPlan,
     ScriptPlan,
 } from '../types/api/query';
 import type {IQueryResult} from '../types/store/query';
@@ -115,10 +115,10 @@ export const parseQueryAPIExplainResponse = (
     return data;
 };
 
-const isExplainScriptPlan = (plan: ScriptPlan | ScanPlan): plan is ScriptPlan =>
+const isExplainScriptPlan = (plan: ScriptPlan | QueryPlan): plan is ScriptPlan =>
     Boolean(plan && 'queries' in plan);
 
-export const parseQueryExplainPlan = (plan: ScriptPlan | ScanPlan): ScanPlan => {
+export const parseQueryExplainPlan = (plan: ScriptPlan | QueryPlan): QueryPlan => {
     if (isExplainScriptPlan(plan)) {
         if (!plan.queries || !plan.queries.length) {
             return {meta: plan.meta};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ydb-embedded-ui",
-  "version": "4.5.2",
+  "version": "4.7.0",
   "files": [
     "dist"
   ],
@@ -103,6 +103,7 @@
     "@commitlint/cli": "^15.0.0",
     "@commitlint/config-conventional": "^15.0.0",
     "@gravity-ui/eslint-config": "^1.0.2",
+    "@gravity-ui/icons": "^2.2.0",
     "@gravity-ui/prettier-config": "^1.0.1",
     "@gravity-ui/stylelint-config": "^1.0.1",
     "@gravity-ui/tsconfig": "^1.0.0",

package/dist/containers/Tenant/QueryEditor/QueriesHistory/QueriesHistory.scss

@@ -1,85 +0,0 @@
-$popup-width: 700px;
-
-.kv-queries-history {
-    $block: &;
-    padding: 12px 16px;
-
-    &__empty {
-        font-weight: 600;
-        text-align: center;
-    }
-    &__popup-wrapper {
-        overflow: hidden;
-
-        width: $popup-width;
-        max-width: $popup-width !important;
-
-        border-radius: 4px;
-        :nth-child(2) {
-            overflow-y: auto;
-
-            max-height: 50vh;
-        }
-
-        &::before {
-            width: $popup-width;
-
-            border-radius: 4px;
-        }
-    }
-    &__saved-queries-row {
-        display: flex;
-        align-items: center;
-
-        padding: 8px 5px;
-
-        border-bottom: 1px solid var(--yc-color-line-generic);
-        &:hover {
-            cursor: pointer;
-
-            color: var(--yc-color-text-link-hover);
-            background: var(--yc-color-base-simple-hover);
-            #{$block}__query-controls {
-                display: flex;
-            }
-        }
-        &_header {
-            font-weight: 600;
-            &:hover {
-                cursor: auto;
-
-                color: var(--yc-color-text-primary);
-                background: var(--yc-color-base-background);
-            }
-        }
-    }
-    &__query-body {
-        overflow: hidden;
-        flex-grow: 1;
-
-        white-space: pre;
-        text-overflow: ellipsis;
-        &_header {
-            display: flex;
-            justify-content: center;
-        }
-    }
-    &__query-controls {
-        display: none;
-    }
-    &__control-button {
-        display: flex;
-        justify-content: center;
-        align-items: center;
-
-        width: 24px;
-
-        color: var(--yc-color-text-hint);
-        &:hover {
-            color: var(--yc-color-text-secondary);
-        }
-    }
-    &__dialog-query-name {
-        font-weight: 500;
-    }
-}

package/dist/containers/Tenant/QueryEditor/QueriesHistory/QueriesHistory.tsx

@@ -1,95 +0,0 @@
-import React, {useRef, useState} from 'react';
-import cn from 'bem-cn-lite';
-import _ from 'lodash';
-import {Button, Popup} from '@gravity-ui/uikit';
-
-import TruncatedQuery from '../../../../components/TruncatedQuery/TruncatedQuery';
-import {useTypedSelector} from '../../../../utils/hooks';
-
-import './QueriesHistory.scss';
-
-const b = cn('kv-queries-history');
-
-const MAX_QUERY_HEIGHT = 3;
-
-interface QueriesHistoryProps {
-    changeUserInput: (value: {input: string}) => void;
-}
-
-function QueriesHistory(props: QueriesHistoryProps) {
-    const [isHistoryVisible, setIsHistoryVisible] = useState(false);
-    const history = useTypedSelector((state) => state.executeQuery.history.queries) ?? [];
-    const anchor = useRef(null);
-
-    const onShowHistoryClick = () => {
-        setIsHistoryVisible(true);
-    };
-
-    const onCloseHistory = () => {
-        setIsHistoryVisible(false);
-    };
-
-    const onQueryClick = (queryText: string) => {
-        const {changeUserInput} = props;
-        return () => {
-            changeUserInput({input: queryText});
-            onCloseHistory();
-        };
-    };
-
-    const renderSavedQueries = () => {
-        const reversedHistory = ([] as string[]).concat(history).reverse();
-        return (
-            <Popup
-                className={b('popup-wrapper')}
-                anchorRef={anchor}
-                open={isHistoryVisible}
-                placement={['bottom-end']}
-                onClose={onCloseHistory}
-            >
-                <div className={b()}>
-                    {reversedHistory.length === 0 ? (
-                        <div className={b('empty')}>History is empty</div>
-                    ) : (
-                        <React.Fragment>
-                            <div className={b('saved-queries-row', {header: true})}>
-                                <div className={b('query-body', {header: true})}>
-                                    <span>QueryText</span>
-                                </div>
-                            </div>
-                            <div>
-                                {reversedHistory.map((query, index) => {
-                                    return (
-                                        <div
-                                            className={b('saved-queries-row')}
-                                            onClick={onQueryClick(query)}
-                                            key={index}
-                                        >
-                                            <div className={b('query-body')}>
-                                                <TruncatedQuery
-                                                    value={query}
-                                                    maxQueryHeight={MAX_QUERY_HEIGHT}
-                                                />
-                                            </div>
-                                        </div>
-                                    );
-                                })}
-                            </div>
-                        </React.Fragment>
-                    )}
-                </div>
-            </Popup>
-        );
-    };
-
-    return (
-        <React.Fragment>
-            <Button ref={anchor} onClick={onShowHistoryClick}>
-                Query history
-            </Button>
-            {isHistoryVisible && renderSavedQueries()}
-        </React.Fragment>
-    );
-}
-
-export default QueriesHistory;