Firebase Setup Guide

Complete Firebase configuration for Magic WRX authentication

🔧 Step-by-Step Setup

Step 1: Firebase Console

Go to Firebase Console

Your project is already configured: magic-wrx

Step 2: Enable Authentication

  • • Go to Authentication → Sign-in method
  • • Enable Email/Password
  • • Enable Google provider
  • • Add authorized domains: localhost

Step 3: Enable Firestore Database

  • • Go to Firestore Database
  • • Click "Create database"
  • • Choose "Start in test mode"
  • • Select your preferred location

Step 4: Configure Domain (Production)

  • • Go to Authentication → Settings
  • • Add your production domain to "Authorized domains"
  • • Example: yourdomain.com

🚨 Troubleshooting Common Issues

Error: "popup-closed-by-user"

Solution: Make sure popups are allowed in your browser and try the Google sign-in again.

Error: "400 Bad Request"

Solution: Ensure Authentication and Firestore are enabled in Firebase Console.

Error: "auth/unauthorized-domain"

Solution: Add your domain (localhost for development) to authorized domains in Firebase Auth settings.

🎯 Your Firebase Configuration

const firebaseConfig = {
  apiKey: "AIzaSyBHy6eur9Ux9-tfhybSHROXL6hbz8Vvjd4",
  authDomain: "magic-wrx.firebaseapp.com",
  projectId: "magic-wrx",
  storageBucket: "magic-wrx.firebasestorage.app",
  messagingSenderId: "24629615626",
  appId: "1:24629615626:web:f9d4d0fac5f709b996d3f3",
  measurementId: "G-RJEJT2JT5T"
};

✅ This configuration is already set up in src/lib/firebase.ts