From cd0d39a9eac1724ec553360e673d9ec483f38f26 Mon Sep 17 00:00:00 2001 From: Deepak Pandey Date: Mon, 15 Sep 2025 13:32:06 +0530 Subject: [PATCH 1/2] Enhance OAuth provider data extraction for better name pre-filling - Improve first name and last name extraction from OAuth providers (Google, GitHub, etc.) - Support multiple OAuth provider data formats: - first_name/given_name for first name - last_name/family_name for last name - name field parsing for full name splitting - Prioritize OAuth provider data over existing profile data - Add visual indicators showing when fields are pre-filled from OAuth - Enhance profile service to better handle OAuth metadata during profile creation - Add debugging logs to track OAuth provider data extraction --- app/complete-profile/page.tsx | 48 ++++++++++++++++++++++++++++++----- lib/services/profile.ts | 19 ++++++++++++-- 2 files changed, 58 insertions(+), 9 deletions(-) diff --git a/app/complete-profile/page.tsx b/app/complete-profile/page.tsx index 9ebe8c24..1d598819 100644 --- a/app/complete-profile/page.tsx +++ b/app/complete-profile/page.tsx @@ -36,6 +36,7 @@ export default function CompleteProfile() { const [usernameError, setUsernameError] = useState(''); const [user, setUser] = useState(null); const [isValidating, setIsValidating] = useState(true); + const [oauthProvider, setOauthProvider] = useState(''); const usernameCheckTimeout = useRef | null>(null); const getSupabaseClient = () => { @@ -82,15 +83,40 @@ export default function CompleteProfile() { // Continue with the form - profileService will handle creation if needed } - // Pre-fill from OAuth provider data if available + // Pre-fill from OAuth provider data if available (prioritize OAuth data over existing profile data) if (user.user_metadata) { const metadata = user.user_metadata; - if (!firstName && (metadata.first_name || metadata.given_name)) { - setFirstName(metadata.first_name || metadata.given_name || ''); + + // Extract first name from various OAuth provider formats + const oauthFirstName = metadata.first_name || + metadata.given_name || + metadata.name?.split(' ')[0] || + ''; + + // Extract last name from various OAuth provider formats + const oauthLastName = metadata.last_name || + metadata.family_name || + metadata.name?.split(' ').slice(1).join(' ') || + ''; + + // Use OAuth data if available, otherwise keep existing profile data + if (oauthFirstName) { + setFirstName(oauthFirstName); } - if (!lastName && (metadata.last_name || metadata.family_name)) { - setLastName(metadata.last_name || metadata.family_name || ''); + if (oauthLastName) { + setLastName(oauthLastName); } + + // Set OAuth provider for UI display + setOauthProvider(metadata.provider || 'unknown'); + + console.log('OAuth provider data:', { + provider: metadata.provider || 'unknown', + firstName: oauthFirstName, + lastName: oauthLastName, + fullName: metadata.name, + metadata: metadata + }); } } catch (error) { @@ -287,7 +313,11 @@ export default function CompleteProfile() { {/* First Name */}
Date: Mon, 15 Sep 2025 13:38:56 +0530 Subject: [PATCH 2/2] Fix build errors: ESLint warnings and Suspense boundary - Fix useCallback dependency array by removing unnecessary firstName/lastName dependencies - Wrap useSearchParams in Suspense boundary to fix Next.js build error - Refactor CompleteProfile component into CompleteProfileContent with Suspense wrapper - Add proper loading fallback for Suspense boundary - Resolve all build and linting issues for production deployment --- app/complete-profile/page.tsx | 22 +++++++++++++++++++--- 1 file changed, 19 insertions(+), 3 deletions(-) diff --git a/app/complete-profile/page.tsx b/app/complete-profile/page.tsx index 1d598819..1c89cec2 100644 --- a/app/complete-profile/page.tsx +++ b/app/complete-profile/page.tsx @@ -1,6 +1,6 @@ 'use client'; -import { useState, useEffect, useCallback, useRef } from 'react'; +import { useState, useEffect, useCallback, useRef, Suspense } from 'react'; import { useRouter, useSearchParams } from 'next/navigation'; import Link from 'next/link'; import { createClient } from '@/lib/supabase/client'; @@ -22,7 +22,7 @@ interface User { }; } -export default function CompleteProfile() { +function CompleteProfileContent() { const router = useRouter(); const searchParams = useSearchParams(); const returnUrl = searchParams.get('returnUrl') || '/protected/dashboard'; @@ -125,7 +125,7 @@ export default function CompleteProfile() { } finally { setIsValidating(false); } - }, [router, firstName, lastName]); + }, [router, returnUrl]); useEffect(() => { checkUser(); @@ -490,3 +490,19 @@ export default function CompleteProfile() {
); } + +export default function CompleteProfile() { + return ( + +
+
+
+
+ Loading... + + }> + + + ); +}