refactor: Migrating to trpc instead of next's route handers

packages/db/index.ts

@@ -1,14 +1,14 @@
 import { PrismaClient } from "@prisma/client";
 
-const prisma = new PrismaClient({
-    log:
-        process.env.NODE_ENV === "development"
-            ? ["query", "error", "warn"]
-            : ["error"],
-});
-
-// For some weird reason accessing @prisma/client from any package is causing problems (specially in error handling).
-// Re export them here instead.
-export * from "@prisma/client";
+const globalForPrisma = globalThis as unknown as {
+  prisma: PrismaClient | undefined;
+};
 
-export default prisma;
+export const prisma =
+  globalForPrisma.prisma ??
+  new PrismaClient({
+    log:
+      process.env.NODE_ENV === "development"
+        ? ["query", "error", "warn"]
+        : ["error"],
+  });

packages/web/app/api/auth/[...nextauth]/route.tsx

@@ -1,3 +1,3 @@
-import { authHandler } from "@/lib/auth";
+import { authHandler } from "@/server/auth";
 
 export { authHandler as GET, authHandler as POST };

packages/web/app/api/trpc/[trpc]/route.ts

@@ -1,10 +1,12 @@
-import { fetchRequestHandler } from '@trpc/server/adapters/fetch';
-import { appRouter } from '@/server/routers/_app';
+import { fetchRequestHandler } from "@trpc/server/adapters/fetch";
+import { appRouter } from "@/server/api/routers/_app";
+import { createContext } from "@/server/api/client";
+
 const handler = (req: Request) =>
   fetchRequestHandler({
-    endpoint: '/api/trpc',
+    endpoint: "/api/trpc",
     req,
     router: appRouter,
-    createContext: () => ({})
+    createContext,
   });
 export { handler as GET, handler as POST };

packages/web/app/dashboard/bookmarks/archive/page.tsx

@@ -1,5 +1,5 @@
 import Bookmarks from "../components/Bookmarks";
 
 export default async function ArchivedBookmarkPage() {
-  return <Bookmarks title="Archive" archived={true} favourited={false} />;
+  return <Bookmarks title="Archive" archived={true} />;
 }

packages/web/app/dashboard/bookmarks/components/AddLink.tsx

@@ -3,13 +3,13 @@
 import { Button } from "@/components/ui/button";
 import { Form, FormControl, FormField, FormItem } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
-import APIClient from "@/lib/api";
 import { Plus } from "lucide-react";
 import { useRouter } from "next/navigation";
 import { useForm, SubmitErrorHandler } from "react-hook-form";
 import { z } from "zod";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { toast } from "@/components/ui/use-toast";
