From c3cf0d431aa18f84e180effaae71e96575b63e29 Mon Sep 17 00:00:00 2001
From: mufazalov <mufazalov@yandex-team.ru>
Date: Tue, 1 Oct 2024 15:15:49 +0300
Subject: [PATCH] fix(PaginatedStorage): properly pass ids, display 1 node on
 Node page

---
 src/containers/Storage/PaginatedStorage.tsx   |  6 ++--
 .../Storage/PaginatedStorageGroups.tsx        | 24 +++++++++++++---
 .../Storage/PaginatedStorageNodes.tsx         | 19 +++++++++----
 src/containers/Storage/Storage.tsx            |  4 +--
 .../PaginatedStorageGroupsTable.tsx           | 28 +++++++++++++++++--
 .../Storage/StorageGroups/getGroups.ts        | 14 ++++++++--
 .../PaginatedStorageNodesTable.tsx            | 17 ++++++++++-
 .../Storage/StorageNodes/getNodes.ts          | 14 ++++++++--
 src/store/reducers/storage/types.ts           | 10 ++++++-
 9 files changed, 112 insertions(+), 24 deletions(-)

diff --git a/src/containers/Storage/PaginatedStorage.tsx b/src/containers/Storage/PaginatedStorage.tsx
index d47d49f56e..804a5714d5 100644
--- a/src/containers/Storage/PaginatedStorage.tsx
+++ b/src/containers/Storage/PaginatedStorage.tsx
@@ -4,8 +4,10 @@ import {useStorageQueryParams} from './useStorageQueryParams';
 
 export interface PaginatedStorageProps {
     database?: string;
-    nodeId?: string;
-    groupId?: string;
+    nodeId?: string | number;
+    groupId?: string | number;
+    pDiskId?: string | number;
+
     parentContainer?: Element | null;
 }
 
diff --git a/src/containers/Storage/PaginatedStorageGroups.tsx b/src/containers/Storage/PaginatedStorageGroups.tsx
index 8ff4d46dc1..d20f0e650b 100644
--- a/src/containers/Storage/PaginatedStorageGroups.tsx
+++ b/src/containers/Storage/PaginatedStorageGroups.tsx
@@ -49,12 +49,18 @@ export function PaginatedStorageGroups(props: PaginatedStorageProps) {
     return <LoaderWrapper loading={!capabilitiesLoaded}>{renderContent()}</LoaderWrapper>;
 }
 
