Google SignIn with expo: signInWithGoogleAsync not being invoked-CodePudding

Im following this tutorial https://github.com/nathvarun/Expo-Google-Login-Firebase and below is my code. However the signInWithGoogleAsync() function is not getting invoked it seems. Clicking the button does nothing. Could it be because of stack Navigator?

There is no issue with firebase as email login is working

Below is my LoginScreen.js

import { useNavigation } from '@react-navigation/core'
import React, { useEffect, useState, Component } from 'react'
import { Button, KeyboardAvoidingView, StyleSheet, Text,TextInput, TouchableOpacity, View } from 'react-native'
import { auth } from '../firebase'
import * as GoogleSignIn from 'expo-google-sign-in';

class LoginScreen extends Component {
signInWithGoogleAsync = async() => {
try {
  const result = await Google.logInAsync({       
    behavior:'web',
    iosClientId: 'lorem ipsum',
    scopes: ['profile', 'email'],
  });

  if (result.type === 'success') {
    return result.accessToken;
  } else {
    return { cancelled: true };
  }
} catch (e) {
  return { error: true };
}
};
render(){
return (
<KeyboardAvoidingView
  style={styles.container}
  behavior="padding"
>
  <View style={styles.inputContainer}>
   <Button
    title='sign'
    onPress={()=>this.signInWithGoogleAsync()} />
  </View>
</KeyboardAvoidingView>
 );
 }
}

export default LoginScreen

here's the App.js:

import { StatusBar } from 'expo-status-bar'; 
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import LoginScreen from './screens/LoginScreen';
import HomeScreen from './screens/HomeScreen';
import * as firebase from "firebase/compat";

const Stack = createNativeStackNavigator();

export default class App extends React.Component {
 render(){
 return (
<NavigationContainer>
  <Stack.Navigator>
    <Stack.Screen options={{ headerShown: false }} name="Login" component={LoginScreen} />
    <Stack.Screen name="Home" component={HomeScreen} />
  </Stack.Navigator>
</NavigationContainer>
);
}
}

const styles = StyleSheet.create({
 container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
},
});
registerRootComponent(App);

CodePudding user response：

You are importing everythin as GoogleSignIn and then below doing await Google.logInAsync so you'd have to change that to await GoogleSignIn.loadInAsync. 9th line

Also, look at the docs, it doesn't look like logInAsync is a function https://docs.expo.dev/versions/latest/sdk/google-sign-in/