fix(manager-component): fix and refactor useResourcesIcebergV6

ref: MANAGER-14495

Signed-off-by: Thibault Barske <[email protected]>

packages/manager-react-components/src/hooks/datagrid/useIcebergV6.tsx

@@ -1,4 +1,4 @@
-import { useState, useEffect } from 'react';
+import { useState } from 'react';
 import { IcebergFetchParamsV6, fetchIcebergV6 } from '@ovh-ux/manager-core-api';
 import { useInfiniteQuery } from '@tanstack/react-query';
 import { ColumnSort } from '../../components';
@@ -8,11 +8,6 @@ interface IcebergV6Hook {
   defaultSorting?: ColumnSort;
 }
 
-interface QueryParams {
-  pageIndex: number;
-  sorting?: ColumnSort;
-}
-
 /**
  * @deprecated use fetchIcebergV6 from @ovh-ux/manager-core-api
  */
@@ -24,77 +19,41 @@ export function useResourcesIcebergV6<T = unknown>({
   queryKey,
   defaultSorting = undefined,
 }: IcebergFetchParamsV6 & IcebergV6Hook) {
-  const [totalCount, setTotalCount] = useState(0);
-  const [flattenData, setFlattenData] = useState<T[]>([]);
-  const [queryParams, setQueryParams] = useState<QueryParams>({
-    pageIndex: 1,
-    sorting: { desc: false, id: '' },
-  });
   const [sorting, setSorting] = useState<ColumnSort>(defaultSorting);
 
-  const {
-    data,
-    fetchNextPage,
-    isError,
-    isLoading,
-    error,
-    status,
-  } = useInfiniteQuery({
-    initialPageParam: null,
-    queryKey: [...queryKey, sorting],
-    queryFn: ({ pageParam }) =>
+  const { data: dataSelected, ...rest } = useInfiniteQuery({
+    initialPageParam: 1,
+    queryKey: [...queryKey, pageSize, sorting],
+    staleTime: Infinity,
+    retry: false,
+    queryFn: ({ pageParam: pageIndex }) =>
       fetchIcebergV6<T>({
         route,
         pageSize,
-        page: pageParam,
+        page: pageIndex,
         sortBy: sorting?.id || null,
         sortReverse: sorting?.desc,
       }),
-    staleTime: Infinity,
-    retry: false,
-    getNextPageParam: () => queryParams.pageIndex,
+    getNextPageParam: (lastPage, _allPages, lastPageIndex) => {
+      if (lastPage.totalCount / pageSize > lastPageIndex) return null;
+      return lastPageIndex + 1;
+    },
+    select: (data) => {
+      const pageIndex = data.pageParams[data.pageParams.length - 1];
+      const { totalCount } = data.pages[0];
+      return {
+        data,
+        pageIndex,
+        totalCount,
+        flattenData: data.pages.flatMap((page) => page.data),
+        hasNextPage: totalCount / pageSize > pageIndex,
+      };
+    },
   });
 
-  useEffect(() => {
-    const flatten = data?.pages.map((page) => page.data).flat();
-    setFlattenData(flatten);
-  }, [data]);
-
-  useEffect(() => {
-    if (totalCount === 0 && data?.pages) {
-      setTotalCount(data.pages[0].totalCount);
-    }
-  }, [data]);
-
-  useEffect(() => {
-    if (sorting) {
-      setQueryParams(() => ({ pageIndex: 1, sorting }));
-    }
-  }, [sorting]);
-
-  useEffect(() => {
-    fetchNextPage();
-  }, [queryParams]);
-
-  const onFetchNextPage = () => {
-    setQueryParams((previousParams: QueryParams) => ({
-      ...previousParams,
-      pageIndex: previousParams.pageIndex + 1,
-    }));
-  };
-
   return {
-    data,
-    fetchNextPage: onFetchNextPage,
-    setFlattenData,
-    flattenData,
-    totalCount,
-    pageIndex: queryParams.pageIndex,
-    hasNextPage: totalCount / pageSize > queryParams.pageIndex,
-    isError,
-    error,
-    isLoading,
-    status,
+    ...(dataSelected ?? { totalCount: 0, hasNextPage: false }),
+    ...rest,
     sorting,
     setSorting,
   };