ydb-embedded-ui 6.7.0 → 6.9.0

package/dist/utils/disks/prepareDisks.js

@@ -0,0 +1,46 @@
+import { isNumeric } from '../utils';
+import { calculatePDiskSeverity } from './calculatePDiskSeverity';
+import { calculateVDiskSeverity } from './calculateVDiskSeverity';
+import { getPDiskType } from './getPDiskType';
+export function prepareVDiskData(vdiskState = {}) {
+    var _a;
+    // Prepare PDisk only if it is present
+    const PDisk = vdiskState.PDisk ? preparePDiskData(vdiskState.PDisk) : undefined;
+    const AllocatedPercent = calculateVDiskAllocatedPercent(vdiskState.AllocatedSize, vdiskState.AvailableSize, PDisk === null || PDisk === void 0 ? void 0 : PDisk.AvailableSize);
+    const Donors = (_a = vdiskState.Donors) === null || _a === void 0 ? void 0 : _a.map((donor) => {
+        return prepareVDiskData({ ...donor, DonorMode: true });
+    });
+    const Severity = calculateVDiskSeverity(vdiskState);
+    return {
+        ...vdiskState,
+        PDisk,
+        AllocatedPercent,
+        Donors,
+        Severity,
+    };
+}
+export function preparePDiskData(pdiskState = {}) {
+    const { AvailableSize, TotalSize, Category } = pdiskState;
+    const Type = getPDiskType(Category);
+    const AllocatedPercent = calculatePDiskAllocatedPercent(AvailableSize, TotalSize);
+    const Severity = calculatePDiskSeverity(pdiskState, AllocatedPercent);
+    return {
+        ...pdiskState,
+        Type,
+        AllocatedPercent,
+        Severity,
+    };
+}
+function calculatePDiskAllocatedPercent(available, total) {
+    if (!isNumeric(available) || !isNumeric(total)) {
+        return undefined;
+    }
+    return Math.round(((Number(total) - Number(available)) * 100) / Number(total));
+}
+function calculateVDiskAllocatedPercent(allocated, availableOnVDisk, availableOnPDisk) {
+    const available = availableOnVDisk !== null && availableOnVDisk !== void 0 ? availableOnVDisk : availableOnPDisk;
+    if (!isNumeric(allocated) || !isNumeric(available)) {
+        return undefined;
+    }
+    return Math.round((Number(allocated) * 100) / (Number(allocated) + Number(available)));
+}

package/dist/utils/hooks/useSearchQuery.d.ts

@@ -0,0 +1 @@
+export declare const useSearchQuery: () => import("qs").ParsedQs;

package/dist/utils/hooks/useSearchQuery.js

@@ -0,0 +1,6 @@
+import { useLocation } from 'react-router-dom';
+import { parseQuery } from '../../routes';
+export const useSearchQuery = () => {
+    const location = useLocation();
+    return parseQuery(location);
+};

package/dist/utils/i18n/i18n.d.ts

@@ -0,0 +1,11 @@
+import type { KeysData } from '@gravity-ui/i18n';
+import { I18N } from '@gravity-ui/i18n';
+declare enum Lang {
+    En = "en",
+    Ru = "ru"
+}
+declare const defaultLang = Lang.En;
+declare const currentLang: Lang;
+declare const i18n: I18N;
+export declare function registerKeysets<Keyset extends KeysData>(id: string, data: Record<string, Keyset>): (key: Extract<keyof Keyset, string>, params?: import("@gravity-ui/i18n").Params) => string;
+export { i18n, Lang, currentLang, defaultLang };

