chore!: only pagination tables in storage (#1745)

Author: astandrik

src/containers/Cluster/Cluster.tsx

@@ -27,7 +27,7 @@ import {cn} from '../../utils/cn';
 import {useTypedDispatch, useTypedSelector} from '../../utils/hooks';
 import {parseVersionsToVersionToColorMap} from '../../utils/versions';
 import {Nodes} from '../Nodes/Nodes';
-import {StorageWrapper} from '../Storage/StorageWrapper';
+import {PaginatedStorage} from '../Storage/PaginatedStorage';
 import {TabletsTable} from '../Tablets/TabletsTable';
 import {Tenants} from '../Tenants/Tenants';
 import {Versions} from '../Versions/Versions';
@@ -199,7 +199,7 @@ export function Cluster({
                         getLocationObjectFromHref(getClusterPath(clusterTabsIds.storage)).pathname
                     }
                 >
-                    <StorageWrapper parentRef={container} />
+                    <PaginatedStorage parentRef={container} />
                 </Route>
                 <Route
                     path={

src/containers/Node/Node.tsx

@@ -20,7 +20,7 @@ import {nodeApi} from '../../store/reducers/node/node';
 import type {AdditionalNodesProps} from '../../types/additionalProps';
 import {cn} from '../../utils/cn';
 import {useAutoRefreshInterval, useTypedDispatch} from '../../utils/hooks';
-import {StorageWrapper} from '../Storage/StorageWrapper';
+import {PaginatedStorage} from '../Storage/PaginatedStorage';
 import {Tablets} from '../Tablets';
 
 import type {NodeTab} from './NodePages';
@@ -142,7 +142,13 @@ export function Node(props: NodeProps) {
             case STORAGE: {
                 return (
                     <div className={b('storage')} ref={container}>
-                        <StorageWrapper nodeId={nodeId} parentRef={container} />
+                        <PaginatedStorage
+                            nodeId={nodeId}
+                            parentRef={container}
+                            viewContext={{
+                                nodeId: nodeId?.toString(),
+                            }}
+                        />
                     </div>
                 );
             }

src/containers/PDiskPage/PDiskPage.tsx

@@ -25,7 +25,7 @@ import {valueIsDefined} from '../../utils';
 import {cn} from '../../utils/cn';
 import {getPDiskId, getSeverityColor} from '../../utils/disks/helpers';
 import {useAutoRefreshInterval, useTypedDispatch, useTypedSelector} from '../../utils/hooks';
-import {StorageWrapper} from '../Storage/StorageWrapper';
+import {PaginatedStorage} from '../Storage/PaginatedStorage';
 
 import {DecommissionButton} from './DecommissionButton/DecommissionButton';
 import {DecommissionLabel} from './DecommissionLabel/DecommissionLabel';
@@ -246,7 +246,15 @@ export function PDiskPage() {
             }
             case 'storage': {
                 return pDiskParamsDefined ? (
-                    <StorageWrapper nodeId={nodeId} pDiskId={pDiskId} parentRef={containerRef} />
+                    <PaginatedStorage
+                        nodeId={nodeId}
+                        pDiskId={pDiskId}
+                        parentRef={containerRef}
+                        viewContext={{
+                            nodeId: nodeId?.toString(),
+                            pDiskId: pDiskId?.toString(),
+                        }}
+                    />
                 ) : null;
             }
             default:

src/containers/Storage/PaginatedStorage.tsx

@@ -10,7 +10,7 @@ export interface PaginatedStorageProps {
     groupId?: string | number;
     pDiskId?: string | number;
 
-    viewContext: StorageViewContext;
+    viewContext?: StorageViewContext;
 
     parentRef: React.RefObject<HTMLElement>;
 

src/containers/Storage/PaginatedStorageNodes.tsx

@@ -208,7 +208,7 @@ function useStorageNodesColumnsToSelect({
     viewContext,
 }: {
     database?: string;
-    viewContext: StorageViewContext;
+    viewContext?: StorageViewContext;
 }) {
     const {balancer} = useClusterBaseInfo();
     const {additionalNodesProps} = useAdditionalNodeProps({balancer});

src/containers/Storage/Storage.tsx

@@ -14,7 +14,7 @@ import {
 } from './constants';
 import type {GetStorageGroupsColumnsParams} from './types';
 
-export function useGetStorageGroupsColumns(viewContext: StorageViewContext) {
+export function useGetStorageGroupsColumns(viewContext?: StorageViewContext) {
     return React.useMemo(() => {
         return getStorageGroupsColumns({viewContext});
     }, [viewContext]);

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

@@ -5,12 +5,12 @@ import type {StorageViewContext} from '../../types';
 export type StorageGroupsColumn = Column<PreparedStorageGroup>;
 
 export interface GetStorageColumnsData {
-    viewContext: StorageViewContext;
+    viewContext?: StorageViewContext;
 }
 
 export interface GetStorageGroupsColumnsParams {
     visibleEntities?: VisibleEntities;
-    viewContext: StorageViewContext;
+    viewContext?: StorageViewContext;
 }
 
 export type StorageColumnsGetter = (data?: GetStorageColumnsData) => StorageGroupsColumn[];