ydb-embedded-ui 6.6.1 → 6.8.0

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

@@ -1,18 +1,13 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import { InfoViewer } from '../../../../../components/InfoViewer';
-import { useTypedSelector } from '../../../../../utils/hooks';
 import { getEntityName } from '../../../utils';
 import { TopicStats } from '../TopicStats';
 import { prepareTopicSchemaInfo } from '../utils';
 /** Displays overview for PersQueueGroup EPathType */
-export const TopicInfo = ({ data }) => {
+export const TopicInfo = ({ data, path }) => {
     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: ["No ", entityName, " data"] });
     }
-    return (_jsxs("div", { children: [_jsx(InfoViewer, { title: entityName, info: prepareTopicSchemaInfo(data) }), _jsx(TopicStats, {})] }));
+    return (_jsxs("div", { children: [_jsx(InfoViewer, { title: entityName, info: prepareTopicSchemaInfo(data) }), _jsx(TopicStats, { path: path })] }));
 };

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

@@ -1,2 +1,4 @@
 import './TopicStats.scss';
-export declare const TopicStats: () => import("react/jsx-runtime").JSX.Element;
+export declare const TopicStats: ({ path }: {
+    path: string;
+}) => import("react/jsx-runtime").JSX.Element;

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

@@ -8,7 +8,7 @@ import { SpeedMultiMeter } from '../../../../../components/SpeedMultiMeter';
 import { selectPreparedTopicStats, topicApi } from '../../../../../store/reducers/topic';
 import { cn } from '../../../../../utils/cn';
 import { formatBps, formatBytes } from '../../../../../utils/dataFormatters/dataFormatters';
-import { useTypedSelector } from '../../../../../utils/hooks';
+import { useAutoRefreshInterval, useTypedSelector } from '../../../../../utils/hooks';
 import { formatDurationToShortTimeFormat } from '../../../../../utils/timeParsers';
 import i18n from './i18n';
 import './TopicStats.scss';
@@ -47,11 +47,11 @@ const prepareBytesWrittenInfo = (data) => {
         },
     ];
 };
