fix: review fixes

Author: astandrik

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

@@ -39,6 +39,23 @@ export function MemoryDetailsSection({memoryStats}: MemoryDetailsSectionProps) {
         return memorySegments.filter((segment) => !segment.isInfo && segment.value > 0);
     }, [memorySegments]);
 
+    const formatValues = React.useCallback((value?: number, total?: number): [string, string] => {
+        return [
+            formatBytes({
+                value: value || 0,
+                size: 'gb',
+                withSizeLabel: false,
+                precision: 2,
+            }),
+            formatBytes({
+                value: total || 0,
+                size: 'gb',
+                withSizeLabel: true,
+                precision: 1,
+            }),
+        ];
+    }, []);
+
     return (
         <div className={b()}>
             <div className={b('header')}>
@@ -51,20 +68,7 @@ export function MemoryDetailsSection({memoryStats}: MemoryDetailsSectionProps) {
                     <ProgressWrapper
                         stack={memorySegments}
                         totalCapacity={memoryStats.HardLimit}
-                        formatValues={(value?: number, total?: number): [string, string] => [
-                            formatBytes({
-                                value: value || 0,
-                                size: 'gb',
-                                withSizeLabel: false,
-                                precision: 2,
-                            }),
-                            formatBytes({
-                                value: total || 0,
-                                size: 'gb',
-                                withSizeLabel: true,
-                                precision: 1,
-                            }),
-                        ]}
+                        formatValues={formatValues}
                         className={b('main-progress-bar')}
                         size="m"
                         width="full"

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

@@ -48,8 +48,12 @@ export function TenantMemory({
                                 />
                                 {memoryUsed && memoryLimit && (
                                     <div className={b('value-text')}>
-                                        {formatStorageValuesToGb(Number(memoryUsed))[0]} of{' '}
-                                        {formatStorageValuesToGb(Number(memoryLimit))[0]}
+                                        {i18n('context_capacity-usage', {
+                                            value: formatStorageValuesToGb(Number(memoryUsed))[0],
+                                            capacity: formatStorageValuesToGb(
+                                                Number(memoryLimit),
+                                            )[0],
+                                        })}
                                     </div>
                                 )}
                             </div>

src/containers/Tenant/Diagnostics/TenantOverview/i18n/en.json

@@ -50,5 +50,6 @@
   "action_by-load": "By Load",
   "action_by-pool-usage": "By Pool Usage",
   "title_memory-details": "Memory Details",
-  "field_memory-usage": "Memory usage"
+  "field_memory-usage": "Memory usage",
+  "context_capacity-usage": "{{value}} of {{capacity}}"
 }