How to fix auth/invalid-continue-uri: Continue URL is not valid in Firebase

// ✅ Valid URL formats
'https://yourapp.com/reset-password-complete'
'https://yourapp.com/verify-email?userId=123'
'http://localhost:3000/auth-callback'  // Only for development
'https://yourapp.page.link/reset'      // For Firebase Dynamic Links

// ❌ Invalid URL formats
'/reset-password'                      // Missing protocol and domain
'yourapp.com/reset-password'           // Missing protocol
'https://yourapp.com/#/reset'          // Contains fragment (#)
'http://yourapp.com/reset'             // HTTP in production (needs HTTPS)
'https://unauthorized.com/reset'       // Domain not authorized
'https://sub.yourapp.com/reset'        // Subdomain not authorized if only root domain is

Authorized domains should include:
- yourapp.com                    # Your production domain
- localhost                      # For development
- yourapp.page.link              # For Firebase Dynamic Links (if used)

// Development environment (localhost)
const devActionCodeSettings = {
  url: 'http://localhost:3000/reset-complete',  // HTTP OK for localhost
  handleCodeInApp: false
};

// Production environment
const prodActionCodeSettings = {
  url: 'https://yourapp.com/reset-complete',    // MUST use HTTPS
  handleCodeInApp: false
};

// Dynamic configuration based on environment
const actionCodeSettings = {
  url: process.env.NODE_ENV === 'development'
    ? 'http://localhost:3000/reset-complete'
    : 'https://yourapp.com/reset-complete',
  handleCodeInApp: false
};

// Mobile app configuration
const actionCodeSettings = {
  url: 'https://yourapp.page.link/reset',      // Dynamic Link URL
  handleCodeInApp: true,                       // Important: true for mobile apps
  dynamicLinkDomain: 'yourapp.page.link',      // Your Dynamic Link domain
  // iOS configuration
  ios: {
    bundleId: 'com.yourapp.ios',
    // appStoreId: '123456789', // Optional App Store ID
    // minimumVersion: '12.0',  // Optional minimum version
  },
  // Android configuration
  android: {
    packageName: 'com.yourapp.android',
    installApp: true,                          // Prompt to install if not installed
    minimumVersion: '12',                      // Minimum app version
  },
};

// Send password reset with Dynamic Links
sendPasswordResetEmail(auth, email, actionCodeSettings);

// ❌ Problematic - unencoded parameters
const badUrl = 'https://yourapp.com/[email protected]&token=abc/def';
// The '/' in token breaks URL parsing

// ✅ Properly encoded
const goodUrl = 'https://yourapp.com/reset?email=user%40example.com&token=abc%2Fdef';

// Using URLSearchParams for proper encoding
const params = new URLSearchParams({
  email: '[email protected]',
  token: 'abc/def',
  redirect: '/dashboard'
});
const baseUrl = 'https://yourapp.com/reset-complete';
const fullUrl = `${baseUrl}?${params.toString()}`;
// Result: https://yourapp.com/reset-complete?email=user%40example.com&token=abc%2Fdef&redirect=%2Fdashboard

// Use in Firebase
const actionCodeSettings = {
  url: fullUrl,
  handleCodeInApp: false
};

async function testContinueUrl(url) {
  const auth = getAuth();
  const testEmail = '[email protected]'; // Use a test email

  try {
    const actionCodeSettings = {
      url: url,
      handleCodeInApp: false
    };

    console.log(`Testing URL: ${url}`);
    console.log(`Domain: ${new URL(url).hostname}`);

    await sendPasswordResetEmail(auth, testEmail, actionCodeSettings);
    console.log('✅ URL accepted by Firebase');

    return { valid: true, message: 'URL accepted' };

  } catch (error) {
    console.error('❌ URL rejected:', error.code, error.message);

    // Diagnostic information
    if (error.code === 'auth/invalid-continue-uri') {
      console.log('Diagnostics:');
      console.log('- Check authorized domains in Firebase Console');
      console.log('- Ensure URL starts with https:// (production)');
      console.log('- Remove any # fragments from URL');
      console.log('- Verify domain matches exactly (no www vs non-www mismatch)');
    }

    return { valid: false, error: error.message, code: error.code };
  }
}

// Test different URLs
await testContinueUrl('https://yourapp.com/reset-complete');
await testContinueUrl('http://localhost:3000/reset-complete');
await testContinueUrl('https://yourapp.page.link/reset');

// Environment configuration
const getContinueUrl = () => {
  const env = process.env.NODE_ENV || 'development';

  switch (env) {
    case 'production':
      return 'https://yourapp.com/auth-callback';

    case 'staging':
      return 'https://staging.yourapp.com/auth-callback';

    case 'development':
    default:
      return 'http://localhost:3000/auth-callback';
  }
};

// Firebase configuration with environment detection
const getFirebaseConfig = () => {
  // Your Firebase config - ensure you're using the right project
  return {
    apiKey: process.env.FIREBASE_API_KEY,
    authDomain: process.env.FIREBASE_AUTH_DOMAIN,
    projectId: process.env.FIREBASE_PROJECT_ID,
    // ... other config
  };
};

// Common mistake: Using development Firebase config with production URLs
// or vice versa. Ensure your Firebase project matches your environment.

// Check your Firebase project ID
console.log('Current Firebase project:', firebase.app().options.projectId);

// Verify the project has your domain authorized
// Different Firebase projects = different authorized domains lists