Refactor LoginPage to use Suspense for loading state and improve auth state handling in ExtensionBridge

web/app/auth/login/page.tsx

@@ -1,13 +1,13 @@
 "use client";
 
-import { useState, useEffect } from "react";
+import { useState, useEffect, Suspense } from "react";
 import { createClient } from "@/lib/supabase/client";
 import { getBaseUrl } from "@/lib/auth-url";
 import Link from "next/link";
 import { useSearchParams } from "next/navigation";
 import { ArrowLeft, Mail, Loader2 } from "lucide-react";
 
-export default function LoginPage() {
+function LoginForm() {
   const [email, setEmail] = useState("");
   const [password, setPassword] = useState("");
   const [error, setError] = useState("");
@@ -24,7 +24,7 @@ export default function LoginPage() {
       if (user) { window.location.href = next; }
       else { setChecking(false); }
     });
-  }, []);
+  }, [next, supabase.auth]);
 
   async function handleLogin(e: React.FormEvent) {
     e.preventDefault(); setLoading(true); setError("");
@@ -119,3 +119,15 @@ export default function LoginPage() {
     </div>
   );
 }
+
+export default function LoginPage() {
+  return (
+    <Suspense fallback={
+      <div className="min-h-screen flex items-center justify-center bg-white">
+        <Loader2 className="w-5 h-5 text-zinc-300 animate-spin" />
+      </div>
+    }>
+      <LoginForm />
+    </Suspense>
+  );
+}

web/components/extension-bridge.tsx

@@ -57,20 +57,24 @@ export function ExtensionBridge() {
     const { data: { subscription } } = supabase.auth.onAuthStateChange(async (event, session) => {
       // Handle ALL events that mean "user is logged in"
       if (session && (event === "SIGNED_IN" || event === "INITIAL_SESSION" || event === "TOKEN_REFRESHED")) {
-        const { data: profile } = await supabase
-          .from("profiles")
-          .select("plan, full_name")
-          .eq("id", session.user.id)
-          .single()
-          .then(r => r)
-          .catch(() => ({ data: null }));
+        let profileData = null;
+        try {
+          const result = await supabase
+            .from("profiles")
+            .select("plan, full_name")
+            .eq("id", session.user.id)
+            .single();
+          profileData = result.data;
+        } catch {
+          // ignore
+        }
 
         sendAuthToExtension(
           session.access_token,
           session.user.email || "",
-          profile?.full_name || session.user.user_metadata?.full_name || "",
+          profileData?.full_name || session.user.user_metadata?.full_name || "",
           session.user.id,
-          profile?.plan || "free",
+          profileData?.plan || "free",
         );
       }