From 7c1afad1d1aa1291458389c21804be6322d34f9e Mon Sep 17 00:00:00 2001 From: Anton Standrik Date: Fri, 1 Aug 2025 12:38:28 +0300 Subject: [PATCH 1/3] fix: incorrect storage group count --- .../MetricsTabs/MetricsTabs.tsx | 48 +++++++++++++++---- .../TenantOverview/TabCard/TabCard.tsx | 15 ++---- .../TenantOverview/TenantOverview.tsx | 1 + 3 files changed, 42 insertions(+), 22 deletions(-) diff --git a/src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/MetricsTabs.tsx b/src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/MetricsTabs.tsx index 1933857312..d58879e272 100644 --- a/src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/MetricsTabs.tsx +++ b/src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/MetricsTabs.tsx @@ -2,6 +2,11 @@ import {Flex} from '@gravity-ui/uikit'; import {Link, useLocation} from 'react-router-dom'; import {parseQuery} from '../../../../../routes'; +import { + useCapabilitiesLoaded, + useStorageGroupsHandlerAvailable, +} from '../../../../../store/reducers/capabilities/hooks'; +import {storageApi} from '../../../../../store/reducers/storage/storage'; import {TENANT_METRICS_TABS_IDS} from '../../../../../store/reducers/tenant/constants'; import type {TenantMetricsTab} from '../../../../../store/reducers/tenant/types'; import type { @@ -11,7 +16,7 @@ import type { } from '../../../../../store/reducers/tenants/utils'; import {cn} from '../../../../../utils/cn'; import {SHOW_NETWORK_UTILIZATION} from '../../../../../utils/constants'; -import {useSetting, useTypedSelector} from '../../../../../utils/hooks'; +import {useAutoRefreshInterval, useSetting, useTypedSelector} from '../../../../../utils/hooks'; import {calculateMetricAggregates} from '../../../../../utils/metrics'; import { formatCoresLegend, @@ -27,6 +32,7 @@ import './MetricsTabs.scss'; const b = cn('tenant-metrics-tabs'); interface MetricsTabsProps { + tenantName: string; poolsCpuStats?: TenantPoolsStats[]; memoryStats?: TenantMetricStats[]; blobStorageStats?: TenantStorageStats[]; @@ -35,6 +41,7 @@ interface MetricsTabsProps { } export function MetricsTabs({ + tenantName, poolsCpuStats, memoryStats, blobStorageStats, @@ -45,6 +52,25 @@ export function MetricsTabs({ const {metricsTab} = useTypedSelector((state) => state.tenant); const queryParams = parseQuery(location); + // Fetch storage groups data to get correct count (only if groups handler available) + const capabilitiesLoaded = useCapabilitiesLoaded(); + const groupsHandlerAvailable = useStorageGroupsHandlerAvailable(); + const [autoRefreshInterval] = useAutoRefreshInterval(); + + const {currentData: storageGroupsData} = storageApi.useGetStorageGroupsInfoQuery( + { + tenant: tenantName, + shouldUseGroupsHandler: groupsHandlerAvailable, + with: 'all', + limit: 0, + fieldsRequired: [], + }, + { + pollingInterval: autoRefreshInterval, + skip: !capabilitiesLoaded || !groupsHandlerAvailable, + }, + ); + const tabLinks: Record = { [TENANT_METRICS_TABS_IDS.cpu]: getTenantPath({ ...queryParams, @@ -73,7 +99,9 @@ export function MetricsTabs({ // Calculate storage metrics using utility const storageStats = tabletStorageStats || blobStorageStats || []; const storageMetrics = calculateMetricAggregates(storageStats); - const storageGroupCount = storageStats.length; + + // Get correct storage groups count from API (only if groups handler available) + const storageGroupCount = groupsHandlerAvailable ? (storageGroupsData?.total ?? 0) : undefined; // Calculate memory metrics using utility const memoryMetrics = calculateMetricAggregates(memoryStats); @@ -91,8 +119,7 @@ export function MetricsTabs({ > string; } -export function TabCard({ - label, - sublabel, - value, - limit, - active, - helpText, - legendFormatter, -}: TabCardProps) { +export function TabCard({text, value, limit, active, helpText, legendFormatter}: TabCardProps) { const {status, percents, legend, fill} = getDiagramValues({ value, capacity: limit, @@ -61,7 +52,7 @@ export function TabCard({ note={helpText} noteIconSize="s" > - {sublabel || label} + {text} diff --git a/src/containers/Tenant/Diagnostics/TenantOverview/TenantOverview.tsx b/src/containers/Tenant/Diagnostics/TenantOverview/TenantOverview.tsx index b3a3967aab..95a5ba64c5 100644 --- a/src/containers/Tenant/Diagnostics/TenantOverview/TenantOverview.tsx +++ b/src/containers/Tenant/Diagnostics/TenantOverview/TenantOverview.tsx @@ -173,6 +173,7 @@ export function TenantOverview({ Date: Fri, 1 Aug 2025 12:43:49 +0300 Subject: [PATCH 2/3] fix: review --- .../Diagnostics/TenantOverview/MetricsTabs/MetricsTabs.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/MetricsTabs.tsx b/src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/MetricsTabs.tsx index d58879e272..bd24ebeab3 100644 --- a/src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/MetricsTabs.tsx +++ b/src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/MetricsTabs.tsx @@ -100,8 +100,9 @@ export function MetricsTabs({ const storageStats = tabletStorageStats || blobStorageStats || []; const storageMetrics = calculateMetricAggregates(storageStats); - // Get correct storage groups count from API (only if groups handler available) - const storageGroupCount = groupsHandlerAvailable ? (storageGroupsData?.total ?? 0) : undefined; + // Get correct storage groups count from API (only if groups handler available and data is loaded) + const storageGroupCount = + groupsHandlerAvailable && storageGroupsData ? storageGroupsData.total : undefined; // Calculate memory metrics using utility const memoryMetrics = calculateMetricAggregates(memoryStats); From b017f98e8664d7b8968559fba23076b4d911a0db Mon Sep 17 00:00:00 2001 From: Anton Standrik Date: Fri, 1 Aug 2025 12:59:49 +0300 Subject: [PATCH 3/3] fix: review --- .../MetricsTabs/MetricsTabs.tsx | 38 +++---------------- .../TenantOverview/TenantOverview.tsx | 6 ++- 2 files changed, 10 insertions(+), 34 deletions(-) diff --git a/src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/MetricsTabs.tsx b/src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/MetricsTabs.tsx index bd24ebeab3..0cedc6b33d 100644 --- a/src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/MetricsTabs.tsx +++ b/src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/MetricsTabs.tsx @@ -2,11 +2,6 @@ import {Flex} from '@gravity-ui/uikit'; import {Link, useLocation} from 'react-router-dom'; import {parseQuery} from '../../../../../routes'; -import { - useCapabilitiesLoaded, - useStorageGroupsHandlerAvailable, -} from '../../../../../store/reducers/capabilities/hooks'; -import {storageApi} from '../../../../../store/reducers/storage/storage'; import {TENANT_METRICS_TABS_IDS} from '../../../../../store/reducers/tenant/constants'; import type {TenantMetricsTab} from '../../../../../store/reducers/tenant/types'; import type { @@ -16,7 +11,7 @@ import type { } from '../../../../../store/reducers/tenants/utils'; import {cn} from '../../../../../utils/cn'; import {SHOW_NETWORK_UTILIZATION} from '../../../../../utils/constants'; -import {useAutoRefreshInterval, useSetting, useTypedSelector} from '../../../../../utils/hooks'; +import {useSetting, useTypedSelector} from '../../../../../utils/hooks'; import {calculateMetricAggregates} from '../../../../../utils/metrics'; import { formatCoresLegend, @@ -32,45 +27,26 @@ import './MetricsTabs.scss'; const b = cn('tenant-metrics-tabs'); interface MetricsTabsProps { - tenantName: string; poolsCpuStats?: TenantPoolsStats[]; memoryStats?: TenantMetricStats[]; blobStorageStats?: TenantStorageStats[]; tabletStorageStats?: TenantStorageStats[]; networkStats?: TenantMetricStats[]; + storageGroupsCount?: number; } export function MetricsTabs({ - tenantName, poolsCpuStats, memoryStats, blobStorageStats, tabletStorageStats, networkStats, + storageGroupsCount, }: MetricsTabsProps) { const location = useLocation(); const {metricsTab} = useTypedSelector((state) => state.tenant); const queryParams = parseQuery(location); - // Fetch storage groups data to get correct count (only if groups handler available) - const capabilitiesLoaded = useCapabilitiesLoaded(); - const groupsHandlerAvailable = useStorageGroupsHandlerAvailable(); - const [autoRefreshInterval] = useAutoRefreshInterval(); - - const {currentData: storageGroupsData} = storageApi.useGetStorageGroupsInfoQuery( - { - tenant: tenantName, - shouldUseGroupsHandler: groupsHandlerAvailable, - with: 'all', - limit: 0, - fieldsRequired: [], - }, - { - pollingInterval: autoRefreshInterval, - skip: !capabilitiesLoaded || !groupsHandlerAvailable, - }, - ); - const tabLinks: Record = { [TENANT_METRICS_TABS_IDS.cpu]: getTenantPath({ ...queryParams, @@ -100,10 +76,6 @@ export function MetricsTabs({ const storageStats = tabletStorageStats || blobStorageStats || []; const storageMetrics = calculateMetricAggregates(storageStats); - // Get correct storage groups count from API (only if groups handler available and data is loaded) - const storageGroupCount = - groupsHandlerAvailable && storageGroupsData ? storageGroupsData.total : undefined; - // Calculate memory metrics using utility const memoryMetrics = calculateMetricAggregates(memoryStats); @@ -137,9 +109,9 @@ export function MetricsTabs({