Fix Google OAuth onboarding redirection issue #92
Conversation
- Fixed TypeScript linter error in checkUserOnboarding function - Updated onAuthStateChange listener to check onboarding status and redirect appropriately - Added initial session check to handle direct navigation scenarios - Removed direct navigation from login() function to prevent conflicts - Users now properly redirected to onboarding when incomplete or dashboard when complete
WalkthroughThe changes introduce error handling and explicit boolean checks in the onboarding status function. The main authentication effect and Supabase auth state listener now both check onboarding status and redirect users accordingly, ensuring new users are routed to onboarding if incomplete. Navigation after login is deferred to these centralized checks. Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant App (AuthContext)
participant Supabase
User->>App (AuthContext): Loads app or signs in
App (AuthContext)->>Supabase: Fetch user & onboarding status
alt Error or user not onboarded
App (AuthContext)->>User: Redirect to /onboarding
else Onboarding complete & role=brand
App (AuthContext)->>User: Redirect to /brand/dashboard
else Onboarding complete & other role
App (AuthContext)->>User: Redirect to /dashboard
end
Assessment against linked issues
Poem
✨ Finishing Touches
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 3
🧹 Nitpick comments (1)
Frontend/src/context/AuthContext.tsx (1)
84-111: Good error handling, but consider optimizing database queries.The try-catch wrapper and explicit boolean coercion improve robustness. However, the function makes three sequential database calls that could be optimized.
Consider combining the queries for better performance:
- try { - // Check if user has completed onboarding by looking for social profiles or brand data - const { data: socialProfiles } = await supabase - .from("social_profiles") - .select("id") - .eq("user_id", userToUse.id) - .limit(1); - - const { data: brandData } = await supabase - .from("brands") - .select("id") - .eq("user_id", userToUse.id) - .limit(1); - - const hasOnboarding = Boolean((socialProfiles && socialProfiles.length > 0) || (brandData && brandData.length > 0)); - - // Get user role - const { data: userData } = await supabase - .from("users") - .select("role") - .eq("id", userToUse.id) - .single(); - - return { hasOnboarding, role: userData?.role || null }; + try { + // Get user data and check onboarding status in parallel + const [socialResult, brandResult, userResult] = await Promise.all([ + supabase.from("social_profiles").select("id").eq("user_id", userToUse.id).limit(1), + supabase.from("brands").select("id").eq("user_id", userToUse.id).limit(1), + supabase.from("users").select("role").eq("id", userToUse.id).single() + ]); + + const hasOnboarding = Boolean( + (socialResult.data && socialResult.data.length > 0) || + (brandResult.data && brandResult.data.length > 0) + ); + + return { hasOnboarding, role: userResult.data?.role || null };
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
Frontend/src/context/AuthContext.tsx(4 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (1)
Frontend/src/context/AuthContext.tsx (1)
Frontend/src/utils/supabase.tsx (1)
supabase(11-11)
🔇 Additional comments (2)
Frontend/src/context/AuthContext.tsx (2)
193-213: Consistent redirection logic - good implementation.The auth state change listener properly handles the SIGNED_IN event with appropriate safeguards for password reset flows.
The logic correctly:
- Only redirects on SIGNED_IN events
- Avoids conflicts during password reset
- Implements the same role-based redirection as the initial check
235-235: Good architectural decision to centralize navigation.Removing direct navigation from the login function and deferring to the auth state change listener creates a cleaner, more predictable flow.
This change ensures all navigation logic is handled in one place, reducing the chance of conflicts between different navigation triggers.
|
@Saahi30 |
Fix Google OAuth onboarding redirection issue
📌 Issue Overview
After signing up or logging in with Google, new users are not redirected to the onboarding process as expected. Instead, they are taken directly to the dashboard/home page, even if they have not completed onboarding.
🔧 Changes Made
1. Fixed TypeScript Linter Error
checkUserOnboardingfunctionBoolean()to ensurehasOnboardingis always a boolean type2. Updated Authentication State Change Handler
onAuthStateChangelistener to check onboarding status after successful sign-in/onboarding/dashboard/brand/dashboard3. Enhanced Initial Session Check
4. Removed Direct Navigation from Login Function
login()function no longer directly navigates to/dashboard🎯 How It Works Now
supabase.auth.signInWithOAuthis calledonAuthStateChangelistener is activated/onboarding🧪 Testing
📁 Files Modified
Frontend/src/context/AuthContext.tsx- Main authentication context with onboarding logicCloses #89
Summary by CodeRabbit
Bug Fixes
New Features
Chores