package/dist/utils/lazyComponent.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import { Loader } from '@gravity-ui/uikit';
+import { useComponent } from '../components/ComponentsProvider/ComponentsProvider';
+import { ErrorBoundaryFallback } from '../components/ErrorBoundary/ErrorBoundary';
+export function lazyComponent(moduleLoader, exportName, loader) {
+    const Component = React.lazy(() => moduleLoader()
+        .then((module) => ({ default: module[exportName] }))
+        .catch((error) => ({ default: () => _jsx(ErrorBoundaryFallback, { error: error }) })));
+    const LazyComponent = (props, ref) => {
+        const ErrorBoundary = useComponent('ErrorBoundary');
+        return (_jsx(ErrorBoundary, { children: _jsx(React.Suspense, { fallback: loader !== null && loader !== void 0 ? loader : _jsx(DefaultLoader, {}), children: _jsx(Component, { ref: ref, ...props }) }) }));
+    };
+    LazyComponent.displayName = exportName;
+    return React.forwardRef(LazyComponent);
+}
+function DefaultLoader() {
+    return (_jsx("div", { style: {
+            width: '100%',
+            height: '100%',
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+        }, children: _jsx(Loader, { size: "l" }) }));
+}

package/dist/utils/nodes.d.ts

@@ -0,0 +1,49 @@
+import { z } from 'zod';
+import type { NodesPreparedEntity } from '../store/reducers/nodes/types';
+import type { ProblemFilterValue } from '../store/reducers/settings/types';
+import type { TComputeNodeInfo } from '../types/api/compute';
+import type { TSystemStateInfo } from '../types/api/nodes';
+import type { TNodeInfo } from '../types/api/nodesList';
+import type { ValueOf } from '../types/common';
+import type { NodesMap } from '../types/store/nodesList';
+export declare enum NodesUptimeFilterValues {
+    'All' = "All",
+    'SmallUptime' = "SmallUptime"
+}
+export declare const nodesUptimeFilterValuesSchema: z.ZodCatch<z.ZodNativeEnum<typeof NodesUptimeFilterValues>>;
+export declare const NodesUptimeFilterTitles: {
+    All: string;
+    SmallUptime: string;
+};
+export declare const isUnavailableNode: (node: NodesPreparedEntity | TSystemStateInfo) => boolean;
+export declare const prepareNodesMap: (nodesList?: TNodeInfo[]) => NodesMap | undefined;
+export declare function calculateLoadAveragePercents(node?: TSystemStateInfo | TComputeNodeInfo): number[] | undefined;
+export interface PreparedNodeSystemState extends TSystemStateInfo {
+    Rack?: string;
+    DC?: string;
+    LoadAveragePercents?: number[];
+    Uptime: string;
+}
+export declare const prepareNodeSystemState: (systemState?: TSystemStateInfo) => PreparedNodeSystemState;
+export declare const getProblemParamValue: (problemFilter: ProblemFilterValue | undefined) => problemFilter is "With problems";
+export declare const getUptimeParamValue: (nodesUptimeFilter: NodesUptimeFilterValues | undefined) => number | undefined;
+/**
+ * Values to sort /compute v2 and /nodes responses
+ *
+ * For actual values go to:\
+ * /nodes: https://github.com/ydb-platform/ydb/blob/main/ydb/core/viewer/json_nodes.h\
+ * /compute: https://github.com/ydb-platform/ydb/blob/main/ydb/core/viewer/json_compute.h
+ */
+export declare const NODES_SORT_VALUES: {
+    readonly NodeId: "NodeId";
+    readonly Host: "Host";
+    readonly DC: "DC";
+    readonly Rack: "Rack";
+    readonly Version: "Version";
+    readonly Uptime: "Uptime";
+    readonly Memory: "Memory";
+    readonly CPU: "CPU";
+    readonly LoadAverage: "LoadAverage";
+};
+export type NodesSortValue = ValueOf<typeof NODES_SORT_VALUES>;
+export declare const isSortableNodesProperty: (value: string) => value is NodesSortValue;

package/dist/utils/nodes.js

