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 | 1x 12x 12x 12x 12x 12x 19x 12x 19x 12x 19x 12x 9x 12x 6x 3x 12x 12x 12x 3x 3x 12x 12x | import { queryFunctionBuilder } from "@components/VirtualList/api";
import { useFiltersRepository } from "@components/VirtualList/hooks";
import { DEFAULT_QUERY_CONFIG } from "@components/VirtualList/hooks/queries";
import {
QKEY_SETTLEMENT_MERCHANTS,
SETTLEMENT_MERCHANTS_QUERY_KEY,
SETTLEMENT_QUERY_PATH,
} from "@constants/queryKeys";
import { useGetCurrentMerchantId } from "@hooks/common";
import { useStateEffect } from "@hooks/customReactCore";
import { useAppSelector } from "@redux/hooks";
import { sortingKey } from "@redux/slices/fundraisers";
import { selectDateFilter } from "@redux/slices/merchantFilters";
import { selectQueryString } from "@redux/slices/search";
import { useTable } from "componentsV2/Table/hooks/useTable";
import { useMemo, useCallback, useState } from "react";
import { useInfiniteQuery, useQueryClient } from "react-query";
export const useGetSettlementMerchants = () => {
const { queryString } = useFiltersRepository();
const { merchantId } = useGetCurrentMerchantId();
const queryClient = useQueryClient();
const [page, setPageDispatcher] = useState(1);
const sorting = useAppSelector((state) =>
sortingKey(state, QKEY_SETTLEMENT_MERCHANTS),
);
const settlementDate = useAppSelector((state) =>
selectDateFilter(state, "settlement-date"),
);
const searchQuery = useAppSelector((state) =>
selectQueryString(state, SETTLEMENT_QUERY_PATH),
);
const {
data,
isFetchingNextPage,
fetchNextPage,
hasNextPage,
isLoading,
isFetching,
} = useInfiniteQuery(
[
SETTLEMENT_MERCHANTS_QUERY_KEY,
merchantId,
searchQuery,
settlementDate,
sorting,
],
queryFunctionBuilder({
queryString,
rowsPerPage: 20,
path: SETTLEMENT_QUERY_PATH,
sorting,
merchantId: merchantId,
searchQuery,
...(settlementDate && {
filter: `settlementDate:"${settlementDate}"`,
}),
}),
{
...DEFAULT_QUERY_CONFIG,
getNextPageParam: (lastPage: any) => {
return lastPage.nextCursor;
},
},
);
// Flatten all pages into one array
const allRows = useMemo<any[]>(
() =>
data?.pages?.[0]?.data
? data.pages.flatMap((page: any) => page.data ?? [])
: [],
[data],
);
const totalRows = allRows.length;
// Infinite scroll load more handler
const handleLoadMore = useCallback(() => {
if (!isFetchingNextPage && hasNextPage) {
fetchNextPage();
setPageDispatcher((prev) => prev + 1);
}
}, [isFetchingNextPage, hasNextPage, fetchNextPage]);
// Reset queries when filters/sorting/search change
useStateEffect(() => {
queryClient.invalidateQueries([SETTLEMENT_MERCHANTS_QUERY_KEY]);
setPageDispatcher(1);
}, [sorting, queryString, searchQuery, settlementDate]);
const { setSelectedRowIdx, loadMore, numberOfPages, selectedRowIdx } =
useTable({
useIdForRows: true,
allRows,
isLoading,
totalRows,
isFetching,
page,
setPageDispatcher,
setPage: handleLoadMore,
openModal: "-",
paginationMethod: "cursor",
nextCursor: hasNextPage ? page + 1 : null,
enabledInfiniteScroll: true,
});
return {
allRows,
setSelectedRowIdx,
loadMore,
numberOfPages,
selectedRowIdx,
handlePageChange: handleLoadMore,
isFetchingNextPage,
isLoading,
totalRows,
setPageDispatcher,
page,
};
};
|