@povio/ui 3.2.2-rc.1 → 3.2.2-rc.2

package/dist/hooks/useQueryAutocomplete.d.ts

@@ -1,6 +1,5 @@
-import { InfiniteData } from '@tanstack/react-query';
 import { Key } from 'react-aria-components';
-import { InfiniteQueryPage, QueryFn, UseQueryAutocompleteOptions } from '../components/inputs/Selection/Autocomplete/queryAutocomplete.types';
+import { QueryFn, UseQueryAutocompleteOptions } from '../components/inputs/Selection/Autocomplete/queryAutocomplete.types';
 export declare const useQueryAutocomplete: <TQueryFn extends QueryFn, TKey extends Key = Key>({ query, queryParams, queryOptions, mapItems, initialQueryState, search, selectedIdsToResolve, }: UseQueryAutocompleteOptions<TQueryFn, TKey>) => {
     data: any;
     isLoading: boolean;
@@ -9,6 +8,6 @@ export declare const useQueryAutocomplete: <TQueryFn extends QueryFn, TKey exten
     items: import('..').SelectItem<TKey>[];
     totalItems: number | undefined;
     hasNextPage: boolean;
-    fetchNextPage: ((options?: import('@tanstack/react-query').FetchNextPageOptions) => Promise<import('@tanstack/react-query').InfiniteQueryObserverResult<InfiniteData<InfiniteQueryPage<TKey>, unknown>, Error>>) | undefined;
+    fetchNextPage: () => void;
     isFetchingNextPage: boolean;
 };

package/dist/hooks/useQueryAutocomplete.js

@@ -1,5 +1,5 @@
 import { ApiQueryUtils } from "../utils/query.utils.js";
-import { useEffect, useMemo, useState } from "react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 //#region src/hooks/useQueryAutocomplete.ts
 var isFilterSearchParams = (params) => {
 	return typeof params === "object" && params !== null && "filter" in params;
@@ -33,6 +33,7 @@ var useQueryAutocomplete = ({ query, queryParams, queryOptions, mapItems, initia
 	const fetchNextPage = infiniteQueryResult?.fetchNextPage;
 	const isFetchingNextPage = infiniteQueryResult?.isFetchingNextPage ?? false;
 	const totalItems = infiniteQueryResult?.data?.pages?.[0]?.totalItems;
+	const isFetchNextPageRequestedRef = useRef(false);
 	const items = useMemo(() => {
 		if (!data) return [];
 		return mapItems(isInfiniteQuery ? data.pages?.flatMap((page) => page?.items ?? []) : data);
@@ -42,12 +43,31 @@ var useQueryAutocomplete = ({ query, queryParams, queryOptions, mapItems, initia
 		mapItems
 	]);
 	const selectedIdsToResolveSet = useMemo(() => new Set(selectedIdsToResolve), [selectedIdsToResolve]);
+	const handleFetchNextPage = useCallback(() => {
+		if (!fetchNextPage || !hasNextPage || isFetchingNextPage || isFetchNextPageRequestedRef.current) return;
+		isFetchNextPageRequestedRef.current = true;
+		try {
+			fetchNextPage().finally(() => {
+				isFetchNextPageRequestedRef.current = false;
+			});
+		} catch (error) {
+			isFetchNextPageRequestedRef.current = false;
+			throw error;
+		}
+	}, [
+		fetchNextPage,
+		hasNextPage,
+		isFetchingNextPage
+	]);
+	useEffect(() => {
+		if (!isFetchingNextPage) isFetchNextPageRequestedRef.current = false;
+	}, [data, isFetchingNextPage]);
 	useEffect(() => {
-		if (!isQueryEnabled || !isInfiniteQuery || !fetchNextPage || !hasNextPage || isFetchingNextPage || selectedIdsToResolveSet.size === 0) return;
+		if (!isQueryEnabled || !isInfiniteQuery || !hasNextPage || isFetchingNextPage || selectedIdsToResolveSet.size === 0) return;
 		const loadedItemIds = new Set(items.map((item) => item.id));
-		if (selectedIdsToResolve.some((id) => !loadedItemIds.has(id))) fetchNextPage();
+		if (selectedIdsToResolve.some((id) => !loadedItemIds.has(id))) handleFetchNextPage();
 	}, [
-		fetchNextPage,
+		handleFetchNextPage,
 		hasNextPage,
 		isFetchingNextPage,
 		isInfiniteQuery,
@@ -64,7 +84,7 @@ var useQueryAutocomplete = ({ query, queryParams, queryOptions, mapItems, initia
 		items,
 		totalItems,
 		hasNextPage,
-		fetchNextPage,
+		fetchNextPage: handleFetchNextPage,
 		isFetchingNextPage
 	};
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@povio/ui",
-  "version": "3.2.2-rc.1",
+  "version": "3.2.2-rc.2",
   "type": "module",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",