ydb-embedded-ui 5.1.0 → 5.2.1

package/dist/components/ComponentsProvider/ComponentsProvider.d.ts

@@ -9,9 +9,13 @@ export declare function useComponent<T extends Parameters<ComponentsRegistry['ge
     StaffCard: typeof import("../User/StaffCard").StaffCard;
 } & {
     AsideNavigation: typeof import("../../containers/AsideNavigation/AsideNavigation").AsideNavigation;
+} & {
+    ErrorBoundary: typeof import("../ErrorBoundary/ErrorBoundary").ErrorBoundaryInner;
 })[T] extends React.ComponentType<any> ? React.ComponentType<React.PropsWithoutRef<React.ComponentProps<({
     StaffCard: typeof import("../User/StaffCard").StaffCard;
 } & {
     AsideNavigation: typeof import("../../containers/AsideNavigation/AsideNavigation").AsideNavigation;
+} & {
+    ErrorBoundary: typeof import("../ErrorBoundary/ErrorBoundary").ErrorBoundaryInner;
 })[T]>>> : never;
 export {};

package/dist/components/ComponentsProvider/componentsRegistry.d.ts

@@ -1,10 +1,13 @@
 import { StaffCard } from '../User/StaffCard';
 import { AsideNavigation } from '../../containers/AsideNavigation/AsideNavigation';
 import { ComponentsRegistryTemplate, Registry } from './registry';
+import { ErrorBoundaryInner } from '../ErrorBoundary/ErrorBoundary';
 declare const componentsRegistryInner: Registry<{
     StaffCard: typeof StaffCard;
 } & {
     AsideNavigation: typeof AsideNavigation;
+} & {
+    ErrorBoundary: typeof ErrorBoundaryInner;
 }>;
 export declare type ComponentsRegistry = ComponentsRegistryTemplate<typeof componentsRegistryInner>;
 export declare const componentsRegistry: ComponentsRegistry;

package/dist/components/ComponentsProvider/componentsRegistry.js

@@ -1,7 +1,9 @@
 import { StaffCard } from '../User/StaffCard';
 import { AsideNavigation } from '../../containers/AsideNavigation/AsideNavigation';
 import { Registry } from './registry';
+import { ErrorBoundaryInner } from '../ErrorBoundary/ErrorBoundary';
 const componentsRegistryInner = new Registry()
     .register('StaffCard', StaffCard)
-    .register('AsideNavigation', AsideNavigation);
+    .register('AsideNavigation', AsideNavigation)
+    .register('ErrorBoundary', ErrorBoundaryInner);
 export const componentsRegistry = componentsRegistryInner;

package/dist/components/ErrorBoundary/ErrorBoundary.d.ts

@@ -1,9 +1,19 @@
 import type { ReactNode } from 'react';
 import './ErrorBoundary.scss';
+export declare function ErrorBoundary({ children }: {
+    children?: ReactNode;
+}): JSX.Element;
 interface ErrorBoundaryProps {
     children?: ReactNode;
     useRetry?: boolean;
     onReportProblem?: (error?: Error) => void;
 }
-export declare const ErrorBoundary: ({ children, useRetry, onReportProblem }: ErrorBoundaryProps) => JSX.Element;
+export declare function ErrorBoundaryInner({ children, useRetry, onReportProblem, }: ErrorBoundaryProps): JSX.Element;
+interface ErrorBoundaryFallbackProps {
+    error: Error;
+    useRetry?: boolean;
+    resetErrorBoundary: () => void;
+    onReportProblem?: (error?: Error) => void;
+}
+export declare function ErrorBoundaryFallback({ error, resetErrorBoundary, useRetry, onReportProblem, }: ErrorBoundaryFallbackProps): JSX.Element;
 export {};

package/dist/components/ErrorBoundary/ErrorBoundary.js

@@ -4,13 +4,21 @@ import cn from 'bem-cn-lite';
 import { Button, Disclosure } from '@gravity-ui/uikit';
 import { registerError } from '../../utils/registerError';
 import { Illustration } from '../Illustration';
+import { useComponent } from '../ComponentsProvider/ComponentsProvider';
 import i18n from './i18n';
 import './ErrorBoundary.scss';
 const b = cn('ydb-error-boundary');