-export const TopicStats = () => {
-    const { autorefresh, currentSchemaPath } = useTypedSelector((state) => state.schema);
-    const { currentData, isFetching, error } = topicApi.useGetTopicQuery({ path: currentSchemaPath }, { pollingInterval: autorefresh });
+export const TopicStats = ({ path }) => {
+    const [autoRefreshInterval] = useAutoRefreshInterval();
+    const { currentData, isFetching, error } = topicApi.useGetTopicQuery({ path }, { pollingInterval: autoRefreshInterval });
     const loading = isFetching && currentData === undefined;
-    const data = useTypedSelector((state) => selectPreparedTopicStats(state, currentSchemaPath));
+    const data = useTypedSelector((state) => selectPreparedTopicStats(state, path));
     if (loading) {
         return (_jsx("div", { className: b(), children: _jsx(Loader, { size: "s" }) }));
     }

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

@@ -9,7 +9,7 @@ import { partitionsApi, setSelectedConsumer } from '../../../../store/reducers/p
 import { selectConsumersNames, topicApi } from '../../../../store/reducers/topic';
 import { cn } from '../../../../utils/cn';
 import { DEFAULT_TABLE_SETTINGS, PARTITIONS_HIDDEN_COLUMNS_KEY } from '../../../../utils/constants';
-import { useSetting, useTypedDispatch, useTypedSelector } from '../../../../utils/hooks';
+import { useAutoRefreshInterval, useSetting, useTypedDispatch, useTypedSelector, } from '../../../../utils/hooks';
 import { PartitionsControls } from './PartitionsControls/PartitionsControls';
 import { PARTITIONS_COLUMNS_WIDTH_LS_KEY } from './columns';
 import i18n from './i18n';
@@ -19,12 +19,9 @@ import './Partitions.scss';
 export const b = cn('ydb-diagnostics-partitions');
 export const Partitions = ({ path }) => {
     const dispatch = useTypedDispatch();
-    // Manual path control to ensure that topic state will be reset before data fetch
-    // so no request with wrong params will be sent
-    const [componentCurrentPath, setComponentCurrentPath] = React.useState(path);
     const [partitionsToRender, setPartitionsToRender] = React.useState([]);
     const consumers = useTypedSelector((state) => selectConsumersNames(state, path));
-    const { autorefresh } = useTypedSelector((state) => state.schema);
+    const [autoRefreshInterval] = useAutoRefreshInterval();
     const { selectedConsumer } = useTypedSelector((state) => state.partitions);
     const { currentData: topicData, isFetching: topicIsFetching, error: topicError, } = topicApi.useGetTopicQuery({ path });
     const topicLoading = topicIsFetching && topicData === undefined;
@@ -33,13 +30,8 @@ export const Partitions = ({ path }) => {
     const nodesMap = useTypedSelector(selectNodesMap);
     const [hiddenColumns, setHiddenColumns] = useSetting(PARTITIONS_HIDDEN_COLUMNS_KEY);
     const [columns, columnsIdsForSelector] = useGetPartitionsColumns(selectedConsumer);
-    React.useEffect(() => {
-        setComponentCurrentPath(path);
-    }, [dispatch, path]);
-    const params = !topicLoading && componentCurrentPath
-        ? { path: componentCurrentPath, consumerName: selectedConsumer }
-        : skipToken;
-    const { currentData: partitionsData, isFetching: partitionsIsFetching, error: partitionsError, } = partitionsApi.useGetPartitionsQuery(params, { pollingInterval: autorefresh });
+    const params = !topicLoading && path ? { path, consumerName: selectedConsumer } : skipToken;
+    const { currentData: partitionsData, isFetching: partitionsIsFetching, error: partitionsError, } = partitionsApi.useGetPartitionsQuery(params, { pollingInterval: autoRefreshInterval });
     const partitionsLoading = partitionsIsFetching && partitionsData === undefined;
     const rawPartitions = partitionsData;
     const partitionsWithHosts = React.useMemo(() => {

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

@@ -1,21 +1,7 @@
 @import '../../../../../styles/mixins.scss';
 
 .healthcheck {
-    display: flex;
-
-    &_expanded {
-        // Since most of the inner containers have fixed width, we can set fixed width here as well
-        // Thus we will get rid of unneeded layout shift when scrollbar appear
-        min-width: 885px;
-    }
-
-    &__issue-preview {
-        margin-bottom: 15px;
-    }
-
-    &__message-container {
-        padding: 15px 0;
-    }
+    $block: &;
 
     &__details {
         width: 872px;
@@ -26,13 +12,10 @@
     }
 
     &__preview {
-        height: 100%;
-    }
-
-    &__preview-header {
-        gap: 8px;
+        display: flex;
+        flex-direction: column;
 
-        margin-bottom: var(--diagnostics-section-title-margin);
+        height: 100%;
     }
 
     &__preview-title {
@@ -44,9 +27,16 @@
     }
 
     &__preview-content {
+        margin: auto;
+
         line-height: 24px;
     }
 
+    &__preview-status-icon {
+        width: 64px;
+        height: 64px;
+    }
+
     &__preview-title-wrapper {
         display: flex;
         align-items: center;
@@ -55,13 +45,45 @@
         margin-bottom: 4px;
     }
 
-    &__issues-statistics {
+    &__preview-issue {
+        position: relative;
+        top: -8px;
+
         display: flex;
-        flex-wrap: wrap;
+        flex-direction: column;
         align-items: center;
-        gap: 10px;
+        gap: 4px;
 
-        margin: 8px 0;
+        &_good {
+            color: var(--g-color-text-positive);
+            & #{$block}__self-check-status-indicator {
+                background-color: var(--g-color-base-positive-light);
+            }
+        }
+        &_degraded {
+            color: var(--g-color-text-info);
+            & #{$block}__self-check-status-indicator {
+                background-color: var(--g-color-base-info-light);
+            }
+        }
+        &_emergency {
+            color: var(--g-color-text-danger);
+            & #{$block}__self-check-status-indicator {
+                background-color: var(--g-color-base-danger-light);
+            }
+        }
+        &_unspecified {
+            color: var(--g-color-text-misc);
+            & #{$block}__self-check-status-indicator {
+                background-color: var(--g-color-base-misc-light);
+            }
+        }
+        &_maintenance_required {
+            color: var(--g-color-text-warning-heavy);
+            & #{$block}__self-check-status-indicator {
+                background-color: var(--g-color-base-warning-light);
+            }
+        }
     }
 
     &__self-check-status-indicator {
@@ -71,39 +93,8 @@
 
         font-size: 13px;
         line-height: 24px;
+        text-wrap: nowrap;
 
         border-radius: 4px;
-
-        &_good,
-        &_green {
-            color: var(--g-color-text-positive);
-            background-color: var(--g-color-base-positive-light);
-        }
-        &_degraded,
-        &_yellow {
-            color: var(--g-color-text-warning);
-            background-color: var(--g-color-base-warning-light);
-        }
-
-        &_blue {
-            color: var(--g-color-text-info);
-            background-color: var(--g-color-base-info-light);
-        }
-
-        &_emergency,
-        &_red {
-            color: var(--g-color-text-danger);
-            background-color: var(--g-color-base-danger-light);
-        }
-        &_unspecified,
-        &_grey {
-            color: var(--g-color-text-misc);
-            background-color: var(--g-color-base-misc-light);
-        }
-        &_maintenance_required,
-        &_orange {
-            color: var(--g-color-text-warning-heavy);
-            background-color: var(--g-color-base-warning-light);
-        }
     }
 }

package/dist/src/containers/Tenant/Diagnostics/TenantOverview/Healthcheck/HealthcheckDetails.d.ts

@@ -1,9 +1,6 @@
-import type { IssuesTree } from '../../../../../store/reducers/healthcheckInfo/types';
 import './Healthcheck.scss';
 interface HealthcheckDetailsProps {
-    issueTrees?: IssuesTree[];
-    loading?: boolean;
-    error?: unknown;
+    tenantName: string;
 }
-export declare function HealthcheckDetails(props: HealthcheckDetailsProps): import("react/jsx-runtime").JSX.Element;
+export declare function HealthcheckDetails({ tenantName }: HealthcheckDetailsProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/src/containers/Tenant/Diagnostics/TenantOverview/Healthcheck/HealthcheckDetails.js

@@ -3,12 +3,17 @@ import React from 'react';
 import { ResponseError } from '../../../../../components/Errors/ResponseError';
 import { Loader } from '../../../../../components/Loader';
 import { cn } from '../../../../../utils/cn';
+import { useAutoRefreshInterval } from '../../../../../utils/hooks';
+import { useHealthcheck } from '../useHealthcheck';
 import IssueTree from './IssuesViewer/IssueTree';
 import i18n from './i18n';
 import './Healthcheck.scss';
 const b = cn('healthcheck');
-export function HealthcheckDetails(props) {
-    const { issueTrees, loading, error } = props;
+export function HealthcheckDetails({ tenantName }) {
+    const [autoRefreshInterval] = useAutoRefreshInterval();
+    const { issueTrees, loading, error } = useHealthcheck(tenantName, {
+        autorefresh: autoRefreshInterval,
+    });
     const renderContent = () => {
         if (error) {
             return _jsx(ResponseError, { error: error, defaultMessage: i18n('no-data') });

package/dist/src/containers/Tenant/Diagnostics/TenantOverview/Healthcheck/HealthcheckPreview.d.ts

@@ -1,11 +1,6 @@
-import type { SelfCheckResult, StatusFlag } from '../../../../../types/api/healthcheck';
 import './Healthcheck.scss';
 interface HealthcheckPreviewProps {
-    selfCheckResult: SelfCheckResult;
-    issuesStatistics?: [StatusFlag, number][];
-    loading?: boolean;
-    onUpdate: VoidFunction;
-    error?: unknown;
+    tenantName: string;
     active?: boolean;
 }
 export declare function HealthcheckPreview(props: HealthcheckPreviewProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/containers/Tenant/Diagnostics/TenantOverview/Healthcheck/HealthcheckPreview.js

@@ -1,28 +1,32 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import { ArrowsRotateRight } from '@gravity-ui/icons';
-import { Button, Icon } from '@gravity-ui/uikit';
+import { CircleCheck, CircleInfo, CircleQuestion, CircleXmark, TriangleExclamationFill, } from '@gravity-ui/icons';
+import { Icon } from '@gravity-ui/uikit';
 import { DiagnosticCard } from '../../../../../components/DiagnosticCard/DiagnosticCard';
-import { EntityStatus } from '../../../../../components/EntityStatus/EntityStatus';
 import { ResponseError } from '../../../../../components/Errors/ResponseError';
 import { Loader } from '../../../../../components/Loader';
-import { hcStatusToColorFlag } from '../../../../../store/reducers/healthcheckInfo/utils';
+import { healthcheckApi } from '../../../../../store/reducers/healthcheckInfo/healthcheckInfo';
+import { SelfCheckResult } from '../../../../../types/api/healthcheck';
 import { cn } from '../../../../../utils/cn';
+import { useAutoRefreshInterval } from '../../../../../utils/hooks';
 import i18n from './i18n';
 import './Healthcheck.scss';
 const b = cn('healthcheck');
+const icons = {
+    [SelfCheckResult.UNSPECIFIED]: CircleQuestion,
+    [SelfCheckResult.GOOD]: CircleCheck,
+    [SelfCheckResult.DEGRADED]: CircleInfo,
+    [SelfCheckResult.MAINTENANCE_REQUIRED]: CircleXmark,
+    [SelfCheckResult.EMERGENCY]: TriangleExclamationFill,
+};
 export function HealthcheckPreview(props) {
-    const { selfCheckResult, issuesStatistics, loading, onUpdate, error, active } = props;
+    const { tenantName, active } = props;
+    const [autoRefreshInterval] = useAutoRefreshInterval();
+    const { currentData: data, isFetching, error, } = healthcheckApi.useGetHealthcheckInfoQuery({ database: tenantName }, {
+        pollingInterval: autoRefreshInterval,
+    });
+    const loading = isFetching && data === undefined;
     const renderHeader = () => {
-        const modifier = selfCheckResult.toLowerCase();
-        if (loading) {
-            return null;
-        }
-        return (_jsxs("div", { className: b('preview-header'), children: [_jsxs("div", { className: b('preview-title-wrapper'), children: [_jsx("div", { className: b('preview-title'), children: i18n('title.healthcheck') }), _jsx(Button, { size: "s", onClick: (event) => {
-                                // FIXME: refactor card to remove the button from the anchor link.
-                                event.preventDefault();
-                                onUpdate();
-                            }, loading: loading, view: "flat-secondary", children: _jsx(Icon, { data: ArrowsRotateRight, size: 20 }) })] }), _jsx("div", { className: b('self-check-status-indicator', { [modifier]: true }), children: selfCheckResult })] }));
+        return (_jsx("div", { className: b('preview-header'), children: _jsx("div", { className: b('preview-title-wrapper'), children: _jsx("div", { className: b('preview-title'), children: i18n('title.healthcheck') }) }) }));
     };
     const renderContent = () => {
         if (error) {
@@ -31,7 +35,9 @@ export function HealthcheckPreview(props) {
         if (loading) {
             return _jsx(Loader, { size: "m" });
         }
-        return (_jsx("div", { className: b('preview-content'), children: !issuesStatistics || !issuesStatistics.length ? (i18n('status_message.ok')) : (_jsxs(React.Fragment, { children: [_jsx("div", { children: i18n('label.issues') }), _jsx("div", { className: b('issues-statistics'), children: issuesStatistics.map(([status, count]) => (_jsx(EntityStatus, { mode: "icons", status: hcStatusToColorFlag[status], label: count.toString(), size: "l" }, status))) })] })) }));
+        const selfCheckResult = (data === null || data === void 0 ? void 0 : data.self_check_result) || SelfCheckResult.UNSPECIFIED;
+        const modifier = selfCheckResult.toLowerCase();
+        return (_jsx("div", { className: b('preview-content'), children: _jsxs("div", { className: b('preview-issue', { [modifier]: true }), children: [_jsx(Icon, { className: b('preview-status-icon'), data: icons[selfCheckResult] }), _jsx("div", { className: b('self-check-status-indicator'), children: selfCheckResult.replace(/_/g, ' ') })] }) }));
     };
     return (_jsxs(DiagnosticCard, { className: b('preview'), active: active, children: [renderHeader(), renderContent()] }));
 }

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

@@ -1,5 +1,4 @@
 import type { TenantMetricStats, TenantPoolsStats, TenantStorageStats } from '../../../../../store/reducers/tenants/utils';
-import type { SelfCheckResult, StatusFlag } from '../../../../../types/api/healthcheck';
 import './MetricsCards.scss';
 export interface TenantMetrics {
     memoryUsed?: number;
@@ -14,12 +13,7 @@ interface MetricsCardsProps {
     memoryStats?: TenantMetricStats[];
     blobStorageStats?: TenantStorageStats[];
     tabletStorageStats?: TenantStorageStats[];
-    issuesStatistics?: [StatusFlag, number][];
-    selfCheckResult: SelfCheckResult;
-    fetchHealthcheck: VoidFunction;
-    healthcheckLoading?: boolean;
-    healthCheckWasLoaded?: boolean;
-    healthcheckError?: unknown;
+    tenantName: string;
 }
-export declare function MetricsCards({ poolsCpuStats, memoryStats, blobStorageStats, tabletStorageStats, issuesStatistics, selfCheckResult, fetchHealthcheck, healthcheckLoading, healthcheckError, }: MetricsCardsProps): import("react/jsx-runtime").JSX.Element;
+export declare function MetricsCards({ poolsCpuStats, memoryStats, blobStorageStats, tabletStorageStats, tenantName, }: MetricsCardsProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -13,7 +13,7 @@ import i18n from '../i18n';
 import { MetricCard } from './MetricCard/MetricCard';
 import './MetricsCards.scss';
 const b = cn('metrics-cards');
-export function MetricsCards({ poolsCpuStats, memoryStats, blobStorageStats, tabletStorageStats, issuesStatistics, selfCheckResult, fetchHealthcheck, healthcheckLoading, healthcheckError, }) {
+export function MetricsCards({ poolsCpuStats, memoryStats, blobStorageStats, tabletStorageStats, tenantName, }) {
     const location = useLocation();
     const { metricsTab } = useTypedSelector((state) => state.tenant);
     const queryParams = parseQuery(location);
@@ -30,7 +30,7 @@ export function MetricsCards({ poolsCpuStats, memoryStats, blobStorageStats, tab
         [TENANT_METRICS_TABS_IDS.memory]: getTenantPath(Object.assign(Object.assign({}, queryParams), { [TenantTabsGroups.metricsTab]: getTabIfNotActive(TENANT_METRICS_TABS_IDS.memory) })),
         [TENANT_METRICS_TABS_IDS.healthcheck]: getTenantPath(Object.assign(Object.assign({}, queryParams), { [TenantTabsGroups.metricsTab]: getTabIfNotActive(TENANT_METRICS_TABS_IDS.healthcheck) })),
     };
-    return (_jsxs("div", { className: b(), children: [_jsx(Link, { to: tabLinks.cpu, className: b('tab'), children: _jsx(CPUCard, { poolsCpuStats: poolsCpuStats, active: metricsTab === TENANT_METRICS_TABS_IDS.cpu }) }), _jsx(Link, { to: tabLinks.storage, className: b('tab'), children: _jsx(StorageCard, { blobStorageStats: blobStorageStats, tabletStorageStats: tabletStorageStats, active: metricsTab === TENANT_METRICS_TABS_IDS.storage }) }), _jsx(Link, { to: tabLinks.memory, className: b('tab'), children: _jsx(MemoryCard, { memoryStats: memoryStats, active: metricsTab === TENANT_METRICS_TABS_IDS.memory }) }), _jsx(Link, { to: tabLinks.healthcheck, className: b('tab'), children: _jsx(HealthcheckPreview, { selfCheckResult: selfCheckResult, issuesStatistics: issuesStatistics, onUpdate: fetchHealthcheck, loading: healthcheckLoading, error: healthcheckError, active: metricsTab === TENANT_METRICS_TABS_IDS.healthcheck }) })] }));
+    return (_jsxs("div", { className: b(), children: [_jsx(Link, { to: tabLinks.cpu, className: b('tab'), children: _jsx(CPUCard, { poolsCpuStats: poolsCpuStats, active: metricsTab === TENANT_METRICS_TABS_IDS.cpu }) }), _jsx(Link, { to: tabLinks.storage, className: b('tab'), children: _jsx(StorageCard, { blobStorageStats: blobStorageStats, tabletStorageStats: tabletStorageStats, active: metricsTab === TENANT_METRICS_TABS_IDS.storage }) }), _jsx(Link, { to: tabLinks.memory, className: b('tab'), children: _jsx(MemoryCard, { memoryStats: memoryStats, active: metricsTab === TENANT_METRICS_TABS_IDS.memory }) }), _jsx(Link, { to: tabLinks.healthcheck, className: b('tab'), children: _jsx(HealthcheckPreview, { tenantName: tenantName, active: metricsTab === TENANT_METRICS_TABS_IDS.healthcheck }) })] }));
 }
 function CPUCard({ poolsCpuStats = [], active }) {
     let status = METRIC_STATUS.Unspecified;

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

@@ -1,7 +1,7 @@
 import type { AdditionalNodesProps } from '../../../../../types/additionalProps';
 interface TenantCpuProps {
-    path: string;
+    tenantName: string;
     additionalNodesProps?: AdditionalNodesProps;
 }
-export declare function TenantCpu({ path, additionalNodesProps }: TenantCpuProps): import("react/jsx-runtime").JSX.Element;
+export declare function TenantCpu({ tenantName, additionalNodesProps }: TenantCpuProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -6,6 +6,6 @@ import { TopNodesByLoad } from './TopNodesByLoad';
 import { TopQueries } from './TopQueries';
 import { TopShards } from './TopShards';
 import { cpuDashboardConfig } from './cpuDashboardConfig';
-export function TenantCpu({ path, additionalNodesProps }) {
-    return (_jsxs(React.Fragment, { children: [_jsx(TenantDashboard, { database: path, charts: cpuDashboardConfig }), _jsx(TopNodesByLoad, { path: path, additionalNodesProps: additionalNodesProps }), _jsx(TopNodesByCpu, { path: path, additionalNodesProps: additionalNodesProps }), _jsx(TopShards, { path: path }), _jsx(TopQueries, { path: path })] }));
+export function TenantCpu({ tenantName, additionalNodesProps }) {
+    return (_jsxs(React.Fragment, { children: [_jsx(TenantDashboard, { database: tenantName, charts: cpuDashboardConfig }), _jsx(TopNodesByLoad, { tenantName: tenantName, additionalNodesProps: additionalNodesProps }), _jsx(TopNodesByCpu, { tenantName: tenantName, additionalNodesProps: additionalNodesProps }), _jsx(TopShards, { tenantName: tenantName, path: tenantName }), _jsx(TopQueries, { tenantName: tenantName })] }));
 }

package/dist/src/containers/Tenant/Diagnostics/TenantOverview/TenantCpu/TopNodesByCpu.d.ts

@@ -1,7 +1,7 @@
 import type { AdditionalNodesProps } from '../../../../../types/additionalProps';
 interface TopNodesByCpuProps {
-    path: string;
+    tenantName: string;
     additionalNodesProps?: AdditionalNodesProps;
 }
-export declare function TopNodesByCpu({ path, additionalNodesProps }: TopNodesByCpuProps): import("react/jsx-runtime").JSX.Element;
+export declare function TopNodesByCpu({ tenantName, additionalNodesProps }: TopNodesByCpuProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/src/containers/Tenant/Diagnostics/TenantOverview/TenantCpu/TopNodesByCpu.js

@@ -1,17 +1,17 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { TENANT_DIAGNOSTICS_TABS_IDS } from '../../../../../store/reducers/tenant/constants';
 import { topNodesApi } from '../../../../../store/reducers/tenantOverview/topNodes/topNodes';
-import { useSearchQuery, useTypedSelector } from '../../../../../utils/hooks';
+import { useAutoRefreshInterval, useSearchQuery } from '../../../../../utils/hooks';
 import { NODES_COLUMNS_WIDTH_LS_KEY, getTopNodesByCpuColumns, } from '../../../../Nodes/getNodesColumns';
 import { TenantTabsGroups, getTenantPath } from '../../../TenantPages';
 import { TenantOverviewTableLayout } from '../TenantOverviewTableLayout';
 import { getSectionTitle } from '../getSectionTitle';
 import i18n from '../i18n';
-export function TopNodesByCpu({ path, additionalNodesProps }) {
+export function TopNodesByCpu({ tenantName, additionalNodesProps }) {
     const query = useSearchQuery();
-    const { autorefresh } = useTypedSelector((state) => state.schema);
+    const [autoRefreshInterval] = useAutoRefreshInterval();
     const columns = getTopNodesByCpuColumns(additionalNodesProps === null || additionalNodesProps === void 0 ? void 0 : additionalNodesProps.getNodeRef);
-    const { currentData, isFetching, error } = topNodesApi.useGetTopNodesQuery({ tenant: path, sortValue: 'CPU' }, { pollingInterval: autorefresh });
+    const { currentData, isFetching, error } = topNodesApi.useGetTopNodesQuery({ tenant: tenantName, sortValue: 'CPU' }, { pollingInterval: autoRefreshInterval });
     const loading = isFetching && currentData === undefined;
     const topNodes = currentData;
     const title = getSectionTitle({

package/dist/src/containers/Tenant/Diagnostics/TenantOverview/TenantCpu/TopNodesByLoad.d.ts

@@ -1,7 +1,7 @@
 import type { AdditionalNodesProps } from '../../../../../types/additionalProps';
 interface TopNodesByLoadProps {
-    path: string;
+    tenantName: string;
     additionalNodesProps?: AdditionalNodesProps;
 }
-export declare function TopNodesByLoad({ path, additionalNodesProps }: TopNodesByLoadProps): import("react/jsx-runtime").JSX.Element;
+export declare function TopNodesByLoad({ tenantName, additionalNodesProps }: TopNodesByLoadProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/src/containers/Tenant/Diagnostics/TenantOverview/TenantCpu/TopNodesByLoad.js

@@ -1,17 +1,17 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { TENANT_DIAGNOSTICS_TABS_IDS } from '../../../../../store/reducers/tenant/constants';
 import { topNodesApi } from '../../../../../store/reducers/tenantOverview/topNodes/topNodes';
-import { useSearchQuery, useTypedSelector } from '../../../../../utils/hooks';
+import { useAutoRefreshInterval, useSearchQuery } from '../../../../../utils/hooks';
 import { NODES_COLUMNS_WIDTH_LS_KEY, getTopNodesByLoadColumns, } from '../../../../Nodes/getNodesColumns';
 import { TenantTabsGroups, getTenantPath } from '../../../TenantPages';
 import { TenantOverviewTableLayout } from '../TenantOverviewTableLayout';
 import { getSectionTitle } from '../getSectionTitle';
 import i18n from '../i18n';
-export function TopNodesByLoad({ path, additionalNodesProps }) {
+export function TopNodesByLoad({ tenantName, additionalNodesProps }) {
     const query = useSearchQuery();
-    const { autorefresh } = useTypedSelector((state) => state.schema);
+    const [autoRefreshInterval] = useAutoRefreshInterval();
     const columns = getTopNodesByLoadColumns(additionalNodesProps === null || additionalNodesProps === void 0 ? void 0 : additionalNodesProps.getNodeRef);
-    const { currentData, isFetching, error } = topNodesApi.useGetTopNodesQuery({ tenant: path, sortValue: 'LoadAverage' }, { pollingInterval: autorefresh });
+    const { currentData, isFetching, error } = topNodesApi.useGetTopNodesQuery({ tenant: tenantName, sortValue: 'LoadAverage' }, { pollingInterval: autoRefreshInterval });
     const loading = isFetching && currentData === undefined;
     const topNodes = currentData;
     const title = getSectionTitle({

package/dist/src/containers/Tenant/Diagnostics/TenantOverview/TenantCpu/TopQueries.d.ts

@@ -1,5 +1,5 @@
 interface TopQueriesProps {
-    path: string;
+    tenantName: string;
 }
-export declare function TopQueries({ path }: TopQueriesProps): import("react/jsx-runtime").JSX.Element;
+export declare function TopQueries({ tenantName }: TopQueriesProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/src/containers/Tenant/Diagnostics/TenantOverview/TenantCpu/TopQueries.js

@@ -5,7 +5,7 @@ import { parseQuery } from '../../../../../routes';
 import { changeUserInput } from '../../../../../store/reducers/executeQuery';
 import { TENANT_DIAGNOSTICS_TABS_IDS, TENANT_PAGE, TENANT_PAGES_IDS, TENANT_QUERY_TABS_ID, } from '../../../../../store/reducers/tenant/constants';
 import { topQueriesApi } from '../../../../../store/reducers/tenantOverview/topQueries/tenantOverviewTopQueries';
-import { useTypedDispatch, useTypedSelector } from '../../../../../utils/hooks';
+import { useAutoRefreshInterval, useTypedDispatch } from '../../../../../utils/hooks';
 import { parseQueryErrorToString } from '../../../../../utils/query';
 import { TenantTabsGroups, getTenantPath } from '../../../TenantPages';
 import { TOP_QUERIES_COLUMNS_WIDTH_LS_KEY, getTenantOverviewTopQueriesColumns, } from '../../TopQueries/getTopQueriesColumns';
@@ -13,14 +13,14 @@ import { TenantOverviewTableLayout } from '../TenantOverviewTableLayout';
 import { getSectionTitle } from '../getSectionTitle';
 import i18n from '../i18n';
 import { b } from '../utils';
-export function TopQueries({ path }) {
+export function TopQueries({ tenantName }) {
     const dispatch = useTypedDispatch();
     const location = useLocation();
     const history = useHistory();
     const query = parseQuery(location);
-    const { autorefresh } = useTypedSelector((state) => state.schema);
+    const [autoRefreshInterval] = useAutoRefreshInterval();
     const columns = getTenantOverviewTopQueriesColumns();
-    const { currentData, isFetching, error } = topQueriesApi.useGetOverviewTopQueriesQuery({ database: path }, { pollingInterval: autorefresh });
+    const { currentData, isFetching, error } = topQueriesApi.useGetOverviewTopQueriesQuery({ database: tenantName }, { pollingInterval: autoRefreshInterval });
     const loading = isFetching && currentData === undefined;
     const { result: data } = currentData || {};
     const handleRowClick = React.useCallback((row) => {

package/dist/src/containers/Tenant/Diagnostics/TenantOverview/TenantCpu/TopShards.d.ts

@@ -1,5 +1,6 @@
 interface TopShardsProps {
+    tenantName: string;
     path: string;
 }
-export declare const TopShards: ({ path }: TopShardsProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TopShards: ({ tenantName, path }: TopShardsProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/src/containers/Tenant/Diagnostics/TenantOverview/TenantCpu/TopShards.js

@@ -3,21 +3,21 @@ import { useLocation } from 'react-router';
 import { parseQuery } from '../../../../../routes';
 import { TENANT_DIAGNOSTICS_TABS_IDS } from '../../../../../store/reducers/tenant/constants';
 import { topShardsApi } from '../../../../../store/reducers/tenantOverview/topShards/tenantOverviewTopShards';
-import { useTypedSelector } from '../../../../../utils/hooks';
+import { useAutoRefreshInterval } from '../../../../../utils/hooks';
 import { parseQueryErrorToString } from '../../../../../utils/query';
 import { TenantTabsGroups, getTenantPath } from '../../../TenantPages';
 import { TOP_SHARDS_COLUMNS_WIDTH_LS_KEY, getTopShardsColumns, } from '../../TopShards/getTopShardsColumns';
 import { TenantOverviewTableLayout } from '../TenantOverviewTableLayout';
 import { getSectionTitle } from '../getSectionTitle';
 import i18n from '../i18n';
-export const TopShards = ({ path }) => {
+export const TopShards = ({ tenantName, path }) => {
     const location = useLocation();
     const query = parseQuery(location);
-    const { autorefresh, currentSchemaPath } = useTypedSelector((state) => state.schema);
-    const { currentData, isFetching, error } = topShardsApi.useGetTopShardsQuery({ database: path, path: currentSchemaPath }, { pollingInterval: autorefresh });
+    const [autoRefreshInterval] = useAutoRefreshInterval();
+    const { currentData, isFetching, error } = topShardsApi.useGetTopShardsQuery({ database: tenantName, path }, { pollingInterval: autoRefreshInterval });
     const loading = isFetching && currentData === undefined;
     const { result: data } = currentData || {};
-    const columns = getTopShardsColumns(path, location);
+    const columns = getTopShardsColumns(tenantName, location);
     const title = getSectionTitle({
         entity: i18n('shards'),
         postfix: i18n('by-cpu-usage'),

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

@@ -4,7 +4,7 @@ import { StringParam, useQueryParam } from 'use-query-params';
 import { MetricChart } from '../../../../../components/MetricChart';
 import { TimeFrameSelector } from '../../../../../components/TimeFrameSelector/TimeFrameSelector';
 import { cn } from '../../../../../utils/cn';
-import { useTypedSelector } from '../../../../../utils/hooks';
+import { useAutoRefreshInterval } from '../../../../../utils/hooks';
 import './TenantDashboard.scss';
 const CHART_WIDTH = 428;
 const CHART_WIDTH_FULL = 872;
@@ -12,9 +12,9 @@ const b = cn('ydb-tenant-dashboard');
 export const TenantDashboard = ({ database, charts }) => {
     const [isDashboardHidden, setIsDashboardHidden] = React.useState(true);
     const [timeFrame = '1h', setTimeframe] = useQueryParam('timeframe', StringParam);
-    const { autorefresh } = useTypedSelector((state) => state.schema);
+    const [autoRefreshInterval] = useAutoRefreshInterval();
     // Refetch data only if dashboard successfully loaded
-    const shouldRefresh = isDashboardHidden ? 0 : autorefresh;
+    const shouldRefresh = isDashboardHidden ? 0 : autoRefreshInterval;
     /**
      * Charts should be hidden, if they are not enabled:
      * 1. GraphShard is not enabled

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

@@ -1,5 +1,5 @@
 interface TenantMemoryProps {
-    path: string;
+    tenantName: string;
 }
-export declare function TenantMemory({ path }: TenantMemoryProps): import("react/jsx-runtime").JSX.Element;
+export declare function TenantMemory({ tenantName }: TenantMemoryProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -3,6 +3,6 @@ import React from 'react';
 import { TenantDashboard } from '../TenantDashboard/TenantDashboard';
 import { TopNodesByMemory } from './TopNodesByMemory';
 import { memoryDashboardConfig } from './memoryDashboardConfig';
-export function TenantMemory({ path }) {
-    return (_jsxs(React.Fragment, { children: [_jsx(TenantDashboard, { database: path, charts: memoryDashboardConfig }), _jsx(TopNodesByMemory, { path: path })] }));
+export function TenantMemory({ tenantName }) {
+    return (_jsxs(React.Fragment, { children: [_jsx(TenantDashboard, { database: tenantName, charts: memoryDashboardConfig }), _jsx(TopNodesByMemory, { tenantName: tenantName })] }));
 }

package/dist/src/containers/Tenant/Diagnostics/TenantOverview/TenantMemory/TopNodesByMemory.d.ts

@@ -1,7 +1,7 @@
 import type { AdditionalNodesProps } from '../../../../../types/additionalProps';
 interface TopNodesByMemoryProps {
-    path: string;
+    tenantName: string;
     additionalNodesProps?: AdditionalNodesProps;
 }
-export declare function TopNodesByMemory({ path, additionalNodesProps }: TopNodesByMemoryProps): import("react/jsx-runtime").JSX.Element;
+export declare function TopNodesByMemory({ tenantName, additionalNodesProps }: TopNodesByMemoryProps): import("react/jsx-runtime").JSX.Element;
 export {};