ydb-embedded-ui 17.1.0 → 18.0.0

package/dist/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/MetricsTabs.scss

@@ -93,12 +93,13 @@
     --tab-border-width: 1px;
     --tab-filler-size: 10px;
     --tab-overlap: -1px;
-    --tab-lift-offset: -6px;
-    --tab-border-compensation: 1px;
     --tab-adjusted-spacing: calc(var(--g-spacing-3) - var(--tab-border-width));
     --z-tab-base: 100;
     --z-tab-active: 110;
     --g-border-radius-xxl: 12px;
+    --metric-tab-card-width: 225px;
+    --metric-tab-card-width-narrow: 210px;
+    --metric-tab-card-height: 70px;
 
     // Fallback for browsers without :has() support
     @supports not selector(:has(*)) {
@@ -111,6 +112,8 @@
     }
 
     &__link {
+        display: block;
+
         text-decoration: none;
 
         color: inherit;
@@ -124,7 +127,7 @@
         position: relative;
         z-index: var(--z-tab-base);
 
-        flex: 1;
+        flex: 0 0 auto;
 
         margin-left: var(--tab-overlap);
         padding: 0 var(--g-spacing-3) var(--g-spacing-3) var(--g-spacing-3);
@@ -132,15 +135,6 @@
         border-bottom: var(--tab-border-width) solid var(--g-color-line-generic);
         background: var(--g-color-base-background);
 
-        .tenant-tab-card__card-container {
-            border: 1px solid transparent;
-            border-top: none;
-
-            & > div {
-                transform: translateY(1px);
-            }
-        }
-
         &:nth-child(1) {
             z-index: calc(var(--z-tab-base) + 3);
         }
@@ -172,34 +166,31 @@
             padding-right: 0;
             @include tab-edge-filler(right);
         }
-    }
 
-    &__link {
-        display: block;
+        &_placeholder {
+            z-index: 1;
+
+            flex: 1 1 auto;
+
+            pointer-events: none;
+
+            .tenant-metrics-tabs__link {
+                height: var(--metric-tab-card-height);
+            }
+        }
     }
 
     // Active state styling
     &__link-container_active {
         z-index: var(--z-tab-active) !important;
 
+        width: var(--metric-tab-card-width);
+        height: var(--metric-tab-card-height);
         padding: 0;
 
         border-bottom: 0;
-        background: var(--g-color-base-background);
-
-        transform: translateY(var(--tab-lift-offset));
-
-        .tenant-tab-card__card-container {
-            border: none;
-            border-radius: var(--g-border-radius-xs);
-
-            & > div {
-                transform: translateY(0);
-            }
-        }
 
         .tenant-metrics-tabs__link {
-            padding-bottom: var(--tab-border-compensation);
             @include tab-border-base(var(--g-color-line-generic));
         }
     }
@@ -223,14 +214,12 @@
     &__link-container:not(:has(+ &__link-container_active)) {
         padding-right: 0;
     }
-}
 
