import {useCallback, useMemo, useState} from 'react';
import {QueryKey, useInfiniteQuery} from 'react-query';
import {OffsetQueryFn} from '@config/api';
import {DEFAULT_LIMIT} from '@services/constants';

export const useOffsetInfiniteQuery = <TResponse,>(
  queryKey: QueryKey,
  queryFn: OffsetQueryFn<TResponse>,
) => {
  const [isRefreshing, setIsRefreshing] = useState(false);

  const queryResult = useInfiniteQuery(
    queryKey,
    ({pageParam}) => queryFn({offset: pageParam}),
    {
      getNextPageParam: lastPage =>
        lastPage.data.length === (lastPage.metadata.limit || DEFAULT_LIMIT)
          ? lastPage.metadata.offset +
            (lastPage.metadata.limit || DEFAULT_LIMIT)
          : null,
      onSettled: () => {
        setIsRefreshing(false);
      },
    },
  );
  const {
    data: rawData,
    fetchNextPage,
    hasNextPage,
    isFetchingNextPage,
    refetch,
  } = queryResult;

  const data = useMemo(
    () => rawData?.pages.flatMap(page => page.data) || [],
    [rawData?.pages],
  );

  const getNextPage = useCallback(() => {
    hasNextPage && !isFetchingNextPage && fetchNextPage();
  }, [fetchNextPage, hasNextPage, isFetchingNextPage]);

  const handleRefresh = useCallback(() => {
    setIsRefreshing(true);
    refetch();
  }, [refetch]);

  return {
    ...queryResult,
    data,
    rawData,
    getNextPage,
    isRefreshing,
    refresh: handleRefresh,
    isFetchingNextPage,
  };
};