fix: selfreview

Author: astandrik

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

@@ -50,7 +50,7 @@ export function MemoryDetailsSection({memoryStats}: MemoryDetailsSectionProps) {
                     {i18n('text_memory-details')}
                 </Text>
             </div>
-            <Flex direction="column" alignItems="flex-start" gap="4">
+            <Flex direction="column" alignItems="flex-start" gap="4" width="100%">
                 <div className={b('main-progress')}>
                     <ProgressWrapper
                         stack={memorySegments}

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

@@ -4,8 +4,9 @@ import {DefinitionList, Flex, Progress, Text} from '@gravity-ui/uikit';
 
 import type {MemorySegment} from '../../../../../components/MemoryViewer/utils';
 import {getMemorySegmentColor} from '../../../../../components/MemoryViewer/utils';
+import i18n from '../../../../../components/ProgressWrapper/i18n';
 import {cn} from '../../../../../utils/cn';
-import {formatSegmentValue} from '../../../../../utils/progress';
+import {formatStorageValuesToGb} from '../../../../../utils/dataFormatters/dataFormatters';
 
 const b = cn('memory-details');
 
@@ -19,7 +20,13 @@ export function MemorySegmentItem({segment}: MemorySegmentItemProps) {
     }, [segment.key]);
 
     const valueText = React.useMemo(() => {
-        return formatSegmentValue(segment.value, segment.capacity);
+        const [valueFormatted, capacityFormatted] = formatStorageValuesToGb(
+            segment.value,
+            segment.capacity,
+        );
+        return segment.capacity
+            ? i18n('context_capacity-usage', {value: valueFormatted, capacity: capacityFormatted})
+            : valueFormatted;
     }, [segment.value, segment.capacity]);
 
     const progressValue = React.useMemo(() => {

src/utils/progress.ts

@@ -1,4 +1,3 @@
-import {formatBytes} from './bytesParsers';
 import {DEFAULT_DANGER_THRESHOLD, DEFAULT_WARNING_THRESHOLD} from './constants';
 import {formatNumber, roundToPrecision} from './dataFormatters/dataFormatters';
 
@@ -17,31 +16,6 @@ export const defaultFormatProgressValues: FormatProgressViewerValues = (value, t
     return [formatValue(value), formatValue(total)];
 };
 
-export function formatSegmentValue(value: number, capacity?: number): string {
-    if (capacity) {
-        const usedValue = formatBytes({
-            value,
-            size: 'tb',
-            withSizeLabel: false,
-            precision: 2,
-        });
-        const totalValue = formatBytes({
-            value: capacity,
-            size: 'tb',
-            withSizeLabel: true,
-            precision: 0,
-        });
-        return `${usedValue} of ${totalValue}`;
-    }
-
-    return formatBytes({
-        value,
-        size: 'gb',
-        withSizeLabel: true,
-        precision: 1,
-    });
-}
-
 interface CalculateProgressStatusProps {
     inverseColorize?: boolean;
     dangerThreshold?: number;