Consolidate Firebase initialization and fix auth context conflicts#15
Open
DigitalBlueprint239 wants to merge 1 commit into
Open
Consolidate Firebase initialization and fix auth context conflicts#15DigitalBlueprint239 wants to merge 1 commit into
DigitalBlueprint239 wants to merge 1 commit into
Conversation
Critical infrastructure fixes that were causing the app to crash on load or silently break the authentication flow: 1. firebase.ts: Changed NEXT_PUBLIC_ to REACT_APP_ (CRA env prefix). Removed crash-on-missing-vars; now logs a warning instead so the UI renders the login screen rather than a blank white page. 2. firestore.ts: Removed independent Firebase app initialization with VITE_* env vars. Now imports db/auth from the shared firebase.ts. Prevents a second Firebase instance from being created silently. 3. AuthProvider.tsx: Replaced anonymous signInAnonymously provider with a re-export of hooks/useAuth.tsx. The two AuthContext instances were causing every Dashboard mount to throw "useAuth must be used within an AuthProvider" because App.tsx provided one context and Dashboard read from a completely separate one. 4. LoginPage.tsx: Created src/components/auth/LoginPage.tsx with email/password sign-in and sign-up, client-side validation, and Firebase error code → human-readable message translation. 5. App.tsx: Added AppContent auth gate. Unauthenticated users always see LoginPage. Auth loading state shows a spinner (no flash). Team and AI providers now mount only after auth resolves, so TeamContext always has a valid auth.currentUser on first render. 6. SmartPlaybook/src/services/firebase.ts: Consolidated orphaned second Firebase app to re-export from the shared instance. 7. Dashboard.tsx: Wired Practice Plans stat to real Firestore count via usePracticePlans hook (was hardcoded to 0). 8. .env.local.example: Corrected to REACT_APP_ prefix with explanation. 9. MASTER_TRACKER.md: Created living project tracker with file index, auth architecture diagram, resolved/deferred issue lists, and next session guidance (player roster UI). https://claude.ai/code/session_01QCc5kbTa6iyNNFPpPUeiNk
❌ Deploy Preview for magical-starlight-0c1207 failed.
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This PR consolidates Firebase initialization into a single shared instance and fixes critical auth context conflicts that were preventing proper authentication. The app now uses email/password authentication with proper error handling, and all Firebase operations flow through a single initialization point.
Key Changes
Firebase Initialization & Consolidation
getApps()guard to prevent multiple app instancesinitializeApp()call; now importsdbandauthfrom shared firebase.tsNEXT_PUBLIC_toREACT_APP_(Create React App requirement)Authentication Architecture
browserLocalPersistencefor session persistence across page refreshesSupporting Changes
usePracticePlanshook to display real Firestore practice plan count via real-time subscriptionREACT_APP_prefix and added documentation explaining Create React App environment variable requirementsImplementation Details
Why the consolidation matters:
initializeApp()calls could create separate app instances, causing data to be written to different databases or auth conflictsAuth flow:
browserLocalPersistenceso users stay logged in across page refreshesonAuthStateChangedlistener in useAuth.tsx resolves the persisted session before rendering any protected contentZero breaking changes:
https://claude.ai/code/session_01QCc5kbTa6iyNNFPpPUeiNk