From 65f6e83f11c82b0ec762e11f3392a80e614ee69a Mon Sep 17 00:00:00 2001
From: Mohamed Bassem <me@mbassem.com>
Date: Sun, 1 Feb 2026 12:29:54 +0000
Subject: refactor: migrate trpc to the new react query integration mode
 (#2438)

* refactor: migrate trpc to the new react query integration mode

* more fixes

* more migrations

* upgrade trpc client
---
 .../components/public/lists/PublicBookmarkGrid.tsx | 28 ++++++++++++----------
 1 file changed, 16 insertions(+), 12 deletions(-)

(limited to 'apps/web/components/public/lists/PublicBookmarkGrid.tsx')

diff --git a/apps/web/components/public/lists/PublicBookmarkGrid.tsx b/apps/web/components/public/lists/PublicBookmarkGrid.tsx
index 18e42baa..9832c5b1 100644
--- a/apps/web/components/public/lists/PublicBookmarkGrid.tsx
+++ b/apps/web/components/public/lists/PublicBookmarkGrid.tsx
@@ -9,9 +9,10 @@ import { ActionButton } from "@/components/ui/action-button";
 import { badgeVariants } from "@/components/ui/badge";
 import { Card, CardContent } from "@/components/ui/card";
 import { Dialog, DialogContent, DialogTrigger } from "@/components/ui/dialog";
-import { api } from "@/lib/trpc";
+import { useTRPC } from "@/lib/trpc";
 import { cn } from "@/lib/utils";
 import tailwindConfig from "@/tailwind.config";
+import { useInfiniteQuery } from "@tanstack/react-query";
 import { Expand, FileIcon, ImageIcon } from "lucide-react";
 import { useInView } from "react-intersection-observer";
 import Masonry from "react-masonry-css";
@@ -199,19 +200,22 @@ export default function PublicBookmarkGrid({
   bookmarks: ZPublicBookmark[];
   nextCursor: ZCursor | null;
 }) {
+  const api = useTRPC();
   const { ref: loadMoreRef, inView: loadMoreButtonInView } = useInView();
   const { data, fetchNextPage, hasNextPage, isFetchingNextPage } =
-    api.publicBookmarks.getPublicBookmarksInList.useInfiniteQuery(
-      { listId: list.id },
-      {
-        initialData: () => ({
-          pages: [{ bookmarks: initialBookmarks, nextCursor, list }],
-          pageParams: [null],
-        }),
-        initialCursor: null,
-        getNextPageParam: (lastPage) => lastPage.nextCursor,
-        refetchOnMount: true,
-      },
+    useInfiniteQuery(
+      api.publicBookmarks.getPublicBookmarksInList.infiniteQueryOptions(
+        { listId: list.id },
+        {
+          initialData: () => ({
+            pages: [{ bookmarks: initialBookmarks, nextCursor, list }],
+            pageParams: [null],
+          }),
+          initialCursor: null,
+          getNextPageParam: (lastPage) => lastPage.nextCursor,
+          refetchOnMount: true,
+        },
+      ),
     );
 
   useEffect(() => {
-- 
cgit v1.2.3-70-g09d2

