Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 | 515x 515x 238x 238x 238x 238x 238x 128x 238x 238x 238x 192x 192x 192x 175x 17x 192x 515x | import { useInfiniteQuery } from "react-query";
import { queryFunctionBuilder, QueryFunctionBuilderParamsType } from "../api";
import { useCallback, useRef, useEffect } from "react";
import { checkPortals } from "@utils/routing";
export const DEFAULT_QUERY_CONFIG = {
staleTime: 1000 * 60 * 0.5,
cacheTime: 1000 * 60 * 2,
refetchOnReconnect: false,
refetchOnMount: false,
};
export const useGetInfiniteTransactionsV2 = (
queryParams: QueryFunctionBuilderParamsType,
config: any,
useDefaultConfig = true,
) => {
const { isEnterprisePortal } = checkPortals();
// Keep query params in a ref so the query function always uses the latest values when it runs.
// useInfiniteQuery can use the first queryFn instance for the lifetime of the query; without this,
// fetchNextPage / refetch could run with stale params (e.g. after filter/sort change before key updates).
const queryParamsRef = useRef(queryParams);
useEffect(() => {
queryParamsRef.current = queryParams;
}, [queryParams]);
const stableQueryFn = useCallback(
(context: { pageParam?: unknown; signal?: AbortSignal }) =>
queryFunctionBuilder({
...queryParamsRef.current,
isEnterprisePortal,
})(context),
[isEnterprisePortal],
);
const queryConfig = useDefaultConfig
? DEFAULT_QUERY_CONFIG
: {
staleTime: 0,
cacheTime: 1000 * 30,
refetchOnWindowFocus: true,
refetchOnReconnect: true,
};
const { queryKey, enabled, ...restConfig } = config;
return useInfiniteQuery(queryKey, stableQueryFn, {
getNextPageParam: (lastPage: any, allPages: any[] = []) => {
const params = queryParamsRef.current;
// Use the actual last page from allPages so we're robust when react-query
// calls this multiple times (e.g. multiple observers) or with intermediate state.
const actualLastPage =
Array.isArray(allPages) && allPages.length > 0
? allPages[allPages.length - 1]
: lastPage;
if (params.paginationMethod === "cursor" && params.nextCursorValue) {
params.nextCursorValue.current = actualLastPage?.nextCursor ?? null;
} else Iif (params.pageRef && !actualLastPage?.nextCursor) {
params.pageRef.current = null;
}
return actualLastPage?.nextCursor ?? null;
},
...queryConfig,
...(typeof enabled === "boolean" && { enabled }),
...restConfig,
});
};
export const useGetInfiniteTransactions = (queryParams: any, config: any) => {
// this is a hack,
// when we invalidate/refetch queries,
// useInfiniteQuery uses the very first instance of query function provided to it
// this workaround is to keep a stable function reeference
// and make sure the query function is always updated with the latest search params
// the correct solution is to pass config.queryKey as an array of [queryKey, queryParams]
// but seems this can be a tech debt item because it can require a lot of changes and side effects
const queryParamsRef = useRef(queryParams);
useEffect(() => {
queryParamsRef.current = queryParams;
}, [queryParams]);
const stableQueryFunction = useCallback((context: any) => {
return queryFunctionBuilder(queryParamsRef.current)(context);
}, []);
const {
status,
data,
error,
isFetching,
isFetchingNextPage,
isFetchingPreviousPage,
fetchNextPage,
fetchPreviousPage,
hasNextPage,
hasPreviousPage,
isLoading,
remove,
} = useInfiniteQuery(config.queryKey, stableQueryFunction, {
getNextPageParam: (lastPage: any) => {
return lastPage.nextCursor;
},
...(typeof config.enabled === "boolean" && {
enabled: config.enabled,
...DEFAULT_QUERY_CONFIG,
}),
refetchOnMount: false,
});
return {
status,
data,
error,
isFetching,
isFetchingNextPage,
isFetchingPreviousPage,
isLoading,
fetchNextPage,
fetchPreviousPage,
hasNextPage,
hasPreviousPage,
remove,
};
};
export type useGetInfiniteTransactionsReturnType = ReturnType<
typeof useGetInfiniteTransactions
>;
|