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.
