Error: auth/configuration-not .An internal error has occurred

Question

any Idea why I m getting this issue when I click on sign Up by email and password in React-Native and Firebase ?

[Error: [auth/configuration-not] An internal error has occurred. [ CONFIGURATION_NOT_FOUND ]]

My App.js file

import React,{useEffect,useState} from 'react';
import 'react-native-gesture-handler';
import {
  StatusBar,
  View,
  Text
} from 'react-native';

import {Provider} from 'react-redux';
import {store} from './redux/store';


import Home from './screens/Home';
import Cart from './screens/Cart';
import CartDone from './screens/CartDone';
import Login from './screens/Login';
import Register from './screens/Register';
import {NavigationContainer} from '@react-navigation/native';
import {createDrawerNavigator,DrawerContentScrollView,DrawerItem} from '@react-navigation/drawer';
import Product from './screens/Product';
import {Avatar,Drawer} from 'react-native-paper';
import auth from '@react-native-firebase/auth';

const DrawerNav = createDrawerNavigator();


const App=() => {

 // Set an initializing state whilst Firebase connects
 const [initializing, setInitializing] = useState(true);
 const [user, setUser] = useState();

 // Handle user state changes
 function onAuthStateChanged(user) {
   setUser(user);
   if (initializing) setInitializing(false);
 }

 useEffect(() => {
   const subscriber = auth().onAuthStateChanged(onAuthStateChanged);
   return subscriber; // unsubscribe on unmount
 }, []);

if (initializing) return null;


if(!user){
  return(
    <Provider store={store}>
      <StatusBar barStyle="white" backgroundColor="red" />
      <NavigationContainer>
      <DrawerNav.Navigator InitialRoute="Login" drawerContent={(props)=><DrawerContent {...props}/>}>
          <DrawerNav.Screen name="Login" component={Login} />
          <DrawerNav.Screen name="Register" component={Register} />
        </DrawerNav.Navigator>
      </NavigationContainer>
    </Provider>
  );
}

  return (
    <Provider store={store}>
      <StatusBar barStyle="white" backgroundColor="red" />
      <NavigationContainer>
      <DrawerNav.Navigator InitialRoute="Home" drawerContent={(props)=><DrawerContent {...props}/>}>
          <DrawerNav.Screen name="Home" component={Home} />
          <DrawerNav.Screen name="Cart" component={Cart} />
          <DrawerNav.Screen name="CartDone" component={CartDone} />
          <DrawerNav.Screen name="Product" component={Product} />
        </DrawerNav.Navigator>
      </NavigationContainer>
    </Provider>
  );
};



function DrawerContent(props){

return(
  <DrawerContentScrollView {...props}>
  <View style={{flex:1,alignItems:"center"}}>
    <Avatar.Image style={{backgroundColor:'white'}} size={130} source={require('./assets/avatar.png')}/>
  </View>
  <Drawer.Section>
  <DrawerItem 
         label="Home"
         icon={()=>(
          <Avatar.Icon backgroundColor="white" color="black" size={30} icon="home"/>
          )}
        onPress={()=>props.navigation.navigate('Home')}
    />
    <DrawerItem 
         label="Cart"
         icon={()=>(
          <Avatar.Icon backgroundColor="white" color="black" size={30} icon="cart"/>
          )}
        onPress={()=>props.navigation.navigate('Cart')}
    />
    <DrawerItem 
         label="Login"
         icon={()=>(
          <Avatar.Icon backgroundColor="white" color="black" size={30} icon="account"/>
          )}
        onPress={()=>props.navigation.navigate('Login')}
    />
  </Drawer.Section>
</DrawerContentScrollView>
  );
}

export default App;

my Register.js file :

import React,{useState} from 'react'
import {View,StyleSheet,TouchableOpacity,TextInput} from 'react-native';
import Header from '../components/header';
import {Item,Input,Icon,Label,CheckBox,ListItem,Body,Text} from "native-base";
//react-native-hide-show-password-input
//import auth from '@react-native-firebase/auth';
import { ScrollView } from 'react-native-gesture-handler';
import firestore from '@react-native-firebase/firestore';

