refactor: migrate auth pages to better-auth client

src/app/auth/signout/page.tsx

@@ -1,14 +1,29 @@
-import { signOut, auth } from "@/auth"
+"use client"
+
+import { signOut, useSession } from "@/lib/auth-client"
 import { Button } from "@/components/ui/button"
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
-import { redirect } from "next/navigation"
 import Link from "next/link"
+import { useRouter } from "next/navigation"
+import { useEffect } from "react"
 
-export default async function SignOutPage() {
-  const session = await auth()
-  
-  if (!session) {
-    redirect("/")
+export default function SignOutPage() {
+  const { data: session, isPending } = useSession()
+  const router = useRouter()
+
+  useEffect(() => {
+    if (!session) {
+      router.push("/")
+    }
+  }, [session, router])
+
+  const handleSignOut = async () => {
+    await signOut()
+    router.push("/")
+  }
+
+  if (isPending || !session) {
+    return null
   }
 
   return (
@@ -25,19 +40,12 @@ export default async function SignOutPage() {
             <div className="text-sm text-muted-foreground">Currently signed in as</div>
             <div className="font-medium">{session.user?.name || session.user?.email}</div>
           </div>
-          
+
           <div className="grid grid-cols-2 gap-3">
-            <form
-              action={async () => {
-                "use server"
-                await signOut({ redirectTo: "/" })
-              }}
-            >
-              <Button type="submit" variant="destructive" className="w-full">
-                Sign Out
-              </Button>
-            </form>
-            
+            <Button onClick={handleSignOut} variant="destructive" className="w-full">
+              Sign Out
+            </Button>
+
             <Button variant="outline" asChild>
               <Link href="/">Cancel</Link>
             </Button>
@@ -46,4 +54,4 @@ export default async function SignOutPage() {
       </Card>
     </div>
   )
-}
+}