ydb-embedded-ui 6.6.1 → 6.8.0

package/dist/src/containers/Tenant/Diagnostics/Autorefresh/AutorefreshControl.js

@@ -2,18 +2,17 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ArrowsRotateLeft } from '@gravity-ui/icons';
 import { Button, Select } from '@gravity-ui/uikit';
 import { api } from '../../../../store/reducers/api';
-import { setAutorefreshInterval } from '../../../../store/reducers/schema/schema';
 import { cn } from '../../../../utils/cn';
-import { useTypedDispatch, useTypedSelector } from '../../../../utils/hooks';
+import { useAutoRefreshInterval, useTypedDispatch } from '../../../../utils/hooks';
 import i18n from './i18n';
 import './AutorefreshControl.scss';
 const b = cn('autorefresh-control');
 export function AutorefreshControl({ className }) {
     const dispatch = useTypedDispatch();
-    const autorefresh = useTypedSelector((state) => state.schema.autorefresh);
+    const [autoRefreshInterval, setAutoRefreshInterval] = useAutoRefreshInterval();
     return (_jsxs("div", { className: b(null, className), children: [_jsx(Button, { view: "flat", onClick: () => {
                     dispatch(api.util.invalidateTags(['All']));
-                }, extraProps: { 'aria-label': i18n('Refresh') }, children: _jsx(Button.Icon, { children: _jsx(ArrowsRotateLeft, {}) }) }), _jsxs(Select, { value: [String(autorefresh)], onUpdate: (v) => {
-                    dispatch(setAutorefreshInterval(Number(v)));
+                }, extraProps: { 'aria-label': i18n('Refresh') }, children: _jsx(Button.Icon, { children: _jsx(ArrowsRotateLeft, {}) }) }), _jsxs(Select, { value: [String(autoRefreshInterval)], onUpdate: (v) => {
+                    setAutoRefreshInterval(Number(v));
                 }, width: 85, children: [_jsx(Select.Option, { value: "0", children: i18n('None') }), _jsx(Select.Option, { value: "15000", children: i18n('15 sec') }), _jsx(Select.Option, { value: "60000", children: i18n('1 min') }), _jsx(Select.Option, { value: "120000", children: i18n('2 min') }), _jsx(Select.Option, { value: "300000", children: i18n('5 min') })] })] }));
 }

package/dist/src/containers/Tenant/Diagnostics/Consumers/Consumers.js

@@ -8,7 +8,7 @@ import { Search } from '../../../../components/Search';
 import { selectPreparedConsumersData, selectPreparedTopicStats, topicApi, } from '../../../../store/reducers/topic';
 import { cn } from '../../../../utils/cn';
 import { DEFAULT_TABLE_SETTINGS } from '../../../../utils/constants';
-import { useTypedSelector } from '../../../../utils/hooks';
+import { useAutoRefreshInterval, useTypedSelector } from '../../../../utils/hooks';
 import { isCdcStreamEntityType } from '../../utils/schema';
 import { ConsumersTopicStats } from './TopicStats';
 import { CONSUMERS_COLUMNS_WIDTH_LS_KEY, columns } from './columns';
