Google login without firebase is not working in react native - react-native

Question

I'm trying to implement google login without firebase in react-native. here i have generated Client ID and Client secret from google cloud and also added required dependency but still the state is not loaded and not showing any content.
I received this error in console: A non-recoverable sign in failure occurred
please help me if anyone is having idea about it
Thanks in advance!!
import {Text, View, Image} from 'react-native';
import React, {Component} from 'react';
import {GoogleSignin, statusCodes} from '#react-native-community/google-signin';
import {GoogleSigninButton} from '#react-native-community/google-signin';
export class GoogleLogin extends Component {
constructor(props) {
super(props);
this.state = {
userGoogleInfo: {},
loaded: false,
};
}
componentDidMount() {
GoogleSignin.configure({
webClientId:
'my Web client id',
offlineAccess: true,
});
}
signIn = async () => {
try {
await GoogleSignin.hasPlayServices();
const userInfo = await GoogleSignin.signIn();
this.setState({
userGoogleInfo: userInfo,
loaded: true,
});
console.log(this.state.userGoogleInfo);
} catch (error) {
if (error.code === statusCodes.SIGN_IN_CANCELLED) {
console.log('e 1');
} else if (error.code === statusCodes.IN_PROGRESS) {
console.log('e 2');
} else if (error.code === statusCodes.PLAY_SERVICES_NOT_AVAILABLE) {
console.log('e 3');
} else {
console.log(error.message);
}
}
};
render() {
return (
<View>
<GoogleSigninButton
onPress={this.signIn}
size={GoogleSigninButton.Size.Wide}
color={GoogleSigninButton.Color.Dark}
style={{width: '100%', height: 100}}
/>
{this.state.loaded ? (
<View>
<Text> {this.state.userGoogleInfo.dictionary}</Text>
console.log('Hello')
</View>
) : (
<Text> Not sign in</Text>
)}
</View>
);
}
}
export default GoogleLogin;