+import { api } from "@/lib/trpc";
 
 const formSchema = z.object({
   url: z.string().url({ message: "The link must be a valid URL" }),
@@ -23,9 +23,10 @@ export default function AddLink() {
   });
 
   async function onSubmit(value: z.infer<typeof formSchema>) {
-    const [_resp, error] = await APIClient.bookmarkLink(value.url);
-    if (error) {
-      toast({ description: error.message, variant: "destructive" });
+    try {
+      await api.bookmarks.bookmarkLink.mutate({ url: value.url, type: "link" });
+    } catch (e) {
+      toast({ description: "Something went wrong", variant: "destructive" });
       return;
     }
     router.refresh();

packages/web/app/dashboard/bookmarks/components/BookmarkOptions.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { useToast } from "@/components/ui/use-toast";
-import APIClient from "@/lib/api";
+import { api } from "@/lib/trpc";
 import { ZBookmark, ZUpdateBookmarksRequest } from "@/lib/types/api/bookmarks";
 import { useRouter } from "next/navigation";
 import { Button } from "@/components/ui/button";
@@ -19,36 +19,37 @@ export default function BookmarkOptions({ bookmark }: { bookmark: ZBookmark }) {
   const linkId = bookmark.id;
 
   const unbookmarkLink = async () => {
-    const [_, error] = await APIClient.deleteBookmark(linkId);
+    try {
+      await api.bookmarks.deleteBookmark.mutate({
+        bookmarkId: linkId,
+      });
 
-    if (error) {
+      toast({
+        description: "The bookmark has been deleted!",
+      });
+    } catch (e) {
       toast({
         variant: "destructive",
         title: "Something went wrong",
         description: "There was a problem with your request.",
       });
-    } else {
-      toast({
-        description: "The bookmark has been deleted!",
-      });
     }
 
     router.refresh();
   };
 
   const updateBookmark = async (req: ZUpdateBookmarksRequest) => {
-    const [_, error] = await APIClient.updateBookmark(linkId, req);
-
-    if (error) {
+    try {
+      await api.bookmarks.updateBookmark.mutate(req);
+      toast({
+        description: "The bookmark has been updated!",
+      });
+    } catch (e) {
       toast({
         variant: "destructive",
         title: "Something went wrong",
         description: "There was a problem with your request.",
       });
-    } else {
-      toast({
-        description: "The bookmark has been updated!",
-      });
     }
 
     router.refresh();
@@ -63,13 +64,20 @@ export default function BookmarkOptions({ bookmark }: { bookmark: ZBookmark }) {
       </DropdownMenuTrigger>
       <DropdownMenuContent className="w-fit">
         <DropdownMenuItem
-          onClick={() => updateBookmark({ favourited: !bookmark.favourited })}
+          onClick={() =>
+            updateBookmark({
+              bookmarkId: linkId,
+              favourited: !bookmark.favourited,
+            })
+          }
         >
           <Star className="mr-2 size-4" />
           <span>{bookmark.favourited ? "Un-favourite" : "Favourite"}</span>
         </DropdownMenuItem>
         <DropdownMenuItem
-          onClick={() => updateBookmark({ archived: !bookmark.archived })}
+          onClick={() =>
+            updateBookmark({ bookmarkId: linkId, archived: !bookmark.archived })
+          }
         >
           <Archive className="mr-2 size-4" />
           <span>{bookmark.archived ? "Un-archive" : "Archive"}</span>

packages/web/app/dashboard/bookmarks/components/Bookmarks.tsx

@@ -1,25 +1,26 @@
 import { redirect } from "next/navigation";
 import BookmarksGrid from "./BookmarksGrid";
-import { authOptions } from "@/lib/auth";
-import { getServerSession } from "next-auth";
-import { getBookmarks } from "@/lib/services/bookmarks";
 import { ZGetBookmarksRequest } from "@/lib/types/api/bookmarks";
+import { api } from "@/server/api/client";
+import { getServerAuthSession } from "@/server/auth";
 
 export default async function Bookmarks({
   favourited,
   archived,
   title,
 }: ZGetBookmarksRequest & { title: string }) {
-  const session = await getServerSession(authOptions);
+  const session = await getServerAuthSession();
   if (!session) {
     redirect("/");
   }
-  const bookmarks = await getBookmarks(session.user.id, {
+
+  // TODO: Migrate to a server side call in trpc instead
+  const bookmarks = await api.bookmarks.getBookmarks({
     favourited,
     archived,
   });
 
-  if (bookmarks.length == 0) {
+  if (bookmarks.bookmarks.length == 0) {
     // TODO: This needs to be polished
     return (
       <>
@@ -32,7 +33,7 @@ export default async function Bookmarks({
   return (
     <>
       <div className="container pb-4 text-2xl">{title}</div>
-      <BookmarksGrid bookmarks={bookmarks} />
+      <BookmarksGrid bookmarks={bookmarks.bookmarks} />
     </>
   );
 }

packages/web/app/dashboard/components/Sidebar.tsx

@@ -1,12 +1,11 @@
 import { Button } from "@/components/ui/button";
-import { authOptions } from "@/lib/auth";
 import { Archive, MoreHorizontal, Star, Tag, Home, Brain } from "lucide-react";
-import { getServerSession } from "next-auth";
 import { redirect } from "next/navigation";
 import SidebarItem from "./SidebarItem";
+import { getServerAuthSession } from "@/server/auth";
 
 export default async function Sidebar() {
-  const session = await getServerSession(authOptions);
+  const session = await getServerAuthSession();
   if (!session) {
     redirect("/");
   }