diff --git a/src/components/common/CharacterList.tsx b/src/components/common/CharacterList.tsx index 8c5295f6..c21618e4 100644 --- a/src/components/common/CharacterList.tsx +++ b/src/components/common/CharacterList.tsx @@ -13,10 +13,10 @@ export const CharacterList: React.FC<{ open: boolean setOpen: (open: boolean) => void hasMore: boolean - loadMore: () => Promise - list: { + loadMore: () => any + list?: ({ list: any[] - }[] + } | null)[] title: string }> = ({ open, setOpen, hasMore, loadMore, list, title }) => { const { t } = useTranslation("common") @@ -36,7 +36,7 @@ export const CharacterList: React.FC<{ > {list?.length ? ( list.map((page) => - page.list?.map((sub: any, index) => { + page?.list?.map((sub: any, index) => { const character = sub?.character || sub?.fromCharacter return (
([]) - const [cursor, setCursor] = useState() - useEffect(() => { - if ( - subscriptions.isSuccess && - subscriptions.data?.list && - !siteSubscriptionList.length - ) { - setSiteSubscriptionList(subscriptions.data.list || []) - setCursor(subscriptions.data.cursor) - } - }, [ - subscriptions.isSuccess, - subscriptions.data?.list, - subscriptions.data?.cursor, - siteSubscriptionList.length, - ]) - - const [siteToSubscriptionList, setSiteToSubscriptionList] = useState( - [], - ) - const [toCursor, setToCursor] = useState() - useEffect(() => { - if ( - toSubscriptions.isSuccess && - toSubscriptions.data?.list && - !siteToSubscriptionList.length - ) { - setSiteToSubscriptionList(toSubscriptions.data.list || []) - setToCursor(toSubscriptions.data.cursor) - } - }, [ - toSubscriptions.isSuccess, - toSubscriptions.data?.list, - toSubscriptions.data?.cursor, - siteToSubscriptionList.length, - ]) - - const loadMoreSubscriptions = async () => { - if (cursor) { - const subs = await getSiteSubscriptions({ - siteId: siteId || "", - cursor, - }) - setSiteSubscriptionList((prev) => [...prev, ...(subs?.list || [])]) - setCursor(subs?.cursor) - } - } - - const loadMoreToSubscriptions = async () => { - if (cursor) { - const subs = await getSiteToSubscriptions({ - siteId: siteId || "", - cursor: toCursor, - }) - setSiteToSubscriptionList((prev) => [...prev, ...(subs?.list || [])]) - setToCursor(subs?.cursor) - } - } - return ( <> @@ -112,7 +46,7 @@ export const FollowingCount: React.FC<{ onClick={() => setIsToFollowListOpen(true)} > - {toSubscriptions.data?.total || 0} + {toSubscriptions.data?.pages?.[0]?.total || 0} {" "} {t("Followings")} @@ -121,9 +55,9 @@ export const FollowingCount: React.FC<{ open={isFollowListOpen} setOpen={setIsFollowListOpen} title="Follow List" - loadMore={loadMoreSubscriptions} - hasMore={!!cursor} - list={siteSubscriptionList} + loadMore={subscriptions.fetchNextPage} + hasMore={!!subscriptions.hasNextPage} + list={subscriptions.data?.pages} > )} {!disableList && ( @@ -131,9 +65,9 @@ export const FollowingCount: React.FC<{ open={isToFollowListOpen} setOpen={setIsToFollowListOpen} title="Follow List" - loadMore={loadMoreToSubscriptions} - hasMore={!!toCursor} - list={siteToSubscriptionList} + loadMore={toSubscriptions.fetchNextPage} + hasMore={!!toSubscriptions.hasNextPage} + list={toSubscriptions.data?.pages} > )} diff --git a/src/components/common/Reactions.tsx b/src/components/common/Reactions.tsx index 630699bf..32db7295 100644 --- a/src/components/common/Reactions.tsx +++ b/src/components/common/Reactions.tsx @@ -49,12 +49,6 @@ export const Reactions: React.FC<{ }) const { data: likeCount = 0 } = useGetLikeCounts({ pageId }) - const loadMoreLikes = async () => { - if (likesMutation.hasNextPage && !likesMutation.isFetchingNextPage) { - await likesMutation.fetchNextPage() - } - } - const like = () => { if (pageId) { if (likeStatus.isLiked) { @@ -96,12 +90,6 @@ export const Reactions: React.FC<{ }) const isMint = useCheckMint(pageId) - const loadMoreMints = async () => { - if (mints.hasNextPage && !mints.isFetchingNextPage) { - await mints.fetchNextPage() - } - } - const mint = () => { if (pageId) { if (isMint.data?.count) { @@ -398,7 +386,7 @@ export const Reactions: React.FC<{ open={isLikeListOpen} setOpen={setIsLikeListOpen} title={t("Like List")} - loadMore={loadMoreLikes} + loadMore={likesMutation.fetchNextPage} hasMore={!!likesMutation.hasNextPage} list={likesMutation.data?.pages || []} > @@ -406,7 +394,7 @@ export const Reactions: React.FC<{ open={isMintListOpen} setOpen={setIsMintListOpen} title={t("Mint List")} - loadMore={loadMoreMints} + loadMore={mints.fetchNextPage} hasMore={!!mints.hasNextPage} list={mints.data?.pages || []} > diff --git a/src/queries/site.ts b/src/queries/site.ts index 7e165f89..976cc673 100644 --- a/src/queries/site.ts +++ b/src/queries/site.ts @@ -66,21 +66,49 @@ export const useGetSubscription = (siteId: string | undefined) => { export const useGetSiteSubscriptions = (data: { siteId: string }) => { const unidata = useUnidata() - return useQuery(["getSiteSubscriptions", data], async () => { - if (!data.siteId) { - return null - } - return siteModel.getSiteSubscriptions(data, unidata) + return useInfiniteQuery({ + queryKey: ["getSiteSubscriptions", data], + queryFn: async ({ pageParam }) => { + if (!data.siteId) { + return { + total: 0, + list: [], + cursor: undefined, + } + } + return siteModel.getSiteSubscriptions( + { + ...data, + cursor: pageParam, + }, + unidata, + ) + }, + getNextPageParam: (lastPage) => lastPage?.cursor || undefined, }) } export const useGetSiteToSubscriptions = (data: { siteId: string }) => { const unidata = useUnidata() - return useQuery(["getSiteToSubscriptions", data], async () => { - if (!data.siteId) { - return null - } - return siteModel.getSiteToSubscriptions(data, unidata) + return useInfiniteQuery({ + queryKey: ["getSiteToSubscriptions", data], + queryFn: async ({ pageParam }) => { + if (!data.siteId) { + return { + total: 0, + list: [], + cursor: undefined, + } + } + return siteModel.getSiteToSubscriptions( + { + ...data, + cursor: pageParam, + }, + unidata, + ) + }, + getNextPageParam: (lastPage) => lastPage?.cursor || undefined, }) }