-function StorageGroupsComponent({database, nodeId, parentContainer}: PaginatedStorageProps) {
+function StorageGroupsComponent({
+    database,
+    nodeId,
+    groupId,
+    pDiskId,
+    parentContainer,
+}: PaginatedStorageProps) {
     const {searchValue, visibleEntities, handleShowAllGroups} = useStorageQueryParams();
 
     const {columnsToShow, columnsToSelect, setColumns} = useStorageGroupsSelectedColumns({
         visibleEntities,
-        nodeId,
+        nodeId: nodeId?.toString(),
     });
 
     const renderControls: RenderControls = ({totalEntities, foundEntities, inited}) => {
@@ -75,6 +81,8 @@ function StorageGroupsComponent({database, nodeId, parentContainer}: PaginatedSt
         <PaginatedStorageGroupsTable
             database={database}
             nodeId={nodeId}
+            groupId={groupId}
+            pDiskId={pDiskId}
             searchValue={searchValue}
             visibleEntities={visibleEntities}
             onShowAll={handleShowAllGroups}
@@ -86,14 +94,19 @@ function StorageGroupsComponent({database, nodeId, parentContainer}: PaginatedSt
     );
 }
 
-function GroupedStorageGroupsComponent({database, groupId, nodeId}: PaginatedStorageProps) {
+function GroupedStorageGroupsComponent({
+    database,
+    nodeId,
+    groupId,
+    pDiskId,
+}: PaginatedStorageProps) {
     const [autoRefreshInterval] = useAutoRefreshInterval();
     const {searchValue, storageGroupsGroupByParam, visibleEntities, handleShowAllGroups} =
         useStorageQueryParams();
 
     const {columnsToShow, columnsToSelect, setColumns} = useStorageGroupsSelectedColumns({
         visibleEntities,
-        nodeId,
+        nodeId: nodeId?.toString(),
     });
 
     const {currentData, isFetching, error} = storageApi.useGetStorageGroupsInfoQuery(
@@ -102,6 +115,7 @@ function GroupedStorageGroupsComponent({database, groupId, nodeId}: PaginatedSto
             with: 'all',
             nodeId,
             groupId,
+            pDiskId,
             filter: searchValue,
             shouldUseGroupsHandler: true,
             group: storageGroupsGroupByParam,
@@ -147,6 +161,8 @@ function GroupedStorageGroupsComponent({database, groupId, nodeId}: PaginatedSto
                         <PaginatedStorageGroupsTable
                             database={database}
                             nodeId={nodeId}
+                            groupId={groupId}
+                            pDiskId={pDiskId}
                             filterGroup={name}
                             filterGroupBy={storageGroupsGroupByParam}
                             searchValue={searchValue}
diff --git a/src/containers/Storage/PaginatedStorageNodes.tsx b/src/containers/Storage/PaginatedStorageNodes.tsx
index 63a545b984..cf237c1d8e 100644
--- a/src/containers/Storage/PaginatedStorageNodes.tsx
+++ b/src/containers/Storage/PaginatedStorageNodes.tsx
@@ -10,7 +10,6 @@ import {
 } from '../../store/reducers/capabilities/hooks';
 import {useClusterBaseInfo} from '../../store/reducers/cluster/cluster';
 import {storageApi} from '../../store/reducers/storage/storage';
-import {valueIsDefined} from '../../utils';
 import {useAutoRefreshInterval} from '../../utils/hooks';
 import {NodesUptimeFilterValues} from '../../utils/nodes';
 import {useAdditionalNodeProps} from '../AppWithClusters/useClusterData';
@@ -57,13 +56,18 @@ export const PaginatedStorageNodes = (props: PaginatedStorageProps) => {
     return <LoaderWrapper loading={!capabilitiesLoaded}>{renderContent()}</LoaderWrapper>;
 };
 
-function StorageNodesComponent({database, groupId, parentContainer}: PaginatedStorageProps) {
+function StorageNodesComponent({
+    database,
+    nodeId,
+    groupId,
+    parentContainer,
+}: PaginatedStorageProps) {
     const {searchValue, visibleEntities, nodesUptimeFilter, handleShowAllNodes} =
         useStorageQueryParams();
 
     const {columnsToShow, columnsToSelect, setColumns} = useStorageNodesColumnsToSelect({
         database,
-        groupId,
+        groupId: groupId?.toString(),
     });
 
     const renderControls: RenderControls = ({totalEntities, foundEntities, inited}) => {
@@ -83,6 +87,8 @@ function StorageNodesComponent({database, groupId, parentContainer}: PaginatedSt
     return (
         <PaginatedStorageNodesTable
             database={database}
+            nodeId={nodeId}
+            groupId={groupId}
             searchValue={searchValue}
             visibleEntities={visibleEntities}
             nodesUptimeFilter={nodesUptimeFilter}
@@ -102,7 +108,7 @@ function GroupedStorageNodesComponent({database, groupId, nodeId}: PaginatedStor
 
     const {columnsToShow, columnsToSelect, setColumns} = useStorageNodesColumnsToSelect({
         database,
-        groupId,
+        groupId: groupId?.toString(),
     });
 
     const {currentData, isFetching, error} = storageApi.useGetStorageNodesInfoQuery(
@@ -111,8 +117,7 @@ function GroupedStorageNodesComponent({database, groupId, nodeId}: PaginatedStor
             with: 'all',
             filter: searchValue,
             node_id: nodeId,
-            // node_id and group_id params don't work together
-            group_id: valueIsDefined(nodeId) ? undefined : groupId,
+            group_id: groupId,
             group: storageNodesGroupByParam,
         },
         {
@@ -155,6 +160,8 @@ function GroupedStorageNodesComponent({database, groupId, nodeId}: PaginatedStor
                     >
                         <PaginatedStorageNodesTable
                             database={database}
+                            nodeId={nodeId}
+                            groupId={groupId}
                             searchValue={searchValue}
                             visibleEntities={'all'}
                             nodesUptimeFilter={NodesUptimeFilterValues.All}
diff --git a/src/containers/Storage/Storage.tsx b/src/containers/Storage/Storage.tsx
index 15953cc68b..7d7ce86ea3 100644
--- a/src/containers/Storage/Storage.tsx
+++ b/src/containers/Storage/Storage.tsx
@@ -13,7 +13,6 @@ import type {NodesSortParams} from '../../store/reducers/nodes/types';
 import {filterGroups, filterNodes} from '../../store/reducers/storage/selectors';
 import {storageApi} from '../../store/reducers/storage/storage';
 import type {StorageSortParams} from '../../store/reducers/storage/types';
-import {valueIsDefined} from '../../utils';
 import {useAutoRefreshInterval, useTableSort} from '../../utils/hooks';
 import {useAdditionalNodeProps} from '../AppWithClusters/useClusterData';
 
@@ -90,8 +89,7 @@ export const Storage = ({database, nodeId, groupId, pDiskId}: StorageProps) => {
             database,
             with: visibleEntities,
             node_id: nodeId,
-            // node_id and group_id params don't work together
-            group_id: valueIsDefined(nodeId) ? undefined : groupId,
+            group_id: groupId,
         },
         {
             skip: !isNodes,
diff --git a/src/containers/Storage/StorageGroups/PaginatedStorageGroupsTable.tsx b/src/containers/Storage/StorageGroups/PaginatedStorageGroupsTable.tsx
index 413bd5b086..2e526a9010 100644
--- a/src/containers/Storage/StorageGroups/PaginatedStorageGroupsTable.tsx
+++ b/src/containers/Storage/StorageGroups/PaginatedStorageGroupsTable.tsx
@@ -21,7 +21,9 @@ interface PaginatedStorageGroupsTableProps {
     columns: StorageGroupsColumn[];
 
     database?: string;
-    nodeId?: string;
+    nodeId?: string | number;
+    groupId?: string | number;
+    pDiskId?: string | number;
 
     filterGroup?: string;
     filterGroupBy?: GroupsGroupByField;
@@ -40,6 +42,8 @@ export const PaginatedStorageGroupsTable = ({
     columns,
     database,
     nodeId,
+    groupId,
+    pDiskId,
     filterGroup,
     filterGroupBy,
     searchValue,
@@ -56,8 +60,26 @@ export const PaginatedStorageGroupsTable = ({
     const fetchData = useGroupsGetter(groupsHandlerAvailable);
 
     const tableFilters = React.useMemo(() => {
-        return {searchValue, visibleEntities, database, nodeId, filterGroup, filterGroupBy};
-    }, [searchValue, visibleEntities, database, nodeId, filterGroup, filterGroupBy]);
+        return {
+            searchValue,
+            visibleEntities,
+            database,
+            nodeId,
+            groupId,
+            pDiskId,
+            filterGroup,
+            filterGroupBy,
+        };
+    }, [
+        searchValue,
+        visibleEntities,
+        database,
+        nodeId,
+        groupId,
+        pDiskId,
+        filterGroup,
+        filterGroupBy,
+    ]);
 
     const renderEmptyDataMessage = () => {
         if (visibleEntities !== VISIBLE_ENTITIES.all) {
diff --git a/src/containers/Storage/StorageGroups/getGroups.ts b/src/containers/Storage/StorageGroups/getGroups.ts
index 50878e7866..11f496453f 100644
--- a/src/containers/Storage/StorageGroups/getGroups.ts
+++ b/src/containers/Storage/StorageGroups/getGroups.ts
@@ -16,8 +16,16 @@ export function useGroupsGetter(shouldUseGroupsHandler: boolean) {
         async (params) => {
             const {limit, offset, sortParams, filters} = params;
             const {sortOrder, columnId} = sortParams ?? {};
-            const {searchValue, visibleEntities, database, nodeId, filterGroup, filterGroupBy} =
-                filters ?? {};
+            const {
+                searchValue,
+                visibleEntities,
+                database,
+                nodeId,
+                groupId,
+                pDiskId,
+                filterGroup,
+                filterGroupBy,
+            } = filters ?? {};
 
             const sort = isSortableStorageProperty(columnId)
                 ? prepareSortValue(columnId, sortOrder)
@@ -31,6 +39,8 @@ export function useGroupsGetter(shouldUseGroupsHandler: boolean) {
                 with: visibleEntities,
                 database,
                 nodeId,
+                groupId,
+                pDiskId,
                 filter_group: filterGroup,
                 filter_group_by: filterGroupBy,
                 shouldUseGroupsHandler,
diff --git a/src/containers/Storage/StorageNodes/PaginatedStorageNodesTable.tsx b/src/containers/Storage/StorageNodes/PaginatedStorageNodesTable.tsx
index 585a441d68..03605807dc 100644
--- a/src/containers/Storage/StorageNodes/PaginatedStorageNodesTable.tsx
+++ b/src/containers/Storage/StorageNodes/PaginatedStorageNodesTable.tsx
@@ -18,6 +18,8 @@ interface PaginatedStorageNodesTableProps {
     columns: StorageNodesColumn[];
 
     database?: string;
+    nodeId?: string | number;
+    groupId?: string | number;
 
     filterGroup?: string;
     filterGroupBy?: NodesGroupByField;
@@ -36,6 +38,8 @@ interface PaginatedStorageNodesTableProps {
 export const PaginatedStorageNodesTable = ({
     columns,
     database,
+    nodeId,
+    groupId,
     filterGroup,
     filterGroupBy,
     searchValue,
@@ -53,10 +57,21 @@ export const PaginatedStorageNodesTable = ({
             visibleEntities,
             nodesUptimeFilter,
             database,
+            nodeId,
+            groupId,
             filterGroup,
             filterGroupBy,
         };
-    }, [searchValue, visibleEntities, nodesUptimeFilter, database, filterGroup, filterGroupBy]);
+    }, [
+        searchValue,
+        visibleEntities,
+        nodesUptimeFilter,
+        database,
+        nodeId,
+        groupId,
+        filterGroup,
+        filterGroupBy,
+    ]);
 
     const renderEmptyDataMessage = () => {
         if (
diff --git a/src/containers/Storage/StorageNodes/getNodes.ts b/src/containers/Storage/StorageNodes/getNodes.ts
index 45de5d66f7..8efd58a91d 100644
--- a/src/containers/Storage/StorageNodes/getNodes.ts
+++ b/src/containers/Storage/StorageNodes/getNodes.ts
@@ -14,8 +14,16 @@ export const getStorageNodes: FetchData<
     Pick<NodesRequestParams, 'type' | 'storage'>
 > = async (params) => {
     const {type = 'static', storage = true, limit, offset, sortParams, filters} = params;
-    const {searchValue, nodesUptimeFilter, visibleEntities, database, filterGroup, filterGroupBy} =
-        filters ?? {};
+    const {
+        searchValue,
+        nodesUptimeFilter,
+        visibleEntities,
+        database,
+        nodeId,
+        groupId,
+        filterGroup,
+        filterGroupBy,
+    } = filters ?? {};
     const {sortOrder, columnId} = sortParams ?? {};
 
     const sort = isSortableNodesProperty(columnId)
@@ -32,6 +40,8 @@ export const getStorageNodes: FetchData<
         uptime: getUptimeParamValue(nodesUptimeFilter),
         with: visibleEntities,
         database,
+        node_id: nodeId,
+        group_id: groupId,
         filter_group: filterGroup,
         filter_group_by: filterGroupBy,
     });
diff --git a/src/store/reducers/storage/types.ts b/src/store/reducers/storage/types.ts
index 41c72e4e6f..bdb6066a7b 100644
--- a/src/store/reducers/storage/types.ts
+++ b/src/store/reducers/storage/types.ts
@@ -18,7 +18,11 @@ export interface PreparedStorageNodeFilters {
     searchValue: string;
     nodesUptimeFilter: NodesUptimeFilterValues;
     visibleEntities: VisibleEntities;
+
     database?: string;
+    nodeId?: string | number;
+    groupId?: string | number;
+
     filterGroup?: string;
     filterGroupBy?: NodesGroupByField;
 }
@@ -38,8 +42,12 @@ export interface PreparedStorageNode extends TSystemStateInfo {
 export interface PreparedStorageGroupFilters {
     searchValue: string;
     visibleEntities: VisibleEntities;
+
     database?: string;
-    nodeId?: string;
+    nodeId?: string | number;
+    groupId?: string | number;
+    pDiskId?: string | number;
+
     filterGroup?: string;
     filterGroupBy?: GroupsGroupByField;
 }