@@ -18,8 +18,8 @@ const b = cn('ydb-diagnostics-consumers');
 export const Consumers = ({ path, type }) => {
     const isCdcStream = isCdcStreamEntityType(type);
     const [searchValue, setSearchValue] = React.useState('');
-    const { autorefresh } = useTypedSelector((state) => state.schema);
-    const { currentData, isFetching, error } = topicApi.useGetTopicQuery({ path }, { pollingInterval: autorefresh });
+    const [autoRefreshInterval] = useAutoRefreshInterval();
+    const { currentData, isFetching, error } = topicApi.useGetTopicQuery({ path }, { pollingInterval: autoRefreshInterval });
     const loading = isFetching && currentData === undefined;
     const consumers = useTypedSelector((state) => selectPreparedConsumersData(state, path));
     const topic = useTypedSelector((state) => selectPreparedTopicStats(state, path));

package/dist/src/containers/Tenant/Diagnostics/Describe/Describe.d.ts

@@ -2,8 +2,8 @@ import type { EPathType } from '../../../../types/api/schema';
 import './Describe.scss';
 import 'react-json-inspector/json-inspector.css';
 interface IDescribeProps {
-    tenant: string;
+    path: string;
     type?: EPathType;
 }
-declare const Describe: ({ tenant, type }: IDescribeProps) => import("react/jsx-runtime").JSX.Element;
+declare const Describe: ({ path, type }: IDescribeProps) => import("react/jsx-runtime").JSX.Element;
 export default Describe;

package/dist/src/containers/Tenant/Diagnostics/Describe/Describe.js

@@ -7,17 +7,16 @@ import { Loader } from '../../../../components/Loader';
 import { describeApi } from '../../../../store/reducers/describe';
 import { selectSchemaMergedChildrenPaths } from '../../../../store/reducers/schema/schema';
 import { cn } from '../../../../utils/cn';
-import { useTypedSelector } from '../../../../utils/hooks';
+import { useAutoRefreshInterval, useTypedSelector } from '../../../../utils/hooks';
 import { isEntityWithMergedImplementation } from '../../utils/schema';
 import './Describe.scss';
 import 'react-json-inspector/json-inspector.css';
 const b = cn('kv-describe');
 const expandMap = new Map();
-const Describe = ({ tenant, type }) => {
-    const { autorefresh, currentSchemaPath } = useTypedSelector((state) => state.schema);
+const Describe = ({ path, type }) => {
+    const [autoRefreshInterval] = useAutoRefreshInterval();
     const isEntityWithMergedImpl = isEntityWithMergedImplementation(type);
-    const mergedChildrenPaths = useTypedSelector((state) => selectSchemaMergedChildrenPaths(state, currentSchemaPath, type), shallowEqual);
-    const path = currentSchemaPath || tenant;
+    const mergedChildrenPaths = useTypedSelector((state) => selectSchemaMergedChildrenPaths(state, path, type), shallowEqual);
     let paths = skipToken;
     if (!isEntityWithMergedImpl) {
         paths = [path];
@@ -26,7 +25,7 @@ const Describe = ({ tenant, type }) => {
         paths = [path, ...mergedChildrenPaths];
     }
     const { currentData, isFetching, error } = describeApi.useGetDescribeQuery(paths, {
-        pollingInterval: autorefresh,
+        pollingInterval: autoRefreshInterval,
     });
     const loading = isFetching && currentData === undefined;
     const currentDescribe = currentData;

package/dist/src/containers/Tenant/Diagnostics/DetailedOverview/DetailedOverview.d.ts

@@ -5,6 +5,7 @@ interface DetailedOverviewProps {
     type?: EPathType;
     className?: string;
     tenantName: string;
+    path: string;
     additionalTenantProps?: AdditionalTenantsProps;
     additionalNodesProps?: AdditionalNodesProps;
 }

package/dist/src/containers/Tenant/Diagnostics/DetailedOverview/DetailedOverview.js

@@ -1,17 +1,15 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useSelector } from 'react-redux';
 import { cn } from '../../../../utils/cn';
 import Overview from '../Overview/Overview';
 import { TenantOverview } from '../TenantOverview/TenantOverview';
 import './DetailedOverview.scss';
 const b = cn('kv-detailed-overview');
 function DetailedOverview(props) {
-    const { type, tenantName, additionalTenantProps, additionalNodesProps } = props;
-    const { currentSchemaPath } = useSelector((state) => state.schema);
+    const { type, tenantName, path, additionalTenantProps, additionalNodesProps } = props;
     const renderTenantOverview = () => {
         return (_jsx("div", { className: b('section'), children: _jsx(TenantOverview, { tenantName: tenantName, additionalTenantProps: additionalTenantProps, additionalNodesProps: additionalNodesProps }) }));
     };
-    const isTenant = tenantName === currentSchemaPath;
-    return (_jsx("div", { className: b(), children: isTenant ? renderTenantOverview() : _jsx(Overview, { type: type, tenantName: tenantName }) }));
+    const isTenant = tenantName === path;
+    return (_jsx("div", { className: b(), children: isTenant ? renderTenantOverview() : _jsx(Overview, { type: type, path: path }) }));
 }
 export default DetailedOverview;

package/dist/src/containers/Tenant/Diagnostics/Diagnostics.d.ts

@@ -3,6 +3,8 @@ import type { EPathType } from '../../../types/api/schema';
 import './Diagnostics.scss';
 interface DiagnosticsProps {
     type?: EPathType;
+    tenantName: string;
+    path: string;
     additionalTenantProps?: AdditionalTenantsProps;
     additionalNodesProps?: AdditionalNodesProps;
 }

package/dist/src/containers/Tenant/Diagnostics/Diagnostics.js

@@ -4,7 +4,6 @@ import { Tabs } from '@gravity-ui/uikit';
 import { Helmet } from 'react-helmet-async';
 import { Link } from 'react-router-dom';
 import { StringParam, useQueryParams } from 'use-query-params';
-import { Loader } from '../../../components/Loader';
 import routes, { createHref } from '../../../routes';
 import { TENANT_DIAGNOSTICS_TABS_IDS } from '../../../store/reducers/tenant/constants';
 import { setDiagnosticsTab } from '../../../store/reducers/tenant/tenant';
@@ -32,83 +31,66 @@ const b = cn('kv-tenant-diagnostics');
 function Diagnostics(props) {
     const container = React.useRef(null);
     const dispatch = useTypedDispatch();
-    const { currentSchemaPath, wasLoaded } = useTypedSelector((state) => state.schema);
     const { diagnosticsTab = TENANT_DIAGNOSTICS_TABS_IDS.overview } = useTypedSelector((state) => state.tenant);
     const [queryParams] = useQueryParams({
         name: StringParam,
+        schema: StringParam,
         backend: StringParam,
         clusterName: StringParam,
     });
-    const { name: rootTenantName } = queryParams;
-    const tenantName = isDatabaseEntityType(props.type) ? currentSchemaPath : rootTenantName;
-    const isDatabase = isDatabaseEntityType(props.type) || currentSchemaPath === rootTenantName;
-    const pages = React.useMemo(() => {
-        if (isDatabase) {
-            return DATABASE_PAGES;
-        }
-        return getPagesByType(props.type);
-    }, [props.type, isDatabase]);
-    const forwardToDiagnosticTab = (tab) => {
-        dispatch(setDiagnosticsTab(tab));
-    };
-    const activeTab = React.useMemo(() => {
-        if (wasLoaded) {
-            let page = pages.find((el) => el.id === diagnosticsTab);
-            if (!page) {
-                page = pages[0];
-            }
-            if (page && page.id !== diagnosticsTab) {
-                forwardToDiagnosticTab(page.id);
-            }
-            return page;
+    const tenantName = isDatabaseEntityType(props.type) ? props.path : props.tenantName;
+    const isDatabase = isDatabaseEntityType(props.type) || props.path === props.tenantName;
+    const pages = isDatabase ? DATABASE_PAGES : getPagesByType(props.type);
+    let activeTab = pages.find((el) => el.id === diagnosticsTab);
+    if (!activeTab) {
+        activeTab = pages[0];
+    }
+    React.useEffect(() => {
+        if (activeTab && activeTab.id !== diagnosticsTab) {
+            dispatch(setDiagnosticsTab(activeTab.id));
         }
-        return undefined;
-    }, [pages, diagnosticsTab, wasLoaded]);
+    }, [activeTab, diagnosticsTab, dispatch]);
     const renderTabContent = () => {
-        const { type } = props;
-        const tenantNameString = tenantName;
+        const { type, path } = props;
         switch (activeTab === null || activeTab === void 0 ? void 0 : activeTab.id) {
             case TENANT_DIAGNOSTICS_TABS_IDS.overview: {
-                return (_jsx(DetailedOverview, { type: type, tenantName: tenantNameString, additionalTenantProps: props.additionalTenantProps, additionalNodesProps: props.additionalNodesProps }));
+                return (_jsx(DetailedOverview, { type: type, tenantName: tenantName, path: path, additionalTenantProps: props.additionalTenantProps, additionalNodesProps: props.additionalNodesProps }));
             }
             case TENANT_DIAGNOSTICS_TABS_IDS.schema: {
-                return (_jsx(SchemaViewer, { path: currentSchemaPath, tenantName: tenantName, type: type, extended: true }));
+                return _jsx(SchemaViewer, { path: path, tenantName: tenantName, type: type, extended: true });
             }
             case TENANT_DIAGNOSTICS_TABS_IDS.topQueries: {
-                return _jsx(TopQueries, { path: tenantNameString, type: type });
+                return _jsx(TopQueries, { tenantName: tenantName, type: type });
             }
             case TENANT_DIAGNOSTICS_TABS_IDS.topShards: {
-                return _jsx(TopShards, { tenantPath: tenantNameString, type: type });
+                return _jsx(TopShards, { tenantName: tenantName, path: path, type: type });
             }
             case TENANT_DIAGNOSTICS_TABS_IDS.nodes: {
-                return (_jsx(NodesWrapper, { path: currentSchemaPath, additionalNodesProps: props.additionalNodesProps, parentContainer: container.current }));
+                return (_jsx(NodesWrapper, { path: path, additionalNodesProps: props.additionalNodesProps, parentContainer: container.current }));
             }
             case TENANT_DIAGNOSTICS_TABS_IDS.tablets: {
-                return _jsx(Tablets, { path: currentSchemaPath });
+                return _jsx(Tablets, { path: path });
             }
             case TENANT_DIAGNOSTICS_TABS_IDS.storage: {
-                return (_jsx(StorageWrapper, { tenant: tenantNameString, parentContainer: container.current }));
+                return _jsx(StorageWrapper, { tenant: tenantName, parentContainer: container.current });
             }
             case TENANT_DIAGNOSTICS_TABS_IDS.network: {
-                return _jsx(Network, { path: tenantNameString });
+                return _jsx(Network, { tenantName: tenantName });
             }
             case TENANT_DIAGNOSTICS_TABS_IDS.describe: {
-                return _jsx(Describe, { tenant: tenantNameString, type: type });
+                return _jsx(Describe, { path: path, type: type });
             }
             case TENANT_DIAGNOSTICS_TABS_IDS.hotKeys: {
-                // @ts-expect-error
-                return _jsx(HotKeys, { path: currentSchemaPath });
+                return _jsx(HotKeys, { path: path });
             }
             case TENANT_DIAGNOSTICS_TABS_IDS.graph: {
-                // @ts-expect-error
-                return _jsx(Heatmap, { path: currentSchemaPath });
+                return _jsx(Heatmap, { path: path });
             }
             case TENANT_DIAGNOSTICS_TABS_IDS.consumers: {
-                // @ts-expect-error
-                return _jsx(Consumers, { path: currentSchemaPath, type: type });
+                return _jsx(Consumers, { path: path, type: type });
             }
             case TENANT_DIAGNOSTICS_TABS_IDS.partitions: {
-                return _jsx(Partitions, { path: currentSchemaPath });
+                return _jsx(Partitions, { path: path });
             }
             default: {
                 return _jsx("div", { children: "No data..." });
@@ -121,12 +103,6 @@ function Diagnostics(props) {
                             return (_jsx(Link, { to: path, className: b('tab'), children: node }, id));
                         }, allowNotSelected: true }), _jsx(AutorefreshControl, {})] }) }));
     };