-export const ErrorBoundary = ({ children, useRetry = true, onReportProblem }) => {
+export function ErrorBoundary({ children }) {
+    const ErrorBoundaryComponent = useComponent('ErrorBoundary');
+    return _jsx(ErrorBoundaryComponent, { children: children });
+}
+export function ErrorBoundaryInner({ children, useRetry = true, onReportProblem, }) {
     return (_jsx(ErrorBoundaryBase, Object.assign({ onError: (error, info) => {
             registerError(error, info.componentStack, 'error-boundary');
         }, fallbackRender: ({ error, resetErrorBoundary }) => {
-            return (_jsxs("div", Object.assign({ className: b(null) }, { children: [_jsx(Illustration, { name: "error", className: b('illustration') }), _jsxs("div", Object.assign({ className: b('content') }, { children: [_jsx("h2", Object.assign({ className: b('error-title') }, { children: i18n('error-title') })), _jsx("div", Object.assign({ className: b('error-description') }, { children: i18n('error-description') })), _jsx(Disclosure, Object.assign({ summary: i18n('show-details'), className: b('show-details'), size: "m" }, { children: _jsx("pre", Object.assign({ className: b('error-details') }, { children: error.stack })) })), _jsxs("div", Object.assign({ className: b('actions') }, { children: [useRetry && (_jsx(Button, Object.assign({ view: "outlined", onClick: resetErrorBoundary }, { children: i18n('button-reset') }))), onReportProblem && (_jsx(Button, Object.assign({ view: "outlined", onClick: () => onReportProblem(error) }, { children: i18n('report-problem') })))] }))] }))] })));
+            return (_jsx(ErrorBoundaryFallback, { error: error, useRetry: useRetry, resetErrorBoundary: resetErrorBoundary, onReportProblem: onReportProblem }));
         } }, { children: children })));
-};
+}
+export function ErrorBoundaryFallback({ error, resetErrorBoundary, useRetry, onReportProblem, }) {
+    return (_jsxs("div", Object.assign({ className: b() }, { children: [_jsx(Illustration, { name: "error", className: b('illustration') }), _jsxs("div", Object.assign({ className: b('content') }, { children: [_jsx("h2", Object.assign({ className: b('error-title') }, { children: i18n('error-title') })), _jsx("div", Object.assign({ className: b('error-description') }, { children: i18n('error-description') })), _jsx(Disclosure, Object.assign({ summary: i18n('show-details'), className: b('show-details'), size: "m" }, { children: _jsx("pre", Object.assign({ className: b('error-details') }, { children: error.stack })) })), _jsxs("div", Object.assign({ className: b('actions') }, { children: [useRetry && (_jsx(Button, Object.assign({ view: "outlined", onClick: resetErrorBoundary }, { children: i18n('button-reset') }))), onReportProblem && (_jsx(Button, Object.assign({ view: "outlined", onClick: () => onReportProblem(error) }, { children: i18n('report-problem') })))] }))] }))] })));
+}

package/dist/components/FullNodeViewer/FullNodeViewer.js

@@ -1,7 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import cn from 'bem-cn-lite';
 import { LOAD_AVERAGE_TIME_INTERVALS } from '../../utils/constants';
-import { calcUptime } from '../../utils/dataFormatters/dataFormatters';
 import InfoViewer from '../InfoViewer/InfoViewer';
 import { ProgressViewer } from '../ProgressViewer/ProgressViewer';
 import { PoolUsage } from '../PoolUsage/PoolUsage';
