fix server side hydration of thread feed

Southclaws · Jan 11, 2025 · 487f215 · 487f215
1 parent a5c8215
commit 487f215
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 6 deletions.
diff --git a/web/src/screens/category/CategoryScreen.tsx b/web/src/screens/category/CategoryScreen.tsx
@@ -35,7 +35,7 @@ export function CategoryScreen(props: ScreenProps) {
 
       <ThreadFeedScreen
         initialPage={props.initialPage}
-        initialPageData={[props.initialThreadList]}
+        initialPageData={props.initialThreadList}
         category={category}
       />
     </LStack>

diff --git a/web/src/screens/feed/FeedScreen.tsx b/web/src/screens/feed/FeedScreen.tsx
@@ -68,7 +68,7 @@ async function ThreadFeedScreenContent({ initialSession, page }: PageProps) {
       <ThreadFeedScreen
         initialSession={initialSession}
         initialPage={page}
-        initialPageData={[threads.data]}
+        initialPageData={threads.data}
       />
     );
   } catch (e) {

diff --git a/web/src/screens/feed/ThreadFeedScreen/useThreadFeedScreen.ts b/web/src/screens/feed/ThreadFeedScreen/useThreadFeedScreen.ts
@@ -6,14 +6,21 @@ import { Account, Category, ThreadListResult } from "@/api/openapi-schema";
 export type Props = {
   initialSession?: Account;
   initialPage: number;
-  initialPageData?: ThreadListResult[];
+  initialPageData?: ThreadListResult;
   category?: Category;
 };
 
 export function useThreadFeedScreen(props: Props) {
-  const { data, error } = useThreadList({
-    page: props.initialPage.toString(),
-  });
+  const { data, error } = useThreadList(
+    {
+      page: props.initialPage.toString(),
+    },
+    {
+      swr: {
+        fallbackData: props.initialPageData,
+      },
+    },
+  );
   if (!data) {
     return {
       ready: false as const,