feat(StorageGroups): add latency and allocation units columns (#1390)

Author: artemmufazalov

src/components/StorageGroupInfo/StorageGroupInfo.tsx

@@ -36,9 +36,9 @@ export function StorageGroupInfo({data, className, ...infoViewerProps}: StorageG
         State,
         MissingDisks,
         Available,
-        LatencyPutTabletLog,
-        LatencyPutUserData,
-        LatencyGetFast,
+        LatencyPutTabletLogMs,
+        LatencyPutUserDataMs,
+        LatencyGetFastMs,
     } = data || {};
 
     const storageGroupInfoFirstColumn = [];
@@ -122,22 +122,22 @@ export function StorageGroupInfo({data, className, ...infoViewerProps}: StorageG
             value: <EntityStatus status={Latency} />,
         });
     }
-    if (valueIsDefined(LatencyPutTabletLog)) {
+    if (valueIsDefined(LatencyPutTabletLogMs)) {
         storageGroupInfoSecondColumn.push({
             label: storageGroupInfoKeyset('latency-put-tablet-log'),
-            value: formatToMs(LatencyPutTabletLog),
+            value: formatToMs(LatencyPutTabletLogMs),
         });
     }
-    if (valueIsDefined(LatencyPutUserData)) {
+    if (valueIsDefined(LatencyPutUserDataMs)) {
         storageGroupInfoSecondColumn.push({
             label: storageGroupInfoKeyset('latency-put-user-data'),
-            value: formatToMs(LatencyPutUserData),
+            value: formatToMs(LatencyPutUserDataMs),
         });
     }
-    if (valueIsDefined(LatencyGetFast)) {
+    if (valueIsDefined(LatencyGetFastMs)) {
         storageGroupInfoSecondColumn.push({
             label: storageGroupInfoKeyset('latency-get-fast'),
-            value: formatToMs(LatencyGetFast),
+            value: formatToMs(LatencyGetFastMs),
         });
     }
     if (valueIsDefined(AllocationUnits)) {

src/containers/Storage/StorageGroups/columns/columns.tsx

@@ -10,9 +10,12 @@ import {InternalLink} from '../../../../components/InternalLink';
 import {UsageLabel} from '../../../../components/UsageLabel/UsageLabel';
 import {VDiskWithDonorsStack} from '../../../../components/VDisk/VDiskWithDonorsStack';
 import {getStorageGroupPath} from '../../../../routes';
+import {valueIsDefined} from '../../../../utils';
 import {cn} from '../../../../utils/cn';
-import {stringifyVdiskId} from '../../../../utils/dataFormatters/dataFormatters';
+import {EMPTY_DATA_PLACEHOLDER} from '../../../../utils/constants';
+import {formatNumber, stringifyVdiskId} from '../../../../utils/dataFormatters/dataFormatters';
 import {isSortableStorageProperty} from '../../../../utils/storage';
+import {formatToMs, parseUsToMs} from '../../../../utils/timeParsers';
 import {bytesToGB, bytesToSpeed} from '../../../../utils/utils';
 import {Disks} from '../../Disks/Disks';
 import {getDegradedSeverity, getUsageSeverityForStorageGroup, isVdiskActive} from '../../utils';
@@ -183,6 +186,30 @@ const writeColumn: StorageGroupsColumn = {
     align: DataTable.RIGHT,
 };
 
+const latencyColumn: StorageGroupsColumn = {
+    name: STORAGE_GROUPS_COLUMNS_IDS.Latency,
+    header: STORAGE_GROUPS_COLUMNS_TITLES.Latency,
+    width: 100,
+    render: ({row}) => {
+        return valueIsDefined(row.LatencyPutTabletLogMs)
+            ? formatToMs(parseUsToMs(row.LatencyPutTabletLogMs))
+            : EMPTY_DATA_PLACEHOLDER;
+    },
+    align: DataTable.RIGHT,
+};
+
+const allocationUnitsColumn: StorageGroupsColumn = {
+    name: STORAGE_GROUPS_COLUMNS_IDS.AllocationUnits,
+    header: STORAGE_GROUPS_COLUMNS_TITLES.AllocationUnits,
+    width: 150,
+    render: ({row}) => {
+        return valueIsDefined(row.AllocationUnits)
+            ? formatNumber(row.AllocationUnits)
+            : EMPTY_DATA_PLACEHOLDER;
+    },
+    align: DataTable.RIGHT,
+};
+
 const getVDisksColumn = (data?: GetStorageColumnsData): StorageGroupsColumn => ({
     name: STORAGE_GROUPS_COLUMNS_IDS.VDisks,
     header: STORAGE_GROUPS_COLUMNS_TITLES.VDisks,
@@ -236,7 +263,7 @@ export const getStorageTopGroupsColumns: StorageColumnsGetter = () => {
     });
 };
 
-export const getStorageGroupsColumns: StorageColumnsGetter = (data?: GetStorageColumnsData) => {
+export const getStorageGroupsColumns: StorageColumnsGetter = (data) => {
     const columns = [
         groupIdColumn,
         poolNameColumn,
@@ -249,6 +276,8 @@ export const getStorageGroupsColumns: StorageColumnsGetter = (data?: GetStorageC
         usedSpaceFlagColumn,
         readColumn,
         writeColumn,
+        latencyColumn,
+        allocationUnitsColumn,
         getVDisksColumn(data),
         getDisksColumn(data),
     ];

src/containers/Storage/StorageGroups/columns/constants.ts

@@ -23,6 +23,7 @@ export const STORAGE_GROUPS_COLUMNS_IDS = {
     Read: 'Read',
     Write: 'Write',
     Latency: 'Latency',
+    AllocationUnits: 'AllocationUnits',
     VDisks: 'VDisks',
     VDisksPDisks: 'VDisksPDisks',
     MissingDisks: 'MissingDisks',
@@ -89,6 +90,9 @@ export const STORAGE_GROUPS_COLUMNS_TITLES = {
     get Latency() {
         return i18n('latency');
     },
+    get AllocationUnits() {
+        return i18n('allocation-units');
+    },
     get VDisks() {
         return i18n('vdisks');
     },

src/containers/Storage/StorageGroups/columns/i18n/en.json

@@ -15,6 +15,7 @@
   "read": "Read",
   "write": "Write",
   "latency": "Latency",
+  "allocation-units": "Allocation Units",
   "vdisks": "VDisks",
   "vdisks-pdisks": "VDisks with PDisks"
 }

src/store/reducers/storage/types.ts

@@ -88,9 +88,10 @@ export interface PreparedStorageGroup {
     State?: string;
     MissingDisks?: string | number;
     Available?: string;
-    LatencyPutTabletLog?: number;
-    LatencyPutUserData?: number;
-    LatencyGetFast?: number;
+
+    LatencyPutTabletLogMs?: number;
+    LatencyPutUserDataMs?: number;
+    LatencyGetFastMs?: number;
 }
 
 export interface StorageSortParams {

src/store/reducers/storage/utils.ts

@@ -15,6 +15,7 @@ import {getColorSeverity, getSeverityColor} from '../../../utils/disks/helpers';
 import {preparePDiskData, prepareVDiskData} from '../../../utils/disks/prepareDisks';
 import {prepareNodeSystemState} from '../../../utils/nodes';
 import {getUsage} from '../../../utils/storage';
+import {parseUsToMs} from '../../../utils/timeParsers';
 
 import type {
     PreparedStorageGroup,
@@ -247,7 +248,19 @@ export const prepareStorageResponse = (data: TStorageInfo): PreparedStorageRespo
 export function prepareGroupsResponse(data: StorageGroupsResponse): PreparedStorageResponse {
     const {FoundGroups, TotalGroups, StorageGroups = [], StorageGroupGroups} = data;
     const preparedGroups: PreparedStorageGroup[] = StorageGroups.map((group) => {
-        const {Usage, Read, Write, Used, Limit, MissingDisks, VDisks = [], Overall} = group;
+        const {
+            Usage,
+            Read,
+            Write,
+            Used,
+            Limit,
+            MissingDisks,
+            VDisks = [],
+            Overall,
+            LatencyPutTabletLog,
+            LatencyPutUserData,
+            LatencyGetFast,
+        } = group;
 
         const vDisks = VDisks.map((disk) => {
             const whiteboardVDisk = disk.Whiteboard;
@@ -275,6 +288,11 @@ export function prepareGroupsResponse(data: StorageGroupsResponse): PreparedStor
             Write: Number(Write),
             Used: Number(Used),
             Limit: Number(Limit),
+
+            LatencyPutTabletLogMs: parseUsToMs(LatencyPutTabletLog),
+            LatencyPutUserDataMs: parseUsToMs(LatencyPutUserData),
+            LatencyGetFastMs: parseUsToMs(LatencyGetFast),
+
             Degraded: Number(MissingDisks),
             Overall,
 

src/types/api/storage.ts

@@ -159,6 +159,25 @@ export interface TGroupsStorageGroupInfo {
     /** float */
     DiskSpaceUsage?: number;
 
+    /**
+     * uint64
+     *
+     * time in us
+     */
+    LatencyPutTabletLog?: string;
+    /**
+     * uint64
+     *
+     * time in us
+     */
+    LatencyPutUserData?: string;
+    /**
+     * uint64
+     *
+     * time in us
+     */
+    LatencyGetFast?: string;
+
     VDisks?: TStorageVDisk[];
 }
 
@@ -219,7 +238,13 @@ export type StorageV2SortValue =
     | 'Used'
     | 'Limit'
     | 'Read'
-    | 'Write';
+    | 'Write'
+
+    // These fields are not present in storage v2
+    // So this sort does nothing
+    // Added them here for types compatibility
+    | 'AllocationUnits'
+    | 'Latency';
 
 /**
  * Values to sort /storage/groups response
@@ -230,9 +255,7 @@ export type GroupsSortField =
     | 'State'
     | 'Available'
     | 'DiskSpaceUsage'
-    | 'Encryption'
-    | 'AllocationUnits'
-    | 'Latency';
+    | 'Encryption';
 
 export type StorageV2Sort = BackendSortParam<StorageV2SortValue>;
 export type GroupsSort = BackendSortParam<GroupsSortField>;

src/utils/storage.ts

@@ -24,6 +24,9 @@ const STORAGE_SORT_VALUES: StorageV2SortValue[] = [
     'Limit',
     'Read',
     'Write',
+
+    'AllocationUnits',
+    'Latency',
 ];
 
 export const isSortableStorageProperty = (value: unknown): value is StorageV2SortValue =>