refactor: paging apis (#2067)

Author: aeharding

package.json

@@ -115,7 +115,7 @@
     "rehype-remark": "^10.0.1",
     "remark-parse": "^11.0.0",
     "remark-stringify": "^11.0.0",
-    "threadiverse": "^0.4.1",
+    "threadiverse": "^0.5.0",
     "ua-parser-js": "^2.0.3",
     "unified": "^11.0.5",
     "unist-util-visit": "^5.0.0",

pnpm-lock.yaml

@@ -214,7 +214,7 @@ export const modNukeCommentChain =
 
     if (!client) throw new Error("Not authorized");
 
-    const { comments } = await client.getComments({
+    const { data: comments } = await client.getComments({
       parent_id: commentId,
       max_depth: 100,
     });
@@ -265,7 +265,7 @@ export const getCommentContent = createAsyncThunk(
 
     const log = await client.getModlog({ comment_id: commentId });
 
-    return log.modlog.filter((l) => "mod_remove_comment" in l)[0]?.comment
+    return log.data.filter((l) => "mod_remove_comment" in l)[0]?.comment
       .content;
   },
   {

src/features/comment/commentSlice.ts

@@ -72,7 +72,7 @@ export default function CommentExpander({
       setLoading(false);
     }
 
-    if (response.comments.length === 0) {
+    if (response.data.length === 0) {
       presentToast({
         message: `Uh-oh. Looks like Lemmy returned 0 comments, but there's actually ${missing}`,
         color: "danger",
@@ -87,7 +87,7 @@ export default function CommentExpander({
     });
 
     // Only append comment that are direct descendants of the current comment, and unhydrated
-    const newComments = response.comments.filter((c) => {
+    const newComments = response.data.filter((c) => {
       // Say we have a tree like this. Parenthesis are missing from frontend:
       // 1
       // 1.1

src/features/comment/inTree/CommentExpander.tsx

@@ -10,7 +10,7 @@ import React, {
   useRef,
   useState,
 } from "react";
-import { CommentView } from "threadiverse";
+import { CommentView, PageCursor } from "threadiverse";
 import { VListHandle } from "virtua";
 
 import FeedLoadMoreFailed from "#/features/feed/endItems/FeedLoadMoreFailed";
@@ -70,7 +70,7 @@ export default function Comments({
   virtualEnabled,
 }: CommentsProps) {
   const dispatch = useAppDispatch();
-  const [page, setPage] = useState(0);
+  const [cursor, setCursor] = useState<PageCursor | undefined>();
   const [loading, _setLoading] = useState(true);
   const loadingRef = useRef(false);
   const finishedPagingRef = useRef(false);
@@ -220,7 +220,7 @@ export default function Comments({
       if (!ready) return;
 
       if (refresh) {
-        if (page === 0 && loadingRef.current) return; // Still loading first page
+        if (!cursor && loadingRef.current) return; // Still loading first page
         finishedPagingRef.current = false;
       } else {
         if (loadingRef.current) return;
@@ -229,7 +229,7 @@ export default function Comments({
 
       let response;
 
-      const currentPage = refresh ? 1 : page + 1;
+      const currentPage = refresh ? undefined : cursor;
 
       const reqPostId = postId;
       const reqCommentId = parentCommentId;
@@ -239,14 +239,11 @@ export default function Comments({
         response = await client.getComments({
           post_id: reqPostId,
           parent_id: parentCommentId,
-          limit: 60,
           ...sortParams,
           type_: "All",
-
+          limit: 60,
           max_depth: maxDepth,
-
-          saved_only: false,
-          page: currentPage,
+          page_cursor: currentPage,
         });
       } catch (error) {
         if (reqPostId === postId && reqCommentId === parentCommentId)
@@ -258,23 +255,23 @@ export default function Comments({
         setLoadFailed(true);
         if (refresh) {
           setComments([]);
-          setPage(0);
+          setCursor(undefined);
         }
 
         throw error;
       } finally {
         setLoading(false);
       }
 
-      dispatch(receivedComments(response.comments));
+      dispatch(receivedComments(response.data));
 
       if (reqPostId !== postId || reqCommentId !== parentCommentId) return;
 
       const existingComments = refresh ? [] : comments;
 
       // Remove comments that are already received
       let newComments = differenceBy(
-        response.comments,
+        response.data,
         existingComments,
         (c) => c.comment.id,
       );
@@ -301,7 +298,7 @@ export default function Comments({
       );
 
       setComments(potentialComments);
-      setPage(currentPage);
+      setCursor(response.next_page);
       setLoadFailed(false);
 
       if (refresh) scrolledRef.current = false;
@@ -311,7 +308,7 @@ export default function Comments({
       comments,
       dispatch,
       maxDepth,
-      page,
+      cursor,
       parentCommentId,
       postId,
       presentToast,

src/features/comment/inTree/Comments.tsx

@@ -156,9 +156,9 @@ export const getTrendingCommunities =
       getState(),
     )?.listCommunities({
       type_: "All",
-      sort: "Hot",
+      sort: "Hot" as never, // TODO Piefed doesn't support Hot for communities sort, ignore for now and hopefully supported soon
       limit: 6,
     });
 
-    dispatch(recievedTrendingCommunities(trendingCommunities.communities));
+    dispatch(recievedTrendingCommunities(trendingCommunities.data));
   };

src/features/community/communitySlice.ts

@@ -58,7 +58,7 @@ export default function GuestCommunitiesList({ actor }: CommunitiesListProps) {
     let communities;
 
     try {
-      ({ communities } = await client.listCommunities({
+      ({ data: communities } = await client.listCommunities({
         ...commonPostFeedParams,
         type_: SHOW_LOCAL_ONLY.includes(actor) ? "Local" : "All",
         ...sortParams,

src/features/community/list/GuestCommunitiesList.tsx

@@ -14,6 +14,7 @@ import { Community, CommunityView } from "threadiverse";
 import useShowModeratorFeed from "#/features/community/list/useShowModeratorFeed";
 import { getHandle } from "#/helpers/lemmy";
 import { useBuildGeneralBrowseLink } from "#/helpers/routes";
+import { getTopAllSearchSort } from "#/helpers/threadiverse";
 import useClient from "#/helpers/useClient";
 import { useOptimizedIonRouter } from "#/helpers/useOptimizedIonRouter";
 import { useAppSelector } from "#/store";
@@ -173,10 +174,10 @@ export default function TitleSearchResults() {
       limit: 20,
       type_: "Communities",
       listing_type: "All",
-      sort: "TopAll",
+      ...getTopAllSearchSort(await client.getMode()),
     });
 
-    setSearchPayload(result.communities);
+    setSearchPayload(result.data as CommunityView[]);
   });
 
   useEffect(() => {

src/features/community/titleSearch/TitleSearchResults.tsx

@@ -44,7 +44,7 @@ export default function useGetRandomCommunity() {
         response = await client.listCommunities({
           type_: "All",
           limit: RANDOM_CHUNK,
-          page: Math.floor(
+          page_cursor: Math.floor(
             (Math.random() * totalCommunitiesCount) / RANDOM_CHUNK,
           ),
         });
@@ -54,7 +54,7 @@ export default function useGetRandomCommunity() {
         throw error;
       }
 
-      const randomCommunitiesByPosts = sortBy(response.communities, [
+      const randomCommunitiesByPosts = sortBy(response.data, [
         (c) => -c.counts.posts,
       ]);