-    // Loader prevents incorrect loading of tabs
-    // After tabs are initially loaded it is no longer needed
-    // Thus there is no also "loading" check as in other parts of the project
-    if (!wasLoaded) {
-        return _jsx(Loader, { size: "l" });
-    }
     return (_jsxs("div", { className: b(), ref: container, children: [activeTab ? (_jsx(Helmet, { children: _jsx("title", { children: activeTab.title }) })) : null, renderTabs(), _jsx("div", { className: b('page-wrapper'), children: renderTabContent() })] }));
 }
 export default Diagnostics;

package/dist/src/containers/Tenant/Diagnostics/Diagnostics.scss

@@ -6,7 +6,7 @@
     height: 100%;
 
     &__header-wrapper {
-        padding: 13px 20px 16px;
+        padding: 0 20px 16px;
 
         background-color: var(--g-color-base-background);
     }

package/dist/src/containers/Tenant/Diagnostics/HotKeys/HotKeys.js

@@ -5,10 +5,11 @@ import DataTable from '@gravity-ui/react-data-table';
 import { Button, Card, Icon } from '@gravity-ui/uikit';
 import { ResponseError } from '../../../../components/Errors/ResponseError';
 import { ResizeableDataTable } from '../../../../components/ResizeableDataTable/ResizeableDataTable';
