chore: rename MetricsCards to MetricsTabs

Author: astandrik

src/containers/Tenant/Diagnostics/TenantOverview/MetricsCards/MetricsCards.scss renamed to src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/MetricsTabs.scss

@@ -75,20 +75,20 @@
  */
 
 @mixin tab-edge-filler($side) {
-    &.tenant-metrics-cards__link-container_active::after {
+    &.tenant-metrics-tabs__link-container_active::after {
         @include pseudo-active-filler($side);
     }
 
-    &:not(.tenant-metrics-cards__link-container_active)::after {
+    &:not(.tenant-metrics-tabs__link-container_active)::after {
         @include pseudo-inactive-filler($side);
     }
 
-    &:not(.tenant-metrics-cards__link-container_active)::before {
+    &:not(.tenant-metrics-tabs__link-container_active)::before {
         @include pseudo-background-fill($side);
     }
 }
 
-.tenant-metrics-cards {
+.tenant-metrics-tabs {
     // CSS Variables for consistent design system
     --tab-border-width: 1px;
     --tab-filler-size: 10px;
@@ -198,7 +198,7 @@
             }
         }
 
-        .tenant-metrics-cards__link {
+        .tenant-metrics-tabs__link {
             padding-bottom: var(--tab-border-compensation);
             @include tab-border-base(var(--g-color-line-generic));
         }

src/containers/Tenant/Diagnostics/TenantOverview/MetricsCards/MetricsCards.tsx renamed to src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/MetricsTabs.tsx

@@ -21,25 +21,25 @@ import {TenantTabsGroups, getTenantPath} from '../../../TenantPages';
 import {TabCard} from '../TabCard/TabCard';
 import i18n from '../i18n';
 
-import './MetricsCards.scss';
+import './MetricsTabs.scss';
 
-const b = cn('tenant-metrics-cards');
+const b = cn('tenant-metrics-tabs');
 
-interface MetricsCardsProps {
+interface MetricsTabsProps {
     poolsCpuStats?: TenantPoolsStats[];
     memoryStats?: TenantMetricStats[];
     blobStorageStats?: TenantStorageStats[];
     tabletStorageStats?: TenantStorageStats[];
     networkStats?: TenantMetricStats[];
 }
 
-export function MetricsCards({
+export function MetricsTabs({
     poolsCpuStats,
     memoryStats,
     blobStorageStats,
     tabletStorageStats,
     networkStats,
-}: MetricsCardsProps) {
+}: MetricsTabsProps) {
     const location = useLocation();
     const {metricsTab} = useTypedSelector((state) => state.tenant);
     const queryParams = parseQuery(location);

src/containers/Tenant/Diagnostics/TenantOverview/TenantOverview.tsx

@@ -15,7 +15,7 @@ import {useClusterNameFromQuery} from '../../../../utils/hooks/useDatabaseFromQu
 import {mapDatabaseTypeToDBName} from '../../utils/schema';
 
 import {HealthcheckPreview} from './Healthcheck/HealthcheckPreview';
-import {MetricsCards} from './MetricsCards/MetricsCards';
+import {MetricsTabs} from './MetricsTabs/MetricsTabs';
 import {TenantCpu} from './TenantCpu/TenantCpu';
 import {TenantMemory} from './TenantMemory/TenantMemory';
 import {TenantStorage} from './TenantStorage/TenantStorage';
@@ -163,7 +163,7 @@ export function TenantOverview({
                     <Flex direction="column" gap={4}>
                         <HealthcheckPreview tenantName={tenantName} />
                         <QueriesActivityBar tenantName={tenantName} />
-                        <MetricsCards
+                        <MetricsTabs
                             poolsCpuStats={poolsStats}
                             memoryStats={memoryStats}
                             blobStorageStats={blobStorageStats}

src/utils/metrics.ts

@@ -79,7 +79,7 @@ export const getHighestSeverityStatus = (statuses: MetricStatus[]): MetricStatus
 
 /**
  * Calculate metric aggregates (sum of used/limit values) and determine status
- * This replaces the repetitive calculation logic from MetricsCards.tsx
+ * This replaces the repetitive calculation logic from MetricsTabs.tsx
  */
 export const calculateMetricAggregates = <T extends MetricStats>(
     items: T[] = [],

tests/suites/tenant/diagnostics/Diagnostics.ts

@@ -304,11 +304,9 @@ export class Diagnostics {
         this.copyLinkButton = page.locator('.ydb-copy-link-button__icon');
 
         // Info tab cards
-        this.cpuCard = page.locator('.tenant-metrics-cards__link-container:has-text("CPU")');
-        this.storageCard = page.locator(
-            '.tenant-metrics-cards__link-container:has-text("Storage")',
-        );
-        this.memoryCard = page.locator('.tenant-metrics-cards__link-container:has-text("Memory")');
+        this.cpuCard = page.locator('.tenant-metrics-tabs__link-container:has-text("CPU")');
+        this.storageCard = page.locator('.tenant-metrics-tabs__link-container:has-text("Storage")');
+        this.memoryCard = page.locator('.tenant-metrics-tabs__link-container:has-text("Memory")');
         this.healthcheckCard = page.locator('.ydb-healthcheck-preview');
         this.ownerCard = page.locator('.ydb-access-rights__owner-card');
         this.changeOwnerButton = page.locator('.ydb-access-rights__owner-card button');