feat(Storage): display media type for groups

Author: ariser

src/containers/Storage/StorageGroups/StorageGroups.tsx

@@ -25,6 +25,7 @@ import './StorageGroups.scss';
 
 enum TableColumnsIds {
     PoolName = 'PoolName',
+    Type = 'Type',
     GroupID = 'GroupID',
     Used = 'Used',
     Limit = 'Limit',
@@ -49,6 +50,7 @@ interface StorageGroupsProps {
 
 const tableColumnsNames: Record<TableColumnsIdsValues, string> = {
     PoolName: 'Pool Name',
+    Type: 'Type',
     GroupID: 'Group ID',
     Used: 'Used',
     Limit: 'Limit',
@@ -114,6 +116,11 @@ function StorageGroups({data, tableSettings, visibleEntities, nodes, onShowAll}:
             },
             align: DataTable.LEFT,
         },
+        {
+            name: TableColumnsIds.Type,
+            header: tableColumnsNames[TableColumnsIds.Type],
+            render: ({value}) => <Label>{value as string || '—'}</Label>,
+        },
         {
             name: TableColumnsIds.Missing,
             header: tableColumnsNames[TableColumnsIds.Missing],

src/store/reducers/storage.js

@@ -4,6 +4,7 @@ import _ from 'lodash';
 import {createSelector} from 'reselect';
 import {calcUptime} from '../../utils';
 import {getUsage} from '../../utils/storage';
+import {getPDiskType} from '../../utils/pdisk';
 
 export const VisibleEntities = {
     All: 'All',
@@ -229,6 +230,10 @@ export const getFlatListStorageGroups = createSelector([getStoragePools], (stora
                         },
                         0,
                     );
+                    const mediaType = group.VDisks?.reduce((type, vdisk) => {
+                        const currentType = getPDiskType(vdisk.PDisk || {});
+                        return currentType && (currentType === type || type === '') ? currentType : 'Mixed';
+                    }, '');
                     return [
                         ...acc,
                         {
@@ -240,6 +245,7 @@ export const getFlatListStorageGroups = createSelector([getStoragePools], (stora
                             Limit: limitSizeBytes,
                             Missing: missing,
                             UsedSpaceFlag,
+                            Type: mediaType || null,
                         },
                     ];
                 },

src/types/store/storage.ts

@@ -8,4 +8,5 @@ export interface IStoragePoolGroup extends TBSGroupStateInfo {
     Limit: number;
     Missing: number;
     UsedSpaceFlag: number;
+    Type: string | null;
 }