@@ -0,0 +1,76 @@
+import { z } from 'zod';
+import { ProblemFilterValues } from '../store/reducers/settings/settings';
+import { EFlag } from '../types/api/enums';
+import { HOUR_IN_SECONDS } from './constants';
+import { calcUptime } from './dataFormatters/dataFormatters';
+import { valueIsDefined } from '.';
+export var NodesUptimeFilterValues;
+(function (NodesUptimeFilterValues) {
+    NodesUptimeFilterValues["All"] = "All";
+    NodesUptimeFilterValues["SmallUptime"] = "SmallUptime";
+})(NodesUptimeFilterValues || (NodesUptimeFilterValues = {}));
+export const nodesUptimeFilterValuesSchema = z
+    .nativeEnum(NodesUptimeFilterValues)
+    .catch(NodesUptimeFilterValues.All);
+export const NodesUptimeFilterTitles = {
+    [NodesUptimeFilterValues.All]: 'All',
+    [NodesUptimeFilterValues.SmallUptime]: 'Uptime < 1h',
+};
+export const isUnavailableNode = (node) => !node.SystemState || node.SystemState === EFlag.Grey;
+export const prepareNodesMap = (nodesList) => {
+    return nodesList === null || nodesList === void 0 ? void 0 : nodesList.reduce((nodesMap, node) => {
+        if (node.Id && node.Host) {
+            nodesMap.set(Number(node.Id), node.Host);
+        }
+        return nodesMap;
+    }, new Map());
+};
+export function calculateLoadAveragePercents(node = {}) {
+    const { LoadAverage, NumberOfCpus } = node;
+    if (!valueIsDefined(LoadAverage) || !valueIsDefined(NumberOfCpus)) {
+        return undefined;
+    }
+    return LoadAverage.map((value) => {
+        return (value * 100) / NumberOfCpus;
+    });
+}
+export const prepareNodeSystemState = (systemState = {}) => {
+    var _a, _b;
+    // There is no Rack in Location field for din nodes
+    const Rack = ((_a = systemState.Location) === null || _a === void 0 ? void 0 : _a.Rack) || systemState.Rack;
+    const DC = ((_b = systemState.Location) === null || _b === void 0 ? void 0 : _b.DataCenter) || systemState.DataCenter;
+    const Uptime = calcUptime(systemState.StartTime);
+    const LoadAveragePercents = calculateLoadAveragePercents(systemState);
+    return {
+        ...systemState,
+        Rack,
+        DC,
+        Uptime,
+        LoadAveragePercents,
+    };
+};
+export const getProblemParamValue = (problemFilter) => {
+    return problemFilter === ProblemFilterValues.PROBLEMS;
+};
+export const getUptimeParamValue = (nodesUptimeFilter) => {
+    return nodesUptimeFilter === NodesUptimeFilterValues.SmallUptime ? HOUR_IN_SECONDS : undefined;
+};
+/**
+ * Values to sort /compute v2 and /nodes responses
+ *
+ * For actual values go to:\
+ * /nodes: https://github.com/ydb-platform/ydb/blob/main/ydb/core/viewer/json_nodes.h\
+ * /compute: https://github.com/ydb-platform/ydb/blob/main/ydb/core/viewer/json_compute.h
+ */
+export const NODES_SORT_VALUES = {
+    NodeId: 'NodeId',
+    Host: 'Host',
+    DC: 'DC',
+    Rack: 'Rack',
+    Version: 'Version',
+    Uptime: 'Uptime',
+    Memory: 'Memory',
+    CPU: 'CPU',
+    LoadAverage: 'LoadAverage',
+};
+export const isSortableNodesProperty = (value) => Object.values(NODES_SORT_VALUES).includes(value);

package/dist/utils/query.js

