i am not new to react native but new to firebase. i was able to build an app on my mac and integrate auth and it was working. I had an issue with keys on my mac so i have given it for maintenance but i have the same code in my windows machine and i think i have set up the machine correctly but its giving me weird issues now. Initially app kept crashing without any error and after sometime when i was able to do
adb logcat -t 'some time'
i saw this message in the logs: --------- beginning of crash 12-13 13:51:10.449 20375 20375 E AndroidRuntime: FATAL EXCEPTION: main 12-13 13:51:10.449 20375 20375 E AndroidRuntime: Process: com.vmallapp, PID: 20375 12-13 13:51:10.449 20375 20375 E AndroidRuntime: java.lang.RuntimeException: Unable to get provider com.google.firebase.provider.FirebaseInitProvider: com.google.firebase.components.MissingDependencyException: Unsatisfied dependency for component Component<[class com.google.firebase.inappmessaging.display.FirebaseInAppMessagingDisplay]>{2, type=0, deps=[Dependency{anInterface=interface com.google.firebase.analytics.connector.AnalyticsConnector, type=required, direct=true}, Dependency{anInterface=class com.google.firebase.FirebaseApp, type=required, direct=true}, Dependency{anInterface=class com.google.firebase.inappmessaging.FirebaseInAppMessaging, type=required, direct=true}]}: interface com.google.firebase.analytics.connector.AnalyticsConnector
So i removed the @react-native-firebase/in-app-messaging using yarn remove. Now the app launches in simulator but none of the touchable opacity presses are getting fired :(. its pretty basic stuff and i am convinced it has something to do with firebase integration but i cant figure out what is going on. My code where now the touchable opacity is not working is as follows (anonymous auth is working):
import React, { useState, useEffect } from 'react';
import profileImage from '../assets/my_profile.png';
import auth from '@react-native-firebase/auth';
import { View, Text, Button, TouchableWithoutFeedback,Dimensions, FlatList, StyleSheet,Image,TouchableOpacity } from 'react-native';
import firestore from '@react-native-firebase/firestore';
export function HomeScreen({ route, navigation }) {
const [flatListItems,setflatListItems] = useState([{name:'My Profile', Image: profileImage, key: '0'}]);
const [initializing, setInitializing] = useState(true);
const [user, setUser] = useState();
const [refreshMenu, setrefreshMenu] = useState(false);
const [refreshingMenuItems, setrefreshingMenuItems] = useState(false);
const getMenuItemsFromDB = async ()=>{
setrefreshingMenuItems(true);
console.log(`made db call to update menu for userid ${user.uid}`);
try{
var querySnapshot = await firestore().collection('Users').where('userId', '==', user.uid).get();
console.log(querySnapshot.size);
const storeList = [{name:'My Profile', Image: profileImage, key: '0'}];
querySnapshot.forEach(documentSnapshot => {
var counter = 1;
console.log('snapshot ID: ', documentSnapshot.id, documentSnapshot.data());
documentSnapshot.data().stores.forEach( x=>{
var imageUri = `url need to be added`
console.log(imageUri);
storeList.push({name:x.mainDisplay, Image: profileImage, key: (counter++).toString(), imageURL : imageUri});
}
);
});
setflatListItems(storeList);
if(refreshMenu)
setrefreshMenu(false);
else
setrefreshMenu(true);
}
catch(error){
console.log(error);
}
setrefreshingMenuItems(false);
}
function onAuthStateChanged(user) {
setUser(user);
if (initializing) setInitializing(false);
}
const handleLogin = () =>{
console.log('login clicked');
console.log(user);
navigation.navigate('Login');
}
const onItemClick = (iconnumber) => {
if(iconnumber=='0')
{
console.log(iconnumber);
//const userinfo = {userid:user.uid,isAnonymous:user.isAnonymous};
//console.log(access_token);
navigation.navigate('Profile');
}
}
useEffect(() => {
console.log('i got triggered');
const subscriber = auth().onAuthStateChanged(onAuthStateChanged);
auth()
.signInAnonymously()
.then(() => {
console.log('User signed in anonymously');
console.log(`user info is ${JSON.stringify(user)}`);
})
.catch(error => {
if (error.code === 'auth/operation-not-allowed') {
console.log('Enable anonymous in your firebase console.');
}
console.error(error);
});
return subscriber; // unsubscribe on unmount
}, []);
if (initializing) return null;
return (
<View style={styles.rootLayoutContainer}>
{(user == null || user.isAnonymous) &&
<TouchableOpacity onPress={() =>handleLogin(user)}>
<Text>Login please please</Text>
</TouchableOpacity>
}
{!user.isAnonymous &&
<Text>welcome {user.email}</Text>
}
<FlatList
data={flatListItems}
extraData = {refreshMenu}
refreshing={refreshingMenuItems}
contentContainerStyle={{paddingTop: 25, flex:0.5}}
onRefresh={getMenuItemsFromDB}
numColumns={2}
renderItem={({item})=>(
<TouchableWithoutFeedback onPress={() => onItemClick( item.key)} >
<View style={styles.containerOfList} >
{!item.imageURL &&
<Image style={styles.listItemImage} source={item.Image}></Image>
}
{item.imageURL &&
<Image style={styles.listItemImage} source={{uri:item.imageURL}}></Image>
}
<Text style={styles.textContainer} >
{item.name}
</Text>
</View>
</TouchableWithoutFeedback>
)}
/>
<TouchableOpacity onPress={() => console.log(' i got pressed')}>
<Text>Refresh Menu</Text>
</TouchableOpacity>
</View>
);
}
/ i am wondering what is going on? none of the onpress events are getting fired at this point. Any pointers will be very appreciated.
so some more troubleshooting and i notived by emulator had time completely off for some reason. it was not matching the time of host. i tried to change the setting to take network time and turn the emulator on and off but that did not do anything. Then i have completely restarted my machine also which seems to have fixed the issue. and now ADB time matches my system time. i have also added the messaging package and will play with it also now. by just adding it, it has not crashed abything yet .. posting it here so if anyone else sees these issues, they may get some idea to troubleshoot.