-import { setHotKeysData, setHotKeysDataWasNotLoaded, setHotKeysError, setHotKeysLoading, } from '../../../../store/reducers/hotKeys/hotKeys';
+import { hotKeysApi } from '../../../../store/reducers/hotKeys/hotKeys';
+import { schemaApi } from '../../../../store/reducers/schema/schema';
 import { cn } from '../../../../utils/cn';
-import { DEFAULT_TABLE_SETTINGS, IS_HOTKEYS_HELP_HIDDDEN_KEY } from '../../../../utils/constants';
-import { useSetting, useTypedDispatch, useTypedSelector } from '../../../../utils/hooks';
+import { DEFAULT_TABLE_SETTINGS, IS_HOTKEYS_HELP_HIDDEN_KEY } from '../../../../utils/constants';
+import { useSetting } from '../../../../utils/hooks';
 import i18n from './i18n';
 import keyIcon from '../../../../assets/icons/key.svg';
 import './HotKeys.scss';
@@ -37,59 +38,18 @@ const getHotKeysColumns = (keyColumnsIds = []) => {
     ];
 };
 export function HotKeys({ path }) {
-    var _a, _b, _c;
-    const dispatch = useTypedDispatch();
-    const [helpHidden, setHelpHidden] = useSetting(IS_HOTKEYS_HELP_HIDDDEN_KEY);
-    const collectSamplesTimerRef = React.useRef();
-    const { loading, wasLoaded, data, error } = useTypedSelector((state) => state.hotKeys);
-    const { loading: schemaLoading, data: schemaData } = useTypedSelector((state) => state.schema);
-    const keyColumnsIds = (_c = (_b = (_a = schemaData[path]) === null || _a === void 0 ? void 0 : _a.PathDescription) === null || _b === void 0 ? void 0 : _b.Table) === null || _c === void 0 ? void 0 : _c.KeyColumnNames;
+    var _a, _b;
+    const { currentData: data, isFetching, error } = hotKeysApi.useGetHotKeysQuery({ path });
+    const loading = isFetching && data === undefined;
+    const { currentData: schemaData, isFetching: schemaIsFetching } = schemaApi.endpoints.getSchema.useQueryState({ path });
+    const schemaLoading = schemaIsFetching && schemaData === undefined;
+    const keyColumnsIds = (_b = (_a = schemaData === null || schemaData === void 0 ? void 0 : schemaData.PathDescription) === null || _a === void 0 ? void 0 : _a.Table) === null || _b === void 0 ? void 0 : _b.KeyColumnNames;
     const tableColumns = React.useMemo(() => {
         return getHotKeysColumns(keyColumnsIds);
     }, [keyColumnsIds]);
-    React.useEffect(() => {
-        const fetchHotkeys = async (enableSampling) => {
-            // Set hotkeys error, but not data, since data is set conditionally
-            try {
-                const response = await window.api.getHotKeys(path, enableSampling);
-                return response;
-            }
-            catch (err) {
-                dispatch(setHotKeysError(err));
-                return undefined;
-            }
-        };
-        const fetchData = async () => {
-            // If there is previous pending request for samples, cancel it
-            if (collectSamplesTimerRef.current !== undefined) {
-                window.clearInterval(collectSamplesTimerRef.current);
-            }
-            dispatch(setHotKeysDataWasNotLoaded());
-            dispatch(setHotKeysLoading());
-            // Send request that will trigger hot keys sampling (enable_sampling = true)
-            const initialResponse = await fetchHotkeys(true);
-            // If there are hotkeys in the initial request (hotkeys was collected before)
-            // we could just use colleted samples (collected hotkeys are stored only for 30 seconds)
-            if (initialResponse && initialResponse.hotkeys) {
-                dispatch(setHotKeysData(initialResponse));
-            }
-            else if (initialResponse) {
-                // Else wait for 5 seconds, while hot keys are being collected
-                // And request these samples (enable_sampling = false)
-                const timer = setTimeout(async () => {
-                    const responseWithSamples = await fetchHotkeys(false);
-                    if (responseWithSamples) {
-                        dispatch(setHotKeysData(responseWithSamples));
-                    }
-                }, 5000);
-                collectSamplesTimerRef.current = timer;
-            }
-        };
-        fetchData();
-    }, [dispatch, path]);
     const renderContent = () => {
         // It takes a while to collect hot keys. Display explicit status message, while collecting
-        if ((loading && !wasLoaded) || schemaLoading) {
+        if (loading || schemaLoading) {
             return _jsx("div", { children: i18n('hot-keys-collecting') });
         }
         if (error) {
@@ -103,11 +63,12 @@ export function HotKeys({ path }) {
                 order: DataTable.DESCENDING,
             } }));
     };