-.tenant-metrics-tabs_serverless {
-    .tenant-metrics-tabs__link-container_placeholder {
-        pointer-events: none;
+    &_serverless {
+        --metric-tab-card-width: 242px;
+    }
 
-        .tenant-tab-card__card-container {
-            opacity: 0;
-        }
+    @media (max-width: 1200px) {
+        --metric-tab-card-width: var(--metric-tab-card-width-narrow);
     }
 }

package/dist/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/CpuTab.d.ts

@@ -1,13 +1,10 @@
+import type { TenantOverviewMetric } from '../../metricOverview';
 import '../MetricsTabs.scss';
 interface CpuTabProps {
     to: string;
     active: boolean;
+    cpu?: TenantOverviewMetric;
     isServerless: boolean;
-    cpu: {
-        totalUsed: number;
-        totalLimit: number;
-    };
-    controlPlaneNodesCount?: number;
 }
-export declare function CpuTab({ to, active, isServerless, cpu, controlPlaneNodesCount }: CpuTabProps): import("react/jsx-runtime").JSX.Element;
+export declare function CpuTab({ to, active, cpu, isServerless }: CpuTabProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/CpuTab.js

@@ -1,16 +1,13 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Link } from 'react-router-dom';
 import { cn } from '../../../../../../utils/cn';
-import { formatCoresLegend } from '../../../../../../utils/metrics/formatMetricLegend';
+import { MetricTabCard } from '../../TabCard/MetricTabCard';
 import { ServerlessTabCard } from '../../TabCard/ServerlessTabCard';
-import { UsageTabCard } from '../../TabCard/UsageTabCard';
 import i18n from '../../i18n';
 import '../MetricsTabs.scss';
 const b = cn('tenant-metrics-tabs');
-export function CpuTab({ to, active, isServerless, cpu, controlPlaneNodesCount }) {
-    const dedicatedDatabaseUsageText = !controlPlaneNodesCount
-        ? i18n('context_cpu-load')
-        : i18n('context_cpu-nodes-count', { count: controlPlaneNodesCount });
-    return (_jsx("div", { className: b('link-container', { active }), children: _jsx(Link, { to: to, className: b('link'), children: isServerless ? (_jsx(ServerlessTabCard, { text: i18n('context_cpu-load'), active: active, helpText: i18n('context_cpu-description'), subtitle: i18n('context_serverless-autoscaled') })) : (_jsx(UsageTabCard, { text: dedicatedDatabaseUsageText, value: cpu.totalUsed, limit: cpu.totalLimit, legendFormatter: formatCoresLegend, active: active, helpText: i18n('context_cpu-description') })) }) }));
+export function CpuTab({ to, active, cpu, isServerless }) {
+    var _a;
+    return (_jsx("div", { className: b('link-container', { active }), children: _jsx(Link, { to: to, className: b('link'), children: isServerless || !cpu ? (_jsx(ServerlessTabCard, { title: i18n('title_cpu-load'), active: active, description: i18n('context_serverless-autoscaled'), helpText: i18n('context_cpu-description') })) : (_jsx(MetricTabCard, { title: i18n('title_cpu'), status: cpu.status, value: (_a = cpu.percentText) !== null && _a !== void 0 ? _a : i18n('value_unavailable-percent'), active: active, description: i18n('context_cpu-tab-description') })) }) }));
 }
 //# sourceMappingURL=CpuTab.js.map

package/dist/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/CpuTab.js.map

@@ -1 +1 @@
-{"version":3,"file":"CpuTab.js","sourceRoot":"","sources":["../../../../../../../src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/CpuTab.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,kBAAkB,CAAC;AAEtC,OAAO,EAAC,EAAE,EAAC,MAAM,4BAA4B,CAAC;AAC9C,OAAO,EAAC,iBAAiB,EAAC,MAAM,oDAAoD,CAAC;AACrF,OAAO,EAAC,iBAAiB,EAAC,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAC,YAAY,EAAC,MAAM,4BAA4B,CAAC;AACxD,OAAO,IAAI,MAAM,YAAY,CAAC;AAE9B,OAAO,qBAAqB,CAAC;AAE7B,MAAM,CAAC,GAAG,EAAE,CAAC,qBAAqB,CAAC,CAAC;AAUpC,MAAM,UAAU,MAAM,CAAC,EAAC,EAAE,EAAE,MAAM,EAAE,YAAY,EAAE,GAAG,EAAE,sBAAsB,EAAc;IACvF,MAAM,0BAA0B,GAAG,CAAC,sBAAsB;QACtD,CAAC,CAAC,IAAI,CAAC,kBAAkB,CAAC;QAC1B,CAAC,CAAC,IAAI,CAAC,yBAAyB,EAAE,EAAC,KAAK,EAAE,sBAAsB,EAAC,CAAC,CAAC;IAEvE,OAAO,CACH,cAAK,SAAS,EAAE,CAAC,CAAC,gBAAgB,EAAE,EAAC,MAAM,EAAC,CAAC,YACzC,KAAC,IAAI,IAAC,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YAC7B,YAAY,CAAC,CAAC,CAAC,CACZ,KAAC,iBAAiB,IACd,IAAI,EAAE,IAAI,CAAC,kBAAkB,CAAC,EAC9B,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,IAAI,CAAC,yBAAyB,CAAC,EACzC,QAAQ,EAAE,IAAI,CAAC,+BAA+B,CAAC,GACjD,CACL,CAAC,CAAC,CAAC,CACA,KAAC,YAAY,IACT,IAAI,EAAE,0BAA0B,EAChC,KAAK,EAAE,GAAG,CAAC,SAAS,EACpB,KAAK,EAAE,GAAG,CAAC,UAAU,EACrB,eAAe,EAAE,iBAAiB,EAClC,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,IAAI,CAAC,yBAAyB,CAAC,GAC3C,CACL,GACE,GACL,CACT,CAAC;AACN,CAAC"}
+{"version":3,"file":"CpuTab.js","sourceRoot":"","sources":["../../../../../../../src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/CpuTab.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,kBAAkB,CAAC;AAEtC,OAAO,EAAC,EAAE,EAAC,MAAM,4BAA4B,CAAC;AAC9C,OAAO,EAAC,aAAa,EAAC,MAAM,6BAA6B,CAAC;AAC1D,OAAO,EAAC,iBAAiB,EAAC,MAAM,iCAAiC,CAAC;AAClE,OAAO,IAAI,MAAM,YAAY,CAAC;AAG9B,OAAO,qBAAqB,CAAC;AAE7B,MAAM,CAAC,GAAG,EAAE,CAAC,qBAAqB,CAAC,CAAC;AASpC,MAAM,UAAU,MAAM,CAAC,EAAC,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE,YAAY,EAAc;;IAC/D,OAAO,CACH,cAAK,SAAS,EAAE,CAAC,CAAC,gBAAgB,EAAE,EAAC,MAAM,EAAC,CAAC,YACzC,KAAC,IAAI,IAAC,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YAC7B,YAAY,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CACpB,KAAC,iBAAiB,IACd,KAAK,EAAE,IAAI,CAAC,gBAAgB,CAAC,EAC7B,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,IAAI,CAAC,+BAA+B,CAAC,EAClD,QAAQ,EAAE,IAAI,CAAC,yBAAyB,CAAC,GAC3C,CACL,CAAC,CAAC,CAAC,CACA,KAAC,aAAa,IACV,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC,EACxB,MAAM,EAAE,GAAG,CAAC,MAAM,EAClB,KAAK,EAAE,MAAA,GAAG,CAAC,WAAW,mCAAI,IAAI,CAAC,2BAA2B,CAAC,EAC3D,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,IAAI,CAAC,6BAA6B,CAAC,GAClD,CACL,GACE,GACL,CACT,CAAC;AACN,CAAC"}

package/dist/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/MemoryTab.d.ts

@@ -1,11 +1,9 @@
+import type { TenantOverviewMetric } from '../../metricOverview';
 import '../MetricsTabs.scss';
 interface MemoryTabProps {
     to: string;
     active: boolean;
-    memory: {
-        totalUsed: number;
-        totalLimit: number;
-    };
+    memory: TenantOverviewMetric;
 }
 export declare function MemoryTab({ to, active, memory }: MemoryTabProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/MemoryTab.js

@@ -1,12 +1,12 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Link } from 'react-router-dom';
 import { cn } from '../../../../../../utils/cn';
-import { formatStorageLegend } from '../../../../../../utils/metrics/formatMetricLegend';
-import { UsageTabCard } from '../../TabCard/UsageTabCard';
+import { MetricTabCard } from '../../TabCard/MetricTabCard';
 import i18n from '../../i18n';
 import '../MetricsTabs.scss';
 const b = cn('tenant-metrics-tabs');
 export function MemoryTab({ to, active, memory }) {
-    return (_jsx("div", { className: b('link-container', { active }), children: _jsx(Link, { to: to, className: b('link'), children: _jsx(UsageTabCard, { text: i18n('context_memory-used'), value: memory.totalUsed, limit: memory.totalLimit, legendFormatter: formatStorageLegend, active: active, helpText: i18n('context_memory-description') }) }) }));
+    var _a;
+    return (_jsx("div", { className: b('link-container', { active }), children: _jsx(Link, { to: to, className: b('link'), children: _jsx(MetricTabCard, { title: i18n('title_memory'), status: memory.status, value: (_a = memory.percentText) !== null && _a !== void 0 ? _a : i18n('value_unavailable-percent'), active: active, description: i18n('context_memory-tab-description') }) }) }));
 }
 //# sourceMappingURL=MemoryTab.js.map

package/dist/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/MemoryTab.js.map

@@ -1 +1 @@
-{"version":3,"file":"MemoryTab.js","sourceRoot":"","sources":["../../../../../../../src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/MemoryTab.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,kBAAkB,CAAC;AAEtC,OAAO,EAAC,EAAE,EAAC,MAAM,4BAA4B,CAAC;AAC9C,OAAO,EAAC,mBAAmB,EAAC,MAAM,oDAAoD,CAAC;AACvF,OAAO,EAAC,YAAY,EAAC,MAAM,4BAA4B,CAAC;AACxD,OAAO,IAAI,MAAM,YAAY,CAAC;AAE9B,OAAO,qBAAqB,CAAC;AAE7B,MAAM,CAAC,GAAG,EAAE,CAAC,qBAAqB,CAAC,CAAC;AAQpC,MAAM,UAAU,SAAS,CAAC,EAAC,EAAE,EAAE,MAAM,EAAE,MAAM,EAAiB;IAC1D,OAAO,CACH,cAAK,SAAS,EAAE,CAAC,CAAC,gBAAgB,EAAE,EAAC,MAAM,EAAC,CAAC,YACzC,KAAC,IAAI,IAAC,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YAC9B,KAAC,YAAY,IACT,IAAI,EAAE,IAAI,CAAC,qBAAqB,CAAC,EACjC,KAAK,EAAE,MAAM,CAAC,SAAS,EACvB,KAAK,EAAE,MAAM,CAAC,UAAU,EACxB,eAAe,EAAE,mBAAmB,EACpC,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,IAAI,CAAC,4BAA4B,CAAC,GAC9C,GACC,GACL,CACT,CAAC;AACN,CAAC"}
+{"version":3,"file":"MemoryTab.js","sourceRoot":"","sources":["../../../../../../../src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/MemoryTab.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,kBAAkB,CAAC;AAEtC,OAAO,EAAC,EAAE,EAAC,MAAM,4BAA4B,CAAC;AAC9C,OAAO,EAAC,aAAa,EAAC,MAAM,6BAA6B,CAAC;AAC1D,OAAO,IAAI,MAAM,YAAY,CAAC;AAG9B,OAAO,qBAAqB,CAAC;AAE7B,MAAM,CAAC,GAAG,EAAE,CAAC,qBAAqB,CAAC,CAAC;AAQpC,MAAM,UAAU,SAAS,CAAC,EAAC,EAAE,EAAE,MAAM,EAAE,MAAM,EAAiB;;IAC1D,OAAO,CACH,cAAK,SAAS,EAAE,CAAC,CAAC,gBAAgB,EAAE,EAAC,MAAM,EAAC,CAAC,YACzC,KAAC,IAAI,IAAC,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YAC9B,KAAC,aAAa,IACV,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC,EAC3B,MAAM,EAAE,MAAM,CAAC,MAAM,EACrB,KAAK,EAAE,MAAA,MAAM,CAAC,WAAW,mCAAI,IAAI,CAAC,2BAA2B,CAAC,EAC9D,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,IAAI,CAAC,gCAAgC,CAAC,GACrD,GACC,GACL,CACT,CAAC;AACN,CAAC"}

package/dist/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/NetworkTab.d.ts

@@ -1,9 +1,9 @@
+import type { TenantOverviewMetric } from '../../metricOverview';
 import '../MetricsTabs.scss';
 interface NetworkTabProps {
     to: string;
     active: boolean;
-    networkUtilization: number;
-    networkThroughput: number;
+    network: TenantOverviewMetric;
 }
-export declare function NetworkTab({ to, active, networkUtilization, networkThroughput }: NetworkTabProps): import("react/jsx-runtime").JSX.Element;
+export declare function NetworkTab({ to, active, network }: NetworkTabProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/NetworkTab.js

@@ -1,14 +1,12 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Link } from 'react-router-dom';
 import { cn } from '../../../../../../utils/cn';
-import { formatNetworkMetric } from '../../../../../../utils/metrics/formatMetricLegend';
-import { UtilizationTabCard } from '../../TabCard/UtilizationTabCard';
+import { MetricTabCard } from '../../TabCard/MetricTabCard';
 import i18n from '../../i18n';
 import '../MetricsTabs.scss';
 const b = cn('tenant-metrics-tabs');
-export function NetworkTab({ to, active, networkUtilization, networkThroughput }) {
-    const fillPercent = networkUtilization * 100;
-    const legendText = formatNetworkMetric(networkThroughput);
-    return (_jsx("div", { className: b('link-container', { active }), children: _jsx(Link, { to: to, className: b('link'), children: _jsx(UtilizationTabCard, { text: i18n('context_network-usage'), fillPercent: fillPercent, legendText: legendText, active: active, helpText: i18n('context_network-description') }) }) }));
+export function NetworkTab({ to, active, network }) {
+    var _a;
+    return (_jsx("div", { className: b('link-container', { active }), children: _jsx(Link, { to: to, className: b('link'), children: _jsx(MetricTabCard, { title: i18n('title_network'), status: network.status, value: (_a = network.percentText) !== null && _a !== void 0 ? _a : i18n('value_unavailable-percent'), active: active, description: i18n('context_network-tab-description') }) }) }));
 }
 //# sourceMappingURL=NetworkTab.js.map

package/dist/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/NetworkTab.js.map

@@ -1 +1 @@
-{"version":3,"file":"NetworkTab.js","sourceRoot":"","sources":["../../../../../../../src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/NetworkTab.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,kBAAkB,CAAC;AAEtC,OAAO,EAAC,EAAE,EAAC,MAAM,4BAA4B,CAAC;AAC9C,OAAO,EAAC,mBAAmB,EAAC,MAAM,oDAAoD,CAAC;AACvF,OAAO,EAAC,kBAAkB,EAAC,MAAM,kCAAkC,CAAC;AACpE,OAAO,IAAI,MAAM,YAAY,CAAC;AAE9B,OAAO,qBAAqB,CAAC;AAE7B,MAAM,CAAC,GAAG,EAAE,CAAC,qBAAqB,CAAC,CAAC;AASpC,MAAM,UAAU,UAAU,CAAC,EAAC,EAAE,EAAE,MAAM,EAAE,kBAAkB,EAAE,iBAAiB,EAAkB;IAC3F,MAAM,WAAW,GAAG,kBAAkB,GAAG,GAAG,CAAC;IAC7C,MAAM,UAAU,GAAG,mBAAmB,CAAC,iBAAiB,CAAC,CAAC;IAE1D,OAAO,CACH,cAAK,SAAS,EAAE,CAAC,CAAC,gBAAgB,EAAE,EAAC,MAAM,EAAC,CAAC,YACzC,KAAC,IAAI,IAAC,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YAC9B,KAAC,kBAAkB,IACf,IAAI,EAAE,IAAI,CAAC,uBAAuB,CAAC,EACnC,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,IAAI,CAAC,6BAA6B,CAAC,GAC/C,GACC,GACL,CACT,CAAC;AACN,CAAC"}
+{"version":3,"file":"NetworkTab.js","sourceRoot":"","sources":["../../../../../../../src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/NetworkTab.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,kBAAkB,CAAC;AAEtC,OAAO,EAAC,EAAE,EAAC,MAAM,4BAA4B,CAAC;AAC9C,OAAO,EAAC,aAAa,EAAC,MAAM,6BAA6B,CAAC;AAC1D,OAAO,IAAI,MAAM,YAAY,CAAC;AAG9B,OAAO,qBAAqB,CAAC;AAE7B,MAAM,CAAC,GAAG,EAAE,CAAC,qBAAqB,CAAC,CAAC;AAQpC,MAAM,UAAU,UAAU,CAAC,EAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAkB;;IAC7D,OAAO,CACH,cAAK,SAAS,EAAE,CAAC,CAAC,gBAAgB,EAAE,EAAC,MAAM,EAAC,CAAC,YACzC,KAAC,IAAI,IAAC,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YAC9B,KAAC,aAAa,IACV,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,EAC5B,MAAM,EAAE,OAAO,CAAC,MAAM,EACtB,KAAK,EAAE,MAAA,OAAO,CAAC,WAAW,mCAAI,IAAI,CAAC,2BAA2B,CAAC,EAC/D,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,IAAI,CAAC,iCAAiC,CAAC,GACtD,GACC,GACL,CACT,CAAC;AACN,CAAC"}

package/dist/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/PlaceholderTab.js

@@ -1,10 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cn } from '../../../../../../utils/cn';
-import { UNBREAKABLE_GAP } from '../../../../../../utils/constants';
-import { ServerlessTabCard } from '../../TabCard/ServerlessTabCard';
 import '../MetricsTabs.scss';
 const b = cn('tenant-metrics-tabs');
 export function PlaceholderTab() {
-    return (_jsx("div", { className: b('link-container', { placeholder: true }), children: _jsx("div", { className: b('link'), children: _jsx(ServerlessTabCard, { text: UNBREAKABLE_GAP, active: false, helpText: undefined, subtitle: UNBREAKABLE_GAP }) }) }));
+    return (_jsx("div", { className: b('link-container', { placeholder: true }), children: _jsx("div", { className: b('link') }) }));
 }
 //# sourceMappingURL=PlaceholderTab.js.map

package/dist/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/PlaceholderTab.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlaceholderTab.js","sourceRoot":"","sources":["../../../../../../../src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/PlaceholderTab.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,EAAE,EAAC,MAAM,4BAA4B,CAAC;AAC9C,OAAO,EAAC,eAAe,EAAC,MAAM,mCAAmC,CAAC;AAClE,OAAO,EAAC,iBAAiB,EAAC,MAAM,iCAAiC,CAAC;AAElE,OAAO,qBAAqB,CAAC;AAE7B,MAAM,CAAC,GAAG,EAAE,CAAC,qBAAqB,CAAC,CAAC;AAEpC,MAAM,UAAU,cAAc;IAC1B,OAAO,CACH,cAAK,SAAS,EAAE,CAAC,CAAC,gBAAgB,EAAE,EAAC,WAAW,EAAE,IAAI,EAAC,CAAC,YACpD,cAAK,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YACrB,KAAC,iBAAiB,IACd,IAAI,EAAE,eAAe,EACrB,MAAM,EAAE,KAAK,EACb,QAAQ,EAAE,SAAS,EACnB,QAAQ,EAAE,eAAe,GAC3B,GACA,GACJ,CACT,CAAC;AACN,CAAC"}
+{"version":3,"file":"PlaceholderTab.js","sourceRoot":"","sources":["../../../../../../../src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/PlaceholderTab.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,EAAE,EAAC,MAAM,4BAA4B,CAAC;AAE9C,OAAO,qBAAqB,CAAC;AAE7B,MAAM,CAAC,GAAG,EAAE,CAAC,qBAAqB,CAAC,CAAC;AAEpC,MAAM,UAAU,cAAc;IAC1B,OAAO,CACH,cAAK,SAAS,EAAE,CAAC,CAAC,gBAAgB,EAAE,EAAC,WAAW,EAAE,IAAI,EAAC,CAAC,YACpD,cAAK,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,GAAI,GAC3B,CACT,CAAC;AACN,CAAC"}

package/dist/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/StorageTab.d.ts

@@ -1,13 +1,10 @@
+import type { TenantOverviewMetric } from '../../metricOverview';
 import '../MetricsTabs.scss';
 interface StorageTabProps {
     to: string;
     active: boolean;
     isServerless: boolean;
-    storage: {
-        totalUsed: number;
-        totalLimit: number;
-    };
-    storageGroupsCount?: number;
+    storage?: TenantOverviewMetric;
 }
-export declare function StorageTab({ to, active, isServerless, storage, storageGroupsCount, }: StorageTabProps): import("react/jsx-runtime").JSX.Element;
+export declare function StorageTab({ to, active, isServerless, storage }: StorageTabProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/StorageTab.js

@@ -1,30 +1,13 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Link } from 'react-router-dom';
 import { cn } from '../../../../../../utils/cn';
-import { formatStorageLegend } from '../../../../../../utils/metrics/formatMetricLegend';
+import { MetricTabCard } from '../../TabCard/MetricTabCard';
 import { ServerlessTabCard } from '../../TabCard/ServerlessTabCard';
-import { UsageTabCard } from '../../TabCard/UsageTabCard';
 import i18n from '../../i18n';
 import '../MetricsTabs.scss';
 const b = cn('tenant-metrics-tabs');
-export function StorageTab({ to, active, isServerless, storage, storageGroupsCount, }) {
-    const text = storageGroupsCount === undefined || isServerless
-        ? i18n('cards.storage-label')
-        : i18n('context_storage-groups', { count: storageGroupsCount });
-    return (_jsx("div", { className: b('link-container', { active }), children: _jsx(Link, { to: to, className: b('link'), children: isServerless ? (_jsx(ServerlessTabCard, { text: text, active: active, helpText: i18n('context_storage-description'), subtitle: storage.totalLimit
-                    ? i18n('context_serverless-storage-subtitle', {
-                        groups: String(storageGroupsCount !== null && storageGroupsCount !== void 0 ? storageGroupsCount : 0),
-                        legend: formatStorageLegend({
-                            value: storage.totalUsed,
-                            capacity: storage.totalLimit,
-                        }),
-                    })
-                    : undefined })) : (_jsx(UsageTabCard, { text: text, value: storage.totalUsed, limit: storage.totalLimit, legendFormatter: formatStorageLegend, active: active, helpText: i18n('context_storage-description'), 
-                // Never show the "danger" (red) status for the storage
-                // doughnut, regardless of usage. The doughnut stays
-                // "warning" (yellow) above the warning threshold and
-                // never turns red, even at high usage below 100%
-                // (e.g. 91-99%) or on overflow above 100%.
-                dangerThreshold: Infinity })) }) }));
+export function StorageTab({ to, active, isServerless, storage }) {
+    var _a;
+    return (_jsx("div", { className: b('link-container', { active }), children: _jsx(Link, { to: to, className: b('link'), children: isServerless || !storage ? (_jsx(ServerlessTabCard, { title: i18n('title_storage'), active: active, description: i18n('context_storage-serverless-tab-description'), helpText: i18n('context_storage-description') })) : (_jsx(MetricTabCard, { title: i18n('title_storage'), status: storage.status, value: (_a = storage.percentText) !== null && _a !== void 0 ? _a : i18n('value_unavailable-percent'), active: active, description: i18n('context_storage-tab-description') })) }) }));
 }
 //# sourceMappingURL=StorageTab.js.map

package/dist/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/StorageTab.js.map

@@ -1 +1 @@
-{"version":3,"file":"StorageTab.js","sourceRoot":"","sources":["../../../../../../../src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/StorageTab.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,kBAAkB,CAAC;AAEtC,OAAO,EAAC,EAAE,EAAC,MAAM,4BAA4B,CAAC;AAC9C,OAAO,EAAC,mBAAmB,EAAC,MAAM,oDAAoD,CAAC;AACvF,OAAO,EAAC,iBAAiB,EAAC,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAC,YAAY,EAAC,MAAM,4BAA4B,CAAC;AACxD,OAAO,IAAI,MAAM,YAAY,CAAC;AAE9B,OAAO,qBAAqB,CAAC;AAE7B,MAAM,CAAC,GAAG,EAAE,CAAC,qBAAqB,CAAC,CAAC;AAUpC,MAAM,UAAU,UAAU,CAAC,EACvB,EAAE,EACF,MAAM,EACN,YAAY,EACZ,OAAO,EACP,kBAAkB,GACJ;IACd,MAAM,IAAI,GACN,kBAAkB,KAAK,SAAS,IAAI,YAAY;QAC5C,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC;QAC7B,CAAC,CAAC,IAAI,CAAC,wBAAwB,EAAE,EAAC,KAAK,EAAE,kBAAkB,EAAC,CAAC,CAAC;IACtE,OAAO,CACH,cAAK,SAAS,EAAE,CAAC,CAAC,gBAAgB,EAAE,EAAC,MAAM,EAAC,CAAC,YACzC,KAAC,IAAI,IAAC,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YAC7B,YAAY,CAAC,CAAC,CAAC,CACZ,KAAC,iBAAiB,IACd,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,IAAI,CAAC,6BAA6B,CAAC,EAC7C,QAAQ,EACJ,OAAO,CAAC,UAAU;oBACd,CAAC,CAAC,IAAI,CAAC,qCAAqC,EAAE;wBACxC,MAAM,EAAE,MAAM,CAAC,kBAAkB,aAAlB,kBAAkB,cAAlB,kBAAkB,GAAI,CAAC,CAAC;wBACvC,MAAM,EAAE,mBAAmB,CAAC;4BACxB,KAAK,EAAE,OAAO,CAAC,SAAS;4BACxB,QAAQ,EAAE,OAAO,CAAC,UAAU;yBAC/B,CAAC;qBACL,CAAC;oBACJ,CAAC,CAAC,SAAS,GAErB,CACL,CAAC,CAAC,CAAC,CACA,KAAC,YAAY,IACT,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,OAAO,CAAC,SAAS,EACxB,KAAK,EAAE,OAAO,CAAC,UAAU,EACzB,eAAe,EAAE,mBAAmB,EACpC,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,IAAI,CAAC,6BAA6B,CAAC;gBAC7C,uDAAuD;gBACvD,oDAAoD;gBACpD,qDAAqD;gBACrD,iDAAiD;gBACjD,2CAA2C;gBAC3C,eAAe,EAAE,QAAQ,GAC3B,CACL,GACE,GACL,CACT,CAAC;AACN,CAAC"}
+{"version":3,"file":"StorageTab.js","sourceRoot":"","sources":["../../../../../../../src/containers/Tenant/Diagnostics/TenantOverview/MetricsTabs/components/StorageTab.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,kBAAkB,CAAC;AAEtC,OAAO,EAAC,EAAE,EAAC,MAAM,4BAA4B,CAAC;AAC9C,OAAO,EAAC,aAAa,EAAC,MAAM,6BAA6B,CAAC;AAC1D,OAAO,EAAC,iBAAiB,EAAC,MAAM,iCAAiC,CAAC;AAClE,OAAO,IAAI,MAAM,YAAY,CAAC;AAG9B,OAAO,qBAAqB,CAAC;AAE7B,MAAM,CAAC,GAAG,EAAE,CAAC,qBAAqB,CAAC,CAAC;AASpC,MAAM,UAAU,UAAU,CAAC,EAAC,EAAE,EAAE,MAAM,EAAE,YAAY,EAAE,OAAO,EAAkB;;IAC3E,OAAO,CACH,cAAK,SAAS,EAAE,CAAC,CAAC,gBAAgB,EAAE,EAAC,MAAM,EAAC,CAAC,YACzC,KAAC,IAAI,IAAC,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YAC7B,YAAY,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CACxB,KAAC,iBAAiB,IACd,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,EAC5B,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,IAAI,CAAC,4CAA4C,CAAC,EAC/D,QAAQ,EAAE,IAAI,CAAC,6BAA6B,CAAC,GAC/C,CACL,CAAC,CAAC,CAAC,CACA,KAAC,aAAa,IACV,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,EAC5B,MAAM,EAAE,OAAO,CAAC,MAAM,EACtB,KAAK,EAAE,MAAA,OAAO,CAAC,WAAW,mCAAI,IAAI,CAAC,2BAA2B,CAAC,EAC/D,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,IAAI,CAAC,iCAAiC,CAAC,GACtD,CACL,GACE,GACL,CACT,CAAC;AACN,CAAC"}

package/dist/containers/Tenant/Diagnostics/TenantOverview/TabCard/MetricTabCard.d.ts

@@ -0,0 +1,11 @@
+import type { EFlag } from '../../../../../types/api/enums';
+import './TabCard.scss';
+interface MetricTabCardProps {
+    title: string;
+    status: EFlag;
+    value: string;
+    description: string;
+    active?: boolean;
+}
+export declare function MetricTabCard({ title, status, value, description, active }: MetricTabCardProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/containers/Tenant/Diagnostics/TenantOverview/TabCard/MetricTabCard.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Card, Flex, Text } from '@gravity-ui/uikit';
+import { StatusIcon } from '../../../../../components/StatusIcon/StatusIcon';
+import { cn } from '../../../../../utils/cn';
+import './TabCard.scss';
+const b = cn('tenant-tab-card');
+export function MetricTabCard({ title, status, value, description, active }) {
+    return (_jsx(Card, { className: b({ active }), type: "container", view: active ? 'outlined' : 'filled', children: _jsxs(Flex, { direction: "column", gap: 0.5, children: [_jsxs(Flex, { alignItems: "center", gap: 1, children: [_jsx(Text, { variant: "subheader-2", "data-qa": "tenant-metric-tab-title", children: title }), _jsxs(Flex, { alignItems: "center", gap: 1, children: [_jsx(Text, { variant: "body-1", color: "secondary", "data-qa": "tenant-metric-tab-value", children: value }), _jsx(StatusIcon, { status: status, mode: "icons", size: "s" })] })] }), _jsx(Text, { variant: "caption-2", color: "secondary", className: b('description'), "data-qa": "tenant-metric-tab-description", children: description })] }) }));
+}
+//# sourceMappingURL=MetricTabCard.js.map

package/dist/containers/Tenant/Diagnostics/TenantOverview/TabCard/MetricTabCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MetricTabCard.js","sourceRoot":"","sources":["../../../../../../src/containers/Tenant/Diagnostics/TenantOverview/TabCard/MetricTabCard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,MAAM,mBAAmB,CAAC;AAEnD,OAAO,EAAC,UAAU,EAAC,MAAM,iDAAiD,CAAC;AAE3E,OAAO,EAAC,EAAE,EAAC,MAAM,yBAAyB,CAAC;AAE3C,OAAO,gBAAgB,CAAC;AAExB,MAAM,CAAC,GAAG,EAAE,CAAC,iBAAiB,CAAC,CAAC;AAUhC,MAAM,UAAU,aAAa,CAAC,EAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,EAAqB;IACzF,OAAO,CACH,KAAC,IAAI,IAAC,SAAS,EAAE,CAAC,CAAC,EAAC,MAAM,EAAC,CAAC,EAAE,IAAI,EAAC,WAAW,EAAC,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ,YAC/E,MAAC,IAAI,IAAC,SAAS,EAAC,QAAQ,EAAC,GAAG,EAAE,GAAG,aAC7B,MAAC,IAAI,IAAC,UAAU,EAAC,QAAQ,EAAC,GAAG,EAAE,CAAC,aAC5B,KAAC,IAAI,IAAC,OAAO,EAAC,aAAa,aAAS,yBAAyB,YACxD,KAAK,GACH,EACP,MAAC,IAAI,IAAC,UAAU,EAAC,QAAQ,EAAC,GAAG,EAAE,CAAC,aAC5B,KAAC,IAAI,IAAC,OAAO,EAAC,QAAQ,EAAC,KAAK,EAAC,WAAW,aAAS,yBAAyB,YACrE,KAAK,GACH,EACP,KAAC,UAAU,IAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,GAAG,GAAG,IACjD,IACJ,EACP,KAAC,IAAI,IACD,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,WAAW,EACjB,SAAS,EAAE,CAAC,CAAC,aAAa,CAAC,aACnB,+BAA+B,YAEtC,WAAW,GACT,IACJ,GACJ,CACV,CAAC;AACN,CAAC"}

package/dist/containers/Tenant/Diagnostics/TenantOverview/TabCard/ServerlessTabCard.d.ts

@@ -1,9 +1,9 @@
 import './TabCard.scss';
 interface ServerlessTabCardProps {
-    text: string;
+    title: string;
     active?: boolean;
+    description: string;
     helpText?: string;
-    subtitle?: string;
 }
-export declare function ServerlessTabCard({ text, active, helpText, subtitle }: ServerlessTabCardProps): import("react/jsx-runtime").JSX.Element;
+export declare function ServerlessTabCard({ title, active, description, helpText }: ServerlessTabCardProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/containers/Tenant/Diagnostics/TenantOverview/TabCard/ServerlessTabCard.js

@@ -1,10 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Card } from '@gravity-ui/uikit';
-import { DoughnutMetrics } from '../../../../../components/DoughnutMetrics/DoughnutMetrics';
+import { Card, Flex, HelpMark, Text } from '@gravity-ui/uikit';
 import { cn } from '../../../../../utils/cn';
 import './TabCard.scss';
 const b = cn('tenant-tab-card');
-export function ServerlessTabCard({ text, active, helpText, subtitle }) {
-    return (_jsx("div", { className: b({ active }), children: _jsx(Card, { className: b('card-container', { active }), type: "container", view: active ? 'outlined' : 'raised', children: _jsxs("div", { className: b('legend-wrapper'), children: [_jsx(DoughnutMetrics.Legend, { variant: "subheader-2", note: helpText, noteIconSize: "s", children: text }), subtitle ? (_jsx(DoughnutMetrics.Legend, { variant: "body-1", color: "secondary", children: subtitle })) : null] }) }) }));
+export function ServerlessTabCard({ title, active, description, helpText }) {
+    return (_jsx(Card, { className: b({ active }), type: "container", view: active ? 'outlined' : 'filled', children: _jsxs(Flex, { direction: "column", gap: 0.5, children: [_jsxs(Flex, { alignItems: "center", gap: 1, children: [_jsx(Text, { variant: "subheader-2", "data-qa": "tenant-metric-tab-title", children: title }), helpText ? (_jsx(HelpMark, { iconSize: "s", popoverProps: { placement: 'right' }, children: helpText })) : null] }), _jsx(Text, { variant: "caption-2", color: "secondary", className: b('description'), "data-qa": "tenant-metric-tab-description", children: description })] }) }));
 }
 //# sourceMappingURL=ServerlessTabCard.js.map

package/dist/containers/Tenant/Diagnostics/TenantOverview/TabCard/ServerlessTabCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"ServerlessTabCard.js","sourceRoot":"","sources":["../../../../../../src/containers/Tenant/Diagnostics/TenantOverview/TabCard/ServerlessTabCard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EAAC,eAAe,EAAC,MAAM,2DAA2D,CAAC;AAC1F,OAAO,EAAC,EAAE,EAAC,MAAM,yBAAyB,CAAC;AAE3C,OAAO,gBAAgB,CAAC;AAExB,MAAM,CAAC,GAAG,EAAE,CAAC,iBAAiB,CAAC,CAAC;AAShC,MAAM,UAAU,iBAAiB,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAyB;IACxF,OAAO,CACH,cAAK,SAAS,EAAE,CAAC,CAAC,EAAC,MAAM,EAAC,CAAC,YACvB,KAAC,IAAI,IACD,SAAS,EAAE,CAAC,CAAC,gBAAgB,EAAE,EAAC,MAAM,EAAC,CAAC,EACxC,IAAI,EAAC,WAAW,EAChB,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ,YAEpC,eAAK,SAAS,EAAE,CAAC,CAAC,gBAAgB,CAAC,aAC/B,KAAC,eAAe,CAAC,MAAM,IAAC,OAAO,EAAC,aAAa,EAAC,IAAI,EAAE,QAAQ,EAAE,YAAY,EAAC,GAAG,YACzE,IAAI,GACgB,EACxB,QAAQ,CAAC,CAAC,CAAC,CACR,KAAC,eAAe,CAAC,MAAM,IAAC,OAAO,EAAC,QAAQ,EAAC,KAAK,EAAC,WAAW,YACrD,QAAQ,GACY,CAC5B,CAAC,CAAC,CAAC,IAAI,IACN,GACH,GACL,CACT,CAAC;AACN,CAAC"}
+{"version":3,"file":"ServerlessTabCard.js","sourceRoot":"","sources":["../../../../../../src/containers/Tenant/Diagnostics/TenantOverview/TabCard/ServerlessTabCard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAC,MAAM,mBAAmB,CAAC;AAE7D,OAAO,EAAC,EAAE,EAAC,MAAM,yBAAyB,CAAC;AAE3C,OAAO,gBAAgB,CAAC;AAExB,MAAM,CAAC,GAAG,EAAE,CAAC,iBAAiB,CAAC,CAAC;AAShC,MAAM,UAAU,iBAAiB,CAAC,EAAC,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,QAAQ,EAAyB;IAC5F,OAAO,CACH,KAAC,IAAI,IAAC,SAAS,EAAE,CAAC,CAAC,EAAC,MAAM,EAAC,CAAC,EAAE,IAAI,EAAC,WAAW,EAAC,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ,YAC/E,MAAC,IAAI,IAAC,SAAS,EAAC,QAAQ,EAAC,GAAG,EAAE,GAAG,aAC7B,MAAC,IAAI,IAAC,UAAU,EAAC,QAAQ,EAAC,GAAG,EAAE,CAAC,aAC5B,KAAC,IAAI,IAAC,OAAO,EAAC,aAAa,aAAS,yBAAyB,YACxD,KAAK,GACH,EACN,QAAQ,CAAC,CAAC,CAAC,CACR,KAAC,QAAQ,IAAC,QAAQ,EAAC,GAAG,EAAC,YAAY,EAAE,EAAC,SAAS,EAAE,OAAO,EAAC,YACpD,QAAQ,GACF,CACd,CAAC,CAAC,CAAC,IAAI,IACL,EACP,KAAC,IAAI,IACD,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,WAAW,EACjB,SAAS,EAAE,CAAC,CAAC,aAAa,CAAC,aACnB,+BAA+B,YAEtC,WAAW,GACT,IACJ,GACJ,CACV,CAAC;AACN,CAAC"}

package/dist/containers/Tenant/Diagnostics/TenantOverview/TabCard/TabCard.scss

@@ -1,27 +1,35 @@
 .tenant-tab-card {
+    padding: var(--g-spacing-4) var(--g-spacing-5);
+
+    cursor: pointer;
+
     border-radius: var(--g-border-radius-s);
 
-    &__card-container {
-        padding: var(--g-spacing-4);
+    &_active {
+        border: none;
+        border-color: transparent;
+    }
 
-        cursor: pointer;
+    &:not(&_active) {
+        width: var(--metric-tab-card-width, 225px);
+        height: var(--metric-tab-card-height, 70px);
 
-        border: 0;
-        border-radius: var(--g-border-radius-s);
+        border: var(--tab-border-width) solid transparent;
+        background-color: var(--g-color-base-generic);
 
-        // Smooth hover transition
-        transition: background-color 0.15s ease;
+        transition:
+            border-color 0.15s ease,
+            background-color 0.15s ease;
 
         &:hover {
-            background-color: var(--g-color-base-float-hover);
+            border-color: var(--g-color-line-generic-hover);
+            background-color: var(--g-color-base-generic-hover);
         }
     }
 
-    &__card-container_active {
-        cursor: default !important;
+    &_active {
+        padding-bottom: calc(var(--g-spacing-4) + var(--tab-overlap));
 
-        &:hover {
-            background-color: transparent;
-        }
+        cursor: default !important;
     }
 }

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

@@ -1,8 +1,10 @@
 import type { ETenantType } from '../../../../../types/api/tenant';
+import type { TenantOverviewUsageMetric } from '../metricOverview';
 interface TenantCpuProps {
     database: string;
     databaseFullPath: string;
     databaseType?: ETenantType;
+    metric?: TenantOverviewUsageMetric;
 }
-export declare function TenantCpu({ database, databaseType, databaseFullPath }: TenantCpuProps): import("react/jsx-runtime").JSX.Element;
+export declare function TenantCpu({ database, databaseType, databaseFullPath, metric }: TenantCpuProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -3,8 +3,10 @@ import React from 'react';
 import { Flex } from '@gravity-ui/uikit';
 import { setTopQueriesFilters } from '../../../../../store/reducers/executeTopQueries/executeTopQueries';
 import { TENANT_DIAGNOSTICS_TABS_IDS } from '../../../../../store/reducers/tenant/constants';
+import { EMPTY_DATA_PLACEHOLDER } from '../../../../../utils/constants';
 import { useTypedDispatch } from '../../../../../utils/hooks';
 import { useDiagnosticsPageLinkGetter } from '../../../Diagnostics/DiagnosticsPages';
+import { MetricPageSummary } from '../MetricPageSummary/MetricPageSummary';
 import { StatsWrapper } from '../StatsWrapper/StatsWrapper';
 import { TenantDashboard } from '../TenantDashboard/TenantDashboard';
 import i18n from '../i18n';
@@ -13,13 +15,14 @@ import { TopNodesByLoad } from './TopNodesByLoad';
 import { TopQueries } from './TopQueries';
 import { TopShards } from './TopShards';
 import { cpuDashboardConfig } from './cpuDashboardConfig';
-export function TenantCpu({ database, databaseType, databaseFullPath }) {
+export function TenantCpu({ database, databaseType, databaseFullPath, metric }) {
+    var _a;
     const dispatch = useTypedDispatch();
     const getDiagnosticsPageLink = useDiagnosticsPageLinkGetter();
     const allNodesLink = getDiagnosticsPageLink(TENANT_DIAGNOSTICS_TABS_IDS.nodes);
     const topShardsLink = getDiagnosticsPageLink(TENANT_DIAGNOSTICS_TABS_IDS.topShards);
     const topQueriesLink = getDiagnosticsPageLink(TENANT_DIAGNOSTICS_TABS_IDS.topQueries);
     const isServerless = databaseType === 'Serverless';
-    return (_jsxs(Flex, { direction: "column", gap: 4, children: [!isServerless && (_jsxs(React.Fragment, { children: [_jsx(TenantDashboard, { database: database, charts: cpuDashboardConfig }), _jsx(StatsWrapper, { allEntitiesLink: allNodesLink, title: i18n('title_top-nodes-load'), children: _jsx(TopNodesByLoad, { database: database }) }), _jsx(StatsWrapper, { title: i18n('title_top-nodes-pool'), allEntitiesLink: allNodesLink, children: _jsx(TopNodesByCpu, { database: database }) })] })), _jsx(StatsWrapper, { title: i18n('title_top-shards'), allEntitiesLink: topShardsLink, children: _jsx(TopShards, { database: database, databaseFullPath: databaseFullPath }) }), _jsx(StatsWrapper, { title: i18n('title_top-queries'), allEntitiesLink: topQueriesLink, onAllEntitiesClick: () => dispatch(setTopQueriesFilters({ from: undefined, to: undefined })), children: _jsx(TopQueries, { database: database }) })] }));
+    return (_jsxs(Flex, { direction: "column", gap: 4, children: [metric ? (_jsx(MetricPageSummary, { dataQa: "tenant-page-metric-summary-cpu", description: i18n('context_cpu-description'), percentText: (_a = metric.percentText) !== null && _a !== void 0 ? _a : EMPTY_DATA_PLACEHOLDER, progressTheme: metric.progressTheme, progressValue: metric.progressValue, legend: metric.legend })) : null, !isServerless && (_jsxs(React.Fragment, { children: [_jsx(TenantDashboard, { database: database, charts: cpuDashboardConfig }), _jsx(StatsWrapper, { allEntitiesLink: allNodesLink, title: i18n('title_top-nodes-load'), children: _jsx(TopNodesByLoad, { database: database }) }), _jsx(StatsWrapper, { title: i18n('title_top-nodes-pool'), allEntitiesLink: allNodesLink, children: _jsx(TopNodesByCpu, { database: database }) })] })), _jsx(StatsWrapper, { title: i18n('title_top-shards'), allEntitiesLink: topShardsLink, children: _jsx(TopShards, { database: database, databaseFullPath: databaseFullPath }) }), _jsx(StatsWrapper, { title: i18n('title_top-queries'), allEntitiesLink: topQueriesLink, onAllEntitiesClick: () => dispatch(setTopQueriesFilters({ from: undefined, to: undefined })), children: _jsx(TopQueries, { database: database }) })] }));
 }
 //# sourceMappingURL=TenantCpu.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TenantCpu.js","sourceRoot":"","sources":["../../../../../../src/containers/Tenant/Diagnostics/TenantOverview/TenantCpu/TenantCpu.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,IAAI,EAAC,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EAAC,oBAAoB,EAAC,MAAM,mEAAmE,CAAC;AACvG,OAAO,EAAC,2BAA2B,EAAC,MAAM,gDAAgD,CAAC;AAE3F,OAAO,EAAC,gBAAgB,EAAC,MAAM,4BAA4B,CAAC;AAC5D,OAAO,EAAC,4BAA4B,EAAC,MAAM,uCAAuC,CAAC;AACnF,OAAO,EAAC,YAAY,EAAC,MAAM,8BAA8B,CAAC;AAC1D,OAAO,EAAC,eAAe,EAAC,MAAM,oCAAoC,CAAC;AACnE,OAAO,IAAI,MAAM,SAAS,CAAC;AAE3B,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAC,cAAc,EAAC,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAC,UAAU,EAAC,MAAM,cAAc,CAAC;AACxC,OAAO,EAAC,SAAS,EAAC,MAAM,aAAa,CAAC;AACtC,OAAO,EAAC,kBAAkB,EAAC,MAAM,sBAAsB,CAAC;AAQxD,MAAM,UAAU,SAAS,CAAC,EAAC,QAAQ,EAAE,YAAY,EAAE,gBAAgB,EAAiB;IAChF,MAAM,QAAQ,GAAG,gBAAgB,EAAE,CAAC;IACpC,MAAM,sBAAsB,GAAG,4BAA4B,EAAE,CAAC;IAE9D,MAAM,YAAY,GAAG,sBAAsB,CAAC,2BAA2B,CAAC,KAAK,CAAC,CAAC;IAC/E,MAAM,aAAa,GAAG,sBAAsB,CAAC,2BAA2B,CAAC,SAAS,CAAC,CAAC;IACpF,MAAM,cAAc,GAAG,sBAAsB,CAAC,2BAA2B,CAAC,UAAU,CAAC,CAAC;IAEtF,MAAM,YAAY,GAAG,YAAY,KAAK,YAAY,CAAC;IAEnD,OAAO,CACH,MAAC,IAAI,IAAC,SAAS,EAAC,QAAQ,EAAC,GAAG,EAAE,CAAC,aAC1B,CAAC,YAAY,IAAI,CACd,MAAC,KAAK,CAAC,QAAQ,eACX,KAAC,eAAe,IAAC,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,kBAAkB,GAAI,EACnE,KAAC,YAAY,IACT,eAAe,EAAE,YAAY,EAC7B,KAAK,EAAE,IAAI,CAAC,sBAAsB,CAAC,YAEnC,KAAC,cAAc,IAAC,QAAQ,EAAE,QAAQ,GAAI,GAC3B,EACf,KAAC,YAAY,IACT,KAAK,EAAE,IAAI,CAAC,sBAAsB,CAAC,EACnC,eAAe,EAAE,YAAY,YAE7B,KAAC,aAAa,IAAC,QAAQ,EAAE,QAAQ,GAAI,GAC1B,IACF,CACpB,EACD,KAAC,YAAY,IAAC,KAAK,EAAE,IAAI,CAAC,kBAAkB,CAAC,EAAE,eAAe,EAAE,aAAa,YACzE,KAAC,SAAS,IAAC,QAAQ,EAAE,QAAQ,EAAE,gBAAgB,EAAE,gBAAgB,GAAI,GAC1D,EACf,KAAC,YAAY,IACT,KAAK,EAAE,IAAI,CAAC,mBAAmB,CAAC,EAChC,eAAe,EAAE,cAAc,EAC/B,kBAAkB,EAAE,GAAG,EAAE,CACrB,QAAQ,CAAC,oBAAoB,CAAC,EAAC,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE,SAAS,EAAC,CAAC,CAAC,YAGpE,KAAC,UAAU,IAAC,QAAQ,EAAE,QAAQ,GAAI,GACvB,IACZ,CACV,CAAC;AACN,CAAC"}
+{"version":3,"file":"TenantCpu.js","sourceRoot":"","sources":["../../../../../../src/containers/Tenant/Diagnostics/TenantOverview/TenantCpu/TenantCpu.tsx"],"names":[],"mappings":"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"}

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

@@ -1,10 +1,12 @@
 import type { TMemoryStats } from '../../../../../types/api/nodes';
+import type { TenantOverviewUsageMetric } from '../metricOverview';
 import './TenantMemory.scss';
 interface TenantMemoryProps {
     database: string;
     memoryStats?: TMemoryStats;
     memoryUsed?: string;
     memoryLimit?: string;
+    metric?: TenantOverviewUsageMetric;
 }
-export declare function TenantMemory({ database, memoryStats, memoryUsed, memoryLimit }: TenantMemoryProps): import("react/jsx-runtime").JSX.Element;
+export declare function TenantMemory({ database, memoryStats, memoryUsed, memoryLimit, metric, }: TenantMemoryProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -3,8 +3,10 @@ import { InfoViewer } from '../../../../../components/InfoViewer/InfoViewer';
 import { ProgressWrapper } from '../../../../../components/ProgressWrapper';
 import { TENANT_DIAGNOSTICS_TABS_IDS } from '../../../../../store/reducers/tenant/constants';
 import { cn } from '../../../../../utils/cn';
+import { EMPTY_DATA_PLACEHOLDER } from '../../../../../utils/constants';
 import { formatStorageValuesToGb } from '../../../../../utils/dataFormatters/dataFormatters';
 import { useDiagnosticsPageLinkGetter } from '../../DiagnosticsPages';
+import { MetricPageSummary } from '../MetricPageSummary/MetricPageSummary';
 import { StatsWrapper } from '../StatsWrapper/StatsWrapper';
 import { TenantDashboard } from '../TenantDashboard/TenantDashboard';
 import i18n from '../i18n';
@@ -13,7 +15,8 @@ import { TopNodesByMemory } from './TopNodesByMemory';
 import { memoryDashboardConfig } from './memoryDashboardConfig';
 import './TenantMemory.scss';
 const b = cn('tenant-memory');
-export function TenantMemory({ database, memoryStats, memoryUsed, memoryLimit }) {
+export function TenantMemory({ database, memoryStats, memoryUsed, memoryLimit, metric, }) {
+    var _a;
     const getDiagnosticsPageLink = useDiagnosticsPageLinkGetter();
     const renderMemoryDetails = () => {
         if (memoryStats) {
@@ -27,6 +30,6 @@ export function TenantMemory({ database, memoryStats, memoryUsed, memoryLimit })
                 },
             ] }));
     };
-    return (_jsxs("div", { className: b(), children: [_jsx(TenantDashboard, { database: database, charts: memoryDashboardConfig }), renderMemoryDetails(), _jsx(StatsWrapper, { title: i18n('title_top-nodes-by-memory'), allEntitiesLink: getDiagnosticsPageLink(TENANT_DIAGNOSTICS_TABS_IDS.nodes), children: _jsx(TopNodesByMemory, { database: database }) })] }));
+    return (_jsxs("div", { className: b(), children: [metric ? (_jsx(MetricPageSummary, { className: b('metric-summary'), dataQa: "tenant-page-metric-summary-memory", description: i18n('context_memory-description'), percentText: (_a = metric.percentText) !== null && _a !== void 0 ? _a : EMPTY_DATA_PLACEHOLDER, progressTheme: metric.progressTheme, progressValue: metric.progressValue, legend: metric.legend })) : null, _jsx(TenantDashboard, { database: database, charts: memoryDashboardConfig }), renderMemoryDetails(), _jsx(StatsWrapper, { title: i18n('title_top-nodes-by-memory'), allEntitiesLink: getDiagnosticsPageLink(TENANT_DIAGNOSTICS_TABS_IDS.nodes), children: _jsx(TopNodesByMemory, { database: database }) })] }));
 }
 //# sourceMappingURL=TenantMemory.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TenantMemory.js","sourceRoot":"","sources":["../../../../../../src/containers/Tenant/Diagnostics/TenantOverview/TenantMemory/TenantMemory.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,UAAU,EAAC,MAAM,iDAAiD,CAAC;AAC3E,OAAO,EAAC,eAAe,EAAC,MAAM,2CAA2C,CAAC;AAC1E,OAAO,EAAC,2BAA2B,EAAC,MAAM,gDAAgD,CAAC;AAE3F,OAAO,EAAC,EAAE,EAAC,MAAM,yBAAyB,CAAC;AAC3C,OAAO,EAAC,uBAAuB,EAAC,MAAM,oDAAoD,CAAC;AAC3F,OAAO,EAAC,4BAA4B,EAAC,MAAM,wBAAwB,CAAC;AACpE,OAAO,EAAC,YAAY,EAAC,MAAM,8BAA8B,CAAC;AAC1D,OAAO,EAAC,eAAe,EAAC,MAAM,oCAAoC,CAAC;AACnE,OAAO,IAAI,MAAM,SAAS,CAAC;AAE3B,OAAO,EAAC,oBAAoB,EAAC,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAC,qBAAqB,EAAC,MAAM,yBAAyB,CAAC;AAE9D,OAAO,qBAAqB,CAAC;AAS7B,MAAM,CAAC,GAAG,EAAE,CAAC,eAAe,CAAC,CAAC;AAE9B,MAAM,UAAU,YAAY,CAAC,EAAC,QAAQ,EAAE,WAAW,EAAE,UAAU,EAAE,WAAW,EAAoB;IAC5F,MAAM,sBAAsB,GAAG,4BAA4B,EAAE,CAAC;IAC9D,MAAM,mBAAmB,GAAG,GAAG,EAAE;QAC7B,IAAI,WAAW,EAAE,CAAC;YACd,OAAO,KAAC,oBAAoB,IAAC,WAAW,EAAE,WAAW,GAAI,CAAC;QAC9D,CAAC;QAED,uBAAuB;QACvB,OAAO,CACH,KAAC,UAAU,IACP,OAAO,EAAC,OAAO,EACf,KAAK,EAAE,IAAI,CAAC,sBAAsB,CAAC,EACnC,IAAI,EAAE;gBACF;oBACI,KAAK,EAAE,IAAI,CAAC,oBAAoB,CAAC;oBACjC,KAAK,EAAE,CACH,KAAC,eAAe,IACZ,KAAK,EAAE,UAAU,EACjB,QAAQ,EAAE,WAAW,EACrB,YAAY,EAAE,uBAAuB,EACrC,iBAAiB,QACjB,SAAS,EAAE,CAAC,CAAC,2BAA2B,CAAC,EACzC,IAAI,EAAC,GAAG,EACR,KAAK,EAAE,GAAG,GACZ,CACL;iBACJ;aACJ,GACH,CACL,CAAC;IACN,CAAC,CAAC;IAEF,OAAO,CACH,eAAK,SAAS,EAAE,CAAC,EAAE,aACf,KAAC,eAAe,IAAC,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,qBAAqB,GAAI,EACrE,mBAAmB,EAAE,EAEtB,KAAC,YAAY,IACT,KAAK,EAAE,IAAI,CAAC,2BAA2B,CAAC,EACxC,eAAe,EAAE,sBAAsB,CAAC,2BAA2B,CAAC,KAAK,CAAC,YAE1E,KAAC,gBAAgB,IAAC,QAAQ,EAAE,QAAQ,GAAI,GAC7B,IACb,CACT,CAAC;AACN,CAAC"}
+{"version":3,"file":"TenantMemory.js","sourceRoot":"","sources":["../../../../../../src/containers/Tenant/Diagnostics/TenantOverview/TenantMemory/TenantMemory.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,UAAU,EAAC,MAAM,iDAAiD,CAAC;AAC3E,OAAO,EAAC,eAAe,EAAC,MAAM,2CAA2C,CAAC;AAC1E,OAAO,EAAC,2BAA2B,EAAC,MAAM,gDAAgD,CAAC;AAE3F,OAAO,EAAC,EAAE,EAAC,MAAM,yBAAyB,CAAC;AAC3C,OAAO,EAAC,sBAAsB,EAAC,MAAM,gCAAgC,CAAC;AACtE,OAAO,EAAC,uBAAuB,EAAC,MAAM,oDAAoD,CAAC;AAC3F,OAAO,EAAC,4BAA4B,EAAC,MAAM,wBAAwB,CAAC;AACpE,OAAO,EAAC,iBAAiB,EAAC,MAAM,wCAAwC,CAAC;AACzE,OAAO,EAAC,YAAY,EAAC,MAAM,8BAA8B,CAAC;AAC1D,OAAO,EAAC,eAAe,EAAC,MAAM,oCAAoC,CAAC;AACnE,OAAO,IAAI,MAAM,SAAS,CAAC;AAG3B,OAAO,EAAC,oBAAoB,EAAC,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAC,qBAAqB,EAAC,MAAM,yBAAyB,CAAC;AAE9D,OAAO,qBAAqB,CAAC;AAU7B,MAAM,CAAC,GAAG,EAAE,CAAC,eAAe,CAAC,CAAC;AAE9B,MAAM,UAAU,YAAY,CAAC,EACzB,QAAQ,EACR,WAAW,EACX,UAAU,EACV,WAAW,EACX,MAAM,GACU;;IAChB,MAAM,sBAAsB,GAAG,4BAA4B,EAAE,CAAC;IAC9D,MAAM,mBAAmB,GAAG,GAAG,EAAE;QAC7B,IAAI,WAAW,EAAE,CAAC;YACd,OAAO,KAAC,oBAAoB,IAAC,WAAW,EAAE,WAAW,GAAI,CAAC;QAC9D,CAAC;QAED,uBAAuB;QACvB,OAAO,CACH,KAAC,UAAU,IACP,OAAO,EAAC,OAAO,EACf,KAAK,EAAE,IAAI,CAAC,sBAAsB,CAAC,EACnC,IAAI,EAAE;gBACF;oBACI,KAAK,EAAE,IAAI,CAAC,oBAAoB,CAAC;oBACjC,KAAK,EAAE,CACH,KAAC,eAAe,IACZ,KAAK,EAAE,UAAU,EACjB,QAAQ,EAAE,WAAW,EACrB,YAAY,EAAE,uBAAuB,EACrC,iBAAiB,QACjB,SAAS,EAAE,CAAC,CAAC,2BAA2B,CAAC,EACzC,IAAI,EAAC,GAAG,EACR,KAAK,EAAE,GAAG,GACZ,CACL;iBACJ;aACJ,GACH,CACL,CAAC;IACN,CAAC,CAAC;IAEF,OAAO,CACH,eAAK,SAAS,EAAE,CAAC,EAAE,aACd,MAAM,CAAC,CAAC,CAAC,CACN,KAAC,iBAAiB,IACd,SAAS,EAAE,CAAC,CAAC,gBAAgB,CAAC,EAC9B,MAAM,EAAC,mCAAmC,EAC1C,WAAW,EAAE,IAAI,CAAC,4BAA4B,CAAC,EAC/C,WAAW,EAAE,MAAA,MAAM,CAAC,WAAW,mCAAI,sBAAsB,EACzD,aAAa,EAAE,MAAM,CAAC,aAAa,EACnC,aAAa,EAAE,MAAM,CAAC,aAAa,EACnC,MAAM,EAAE,MAAM,CAAC,MAAM,GACvB,CACL,CAAC,CAAC,CAAC,IAAI,EACR,KAAC,eAAe,IAAC,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,qBAAqB,GAAI,EACrE,mBAAmB,EAAE,EAEtB,KAAC,YAAY,IACT,KAAK,EAAE,IAAI,CAAC,2BAA2B,CAAC,EACxC,eAAe,EAAE,sBAAsB,CAAC,2BAA2B,CAAC,KAAK,CAAC,YAE1E,KAAC,gBAAgB,IAAC,QAAQ,EAAE,QAAQ,GAAI,GAC7B,IACb,CACT,CAAC;AACN,CAAC"}

package/dist/containers/Tenant/Diagnostics/TenantOverview/TenantMemory/TenantMemory.scss

@@ -1,6 +1,10 @@
 @use '../../../../../styles/mixins.scss';
 
 .tenant-memory {
+    &__metric-summary {
+        margin-bottom: var(--g-spacing-4);
+    }
+
     &__value-text {
         flex-shrink: 0;
 

package/dist/containers/Tenant/Diagnostics/TenantOverview/TenantNetwork/TenantNetwork.d.ts

@@ -1,6 +1,9 @@
+import type { TenantOverviewMetric } from '../metricOverview';
 import './TenantNetwork.scss';
 interface TenantNetworkProps {
     database: string;
+    metric?: TenantOverviewMetric;
+    networkThroughput?: number;
 }
-export declare function TenantNetwork({ database }: TenantNetworkProps): import("react/jsx-runtime").JSX.Element;
+export declare function TenantNetwork({ database, metric, networkThroughput }: TenantNetworkProps): import("react/jsx-runtime").JSX.Element;
 export {};