@@ -18,7 +17,7 @@ export const FullNodeViewer = ({ node, className }) => {
     if ((_b = node === null || node === void 0 ? void 0 : node.Tenants) === null || _b === void 0 ? void 0 : _b.length) {
         commonInfo.push({ label: 'Database', value: node.Tenants[0] });
     }
-    commonInfo.push({ label: 'Version', value: node === null || node === void 0 ? void 0 : node.Version }, { label: 'Uptime', value: calcUptime(node === null || node === void 0 ? void 0 : node.StartTime) }, { label: 'DC', value: (node === null || node === void 0 ? void 0 : node.DataCenterDescription) || (node === null || node === void 0 ? void 0 : node.DC) }, { label: 'Rack', value: node === null || node === void 0 ? void 0 : node.Rack });
+    commonInfo.push({ label: 'Version', value: node === null || node === void 0 ? void 0 : node.Version }, { label: 'Uptime', value: node === null || node === void 0 ? void 0 : node.Uptime }, { label: 'DC', value: (node === null || node === void 0 ? void 0 : node.DataCenterDescription) || (node === null || node === void 0 ? void 0 : node.DC) }, { label: 'Rack', value: node === null || node === void 0 ? void 0 : node.Rack });
     const averageInfo = (_c = node === null || node === void 0 ? void 0 : node.LoadAverage) === null || _c === void 0 ? void 0 : _c.map((load, loadIndex) => ({
         label: LOAD_AVERAGE_TIME_INTERVALS[loadIndex],
         value: (_jsx(ProgressViewer, { value: load, percents: true, colorizeProgress: true, capacity: 100 })),

package/dist/containers/Cluster/Cluster.scss

@@ -10,6 +10,9 @@
     @include flex-container();
 
     &__header {
+        position: sticky;
+        left: 0;
+
         padding: 20px 0;
     }
 

package/dist/containers/ClusterModeGuard/ClusterModeGuard.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from 'react';
+export interface ClusterModeGuardProps {
+    children: ReactNode;
+    mode: 'single' | 'multi';
+}
+export declare function ClusterModeGuard({ children, mode }: ClusterModeGuardProps): JSX.Element | null;

package/dist/containers/ClusterModeGuard/ClusterModeGuard.js

@@ -0,0 +1,6 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { useTypedSelector } from '../../lib';
+export function ClusterModeGuard({ children, mode }) {
+    const shouldRender = useTypedSelector((state) => mode === 'single' ? state.singleClusterMode : !state.singleClusterMode);
+    return shouldRender ? _jsx(_Fragment, { children: children }) : null;
+}

package/dist/containers/ClusterModeGuard/index.d.ts

@@ -0,0 +1 @@
+export * from './ClusterModeGuard';

package/dist/containers/ClusterModeGuard/index.js

@@ -0,0 +1 @@
+export * from './ClusterModeGuard';

package/dist/containers/Tenant/Query/QueryEditor/QueryEditor.js

@@ -17,6 +17,7 @@ import { Preview } from '../Preview/Preview';
 import { ExecuteResult } from '../ExecuteResult/ExecuteResult';
 import { ExplainResult } from '../ExplainResult/ExplainResult';
 import { QueryEditorControls } from '../QueryEditorControls/QueryEditorControls';
+import i18n from '../i18n';
 import './QueryEditor.scss';
 const EDITOR_OPTIONS = {
     automaticLayout: true,
@@ -196,7 +197,7 @@ function QueryEditor(props) {
         editor.focus();
         editor.addAction({
             id: 'sendQuery',
-            label: 'Send query',
+            label: i18n('action.send-query'),
             keybindings: [
                 // eslint-disable-next-line no-bitwise
                 monaco.KeyMod.CtrlCmd | monaco.KeyCode.Enter,
@@ -220,7 +221,7 @@ function QueryEditor(props) {
         });
         editor.addAction({
             id: 'sendSelectedQuery',
-            label: 'Send selected query',
+            label: i18n('action.send-selected-query'),
             keybindings: [
                 // eslint-disable-next-line no-bitwise
                 monaco.KeyMod.CtrlCmd | monaco.KeyMod.Shift | monaco.KeyCode.Enter,
@@ -232,7 +233,7 @@ function QueryEditor(props) {
         });
         editor.addAction({
             id: 'previous-query',
-            label: 'Previous query',
+            label: i18n('action.previous-query'),
             keybindings: [
                 // eslint-disable-next-line no-bitwise
                 monaco.KeyMod.CtrlCmd | monaco.KeyCode.UpArrow,
@@ -245,7 +246,7 @@ function QueryEditor(props) {
         });
         editor.addAction({
             id: 'next-query',
-            label: 'Next query',
+            label: i18n('action.next-query'),
             keybindings: [
                 // eslint-disable-next-line no-bitwise
                 monaco.KeyMod.CtrlCmd | monaco.KeyCode.DownArrow,

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

@@ -17,5 +17,9 @@
     "method-description.data": "DML queries for changing and fetching data in serialization mode.\nAPI call: table.executeDataQuery",
     "method-description.query": "Any query. An experimental API call supposed to replace all existing methods.\nAPI Call: query.ExecuteScript",
     "method-description.pg": "Queries in postgresql syntax.\nAPI call: query.ExecuteScript",
-    "query-duration.description": "Duration of server-side query execution"
+    "query-duration.description": "Duration of server-side query execution",
+    "action.send-query": "Send query",
+    "action.send-selected-query": "Send selected query",
+    "action.previous-query": "Previous query in history",
+    "action.next-query": "Next query in history"
 }

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

@@ -1,2 +1,2 @@
-declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
+declare const _default: (key: "controls.query-mode-selector_type" | "tabs.newQuery" | "tabs.history" | "tabs.saved" | "history.empty" | "saved.empty" | "delete-dialog.header" | "delete-dialog.question" | "delete-dialog.delete" | "delete-dialog.cancel" | "preview.title" | "preview.not-available" | "preview.close" | "method-description.script" | "method-description.scan" | "method-description.data" | "method-description.query" | "method-description.pg" | "query-duration.description" | "action.send-query" | "action.send-selected-query" | "action.previous-query" | "action.next-query", params?: import("@gravity-ui/i18n").Params | undefined) => string;
 export default _default;

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

@@ -1,7 +1,4 @@
-import { i18n, Lang } from '../../../../utils/i18n';
+import { registerKeysets } from '../../../../utils/i18n';
 import en from './en.json';
-import ru from './ru.json';
 const COMPONENT = 'ydb-query-editor';
-i18n.registerKeyset(Lang.En, COMPONENT, en);
-i18n.registerKeyset(Lang.Ru, COMPONENT, ru);
-export default i18n.keyset(COMPONENT);
+export default registerKeysets(COMPONENT, { en });

package/dist/containers/UserSettings/Setting.d.ts

@@ -3,6 +3,7 @@ export declare type SettingsElementType = 'switch' | 'radio';
 export interface SettingProps {
     type?: SettingsElementType;
     title: string;
+    description?: ReactNode;
     settingKey: string;
     helpPopoverContent?: ReactNode;
     options?: {
@@ -12,4 +13,4 @@ export interface SettingProps {
     defaultValue?: unknown;
     onValueUpdate?: VoidFunction;
 }
-export declare const Setting: ({ type, settingKey, title, helpPopoverContent, options, defaultValue, onValueUpdate, }: SettingProps) => JSX.Element;
+export declare const Setting: ({ type, settingKey, title, description, helpPopoverContent, options, defaultValue, onValueUpdate, }: SettingProps) => JSX.Element;

package/dist/containers/UserSettings/Setting.js

@@ -4,7 +4,7 @@ import { Settings } from '@gravity-ui/navigation';
 import { LabelWithPopover } from '../../components/LabelWithPopover/LabelWithPopover';
 import { useSetting } from '../../utils/hooks';
 import { b } from './UserSettings';
-export const Setting = ({ type = 'switch', settingKey, title, helpPopoverContent, options, defaultValue, onValueUpdate, }) => {
+export const Setting = ({ type = 'switch', settingKey, title, description, helpPopoverContent, options, defaultValue, onValueUpdate, }) => {
     const [settingValue, setValue] = useSetting(settingKey, defaultValue);
     const onUpdate = (value) => {
         setValue(value);
@@ -33,5 +33,5 @@ export const Setting = ({ type = 'switch', settingKey, title, helpPopoverContent
                 return null;
         }
     };
-    return (_jsx(Settings.Item, Object.assign({ title: title, highlightedTitle: title, renderTitleComponent: renderTitleComponent }, { children: getSettingsElement(type) })));
+    return (_jsx(Settings.Item, Object.assign({ title: title, highlightedTitle: title, description: description, renderTitleComponent: renderTitleComponent }, { children: getSettingsElement(type) })));
 };

package/dist/containers/UserSettings/i18n/en.json

@@ -10,6 +10,8 @@
     "settings.language.title": "Interface language",
     "settings.language.option-russian": "Russian",
     "settings.language.option-english": "English",
+    "settings.binaryDataInPlainTextDisplay.title": "Display binary data in plain text",
+    "settings.binaryDataInPlainTextDisplay.description": "Available starting from version 24.1",
     "settings.invertedDisks.title": "Inverted disks space indicators",
     "settings.useNodesEndpoint.title": "Break the Nodes tab in Diagnostics",
     "settings.useNodesEndpoint.popover": "Use /viewer/json/nodes endpoint for Nodes Tab in diagnostics. It could return incorrect data on some versions",

package/dist/containers/UserSettings/i18n/index.d.ts

@@ -1,2 +1,2 @@
-declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
+declare const _default: (key: "page.general" | "section.appearance" | "page.experiments" | "section.experiments" | "settings.theme.title" | "settings.theme.option-dark" | "settings.theme.option-light" | "settings.theme.option-system" | "settings.language.title" | "settings.language.option-russian" | "settings.language.option-english" | "settings.binaryDataInPlainTextDisplay.title" | "settings.binaryDataInPlainTextDisplay.description" | "settings.invertedDisks.title" | "settings.useNodesEndpoint.title" | "settings.useNodesEndpoint.popover" | "settings.useVirtualTables.title" | "settings.useVirtualTables.popover" | "settings.queryUseMultiSchema.title" | "settings.queryUseMultiSchema.popover", params?: import("@gravity-ui/i18n").Params | undefined) => string;
 export default _default;

package/dist/containers/UserSettings/i18n/index.js

@@ -1,7 +1,3 @@
-import { i18n, Lang } from '../../../utils/i18n';
+import { registerKeysets } from '../../../utils/i18n';
 import en from './en.json';
-import ru from './ru.json';
-const COMPONENT = 'ydb-user-settings';
-i18n.registerKeyset(Lang.En, COMPONENT, en);
-i18n.registerKeyset(Lang.Ru, COMPONENT, ru);
-export default i18n.keyset(COMPONENT);
+export default registerKeysets('ydb-user-settings', { en });

package/dist/containers/UserSettings/settings.d.ts

@@ -14,6 +14,7 @@ export interface SettingsPage {
 export declare type YDBEmbeddedUISettings = SettingsPage[];
 export declare const themeSetting: SettingProps;
 export declare const languageSetting: SettingProps;
+export declare const binaryDataInPlainTextDisplay: SettingProps;
 export declare const invertedDisksSetting: SettingProps;
 export declare const useNodesEndpointSetting: SettingProps;
 export declare const useVirtualTables: SettingProps;

package/dist/containers/UserSettings/settings.js

@@ -1,8 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import favoriteFilledIcon from '../../assets/icons/star.svg';
 import flaskIcon from '../../assets/icons/flask.svg';
-import { INVERTED_DISKS_KEY, LANGUAGE_KEY, THEME_KEY, USE_BACKEND_PARAMS_FOR_TABLES_KEY, USE_NODES_ENDPOINT_IN_DIAGNOSTICS_KEY, QUERY_USE_MULTI_SCHEMA_KEY, } from '../../utils/constants';
+import { INVERTED_DISKS_KEY, LANGUAGE_KEY, THEME_KEY, USE_BACKEND_PARAMS_FOR_TABLES_KEY, USE_NODES_ENDPOINT_IN_DIAGNOSTICS_KEY, QUERY_USE_MULTI_SCHEMA_KEY, BINARY_DATA_IN_PLAIN_TEXT_DISPLAY, } from '../../utils/constants';
 import { Lang, defaultLang } from '../../utils/i18n';
 import i18n from './i18n';
+import { ClusterModeGuard } from '../ClusterModeGuard';
 const themeOptions = [
     {
         value: 'system',
@@ -43,6 +45,11 @@ export const languageSetting = {
         window.location.reload();
     },
 };
+export const binaryDataInPlainTextDisplay = {
+    settingKey: BINARY_DATA_IN_PLAIN_TEXT_DISPLAY,
+    title: i18n('settings.binaryDataInPlainTextDisplay.title'),
+    description: (_jsx(ClusterModeGuard, Object.assign({ mode: "multi" }, { children: i18n('settings.binaryDataInPlainTextDisplay.description') }))),
+};
 export const invertedDisksSetting = {
     settingKey: INVERTED_DISKS_KEY,
     title: i18n('settings.invertedDisks.title'),
@@ -65,7 +72,7 @@ export const queryUseMultiSchemaSetting = {
 export const appearanceSection = {
     id: 'appearanceSection',
     title: i18n('section.appearance'),
-    settings: [themeSetting, invertedDisksSetting],
+    settings: [themeSetting, invertedDisksSetting, binaryDataInPlainTextDisplay],
 };
 export const experimentsSection = {
     id: 'experimentsSection',

package/dist/lib.d.ts

@@ -1,7 +1,8 @@
 export { App as SingleClusterApp, AppSlots } from './containers/App';
 export { AppWithClusters as MultiClusterApp } from './containers/AppWithClusters/AppWithClusters';
-export { ErrorBoundary } from './components/ErrorBoundary/ErrorBoundary';
+export { ErrorBoundaryInner as ErrorBoundary, ErrorBoundaryFallback, } from './components/ErrorBoundary/ErrorBoundary';
 export { configureStore, rootReducer } from './store';
+export { default as appRoutes } from './routes';
 export { createApi, YdbEmbeddedAPI, YdbWebVersionAPI } from './services/api';
 export { settingsManager } from './services/settings';
 export { settings as userSettings } from './containers/UserSettings/settings';

package/dist/lib.js

@@ -1,7 +1,8 @@
 export { App as SingleClusterApp, AppSlots } from './containers/App';
 export { AppWithClusters as MultiClusterApp } from './containers/AppWithClusters/AppWithClusters';
-export { ErrorBoundary } from './components/ErrorBoundary/ErrorBoundary';
+export { ErrorBoundaryInner as ErrorBoundary, ErrorBoundaryFallback, } from './components/ErrorBoundary/ErrorBoundary';
 export { configureStore, rootReducer } from './store';
+export { default as appRoutes } from './routes';
 export { createApi, YdbEmbeddedAPI, YdbWebVersionAPI } from './services/api';
 export { settingsManager } from './services/settings';
 export { settings as userSettings } from './containers/UserSettings/settings';

package/dist/services/api.js

@@ -12,8 +12,10 @@ var __rest = (this && this.__rest) || function (s, e) {
 import AxiosWrapper from '@gravity-ui/axios-wrapper';
 import { backend as BACKEND, metaBackend as META_BACKEND } from '../store';
 import { prepareSortValue } from '../utils/filters';
+import { BINARY_DATA_IN_PLAIN_TEXT_DISPLAY } from '../utils/constants';
 import { parseMetaCluster } from './parsers/parseMetaCluster';
 import { parseMetaTenants } from './parsers/parseMetaTenants';
+import { settingsManager } from './settings';
 export class YdbEmbeddedAPI extends AxiosWrapper {
     getPath(path) {
         return `${BACKEND !== null && BACKEND !== void 0 ? BACKEND : ''}${path}`;
@@ -179,7 +181,12 @@ export class YdbEmbeddedAPI extends AxiosWrapper {
         // Time difference to ensure that timeout from ui will be shown rather than backend error
         const uiTimeout = 9 * 60 * 1000;
         const backendTimeout = 10 * 60 * 1000;
-        return this.post(this.getPath(`/viewer/json/query?timeout=${backendTimeout}${schema ? `&schema=${schema}` : ''}`), params, {}, {
+        /**
+         * Return strings using base64 encoding.
+         * @link https://github.com/ydb-platform/ydb/pull/647
+         */
+        const base64 = !settingsManager.readUserSettingsValue(BINARY_DATA_IN_PLAIN_TEXT_DISPLAY, true);
+        return this.post(this.getPath(`/viewer/json/query?timeout=${backendTimeout}&base64=${base64}${schema ? `&schema=${schema}` : ''}`), params, {}, {
             concurrentId,
             timeout: uiTimeout,
         });

package/dist/services/settings.js

@@ -1,5 +1,5 @@
 import { TENANT_PAGES_IDS } from '../store/reducers/tenant/constants';
-import { ASIDE_HEADER_COMPACT_KEY, INVERTED_DISKS_KEY, LANGUAGE_KEY, LAST_USED_QUERY_ACTION_KEY, PARTITIONS_HIDDEN_COLUMNS_KEY, QUERY_INITIAL_MODE_KEY, QUERY_USE_MULTI_SCHEMA_KEY, SAVED_QUERIES_KEY, TENANT_INITIAL_PAGE_KEY, THEME_KEY, USE_BACKEND_PARAMS_FOR_TABLES_KEY, USE_NODES_ENDPOINT_IN_DIAGNOSTICS_KEY, USE_CLUSTER_BALANCER_AS_BACKEND_KEY, } from '../utils/constants';
+import { ASIDE_HEADER_COMPACT_KEY, INVERTED_DISKS_KEY, LANGUAGE_KEY, LAST_USED_QUERY_ACTION_KEY, PARTITIONS_HIDDEN_COLUMNS_KEY, QUERY_INITIAL_MODE_KEY, QUERY_USE_MULTI_SCHEMA_KEY, SAVED_QUERIES_KEY, TENANT_INITIAL_PAGE_KEY, THEME_KEY, USE_BACKEND_PARAMS_FOR_TABLES_KEY, USE_NODES_ENDPOINT_IN_DIAGNOSTICS_KEY, USE_CLUSTER_BALANCER_AS_BACKEND_KEY, BINARY_DATA_IN_PLAIN_TEXT_DISPLAY, } from '../utils/constants';
 import { QUERY_ACTIONS, QUERY_MODES } from '../utils/query';
 import { parseJson } from '../utils/utils';
 /** User settings keys and their default values */
@@ -9,6 +9,7 @@ export const DEFAULT_USER_SETTINGS = {
     [INVERTED_DISKS_KEY]: false,
     [USE_NODES_ENDPOINT_IN_DIAGNOSTICS_KEY]: false,
     [QUERY_USE_MULTI_SCHEMA_KEY]: false,
+    [BINARY_DATA_IN_PLAIN_TEXT_DISPLAY]: true,
     [SAVED_QUERIES_KEY]: [],
     [TENANT_INITIAL_PAGE_KEY]: TENANT_PAGES_IDS.query,
     [QUERY_INITIAL_MODE_KEY]: QUERY_MODES.script,

package/dist/store/reducers/node/types.d.ts

@@ -1,8 +1,8 @@
 import type { IResponseError } from '../../../types/api/error';
-import type { TSystemStateInfo } from '../../../types/api/nodes';
 import type { TPDiskStateInfo } from '../../../types/api/pdisk';
 import type { TStorageInfo } from '../../../types/api/storage';
 import type { TVDiskStateInfo } from '../../../types/api/vdisk';
+import type { PreparedNodeSystemState } from '../../../utils/nodes';
 import type { ApiRequestAction } from '../../utils';
 import { FETCH_NODE, FETCH_NODE_STRUCTURE, resetNode } from './node';
 interface RawStructurePDisk extends TPDiskStateInfo {
@@ -17,9 +17,7 @@ export interface PreparedStructurePDisk extends TPDiskStateInfo {
     vDisks: PreparedStructureVDisk[];
 }
 export declare type PreparedNodeStructure = Record<string, PreparedStructurePDisk>;
-export interface PreparedNode extends TSystemStateInfo {
-    DC?: string;
-    Rack?: string;
+export interface PreparedNode extends Partial<PreparedNodeSystemState> {
 }
 export interface NodeState {
     data: PreparedNode;

package/dist/store/reducers/node/utils.js

@@ -1,8 +1,9 @@
+import { prepareNodeSystemState } from '../../../utils/nodes';
 export const prepareNodeData = (data) => {
-    var _a, _b, _c;
+    var _a;
     if (!((_a = data.SystemStateInfo) === null || _a === void 0 ? void 0 : _a.length)) {
         return {};
     }
     const nodeData = data.SystemStateInfo[0];
-    return Object.assign(Object.assign({}, nodeData), { DC: (_b = nodeData.Location) === null || _b === void 0 ? void 0 : _b.DataCenter, Rack: (_c = nodeData.Location) === null || _c === void 0 ? void 0 : _c.Rack });
+    return prepareNodeSystemState(nodeData);
 };

package/dist/store/reducers/nodes/utils.js

@@ -1,5 +1,6 @@
 import { calcUptime } from '../../../utils/dataFormatters/dataFormatters';
 import { generateEvaluator } from '../../../utils/generateEvaluator';
+import { prepareNodeSystemState } from '../../../utils/nodes';
 const prepareComputeNode = (node, tenantName) => {
     var _a;
     return Object.assign(Object.assign({}, node), { 
@@ -36,10 +37,10 @@ export const prepareComputeNodesData = (data) => {
 export const prepareNodesData = (data) => {
     const rawNodes = data.Nodes || [];
     const preparedNodes = rawNodes.map((node) => {
-        var _a, _b, _c, _d, _e, _f, _g;
+        var _a, _b, _c, _d;
         // 0 limit means that limit is not set, so it should be undefined
         const sharedCacheLimit = Number((_a = node.SystemState.SharedCacheStats) === null || _a === void 0 ? void 0 : _a.LimitBytes) || undefined;
-        return Object.assign(Object.assign({}, node.SystemState), { Tablets: node.Tablets, NodeId: node.NodeId, Uptime: calcUptime((_b = node.SystemState) === null || _b === void 0 ? void 0 : _b.StartTime), TenantName: (_d = (_c = node.SystemState) === null || _c === void 0 ? void 0 : _c.Tenants) === null || _d === void 0 ? void 0 : _d[0], DC: (_e = node.SystemState.Location) === null || _e === void 0 ? void 0 : _e.DataCenter, Rack: (_f = node.SystemState.Location) === null || _f === void 0 ? void 0 : _f.Rack, SharedCacheUsed: (_g = node.SystemState.SharedCacheStats) === null || _g === void 0 ? void 0 : _g.UsedBytes, SharedCacheLimit: sharedCacheLimit });
+        return Object.assign(Object.assign({}, prepareNodeSystemState(node.SystemState)), { Tablets: node.Tablets, NodeId: node.NodeId, TenantName: (_c = (_b = node.SystemState) === null || _b === void 0 ? void 0 : _b.Tenants) === null || _c === void 0 ? void 0 : _c[0], SharedCacheUsed: (_d = node.SystemState.SharedCacheStats) === null || _d === void 0 ? void 0 : _d.UsedBytes, SharedCacheLimit: sharedCacheLimit });
     });
     return {
         Nodes: preparedNodes,

package/dist/store/reducers/storage/utils.js

@@ -3,7 +3,7 @@ import { TPDiskState } from '../../../types/api/pdisk';
 import { EFlag } from '../../../types/api/enums';
 import { getPDiskType } from '../../../utils/pdisk';
 import { getUsage } from '../../../utils/storage';
-import { calcUptime } from '../../../utils/dataFormatters/dataFormatters';
+import { prepareNodeSystemState } from '../../../utils/nodes';
 // ==== Constants  ====
 const FLAGS_POINTS = {
     [EFlag.Green]: 1,
@@ -85,24 +85,11 @@ export const prepareStorageGroups = (StorageGroups, StoragePools) => {
 };
 // ==== Prepare nodes ====
 const prepareStorageNodeData = (node) => {
-    var _a, _b, _c, _d;
-    const systemState = (_a = node.SystemState) !== null && _a !== void 0 ? _a : {};
-    const missing = ((_b = node.PDisks) === null || _b === void 0 ? void 0 : _b.filter((pDisk) => {
+    var _a;
+    const missing = ((_a = node.PDisks) === null || _a === void 0 ? void 0 : _a.filter((pDisk) => {
         return pDisk.State !== TPDiskState.Normal;
     }).length) || 0;
-    return {
-        NodeId: node.NodeId,
-        SystemState: systemState.SystemState,
-        DC: (_c = systemState.Location) === null || _c === void 0 ? void 0 : _c.DataCenter,
-        Rack: (_d = systemState.Location) === null || _d === void 0 ? void 0 : _d.Rack,
-        Host: systemState.Host,
-        Endpoints: systemState.Endpoints,
-        Uptime: calcUptime(systemState.StartTime),
-        StartTime: systemState.StartTime,
-        PDisks: node.PDisks,
-        VDisks: node.VDisks,
-        Missing: missing,
-    };
+    return Object.assign(Object.assign({}, prepareNodeSystemState(node.SystemState)), { NodeId: node.NodeId, PDisks: node.PDisks, VDisks: node.VDisks, Missing: missing });
 };
 // ==== Prepare responses ====
 export const prepareStorageNodesResponse = (data) => {

package/dist/utils/constants.d.ts

@@ -56,6 +56,7 @@ export declare const SAVED_QUERIES_KEY = "saved_queries";
 export declare const ASIDE_HEADER_COMPACT_KEY = "asideHeaderCompact";
 export declare const QUERIES_HISTORY_KEY = "queries_history";
 export declare const DATA_QA_TUNE_COLUMNS_POPUP = "tune-columns-popup";
+export declare const BINARY_DATA_IN_PLAIN_TEXT_DISPLAY = "binaryDataInPlainTextDisplay";
 export declare const DEFAULT_SIZE_RESULT_PANE_KEY = "default-size-result-pane";
 export declare const DEFAULT_SIZE_TENANT_SUMMARY_KEY = "default-size-tenant-summary-pane";
 export declare const DEFAULT_SIZE_TENANT_KEY = "default-size-tenant-pane";

package/dist/utils/constants.js

@@ -72,6 +72,7 @@ export const SAVED_QUERIES_KEY = 'saved_queries';
 export const ASIDE_HEADER_COMPACT_KEY = 'asideHeaderCompact';
 export const QUERIES_HISTORY_KEY = 'queries_history';
 export const DATA_QA_TUNE_COLUMNS_POPUP = 'tune-columns-popup';
+export const BINARY_DATA_IN_PLAIN_TEXT_DISPLAY = 'binaryDataInPlainTextDisplay';
 export const DEFAULT_SIZE_RESULT_PANE_KEY = 'default-size-result-pane';
 export const DEFAULT_SIZE_TENANT_SUMMARY_KEY = 'default-size-tenant-summary-pane';
 export const DEFAULT_SIZE_TENANT_KEY = 'default-size-tenant-pane';

package/dist/utils/nodes.d.ts

@@ -14,6 +14,12 @@ export declare const NodesUptimeFilterTitles: {
 };
 export declare const isUnavailableNode: (node: NodesPreparedEntity | TSystemStateInfo) => boolean;
 export declare const prepareNodesMap: (nodesList?: TNodeInfo[] | undefined) => NodesMap | undefined;
+export interface PreparedNodeSystemState extends TSystemStateInfo {
+    Rack?: string;
+    DC?: string;
+    Uptime: string;
+}
+export declare const prepareNodeSystemState: (systemState?: TSystemStateInfo) => PreparedNodeSystemState;
 export declare const getProblemParamValue: (problemFilter: ProblemFilterValue | undefined) => boolean;
 export declare const getUptimeParamValue: (nodesUptimeFilter: NodesUptimeFilterValues | undefined) => number | undefined;
 /**

package/dist/utils/nodes.js

@@ -1,5 +1,6 @@
 import { ProblemFilterValues } from '../store/reducers/settings/settings';
 import { EFlag } from '../types/api/enums';
+import { calcUptime } from './dataFormatters/dataFormatters';
 import { HOUR_IN_SECONDS } from './constants';
 export var NodesUptimeFilterValues;
 (function (NodesUptimeFilterValues) {
@@ -19,6 +20,16 @@ export const prepareNodesMap = (nodesList) => {
         return nodesMap;
     }, new Map());
 };
+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);
+    return Object.assign(Object.assign({}, systemState), { Rack,
+        DC,
+        Uptime });
+};
 export const getProblemParamValue = (problemFilter) => {
     return problemFilter === ProblemFilterValues.PROBLEMS;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ydb-embedded-ui",
-  "version": "5.1.0",
+  "version": "5.2.1",
   "files": [
     "dist"
   ],

package/dist/containers/Tenant/Query/i18n/ru.json

@@ -1,21 +0,0 @@
-{
-    "controls.query-mode-selector_type": "Тип запроса:",
-    "tabs.newQuery": "Запрос",
-    "tabs.history": "История",
-    "tabs.saved": "Сохраненные",
-    "history.empty": "История пуста",
-    "saved.empty": "Нет сохраненных запросов",
-    "delete-dialog.header": "Удалить запрос",
-    "delete-dialog.question": "Вы уверены что хотите удалить запрос",
-    "delete-dialog.delete": "Удалить",
-    "delete-dialog.cancel": "Отменить",
-    "preview.title": "Предпросмотр",
-    "preview.not-available": "Предпросмотр недоступен",
-    "preview.close": "Закрыть предпросмотр",
-    "method-description.script": "Для скриптов, совмещающих DDL и DML-конструкции.\nAPI call: schema.scripting",
-    "method-description.scan": "Только читающие запросы, потенциально читающие много данных.\nAPI call: table.ExecuteScan",
-    "method-description.data": "DML-запросы для изменения и выборки данных в режиме изоляции Serializable.\nAPI call: table.executeDataQuery",
-    "method-description.query": "Любые запросы. Экспериментальный перспективный метод, который в будущем заменит все остальные.\nAPI call: query.ExecuteScript",
-    "method-description.pg": "Запросы в синтаксисе postgresql.\nAPI call: query.ExecuteScript",
-    "query-duration.description": "Время выполнения запроса на стороне сервера"
-}

package/dist/containers/UserSettings/i18n/ru.json

@@ -1,20 +0,0 @@
-{
-    "page.general": "Общие",
-    "section.appearance": "Внешний вид",
-    "page.experiments": "Эксперименты",
-    "section.experiments": "Эксперименты",
-    "settings.theme.title": "Тема",
-    "settings.theme.option-dark": "Тёмная",
-    "settings.theme.option-light": "Светлая",
-    "settings.theme.option-system": "Системная",
-    "settings.language.title": "Язык интерфейса",
-    "settings.language.option-russian": "Русский",
-    "settings.language.option-english": "English",
-    "settings.invertedDisks.title": "Инвертированные индикаторы места на дисках",
-    "settings.useNodesEndpoint.title": "Сломать вкладку Nodes в диагностике",
-    "settings.useNodesEndpoint.popover": "Использовать эндпоинт /viewer/json/nodes для вкладки Nodes в диагностике. Может возвращать некорректные данные на некоторых версиях",
-    "settings.useVirtualTables.title": "Использовать таблицу с загрузкой данных по скроллу для вкладок Nodes и Storage",
-    "settings.useVirtualTables.popover": "Это улучшит производительность, но может работать нестабильно",
-    "settings.queryUseMultiSchema.title": "Разрешить запросы с несколькими результатами",
-    "settings.queryUseMultiSchema.popover": "Использовать для запросов схему 'multi', которая позволяет выполнять запросы с несколькими результатами. На версиях 23-3 и старше результат не возвращается вообще"
-}