chat / client /src /hooks /Prompts /usePromptGroupsNav.ts
Zhitomir's picture
chat init
aa2e6af
Raw
History Blame Contribute Delete
2.04 kB
import { useRecoilState, useRecoilValue } from 'recoil';
import { useMemo, useRef, useEffect, useCallback } from 'react';
import { usePromptGroupsInfiniteQuery } from '~/data-provider';
import debounce from 'lodash/debounce';
import store from '~/store';
export default function usePromptGroupsNav() {
const category = useRecoilValue(store.promptsCategory);
const [name, setName] = useRecoilState(store.promptsName);
const [pageSize, setPageSize] = useRecoilState(store.promptsPageSize);
const [pageNumber, setPageNumber] = useRecoilState(store.promptsPageNumber);
const maxPageNumberReached = useRef(1);
useEffect(() => {
if (pageNumber > 1 && pageNumber > maxPageNumberReached.current) {
maxPageNumberReached.current = pageNumber;
}
}, [pageNumber]);
const groupsQuery = usePromptGroupsInfiniteQuery({
name,
pageSize,
category,
pageNumber: pageNumber + '',
});
useEffect(() => {
maxPageNumberReached.current = 1;
setPageNumber(1);
}, [pageSize, name, category, setPageNumber]);
const promptGroups = useMemo(() => {
return groupsQuery?.data?.pages?.[pageNumber - 1 + '']?.promptGroups || [];
}, [groupsQuery.data, pageNumber]);
const nextPage = () => {
setPageNumber((prev) => prev + 1);
groupsQuery.hasNextPage && groupsQuery.fetchNextPage();
};
const prevPage = () => {
setPageNumber((prev) => prev - 1);
groupsQuery.hasPreviousPage && groupsQuery.fetchPreviousPage();
};
const isFetching = groupsQuery.isFetchingNextPage;
const hasNextPage = !!groupsQuery.hasNextPage || maxPageNumberReached.current > pageNumber;
const hasPreviousPage = !!groupsQuery.hasPreviousPage || pageNumber > 1;
const debouncedSetName = useCallback(
debounce((nextValue: string) => {
setName(nextValue);
}, 850),
[setName],
);
return {
name,
setName: debouncedSetName,
nextPage,
prevPage,
isFetching,
pageSize,
setPageSize,
hasNextPage,
groupsQuery,
promptGroups,
hasPreviousPage,
};
}