ng

frontend/src/pages/ResetPassword.jsx

@@ -12,7 +12,7 @@ const ResetPassword = () => {
   const { loading, error } = useSelector(state => state.auth);
   
   const [formData, setFormData] = useState({
-    token: '',
+    token: '', // This is likely unused in the v2 flow, but kept for structure
     password: '',
     confirmPassword: ''
   });
@@ -24,11 +24,34 @@ const ResetPassword = () => {
     password: false,
     confirmPassword: false
   });
-  
-  // Get token from URL params
+  const [authState, setAuthState] = useState({ event: null, session: null });
+
+  // --- Listen for auth state changes specifically on this page ---
+  // This helps confirm if PASSWORD_RECOVERY was detected
+  useEffect(() => {
+    console.log("ResetPassword component mounted. Setting up auth listener.");
+    const { data: authListener } = supabase.auth.onAuthStateChange((event, session) => {
+      console.log('Auth state changed within ResetPassword component:', event, session ? `User: ${session.user?.id || 'N/A'}` : 'No session');
+      setAuthState({ event, session });
+      
+      if (event === 'PASSWORD_RECOVERY') {
+        console.log('*** PASSWORD_RECOVERY event confirmed in ResetPassword component. ***');
+        // Optional: You could set some state here to indicate the recovery flow is active
+      }
+    });
+
+    // Cleanup listener on unmount
+    return () => {
+      console.log("ResetPassword component unmounting. Removing auth listener.");
+      authListener?.subscription.unsubscribe();
+    };
+  }, []);
+
+  // Get token from URL params (old v1 flow, kept for reference but likely not used)
   useEffect(() => {
     const token = searchParams.get('token');
     if (token) {
+      console.warn("Token found in search params (v1 flow?). This might be unexpected in v2 flow:", token);
       setFormData(prev => ({ ...prev, token }));
     }
   }, [searchParams]);
@@ -98,32 +121,36 @@ const ResetPassword = () => {
     }
 
     try {
+      console.log("Attempting to get current session before password update...");
+      
       // --- Check for existing session (recovery session) ---
       // It's crucial to verify the session was established by the Supabase client
       // when it processed the URL fragments on app load.
-      const { data: { session }, error: sessionError } = await supabase.auth.getSession();
+      const { data: { session: currentSession }, error: sessionError } = await supabase.auth.getSession();
+      console.log("Current session check result:", currentSession ? `Session for user: ${currentSession.user?.id || 'N/A'}` : 'No session', sessionError);
+      
       if (sessionError) {
-        console.error('Error getting session:', sessionError);
+        console.error('Error getting current session:', sessionError);
         alert('Failed to get session. Please try resetting your password again.');
-        // Optionally, redirect to /forgot-password
-        // navigate('/forgot-password');
         return;
       }
 
-      if (!session || !session.user) {
+      if (!currentSession || !currentSession.user) {
         // This is the likely cause of AuthSessionMissingError
-        console.warn('No active session found. The URL might not have been processed correctly or the session expired.');
+        console.warn('No active session found in handleSubmit. The URL might not have been processed correctly or the session expired.');
+        console.log("Auth state at time of submission:", authState);
         alert('Password reset link may be invalid or expired. Please request a new one.');
         // Optionally, redirect to /forgot-password
         // navigate('/forgot-password');
         return;
       }
 
-      console.log('Resetting password with Supabase client for user:', session.user?.email);
+      console.log('Resetting password with Supabase client for user:', currentSession.user?.email);
 
       const { data, error } = await supabase.auth.updateUser({
         password: formData.password
       });
+      console.log("supabase.auth.updateUser result:", data, error);
 
       if (error) {
         console.error('Supabase password reset error:', error);
@@ -141,8 +168,7 @@ const ResetPassword = () => {
 
       console.log('Password updated successfully:', data);
       alert('Password reset successfully! You can now log in with your new password.');
-      // After successful reset, the session might need to be cleared or re-established.
-      // Consider logging the user out of the recovery session.
+      // After successful reset, sign the user out of the temporary recovery session.
       await supabase.auth.signOut(); 
       navigate('/login');
 
@@ -171,6 +197,14 @@ const ResetPassword = () => {
         
         {/* Auth Card */}
         <div className="bg-white rounded-2xl shadow-xl p-4 sm:p-8 space-y-4 sm:space-y-6 animate-slide-up animate-delay-100">
+          {/* --- Debug Info Display (Remove in production) --- */}
+          <div className="bg-yellow-50 border border-yellow-200 rounded-lg p-2 text-xs">
+            <strong>Debug Info:</strong>
+            <p>Auth Event: {authState.event || 'None'}</p>
+            <p>Auth Session User ID: {authState.session?.user?.id || 'None'}</p>
+          </div>
+          {/* --- End Debug Info --- */}
+
           {/* Error Message */}
           {error && (
             <div className="bg-red-50 border border-red-200 rounded-lg p-3 sm:p-4 animate-slide-up animate-delay-200">

frontend/src/services/supabaseClient.js

@@ -38,17 +38,58 @@ export const supabase = createClient(
   }
 );
 
-// --- Add logging to debug session initialization ---
+// --- Add comprehensive logging for auth state changes ---
+let initialSessionCheckDone = false;
+
+// Listen for auth state changes
+const { data: authListener } = supabase.auth.onAuthStateChange((event, session) => {
+  console.log('Supabase Auth State Change Event:', event);
+  console.log('Supabase Auth State Change Session:', session ? `User: ${session.user?.id || 'N/A'}` : 'No session');
+
+  // Handle specific events
+  if (event === 'PASSWORD_RECOVERY') {
+    console.log('*** PASSWORD_RECOVERY event detected. A password reset link was used. ***');
+    // The session provided here should be the temporary recovery session.
+    // The app should now allow the user to set a new password.
+  } else if (event === 'SIGNED_IN') {
+    console.log('User signed in.');
+  } else if (event === 'SIGNED_OUT') {
+    console.log('User signed out.');
+  } else if (event === 'TOKEN_REFRESHED') {
+    console.log('Session token refreshed.');
+  } else if (event === 'USER_UPDATED') {
+    console.log('User data updated.');
+  }
+});
+
 console.log("Supabase client initialized with URL:", supabaseUrl);
+
+// Initial session check on app load
 supabase.auth.getSession()
   .then(({ data: { session }, error }) => {
+    initialSessionCheckDone = true;
     if (error) {
       console.error("Error getting initial session:", error);
     } else {
-      console.log("Initial session from URL (on app load):", session ? "Session exists" : "No session");
-      // Note: The actual session details might be sensitive, so just log existence.
-      // If session is null here when coming from a reset link, it means processing failed.
+      console.log("Initial session check result (on app load):", session ? `Session exists for user: ${session.user?.id || 'N/A'}` : "No active session found");
+      // If session is null here when coming from a reset link, it means processing failed or the token was already used/expired.
     }
   });
 
+// Fallback check in case the initial check happens too early or misses something
+setTimeout(() => {
+    if (!initialSessionCheckDone) {
+        console.warn("Initial session check might have been missed or delayed. Checking again...");
+        supabase.auth.getSession()
+        .then(({ data: { session }, error }) => {
+            initialSessionCheckDone = true; // Mark as done even on retry
+            if (error) {
+            console.error("Fallback - Error getting session:", error);
+            } else {
+            console.log("Fallback - Session check result:", session ? `Session exists for user: ${session.user?.id || 'N/A'}` : "No active session found (Fallback)");
+            }
+        });
+    }
+}, 1000); // Check again after 1 second
+
 export default supabase;