fix(Storage): expect arbitrary donors data

Author: ariser

src/containers/Storage/StorageGroups/StorageGroups.tsx

@@ -3,7 +3,6 @@ import cn from 'bem-cn-lite';
 import DataTable, {Column, Settings, SortOrder} from '@yandex-cloud/react-data-table';
 import {Popover, PopoverBehavior} from '@yandex-cloud/uikit';
 
-import Vdisk from '../Vdisk/Vdisk';
 import {Stack} from '../../../components/Stack/Stack';
 //@ts-ignore
 import EntityStatus from '../../../components/EntityStatus/EntityStatus';
@@ -16,6 +15,9 @@ import {bytesToGB, bytesToSpeed} from '../../../utils/utils';
 //@ts-ignore
 import {stringifyVdiskId} from '../../../utils';
 
+import Vdisk from '../Vdisk/Vdisk';
+import {isFullDonorData} from '../utils';
+
 import './StorageGroups.scss';
 
 enum TableColumnsIds {
@@ -197,34 +199,38 @@ function StorageGroups({data, tableSettings, visibleEntities, nodes}: StorageGro
             header: tableColumnsNames[TableColumnsIds.VDisks],
             render: ({value, row}) => (
                 <div className={b('vdisks-wrapper')}>
-                    {_.map(value as TVDiskStateInfo[], (el) => (
-                        Array.isArray(el.Donors) && el.Donors.length > 0 ? (
-                            <Stack className={b('vdisks-item')} key={stringifyVdiskId(el.VDiskId)}>
-                                <Vdisk
-                                    {...el}
-                                    PoolName={row[TableColumnsIds.PoolName]}
-                                    nodes={nodes}
-                                />
-                                {el.Donors.map((donor) => (
+                    {_.map(value as TVDiskStateInfo[], (el) => {
+                        const donors = Array.isArray(el.Donors) ? el.Donors.filter(isFullDonorData) : [];
+
+                        return (
+                            donors.length > 0 ? (
+                                <Stack className={b('vdisks-item')} key={stringifyVdiskId(el.VDiskId)}>
+                                    <Vdisk
+                                        {...el}
+                                        PoolName={row[TableColumnsIds.PoolName]}
+                                        nodes={nodes}
+                                    />
+                                    {donors.map((donor) => (
+                                        <Vdisk
+                                            {...donor}
+                                            // donor and acceptor are always in the same group
+                                            PoolName={row[TableColumnsIds.PoolName]}
+                                            nodes={nodes}
+                                            key={stringifyVdiskId(donor.VDiskId)}
+                                        />
+                                    ))}
+                                </Stack>
+                            ) : (
+                                <div className={b('vdisks-item')} key={stringifyVdiskId(el.VDiskId)}>
                                     <Vdisk
-                                        {...donor}
-                                        // donor and acceptor are always in the same group
+                                        {...el}
                                         PoolName={row[TableColumnsIds.PoolName]}
                                         nodes={nodes}
-                                        key={stringifyVdiskId(donor.VDiskId)}
                                     />
-                                ))}
-                            </Stack>
-                        ) : (
-                            <div className={b('vdisks-item')} key={stringifyVdiskId(el.VDiskId)}>
-                                <Vdisk
-                                    {...el}
-                                    PoolName={row[TableColumnsIds.PoolName]}
-                                    nodes={nodes}
-                                />
-                            </div>
-                        )
-                    ))}
+                                </div>
+                            )
+                        );
+                    })}
                 </div>
             ),
             align: DataTable.CENTER,

src/containers/Storage/utils/index.ts

@@ -1 +1,6 @@
+import type {TVDiskStateInfo, TVSlotId} from '../../../types/api/storage';
+
 export * from './constants';
+
+export const isFullDonorData = (donor: TVDiskStateInfo | TVSlotId): donor is TVDiskStateInfo =>
+    'VDiskId' in donor;

src/types/api/storage.ts

@@ -96,6 +96,15 @@ interface TVDiskID {
     VDisk?: string;
 }
 
+export interface TVSlotId {
+    /** uint32 */
+    NodeId?: string;
+    /** uint32 */
+    PDiskId?: string;
+    /** uint32 */
+    VSlotId?: string;
+}
+
 export interface TVDiskStateInfo {
     VDiskId?: TVDiskID;
     /** uint64 */
@@ -154,7 +163,8 @@ export interface TVDiskStateInfo {
      * VDisk actor instance guid
      */
     InstanceGuid?: string;
-    Donors?: TVDiskStateInfo[];
+    // in reality it is `Donors: TVDiskStateInfo[] | TVSlotId[]`, but this way it is more error-proof
+    Donors?: Array<TVDiskStateInfo | TVSlotId>;
 
     /** VDisk (Skeleton) Front Queue Status */
     FrontQueues?: EFlag;