-    const renderHelpCard = () => {
-        if (helpHidden) {
-            return null;
-        }
-        return (_jsxs(Card, { theme: "info", view: "filled", type: "container", className: b('help-card'), children: [i18n('help'), _jsx(Button, { className: b('help-card__close-button'), view: "flat", onClick: () => setHelpHidden(true), children: _jsx(Icon, { data: Xmark, size: 18 }) })] }));
-    };
-    return (_jsxs(React.Fragment, { children: [renderHelpCard(), renderContent()] }));
+    return (_jsxs(React.Fragment, { children: [_jsx(HelpCard, {}), renderContent()] }));
+}
+function HelpCard() {
+    const [helpHidden, setHelpHidden] = useSetting(IS_HOTKEYS_HELP_HIDDEN_KEY);
+    if (helpHidden) {
+        return null;
+    }
+    return (_jsxs(Card, { theme: "info", view: "filled", type: "container", className: b('help-card'), children: [i18n('help'), _jsx(Button, { className: b('help-card__close-button'), view: "flat", onClick: () => setHelpHidden(true), children: _jsx(Icon, { data: Xmark, size: 18 }) })] }));
 }

package/dist/src/containers/Tenant/Diagnostics/Network/Network.d.ts

@@ -1,6 +1,6 @@
 import './Network.scss';
 interface NetworkProps {
-    path: string;
+    tenantName: string;
 }
