diff --git a/src/app/page.tsx b/src/app/page.tsx
index bbf1611..37629a1 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -4,7 +4,6 @@ import { HydrateClient } from "~/trpc/server";
 import FileGrid from "~/app/_components/FileGrid";
 import UploadForm from "~/app/_components/UploadForm";
 import { Toaster } from "react-hot-toast";
-import { signIn, signOut } from "next-auth/react";
 
 export default async function Home() {
   const session = await auth();
@@ -43,12 +42,14 @@ export default async function Home() {
           )}
           {!session?.user && (
           <div className="flex flex-col items-center gap-2">
-            <button
-              onClick={() => (session ? signOut() : signIn())}
-              className="rounded-full bg-white/10 px-10 py-3 font-semibold no-underline transition hover:bg-white/20"
-            >
-              {session ? "Sign out" : "Sign in"}
-            </button>
+            <div className="flex flex-col items-center justify-center gap-4">
+              <Link
+                href={session ? "/api/auth/signout" : "/api/auth/signin"}
+                className="rounded-full bg-white/10 px-10 py-3 font-semibold no-underline transition hover:bg-white/20"
+              >
+                {session ? "Sign out" : "Sign in"}
+              </Link>
+            </div>
           </div>
           )}
         </div>
diff --git a/src/components/Auth.tsx b/src/components/Auth.tsx
deleted file mode 100644
index e69de29..0000000
diff --git a/src/trpc/server.ts b/src/trpc/server.ts
index 3f4a52f..9e72cbe 100644
--- a/src/trpc/server.ts
+++ b/src/trpc/server.ts
@@ -8,7 +8,6 @@ import { createCaller, type AppRouter } from "~/server/api/root";
 import { createTRPCContext } from "~/server/api/trpc";
 import { createQueryClient } from "./query-client";
 
-
 /**
  * This wraps the `createTRPCContext` helper and provides the required context for the tRPC API when
  * handling a tRPC call from a React Server Component.