ydb-embedded-ui 6.11.0 → 6.13.0

package/dist/containers/Tenant/Query/ExplainResult/ExplainResult.scss

@@ -1,5 +1,3 @@
-@import '../../../../styles/mixins.scss';
-
 .ydb-query-explain-result {
     &__result {
         display: flex;
@@ -10,6 +8,7 @@
     &__text-message {
         padding: 15px 20px;
     }
+
     &__controls {
         position: sticky;
         z-index: 2;
@@ -35,34 +34,6 @@
         display: flex;
         gap: 4px;
     }
-    &__explain-canvas-container {
-        overflow-y: auto;
-
-        width: 100%;
-        height: 100%;
-        &_hidden {
-            display: none;
-        }
-    }
-    &__inspector {
-        overflow-y: auto;
-
-        padding: 15px 20px;
-        @include json-tree-styles();
-
-        &_fullscreen {
-            padding: 10px;
-        }
-    }
-
-    &__ast {
-        overflow: hidden;
-
-        width: 100%;
-        height: 100%;
-
-        white-space: pre-wrap;
-    }
     &__loader {
         display: flex;
         justify-content: center;

package/dist/containers/Tenant/Query/ExplainResult/components/Ast/Ast.d.ts

@@ -0,0 +1,7 @@
+import './Ast.scss';
+interface AstProps {
+    ast: string;
+    theme: string;
+}
+export declare function Ast({ ast, theme }: AstProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/containers/Tenant/Query/ExplainResult/components/Ast/Ast.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import MonacoEditor from 'react-monaco-editor';
+import { cn } from '../../../../../../utils/cn';
+import { S_EXPRESSION_LANGUAGE_ID } from '../../../../../../utils/monaco/constats';
+import './Ast.scss';
+const b = cn('ydb-query-explain-ast');
+const EDITOR_OPTIONS = {
+    automaticLayout: true,
+    selectOnLineNumbers: true,
+    readOnly: true,
+    minimap: {
+        enabled: false,
+    },
+    wrappingIndent: 'indent',
+};
+export function Ast({ ast, theme }) {
+    return (_jsx("div", { className: b(), children: _jsx(MonacoEditor, { language: S_EXPRESSION_LANGUAGE_ID, value: ast, options: EDITOR_OPTIONS, theme: `vs-${theme}` }) }));
+}

package/dist/containers/Tenant/Query/ExplainResult/components/Ast/Ast.scss

@@ -0,0 +1,8 @@
+.ydb-query-explain-ast {
+    overflow: hidden;
+
+    width: 100%;
+    height: 100%;
+
+    white-space: pre-wrap;
+}

package/dist/containers/Tenant/Query/ExplainResult/components/Graph/Graph.d.ts

@@ -0,0 +1,8 @@
+import type { PreparedExplainResponse } from '../../../../../../store/reducers/explainQuery/types';
+import './Graph.scss';
+interface GraphProps {
+    explain: PreparedExplainResponse['plan'];
+    theme: string;
+}
+export declare function Graph({ explain, theme }: GraphProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/containers/Tenant/Query/ExplainResult/components/Graph/Graph.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { YDBGraph } from '../../../../../../components/Graph/Graph';
+import { explainVersions } from '../../../../../../store/reducers/explainQuery/utils';
+import { cn } from '../../../../../../utils/cn';
+import i18n from '../../i18n';
+import './Graph.scss';
+const b = cn('ydb-query-explain-graph');
+export function Graph({ explain, theme }) {
+    const { links, nodes, version } = explain !== null && explain !== void 0 ? explain : {};
+    const isSupportedVersion = version === explainVersions.v2;
+    const isEnoughDataForGraph = links && nodes && nodes.length;
+    const content = isSupportedVersion && isEnoughDataForGraph ? (_jsx("div", { className: b('canvas-container'), children: _jsx(YDBGraph, { data: { links, nodes } }, theme) })) : (_jsx("div", { className: b('text-message'), children: i18n('description.graph-is-not-supported') }));
+    return content;
+}

package/dist/containers/Tenant/Query/ExplainResult/components/Graph/Graph.scss

@@ -0,0 +1,14 @@
+.ydb-query-explain-graph {
+    &__canvas-container {
+        overflow-y: auto;
+
+        width: 100%;
+        height: 100%;
+        &_hidden {
+            display: none;
+        }
+    }
+    &__text-message {
+        padding: 15px 20px;
+    }
+}

package/dist/containers/Tenant/Query/ExplainResult/components/SimplifiedPlan/MetricsCell.d.ts

@@ -0,0 +1,6 @@
+interface MetricsCellProps {
+    value: unknown;
+    formatter: (value: number) => string;
+}
+export declare function MetricsCell({ value, formatter }: MetricsCellProps): import("react/jsx-runtime").JSX.Element | undefined;
+export {};

package/dist/containers/Tenant/Query/ExplainResult/components/SimplifiedPlan/MetricsCell.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { isNumeric } from '../../../../../../utils/utils';
+import { block } from './utils';
+export function MetricsCell({ value, formatter }) {
+    if (!isNumeric(value)) {
+        return undefined;
+    }
+    const numberValue = Number(value);
+    const content = formatter(numberValue);
+    return _jsx("div", { className: block('metrics-cell'), children: content });
+}

package/dist/containers/Tenant/Query/ExplainResult/components/SimplifiedPlan/OperationCell.d.ts

@@ -0,0 +1,13 @@
+import type { Row } from '@tanstack/react-table';
+import type { SimlifiedPlanOperatorOtherParams } from '../../../../../../types/api/query';
+interface OperationCellProps<TData> {
+    row: Row<TData>;
+    depth?: number;
+    params: {
+        name: string;
+        operationParams?: SimlifiedPlanOperatorOtherParams;
+        lines?: string;
+    };
+}
+export declare function OperationCell<TData>({ row, depth, params }: OperationCellProps<TData>): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/containers/Tenant/Query/ExplainResult/components/SimplifiedPlan/OperationCell.js

@@ -0,0 +1,48 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { ArrowToggle, Button, Flex } from '@gravity-ui/uikit';
+import { OperationParams } from './OperationParams';
+import { block } from './utils';
+const LEVEL_PADDING = 25;
+const FIRST_PADDING = 9;
+function Divider({ modifiers, left }) {
+    return (_jsx("div", { className: block('divider', modifiers), style: {
+            left,
+        } }));
+}
+function getDividers(lines, hasLeafs) {
+    const linesArray = lines.split('.').map(Number);
+    const dividers = [];
+    for (let i = 0; i < linesArray.length; i++) {
+        //logic for calculating left coordinate: FIRST_PADDING - is a padding from start of a level to the middle of toggle button
+        // LEVEL_PADDING is a difference between levels
+        // (i-1): in `lines` we have digits that point, should we paint a line for previous levels or not
+        if (i === linesArray.length - 1 && i !== 0) {
+            if (linesArray[i]) {
+                //horizontal pointer to the node (├)
+                dividers.push(_jsx(Divider, { modifiers: { horizontal: true }, left: FIRST_PADDING + 1 + LEVEL_PADDING * (i - 1) }, 'last'));
+            }
+            else {
+                //pointer to the last child in the branch (└)
+                dividers.push(_jsx(Divider, { modifiers: { last: true }, left: FIRST_PADDING + LEVEL_PADDING * (i - 1) }, 'last'));
+            }
+        }
+        if (i === linesArray.length - 1 && hasLeafs) {
+            //starting vertical line if node has leafs
+            dividers.push(_jsx(Divider, { modifiers: { first: true }, left: FIRST_PADDING + LEVEL_PADDING * i }, 'first'));
+        }
+        if (linesArray[i]) {
+            //vertical line indicating level
+            dividers.push(_jsx(Divider, { left: FIRST_PADDING + LEVEL_PADDING * (i - 1) }, i));
+        }
+    }
+    return dividers;
+}
+export function OperationCell({ row, depth = 0, params }) {
+    const { name, operationParams, lines = '' } = params;
+    const hasLeafs = row.getLeafRows().length > 0;
+    const dividers = React.useMemo(() => getDividers(lines, hasLeafs), [lines, hasLeafs]);
+    return (_jsxs("div", { style: {
+            paddingLeft: LEVEL_PADDING * depth,
+        }, className: block('operation-name'), children: [dividers, _jsxs(Flex, { gap: 1, alignItems: "flex-start", className: block('operation-content'), children: [row.getCanExpand() && (_jsx(Button, { view: "flat", size: "xs", onClick: row.getToggleExpandedHandler(), children: _jsx(Button.Icon, { children: _jsx(ArrowToggle, { direction: row.getIsExpanded() ? 'bottom' : 'right', size: 14 }) }) })), _jsx("div", { className: block('operation-name-content'), children: _jsxs("div", { children: [name, "\u00A0", _jsx(OperationParams, { params: operationParams })] }) })] })] }));
+}

package/dist/containers/Tenant/Query/ExplainResult/components/SimplifiedPlan/OperationParams.d.ts

@@ -0,0 +1,6 @@
+import type { SimlifiedPlanOperatorOtherParams } from '../../../../../../types/api/query';
+interface OperationParamsProps {
+    params?: SimlifiedPlanOperatorOtherParams;
+}
+export declare function OperationParams({ params }: OperationParamsProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/containers/Tenant/Query/ExplainResult/components/SimplifiedPlan/OperationParams.js

@@ -0,0 +1,66 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { block } from './utils';
+const operatorPropertyToColor = {
+    Table: 'var(--g-color-text-info)',
+    Predicate: 'var(--g-color-text-positive)',
+    Condition: 'var(--g-color-text-utility)',
+};
+function getOperatorPropertyColor(property) {
+    if (property in operatorPropertyToColor) {
+        return operatorPropertyToColor[property];
+    }
+    return 'var(--g-color-text-secondary)';
+}
+function prepareValue(value) {
+    if (value === undefined) {
+        return '';
+    }
+    if (typeof value === 'object') {
+        return JSON.stringify(value);
+    }
+    else {
+        return value.toString();
+    }
+}
+function reorderParamsEntries(params) {
+    const reordered = [];
+    const { Table, Predicate, Condition, ...rest } = params;
+    if (Table) {
+        reordered.push(['Table', Table]);
+    }
+    if (Predicate) {
+        reordered.push(['Predicate', Predicate]);
+    }
+    if (Condition) {
+        reordered.push(['Condition', Condition]);
+    }
+    return reordered.concat(Object.entries(rest));
+}
+function getOperationParams(params = {}) {
+    const result = [];
+    const paramsEntries = Object.entries(params);
+    if (paramsEntries.length === 1) {
+        const value = paramsEntries[0][1];
+        const color = getOperatorPropertyColor(paramsEntries[0][0]);
+        // if there is only one param, display value without key
+        result.push(_jsx("span", { style: { color }, children: prepareValue(value) }, "param"));
+    }
+    else {
+        const reorderedParamsEntries = reorderParamsEntries(params);
+        for (let i = 0; i < reorderedParamsEntries.length; i++) {
+            const [key, value] = reorderedParamsEntries[i];
+            const color = getOperatorPropertyColor(key);
+            if (i > 0) {
+                result.push(', ');
+            }
+            result.push(_jsxs("span", { style: { color }, children: [key, ": ", prepareValue(value)] }, i));
+        }
+    }
+    return result;
+}
+export function OperationParams({ params }) {
+    if (!params) {
+        return null;
+    }
+    return _jsxs("span", { className: block('operation-params'), children: ["(", getOperationParams(params), ")"] });
+}

package/dist/containers/Tenant/Query/ExplainResult/components/SimplifiedPlan/SimplifiedPlan.d.ts

@@ -0,0 +1,7 @@
+import type { SimplifiedPlanItem } from '../../../../../../store/reducers/explainQuery/types';
+import './SimplifiedPlan.scss';
+interface SimplifiedPlanProps {
+    plan: SimplifiedPlanItem[];
+}
+export declare function SimplifiedPlan({ plan }: SimplifiedPlanProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/containers/Tenant/Query/ExplainResult/components/SimplifiedPlan/SimplifiedPlan.js

@@ -0,0 +1,100 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import { Table, useTable } from '@gravity-ui/table';
+import { configuredNumeral } from '../../../../../../utils/numeral';
+import { formatToMs } from '../../../../../../utils/timeParsers';
+import { toExponential } from '../../../../../../utils/utils';
+import { MetricsCell } from './MetricsCell';
+import { OperationCell } from './OperationCell';
+import { block, getExtendedTreeNodes, getTreeNodesCoordinates } from './utils';
+import './SimplifiedPlan.scss';
+function nameAccessorFn(row) {
+    return { name: row.name, operationParams: row.operationParams, lines: row.lines };
+}
+function metricsCell(info) {
+    const formatter = (value) => value < 1e8 ? configuredNumeral(value).format() : toExponential(value, 1);
+    return _jsx(MetricsCell, { value: info.getValue(), formatter: formatter });
+}
+function cpuCell(info) {
+    const formatter = (value) => formatToMs(Math.round(value));
+    return _jsx(MetricsCell, { value: info.getValue(), formatter: formatter });
+}
+function ColumnHeader({ name }) {
+    return _jsx("div", { className: block('table-header-content'), children: name });
+}
+const columns = [
+    {
+        accessorKey: 'name',
+        accessorFn: nameAccessorFn,
+        header: () => _jsx(ColumnHeader, { name: "Operation" }),
+        size: 600,
+        cell: (info) => (_jsx(OperationCell, { row: info.row, depth: info.row.depth, params: info.getValue() })),
+    },
+    {
+        accessorKey: 'aCpu',
+        header: () => _jsx(ColumnHeader, { name: "A-Cpu" }),
+        size: 90,
+        minSize: 100,
+        cell: cpuCell,
+        meta: { align: 'right', verticalAlign: 'top' },
+    },
+    {
+        accessorKey: 'aRows',
+        header: () => _jsx(ColumnHeader, { name: "A-Rows" }),
+        size: 90,
+        minSize: 100,
+        cell: metricsCell,
+        meta: { align: 'right', verticalAlign: 'top' },
+    },
+    {
+        accessorKey: 'eCost',
+        header: () => _jsx(ColumnHeader, { name: "E-Cost" }),
+        size: 90,
+        minSize: 100,
+        cell: metricsCell,
+        meta: { align: 'right', verticalAlign: 'top' },
+    },
+    {
+        accessorKey: 'eRows',
+        header: () => _jsx(ColumnHeader, { name: "E-Rows" }),
+        size: 90,
+        minSize: 100,
+        cell: metricsCell,
+        meta: { align: 'right', verticalAlign: 'top' },
+    },
+    {
+        accessorKey: 'eSize',
+        header: () => _jsx(ColumnHeader, { name: "E-Size" }),
+        size: 90,
+        minSize: 100,
+        cell: metricsCell,
+        meta: { align: 'right', verticalAlign: 'top' },
+    },
+];
+export function SimplifiedPlan({ plan }) {
+    const planWithLinesInfo = React.useMemo(() => getExtendedTreeNodes(plan), [plan]);
+    const [expanded, setExpanded] = React.useState(() => {
+        const coordinates = getTreeNodesCoordinates(plan);
+        return Object.fromEntries(coordinates.map((id) => [id, true]));
+    });
+    const table = useTable({
+        columns,
+        data: planWithLinesInfo,
+        getSubRows: (item) => item.children,
+        enableExpanding: true,
+        onExpandedChange: setExpanded,
+        state: {
+            expanded,
+        },
+    });
+    return (_jsx("div", { className: block(), children: _jsx(Table, { table: table, headerCellClassName: ({ column }) => {
+                var _a;
+                const align = (_a = column.columnDef.meta) === null || _a === void 0 ? void 0 : _a.align;
+                return block('table-header-cell', { align });
+            }, cellClassName: (cell) => {
+                var _a, _b;
+                const align = (_a = cell === null || cell === void 0 ? void 0 : cell.column.columnDef.meta) === null || _a === void 0 ? void 0 : _a.align;
+                const verticalAlign = (_b = cell === null || cell === void 0 ? void 0 : cell.column.columnDef.meta) === null || _b === void 0 ? void 0 : _b.verticalAlign;
+                return block('table-cell', { align, 'vertical-align': verticalAlign });
+            }, className: block('table'), stickyHeader: true }) }));
+}

package/dist/containers/Tenant/Query/ExplainResult/components/SimplifiedPlan/SimplifiedPlan.scss

@@ -0,0 +1,128 @@
+@import '../../../../../../styles/mixins.scss';
+
+.ydb-query-explain-simplified-plan {
+    $block: &;
+    overflow: auto;
+
+    height: 100%;
+    padding: 0 0 15px;
+    &__table {
+        width: 100%;
+        max-width: 100%;
+
+        table-layout: fixed;
+        border-spacing: 0px;
+        border-collapse: collapse;
+        tr {
+            &:hover {
+                background-color: var(--g-color-base-generic-hover) !important;
+            }
+        }
+        tr:nth-of-type(2n + 1) {
+            background-color: var(--g-color-base-generic-ultralight);
+        }
+    }
+    &__name {
+        display: flex;
+        align-items: center;
+        gap: var(--g-spacing-1);
+
+        max-width: 100%;
+    }
+    &__table-header-cell {
+        height: 40px;
+        padding: 0;
+
+        text-align: left;
+
+        background-color: var(--g-color-base-background);
+        @include text-subheader-2();
+        &_align_right {
+            text-align: right;
+        }
+    }
+    &__table-header-content {
+        height: 100%;
+        padding: 0 var(--g-spacing-2);
+
+        line-height: 40px;
+
+        border-bottom: 1px solid var(--g-color-line-generic);
+    }
+    &__metrics-cell {
+        padding: var(--g-spacing-1) var(--g-spacing-2);
+    }
+    &__table-cell {
+        height: 30px;
+        padding: 0;
+        @include text-body-2();
+        &_align_right {
+            text-align: right;
+        }
+        &_vertical-align_top {
+            vertical-align: top;
+        }
+    }
+    &__operation-params {
+        color: var(--g-color-text-secondary);
+    }
+    &__operation-name {
+        position: relative;
+
+        max-width: 100%;
+        height: 100%;
+    }
+
+    &__divider {
+        position: absolute;
+        bottom: 0;
+
+        width: 12px;
+        height: 100%;
+
+        box-shadow: 1px 0 0 0 var(--g-color-line-generic) inset;
+
+        &_last {
+            top: 0;
+            bottom: unset;
+
+            width: 12px;
+            height: 14px;
+
+            border-radius: 0 0 0 1px;
+            box-shadow: 1px -1px 0 0 var(--g-color-line-generic) inset;
+        }
+        &_horizontal {
+            top: 0;
+            bottom: unset;
+
+            width: 12px;
+            height: 14px;
+
+            box-shadow: 0 -1px 0 0 var(--g-color-line-generic) inset;
+        }
+        &_first {
+            height: calc(100% - 24px);
+        }
+    }
+
+    &__operation-content {
+        align-items: baseline;
+
+        max-width: 100%;
+        height: 100%;
+        padding: var(--g-spacing-1) 0;
+
+        word-break: break-word;
+    }
+
+    &__operation-name-content {
+        display: flex;
+        flex-grow: 1;
+
+        height: 100%;
+    }
+    .gt-table__cell_id_name {
+        border: unset;
+    }
+}

package/dist/containers/Tenant/Query/ExplainResult/components/SimplifiedPlan/types.d.ts

@@ -0,0 +1,5 @@
+import type { SimplifiedPlanItem } from '../../../../../../store/reducers/explainQuery/types';
+export interface ExtendedSimplifiesPlanItem extends Omit<SimplifiedPlanItem, 'children'> {
+    lines?: string;
+    children?: ExtendedSimplifiesPlanItem[];
+}

package/dist/containers/Tenant/Query/ExplainResult/components/SimplifiedPlan/types.js

@@ -0,0 +1 @@
+export {};

package/dist/containers/Tenant/Query/ExplainResult/components/SimplifiedPlan/utils.d.ts

@@ -0,0 +1,5 @@
+import type { SimplifiedPlanItem } from '../../../../../../store/reducers/explainQuery/types';
+import type { ExtendedSimplifiesPlanItem } from './types';
+export declare const block: import("@bem-react/classname").ClassNameFormatter;
+export declare function getTreeNodesCoordinates(items?: SimplifiedPlanItem[], prefix?: string): string[];
+export declare function getExtendedTreeNodes(items?: SimplifiedPlanItem[], prefix?: string): ExtendedSimplifiesPlanItem[];

package/dist/containers/Tenant/Query/ExplainResult/components/SimplifiedPlan/utils.js

@@ -0,0 +1,59 @@
+import { cn } from '../../../../../../utils/cn';
+export const block = cn('ydb-query-explain-simplified-plan');
+export function getTreeNodesCoordinates(items, prefix = '') {
+    const result = [];
+    const stack = [];
+    if (items) {
+        stack.push({ items, prefix });
+    }
+    while (stack.length > 0) {
+        const { items, prefix } = stack.pop();
+        items === null || items === void 0 ? void 0 : items.forEach((item, index) => {
+            let newPrefix = `${prefix}.${index}`;
+            if (!prefix) {
+                newPrefix = String(index);
+            }
+            result.push(newPrefix);
+            if (item.children) {
+                stack.push({ items: item.children, prefix: newPrefix });
+            }
+        });
+    }
+    return result;
+}
+export function getExtendedTreeNodes(items, prefix = '') {
+    if (!items) {
+        return [];
+    }
+    const stack = [{ items, prefix, parentIndex: -1, parentArray: [] }];
+    const newItems = [];
+    while (stack.length > 0) {
+        const { items, prefix, parentIndex, parentArray } = stack.pop();
+        const localItems = [];
+        for (let i = 0; i < items.length; i++) {
+            const newItem = { ...items[i] };
+            const line = i < items.length - 1 ? 1 : 0;
+            let newPrefix = `${prefix}.${line}`;
+            if (!prefix) {
+                newPrefix = String(line);
+            }
+            newItem['lines'] = newPrefix;
+            localItems.push(newItem);
+            if (newItem.children) {
+                stack.push({
+                    items: newItem.children,
+                    prefix: newPrefix,
+                    parentIndex: i,
+                    parentArray: localItems,
+                });
+            }
+        }
+        if (parentIndex === -1) {
+            newItems.push(...localItems);
+        }
+        else {
+            parentArray[parentIndex].children = localItems;
+        }
+    }
+    return newItems;
+}

package/dist/containers/Tenant/Query/ExplainResult/components/TextExplain/TextExplain.d.ts

@@ -0,0 +1,8 @@
+import type { QueryPlan, ScriptPlan } from '../../../../../../types/api/query';
+import './TextExplain.scss';
+import 'react-json-inspector/json-inspector.css';
+interface TextExplainProps {
+    explain: QueryPlan | ScriptPlan;
+}
+export declare function TextExplain({ explain }: TextExplainProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/containers/Tenant/Query/ExplainResult/components/TextExplain/TextExplain.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import JSONTree from 'react-json-inspector';
+import { cn } from '../../../../../../utils/cn';
+import './TextExplain.scss';
+import 'react-json-inspector/json-inspector.css';
+const b = cn('ydb-query-explain-text');
+export function TextExplain({ explain }) {
+    return (_jsx(JSONTree, { data: explain, isExpanded: () => true, className: b('inspector'), searchOptions: {
+            debounceTime: 300,
+        } }));
+}

package/dist/containers/Tenant/Query/ExplainResult/components/TextExplain/TextExplain.scss

@@ -0,0 +1,14 @@
+@import '../../../../../../styles/mixins.scss';
+
+.ydb-query-explain-text {
+    &__inspector {
+        overflow-y: auto;
+
+        padding: 15px 20px;
+        @include json-tree-styles();
+
+        &_fullscreen {
+            padding: 10px;
+        }
+    }
+}

package/dist/containers/Tenant/Query/ExplainResult/i18n/en.json

@@ -0,0 +1,8 @@
+{
+    "description.empty-result": "There is no {{activeOption}} for the request",
+    "description.graph-is-not-supported": "Graph can not be rendered",
+    "action.schema": "Schema",
+    "action.explain-plan": "Explain Plan",
+    "action.json": "JSON",
+    "action.ast": "AST"
+}

package/dist/containers/Tenant/Query/ExplainResult/i18n/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (key: "description.graph-is-not-supported" | "action.schema" | "action.explain-plan" | "description.empty-result" | "action.json" | "action.ast", params?: import("@gravity-ui/i18n").Params) => string;
+export default _default;

package/dist/containers/Tenant/Query/ExplainResult/i18n/index.js

@@ -0,0 +1,4 @@
+import { registerKeysets } from '../../../../../utils/i18n';
+import en from './en.json';
+const COMPONENT = 'ydb-explain-result';
+export default registerKeysets(COMPONENT, { en });