export default Register = ({navigation})=>{
    return (
       <Header screen="Register" component={Main} navigation={navigation} />
    )
}

const Main=(props)=>{

const [email,setemail]=useState('');
const [password,setpassword]=useState('');
const [firstName,setfirstName]=useState('');
const [lastName,setLastName]=useState('');
const [secureText,setSecureText]=useState(true);
const [isChecked,setisChecked]=useState(false);


 function CreateUser(){

 if(email!="" && email!=null && password!="" && password!=null && isChecked==true ){
     auth()
     .createUserWithEmailAndPassword(email,password)
     .then(() => {
      console.log('User account created & signed in!');
    })
    .catch(error => {
      if (error.code === 'auth/email-already-in-use') {
        console.log('That email address is already in use!');
       }
  
       if (error.code === 'auth/invalid-email') {
        console.log('That email address is invalid!');
       }
  
      console.log("last one",error);
    });
 }

// adding user to firestore
/*firestore()
  .collection('Users')
  .add({
    name: firstName+" "+lastName,
    email : email,
    password : password,
  })
  .then(() => {
    console.log('User added!');
  })
  .catch(err=>console.log(err)); */

 }


    return (
        <ScrollView>
        <View style={styles.Container}>
             <View style={styles.form}>

             <Item rounded style={styles.inputstyle}>
                <Input
                 placeholder="First Name"
                 value={firstName}
                 onChangeText={text =>setfirstName(text)}
                 underlineColor="transparent"
                />

                </Item>
                <Item rounded style={styles.inputstyle}>
                <Input
                 placeholder="Last Name"
                 value={lastName}
                 onChangeText={text =>setLastName(text)}
                 underlineColor="transparent"
                />

                </Item>
                <Item rounded style={styles.inputstyle}>
                <Input
                 placeholder="Email"
                 value={email}
                 onChangeText={text =>setemail(text)}
                 underlineColor="transparent"
                />
                </Item>

                 <Item rounded style={styles.inputstyle}>
                  <Input secureTextEntry={secureText} onChangeText={(text)=>setpassword(text)} placeholder='password'/>
                  <Icon active onPress={()=>setSecureText(secureText==true ? false : true)} name={secureText==true ? "eye-off" : "eye"} />
                 </Item>

                 <View style={styles.termscheckboxContainer}>
                 <ListItem>
                  <CheckBox onPress={()=>setisChecked(isChecked==false ? true : false)} checked={isChecked} />
                  <Text style={{ marginLeft:10 }}>Accept the terms and conditions</Text>
                </ListItem>
                 </View>
              

                <TouchableOpacity 
                 onPress={()=>CreateUser()}
                style={styles.submit}>
                    <Text style={styles.submittxt}>Sign up</Text>
                </TouchableOpacity>

               
                <View style={styles.divid}>
                    <View style={styles.line} />
                    <Text style={styles.or}>or</Text>
                    <View style={styles.line} />
                </View>

               <View style={styles.secondpanel}>
               <TouchableOpacity style={styles.facebook}>
                    <Text style={styles.txtsignwith}>Sign In with Facebook</Text>
                </TouchableOpacity>

                <TouchableOpacity style={styles.google}>
                    <Text style={styles.txtsignwith}>Sign In with Google</Text>
                </TouchableOpacity>

               <View style={styles.signupqs}>
               <Text style={styles.signupqstxtA}>Already have an account?</Text>
                <TouchableOpacity 
                onPress={()=>props.navigation.navigate('Login')}
                style={styles.signupqsbtn}>
                  <Text style={styles.signupqstxtB}>Sign In</Text>
                </TouchableOpacity>
               </View>
               </View>
             </View>
        </View>
        </ScrollView>
    )
}

I have followed all instructions in React Native Firebase documentation. Auth function login verification working . I have also enabled email and password service from firebase.

thanks.

Answer 1

You got this error because you haven't enabled Authentication mode in FireStore console e.g. Email-Password etc.

Answer 2

Have you checked the project_id in your Android app google-services.json file is the same as the Firebase project for which you enabled Google Sign In Authentication? If that is the case and you have not edited the google-services.json file, you can file a support ticket to Firebase.