cr

src/app/auth/signup/success/page.tsx

@@ -1,6 +1,43 @@
 "use client";
 
+import { useUser } from "@/hooks/useUser";
+import { useEffect, useState } from "react";
+import { redirect, RedirectType } from "next/navigation";
+
 export default function Page() {
+  const { getUser, user } = useUser();
+  const [isChecking, setIsChecking] = useState(true);
+
+  useEffect(() => {
+    if (user) {
+      return;
+    }
+    const startTime = Date.now();
+    const checkDuration = 3 * 60 * 1000; // 3 minutes in milliseconds
+    const interval = 4000; // 4 seconds
+
+    const checkUser = async () => {
+      await getUser();
+      if (Date.now() - startTime >= checkDuration) {
+        setIsChecking(false);
+      }
+    };
+
+    const intervalId = setInterval(checkUser, interval);
+
+    // Initial check
+    checkUser();
+
+    // Cleanup function
+    return () => clearInterval(intervalId);
+  }, [getUser]);
+
+  useEffect(() => {
+    if (user) {
+      redirect("/", RedirectType.push);
+    }
+  }, [user]);
+
   return (
     <div className="flex flex-col items-center justify-center min-h-screen bg-gray-100">
       <div className="max-w-md w-full bg-white shadow-md rounded-lg p-8 text-center">
@@ -12,6 +49,11 @@ export default function Page() {
         <p className="text-sm text-gray-500">
           If you don&apos;t see the email, please check your spam folder.
         </p>
+        {isChecking && (
+          <p className="text-sm text-blue-500 mt-4">
+            Waiting for email confirmation...
+          </p>
+        )}
       </div>
     </div>
   );

src/hooks/useUser.tsx

@@ -6,21 +6,22 @@ export function useUser() {
   const [user, setUser] = useState<User | null>(null);
   const [loading, setLoading] = useState(true);
 
-  useEffect(() => {
+  async function getUser() {
     const supabase = createSupabaseClient();
 
-    async function getUser() {
-      const {
-        data: { user },
-      } = await supabase.auth.getUser();
-      setUser(user);
-      setLoading(false);
-    }
+    const {
+      data: { user },
+    } = await supabase.auth.getUser();
+    setUser(user);
+    setLoading(false);
+  }
 
+  useEffect(() => {
     getUser();
   }, []);
 
   return {
+    getUser,
     user,
     loading,
   };

src/lib/supabase/middleware.ts

@@ -1,5 +1,5 @@
 import { createServerClient } from "@supabase/ssr";
-import { NextResponse, type NextRequest } from "next/server";
+import { NextRequest, NextResponse } from "next/server";
 
 export async function updateSession(request: NextRequest) {
   if (!process.env.NEXT_PUBLIC_SUPABASE_URL) {
@@ -51,14 +51,15 @@ export async function updateSession(request: NextRequest) {
     return NextResponse.redirect(url);
   }
 
-  if (
-    user &&
-    request.nextUrl.pathname.startsWith("/auth") &&
-    !request.nextUrl.pathname.startsWith("/auth/signout")
-  ) {
-    // user is logged in, respond by redirecting the user to the home page
-    const url = new URL("/", request.url);
-    return NextResponse.redirect(url);
+  if (user) {
+    if (
+      request.nextUrl.pathname.startsWith("/auth") &&
+      !request.nextUrl.pathname.startsWith("/auth/signout")
+    ) {
+      // user is logged in, respond by redirecting the user to the home page
+      const url = new URL("/", request.url);
+      return NextResponse.redirect(url);
+    }
   }
 
   // IMPORTANT: You *must* return the supabaseResponse object as it is. If you're