-export declare function Network({ path }: NetworkProps): import("react/jsx-runtime").JSX.Element;
+export declare function Network({ tenantName }: NetworkProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/src/containers/Tenant/Diagnostics/Network/Network.js

@@ -9,23 +9,23 @@ import { networkApi } from '../../../../store/reducers/network/network';
 import { ProblemFilterValues, changeFilter, selectProblemFilter, } from '../../../../store/reducers/settings/settings';
 import { hideTooltip, showTooltip } from '../../../../store/reducers/tooltip';
 import { cn } from '../../../../utils/cn';
-import { useTypedDispatch, useTypedSelector } from '../../../../utils/hooks';
+import { useAutoRefreshInterval, useTypedDispatch, useTypedSelector } from '../../../../utils/hooks';
 import { getDefaultNodePath } from '../../../Node/NodePages';
 import { NodeNetwork } from './NodeNetwork/NodeNetwork';
 import { getConnectedNodesCount } from './utils';
 import networkIcon from '../../../../assets/icons/network.svg';
 import './Network.scss';
 const b = cn('network');
-export function Network({ path }) {
+export function Network({ tenantName }) {
     var _a, _b;
-    const { autorefresh } = useTypedSelector((state) => state.schema);
+    const [autoRefreshInterval] = useAutoRefreshInterval();
     const filter = useTypedSelector(selectProblemFilter);
     const dispatch = useTypedDispatch();
     const [clickedNode, setClickedNode] = React.useState();
     const [showId, setShowId] = React.useState(false);
     const [showRacks, setShowRacks] = React.useState(false);
-    const { currentData, isFetching, error } = networkApi.useGetNetworkInfoQuery(path, {
-        pollingInterval: autorefresh,
+    const { currentData, isFetching, error } = networkApi.useGetNetworkInfoQuery(tenantName, {
+        pollingInterval: autoRefreshInterval,
     });
     const loading = isFetching && currentData === undefined;
     if (loading) {

package/dist/src/containers/Tenant/Diagnostics/Overview/AsyncReplicationInfo/AsyncReplicationInfo.js

@@ -1,8 +1,7 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import { Flex, Text } from '@gravity-ui/uikit';
 import { AsyncReplicationState } from '../../../../../components/AsyncReplicationState';
 import { InfoViewer } from '../../../../../components/InfoViewer';
-import { useTypedSelector } from '../../../../../utils/hooks';
 import { getEntityName } from '../../../utils';
 import { AsyncReplicationPaths } from '../AsyncReplicationPaths';
 import { Credentials } from './Credentials';
@@ -11,10 +10,6 @@ import i18n from './i18n';
 export function AsyncReplicationInfo({ data }) {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
     const entityName = getEntityName(data === null || data === void 0 ? void 0 : data.PathDescription);
-    const { error: schemaError } = useTypedSelector((state) => state.schema);
-    if (schemaError) {
-        return _jsx("div", { className: "error", children: schemaError.statusText });
-    }
     if (!data) {
         return (_jsxs("div", { className: "error", children: [i18n('noData'), " ", entityName] }));
     }

package/dist/src/containers/Tenant/Diagnostics/Overview/ChangefeedInfo/ChangefeedInfo.d.ts

@@ -1,8 +1,9 @@
 import type { TEvDescribeSchemeResult } from '../../../../../types/api/schema';
 interface ChangefeedProps {
+    path: string;
     data?: TEvDescribeSchemeResult;
     topic?: TEvDescribeSchemeResult;
 }
 /** Displays overview for CDCStream EPathType */
-export declare const ChangefeedInfo: ({ data, topic }: ChangefeedProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ChangefeedInfo: ({ path, data, topic }: ChangefeedProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/src/containers/Tenant/Diagnostics/Overview/ChangefeedInfo/ChangefeedInfo.js

@@ -1,7 +1,6 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import { InfoViewer, formatObject } from '../../../../../components/InfoViewer';
 import { formatCdcStreamItem, formatCommonItem, } from '../../../../../components/InfoViewer/formatters';
-import { useTypedSelector } from '../../../../../utils/hooks';
 import { getEntityName } from '../../../utils';
 import { TopicStats } from '../TopicStats';
 import { prepareTopicSchemaInfo } from '../utils';
@@ -21,14 +20,10 @@ const prepareChangefeedInfo = (changefeedData, topicData) => {
     return [created, ...changefeedInfo, ...topicInfo];
 };
 /** Displays overview for CDCStream EPathType */
-export const ChangefeedInfo = ({ data, topic }) => {
+export const ChangefeedInfo = ({ path, data, topic }) => {
     const entityName = getEntityName(data === null || data === void 0 ? void 0 : data.PathDescription);
-    const { error: schemaError } = useTypedSelector((state) => state.schema);
-    if (schemaError) {
-        return _jsx("div", { className: "error", children: schemaError.statusText });
-    }
     if (!data || !topic) {
         return _jsxs("div", { className: "error", children: ["No ", entityName, " data"] });
     }
-    return (_jsxs("div", { children: [_jsx(InfoViewer, { title: entityName, info: prepareChangefeedInfo(data, topic) }), _jsx(TopicStats, {})] }));
+    return (_jsxs("div", { children: [_jsx(InfoViewer, { title: entityName, info: prepareChangefeedInfo(data, topic) }), _jsx(TopicStats, { path: path })] }));
 };

package/dist/src/containers/Tenant/Diagnostics/Overview/Overview.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { EPathType } from '../../../../types/api/schema';
 interface OverviewProps {
     type?: EPathType;
-    tenantName?: string;
+    path: string;
 }
-declare function Overview({ type, tenantName }: OverviewProps): string | number | true | Iterable<React.ReactNode> | import("react/jsx-runtime").JSX.Element;
+declare function Overview({ type, path }: OverviewProps): string | number | true | Iterable<React.ReactNode> | import("react/jsx-runtime").JSX.Element;
 export default Overview;

package/dist/src/containers/Tenant/Diagnostics/Overview/Overview.js

@@ -6,9 +6,9 @@ import { TableIndexInfo } from '../../../../components/InfoViewer/schemaInfo';
 import { Loader } from '../../../../components/Loader';
 import { olapApi } from '../../../../store/reducers/olapStats';
 import { overviewApi } from '../../../../store/reducers/overview/overview';
-import { selectSchemaMergedChildrenPaths } from '../../../../store/reducers/schema/schema';
+import { schemaApi, selectSchemaMergedChildrenPaths } from '../../../../store/reducers/schema/schema';
 import { EPathType } from '../../../../types/api/schema';
-import { useTypedSelector } from '../../../../utils/hooks';
+import { useAutoRefreshInterval, useTypedSelector } from '../../../../utils/hooks';
 import { ExternalDataSourceInfo } from '../../Info/ExternalDataSource/ExternalDataSource';
 import { ExternalTableInfo } from '../../Info/ExternalTable/ExternalTable';
 import { ViewInfo } from '../../Info/View/View';
@@ -17,30 +17,28 @@ import { AsyncReplicationInfo } from './AsyncReplicationInfo';
 import { ChangefeedInfo } from './ChangefeedInfo';
 import { TableInfo } from './TableInfo';
 import { TopicInfo } from './TopicInfo';
-function Overview({ type, tenantName }) {
-    const { autorefresh, currentSchemaPath } = useTypedSelector((state) => state.schema);
-    const schemaPath = currentSchemaPath || tenantName;
-    const olapParams = isTableType(type) && isColumnEntityType(type) ? { path: schemaPath } : skipToken;
-    const { currentData: olapData, isFetching: olapIsFetching } = olapApi.useGetOlapStatsQuery(olapParams, { pollingInterval: autorefresh });
+function Overview({ type, path }) {
+    const [autoRefreshInterval] = useAutoRefreshInterval();
+    const olapParams = isTableType(type) && isColumnEntityType(type) ? { path } : skipToken;
+    const { currentData: olapData, isFetching: olapIsFetching } = olapApi.useGetOlapStatsQuery(olapParams, { pollingInterval: autoRefreshInterval });
     const olapStatsLoading = olapIsFetching && olapData === undefined;
     const { result: olapStats } = olapData || { result: undefined };
     const isEntityWithMergedImpl = isEntityWithMergedImplementation(type);
-    // shalloEqual prevents rerenders when new schema data is loaded
-    const mergedChildrenPaths = useTypedSelector((state) => selectSchemaMergedChildrenPaths(state, currentSchemaPath, type), shallowEqual);
+    // shallowEqual prevents rerenders when new schema data is loaded
+    const mergedChildrenPaths = useTypedSelector((state) => selectSchemaMergedChildrenPaths(state, path, type), shallowEqual);
     let paths = skipToken;
-    if (schemaPath) {
-        if (!isEntityWithMergedImpl) {
-            paths = [schemaPath];
-        }
-        else if (mergedChildrenPaths) {
-            paths = [schemaPath, ...mergedChildrenPaths];
-        }
+    if (!isEntityWithMergedImpl) {
+        paths = [path];
+    }
+    else if (mergedChildrenPaths) {
+        paths = [path, ...mergedChildrenPaths];
     }
     const { currentData, isFetching, error: overviewError, } = overviewApi.useGetOverviewQuery(paths, {
-        pollingInterval: autorefresh,
+        pollingInterval: autoRefreshInterval,
     });
     const overviewLoading = isFetching && currentData === undefined;
     const { data: rawData, additionalData } = currentData || {};
+    const { error: schemaError } = schemaApi.endpoints.getSchema.useQueryState({ path });
     const entityLoading = overviewLoading || olapStatsLoading;
     const entityNotReady = isEntityWithMergedImpl && !mergedChildrenPaths;
     const renderContent = () => {
@@ -59,9 +57,9 @@ function Overview({ type, tenantName }) {
             [EPathType.EPathTypeColumnTable]: undefined,
             [EPathType.EPathTypeCdcStream]: () => {
                 var _a;
-                return (_jsx(ChangefeedInfo, { data: data, topic: (_a = additionalData === null || additionalData === void 0 ? void 0 : additionalData[0]) !== null && _a !== void 0 ? _a : undefined }));
+                return (_jsx(ChangefeedInfo, { path: path, data: data, topic: (_a = additionalData === null || additionalData === void 0 ? void 0 : additionalData[0]) !== null && _a !== void 0 ? _a : undefined }));
             },
-            [EPathType.EPathTypePersQueueGroup]: () => _jsx(TopicInfo, { data: data }),
+            [EPathType.EPathTypePersQueueGroup]: () => _jsx(TopicInfo, { data: data, path: path }),
             [EPathType.EPathTypeExternalTable]: () => _jsx(ExternalTableInfo, { data: data }),
             [EPathType.EPathTypeExternalDataSource]: () => _jsx(ExternalDataSourceInfo, { data: data }),
             [EPathType.EPathTypeView]: () => _jsx(ViewInfo, { data: data }),
@@ -72,8 +70,8 @@ function Overview({ type, tenantName }) {
     if (entityLoading || entityNotReady) {
         return _jsx(Loader, { size: "m" });
     }
-    if (overviewError) {
-        return _jsx(ResponseError, { error: overviewError });
+    if (schemaError || overviewError) {
+        return _jsx(ResponseError, { error: schemaError || overviewError });
     }
     return renderContent();
 }

package/dist/src/containers/Tenant/Diagnostics/Overview/TableInfo/TableInfo.js

@@ -2,13 +2,13 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { InfoViewer } from '../../../../../components/InfoViewer';
 import { cn } from '../../../../../utils/cn';
-import { getEntityName } from '../../../utils';
+import { EntityTitle } from '../../../EntityTitle/EntityTitle';
 import i18n from './i18n';
 import { prepareTableInfo } from './prepareTableInfo';
 import './TableInfo.scss';
 const b = cn('ydb-diagnostics-table-info');
 export const TableInfo = ({ data, type, olapStats }) => {
-    const entityName = getEntityName(data === null || data === void 0 ? void 0 : data.PathDescription);
+    const title = _jsx(EntityTitle, { data: data === null || data === void 0 ? void 0 : data.PathDescription });
     const { generalInfo = [], tableStatsInfo = [], tabletMetricsInfo = [], partitionConfigInfo = [], } = React.useMemo(() => prepareTableInfo(data, type, olapStats), [data, type, olapStats]);
-    return (_jsxs("div", { className: b(), children: [_jsx(InfoViewer, { info: generalInfo, title: entityName, className: b('info-block'), renderEmptyState: () => _jsx("div", { className: b('title'), children: entityName }) }), _jsxs("div", { className: b('row'), children: [_jsx("div", { className: b('col'), children: tableStatsInfo.map((info, index) => (_jsx(InfoViewer, { info: info, title: index === 0 ? i18n('tableStats') : undefined, className: b('info-block'), renderEmptyState: () => null }, index))) }), tabletMetricsInfo.length > 0 || partitionConfigInfo.length > 0 ? (_jsxs("div", { className: b('col'), children: [_jsx(InfoViewer, { info: tabletMetricsInfo, title: i18n('tabletMetrics'), className: b('info-block'), renderEmptyState: () => null }), _jsx(InfoViewer, { info: partitionConfigInfo, title: i18n('partitionConfig'), className: b('info-block'), renderEmptyState: () => null })] })) : null] })] }));
+    return (_jsxs("div", { className: b(), children: [_jsx(InfoViewer, { info: generalInfo, title: title, className: b('info-block'), renderEmptyState: () => _jsx("div", { className: b('title'), children: title }) }), _jsxs("div", { className: b('row'), children: [_jsx("div", { className: b('col'), children: tableStatsInfo.map((info, index) => (_jsx(InfoViewer, { info: info, title: index === 0 ? i18n('tableStats') : undefined, className: b('info-block'), renderEmptyState: () => null }, index))) }), tabletMetricsInfo.length > 0 || partitionConfigInfo.length > 0 ? (_jsxs("div", { className: b('col'), children: [_jsx(InfoViewer, { info: tabletMetricsInfo, title: i18n('tabletMetrics'), className: b('info-block'), renderEmptyState: () => null }), _jsx(InfoViewer, { info: partitionConfigInfo, title: i18n('partitionConfig'), className: b('info-block'), renderEmptyState: () => null })] })) : null] })] }));
 };

package/dist/src/containers/Tenant/Diagnostics/Overview/TableInfo/TableInfo.scss

@@ -1,8 +1,6 @@
 @import '../../../../../styles/mixins.scss';
 
 .ydb-diagnostics-table-info {
-    overflow: auto;
-
     &__title {
         @include info-viewer-title();
     }

package/dist/src/containers/Tenant/Diagnostics/Overview/TopicInfo/TopicInfo.d.ts

@@ -1,7 +1,8 @@
 import type { TEvDescribeSchemeResult } from '../../../../../types/api/schema';
 interface TopicInfoProps {
+    path: string;
     data?: TEvDescribeSchemeResult;
 }
 /** Displays overview for PersQueueGroup EPathType */
-export declare const TopicInfo: ({ data }: TopicInfoProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TopicInfo: ({ data, path }: TopicInfoProps) => import("react/jsx-runtime").JSX.Element;
 export {};