@@ -0,0 +1,200 @@
+import { YQLType } from '../types';
+import { isAxiosResponse, isNetworkError } from './response';
+export const QUERY_ACTIONS = {
+    execute: 'execute',
+    explain: 'explain',
+};
+export const QUERY_MODES = {
+    scan: 'scan',
+    script: 'script',
+    data: 'data',
+    query: 'query',
+    pg: 'pg',
+};
+export const QUERY_MODES_TITLES = {
+    scan: 'Scan',
+    script: 'YQL Script',
+    data: 'Data',
+    query: 'YQL - QueryService',
+    pg: 'PostgreSQL',
+};
+export const QUERY_SYNTAX = {
+    yql: 'yql_v1',
+    pg: 'pg',
+};
+// eslint-disable-next-line complexity
+export const getColumnType = (type) => {
+    switch (type.replace(/\?$/, '')) {
+        case YQLType.Bool:
+            return 'boolean';
+        case YQLType.Int8:
+        case YQLType.Int16:
+        case YQLType.Int32:
+        case YQLType.Int64:
+        case YQLType.Uint8:
+        case YQLType.Uint16:
+        case YQLType.Uint32:
+        case YQLType.Uint64:
+        case YQLType.Float:
+        case YQLType.Double:
+        case YQLType.Decimal:
+            return 'number';
+        case YQLType.String:
+        case YQLType.Utf8:
+        case YQLType.Json:
+        case YQLType.JsonDocument:
+        case YQLType.Yson:
+        case YQLType.Uuid:
+            return 'string';
+        case YQLType.Date:
+        case YQLType.Datetime:
+        case YQLType.Timestamp:
+        case YQLType.Interval:
+        case YQLType.TzDate:
+        case YQLType.TzDateTime:
+        case YQLType.TzTimestamp:
+            return 'date';
+        default:
+            return undefined;
+    }
+};
+/** parse response result from ArrayRow to KeyValueRow */
+const parseModernResult = (rows, columns) => {
+    return rows.map((row) => {
+        return row.reduce((newRow, cellData, columnIndex) => {
+            const { name } = columns[columnIndex];
+            newRow[name] = cellData;
+            return newRow;
+        }, {});
+    });
+};
+const parseExecuteModernResponse = (data) => {
+    const { result, columns, ...restData } = data;
+    return {
+        result: result && columns && parseModernResult(result, columns),
+        columns,
+        ...restData,
+    };
+};
+const parseExecuteMultiResponse = (data) => {
+    const { result, ...restData } = data;
+    const parsedResult = result === null || result === void 0 ? void 0 : result.map((resultSet) => {
+        const { rows, columns } = resultSet;
+        let parsedRows;
+        if (columns) {
+            // Result shouldn't be null if there are columns
+            parsedRows = [];
+        }
+        if (rows && columns) {
+            parsedRows = parseModernResult(rows, columns);
+        }
+        return {
+            columns: columns,
+            result: parsedRows,
+        };
+    });
+    return {
+        resultSets: parsedResult, // use a separate field to make result compatible
+        ...restData,
+    };
+};
+const isModern = (response) => Boolean(response &&
+    !Array.isArray(response) &&
+    Array.isArray(response.result) &&
+    Array.isArray(response.columns));
+const isMulti = (response) => Boolean(response &&
+    !Array.isArray(response) &&
+    Array.isArray(response.result) &&
+    typeof response.result[0] === 'object' &&
+    'rows' in response.result[0] &&
+    'columns' in response.result[0]);
+const isUnsupportedType = (data) => {
+    return Boolean(!data ||
+        typeof data !== 'object' ||
+        Array.isArray(data) ||
+        ('result' in data && !Array.isArray(data.result)));
+};
+export function isQueryErrorResponse(data) {
+    return Boolean(data && typeof data === 'object' && 'error' in data && 'issues' in data);
+}
+// Although schema is set in request, if schema is not supported default schema for the version will be used
+// So we should additionally parse response
+export const parseQueryAPIExecuteResponse = (data) => {
+    if (isUnsupportedType(data)) {
+        return {};
+    }
+    if (isMulti(data)) {
+        return parseExecuteMultiResponse(data);
+    }
+    if (isModern(data)) {
+        return parseExecuteModernResponse(data);
+    }
+    return data;
+};
+export const parseQueryAPIExplainResponse = (data) => {
+    if (isUnsupportedType(data)) {
+        return {};
+    }
+    return data;
+};
+const isExplainScriptPlan = (plan) => Boolean(plan && 'queries' in plan);
+export const parseQueryExplainPlan = (plan) => {
+    if (isExplainScriptPlan(plan)) {
+        if (!plan.queries || !plan.queries.length) {
+            return { meta: plan.meta };
+        }
+        return {
+            Plan: plan.queries[0].Plan,
+            tables: plan.queries[0].tables,
+            meta: plan.meta,
+        };
+    }
+    return plan;
+};
+export const prepareQueryResponse = (data) => {
+    if (!Array.isArray(data)) {
+        return [];
+    }
+    return data.map((row) => {
+        const formattedData = {};
+        for (const field in row) {
+            if (Object.prototype.hasOwnProperty.call(row, field)) {
+                const type = typeof row[field];
+                // Although typeof null == 'object'
+                // null result should be preserved
+                if ((row[field] !== null && type === 'object') ||
+                    type === 'boolean' ||
+                    Array.isArray(row[field])) {
+                    formattedData[field] = JSON.stringify(row[field]);
+                }
+                else {
+                    formattedData[field] = row[field];
+                }
+            }
+        }
+        return formattedData;
+    });
+};
+export const parseQueryError = (error) => {
+    if (typeof error === 'string' || isQueryErrorResponse(error)) {
+        return error;
+    }
+    if (isNetworkError(error)) {
+        return error.message;
+    }
+    if (isAxiosResponse(error)) {
+        if ('data' in error && isQueryErrorResponse(error.data)) {
+            return error.data;
+        }
+        return error.statusText;
+    }
+    return undefined;
+};
+export const parseQueryErrorToString = (error) => {
+    var _a;
+    const parsedError = parseQueryError(error);
+    if (typeof parsedError === 'string') {
+        return parsedError;
+    }
+    return (_a = parsedError === null || parsedError === void 0 ? void 0 : parsedError.error) === null || _a === void 0 ? void 0 : _a.message;
+};

package/dist/utils/response.d.ts

@@ -0,0 +1,4 @@
+import type { AxiosResponse } from 'axios';
+import type { NetworkError } from '../types/api/error';
+export declare const isNetworkError: (error: unknown) => error is NetworkError;
+export declare const isAxiosResponse: (response: unknown) => response is AxiosResponse;

package/dist/utils/timeParsers/i18n/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (key: "days" | "hours" | "ms" | "daysHours" | "hoursMin" | "minSec" | "secMs" | "min" | "sec", params?: import("@gravity-ui/i18n").Params) => string;
+export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ydb-embedded-ui",
-  "version": "6.7.0",
+  "version": "6.9.0",
   "files": [
     "dist"
   ],
@@ -12,18 +12,18 @@
   "dependencies": {
     "@bem-react/classname": "^1.6.0",
     "@gravity-ui/axios-wrapper": "^1.4.1",
-    "@gravity-ui/chartkit": "^5.5.0",
-    "@gravity-ui/components": "^3.6.2",
-    "@gravity-ui/date-utils": "^2.4.0",
-    "@gravity-ui/i18n": "^1.5.0",
-    "@gravity-ui/icons": "^2.9.1",
-    "@gravity-ui/navigation": "^2.10.0",
+    "@gravity-ui/chartkit": "^5.9.0",
+    "@gravity-ui/components": "^3.7.0",
+    "@gravity-ui/date-utils": "^2.5.3",
+    "@gravity-ui/i18n": "^1.5.1",
+    "@gravity-ui/icons": "^2.10.0",
+    "@gravity-ui/navigation": "^2.16.0",
     "@gravity-ui/paranoid": "^2.0.1",
     "@gravity-ui/react-data-table": "^2.1.1",
-    "@gravity-ui/uikit": "^6.15.0",
+    "@gravity-ui/uikit": "^6.20.1",
     "@gravity-ui/websql-autocomplete": "^9.1.0",
     "@reduxjs/toolkit": "^2.2.3",
-    "axios": "^1.6.8",
+    "axios": "^1.7.2",
     "axios-retry": "^4.4.0",
     "colord": "^2.9.3",
     "copy-to-clipboard": "^3.3.3",
@@ -35,17 +35,17 @@
     "path-to-regexp": "^3.0.0",
     "qs": "^6.12.0",
     "react-error-boundary": "^4.0.13",
-    "react-helmet-async": "2.0.4",
+    "react-helmet-async": "^2.0.5",
     "react-json-inspector": "^7.1.1",
     "react-list": "^0.8.17",
     "react-monaco-editor": "^0.55.0",
-    "react-redux": "^9.1.0",
+    "react-redux": "^9.1.2",
     "react-router": "^5.3.4",
     "react-router-dom": "^5.3.4",
     "react-split": "^2.0.14",
     "redux": "^5.0.1",
     "redux-location-state": "^2.8.2",
-    "tslib": "^2.6.2",
+    "tslib": "^2.6.3",
     "url": "^0.11.3",
     "use-query-params": "^2.2.1",
     "web-vitals": "^1.1.2",
@@ -66,7 +66,7 @@
     "lint:other": "npm run prettier -- --check",
     "prettier": "prettier '**/*.{json,yaml,yml,md}'",
     "unimported": "npx unimported --no-cache",
-    "package": "rm -rf dist && tsc -p tsconfig.package.json && copyfiles -u 1 'src/**/*.{css,scss,svg}' dist/src",
+    "package": "rm -rf dist && tsc -p tsconfig.package.json && copyfiles -u 1 'src/**/*.{css,scss,svg}' dist",
     "test": "react-app-rewired test",
     "eject": "react-scripts eject",
     "prepublishOnly": "npm run package",
@@ -122,54 +122,54 @@
     ]
   },
   "devDependencies": {
-    "@commitlint/cli": "^19.2.1",
-    "@commitlint/config-conventional": "^19.1.0",
+    "@commitlint/cli": "^19.3.0",
+    "@commitlint/config-conventional": "^19.2.2",
     "@gravity-ui/eslint-config": "^3.2.0",
     "@gravity-ui/prettier-config": "^1.1.0",
     "@gravity-ui/stylelint-config": "^4.0.1",
     "@gravity-ui/tsconfig": "^1.0.0",
     "@playwright/test": "^1.42.1",
-    "@testing-library/jest-dom": "^6.4.2",
+    "@testing-library/jest-dom": "^6.4.6",
     "@testing-library/react": "^14.2.2",
     "@testing-library/user-event": "^14.5.2",
     "@types/jest": "^29.5.12",
     "@types/lodash": "^4.17.0",
     "@types/numeral": "^2.0.5",
-    "@types/qs": "^6.9.14",
-    "@types/react": "^18.2.73",
-    "@types/react-dom": "^18.2.23",
+    "@types/qs": "^6.9.15",
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0",
     "@types/react-router": "^5.1.20",
     "@types/react-router-dom": "^5.3.3",
     "copyfiles": "^2.4.1",
     "http-proxy-middleware": "^2.0.6",
     "husky": "^9.0.11",
     "jest-transform-css": "^6.0.1",
-    "lint-staged": "^15.2.2",
+    "lint-staged": "^15.2.7",
     "npm-run-all": "^4.1.5",
     "postcss": "^8.4.38",
     "prettier": "^3.2.5",
     "prop-types": "^15.8.1",
-    "react": "^18.2.0",
+    "react": "^18.3.1",
     "react-app-rewired": "^2.2.1",
-    "react-dom": "^18.2.0",
+    "react-dom": "^18.3.1",
     "react-scripts": "^5.0.1",
     "sass": "^1.72.0",
     "source-map-explorer": "^2.5.3",
-    "stylelint": "^15.0.0",
-    "ts-jest": "^29.1.2",
-    "typescript": "^5.4.3"
+    "stylelint": "^15.11.0",
+    "ts-jest": "^29.1.5",
+    "typescript": "^5.5.3"
   },
   "peerDependencies": {
     "prop-types": "^15.8.1",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
   },
   "overrides": {
     "fork-ts-checker-webpack-plugin": "^9.0.2",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "redux": "^5.0.1",
-    "typescript": "^5.4.3",
-    "monaco-editor": "^0.48.0"
+    "react": "$react",
+    "react-dom": "$react-dom",
+    "redux": "$redux",
+    "typescript": "$typescript",
+    "monaco-editor": "$monaco-editor"
   }
 }