ecpay_expo/components/GoogleSignInSection.tsx
2025-01-09 19:12:18 +05:30

59 lines
1.8 KiB
TypeScript

import React, { useEffect, useState } from 'react';
import { Pressable, StyleSheet, ActivityIndicator, Alert } from 'react-native';
import { ThemedText } from '@/components/ThemedText';
import { GoogleSignin, GoogleSigninButton, statusCodes, User } from '@react-native-google-signin/google-signin';
import auth from '@react-native-firebase/auth';
export default function GoogleSignInSection() {
const [loading, setLoading] = useState(false);
const [firebaseUser, setFirebaseUser] = useState<User | null>();
useEffect(() => {
GoogleSignin.configure({ webClientId: 'YOUR_WEB_CLIENT_ID' });
const checkSignInStatus = async () => {
try {
const userInfo = await GoogleSignin.signInSilently();
if (userInfo) setFirebaseUser(userInfo.data);
} catch (error) {
console.error('Google Sign-In check failed', error);
}
};
checkSignInStatus();
}, []);
const signIn = async () => {
try {
setLoading(true);
const userInfo = await GoogleSignin.signIn();
setFirebaseUser(userInfo.data);
} catch (error:any) {
if (error.code === statusCodes.PLAY_SERVICES_NOT_AVAILABLE) {
Alert.alert('Error', 'Google Play Services unavailable.');
} else {
Alert.alert('Error', 'Something went wrong.');
}
} finally {
setLoading(false);
}
};
return (
<>
{firebaseUser ? (
<Pressable onPress={() => GoogleSignin.signOut()} style={styles.button}>
<ThemedText style={styles.text}>Logout</ThemedText>
</Pressable>
) : (
<GoogleSigninButton onPress={signIn} style={styles.googleButton} />
)}
</>
);
}
const styles = StyleSheet.create({
button: { backgroundColor: '#007bff', padding: 12, borderRadius: 8 },
text: { color: '#fff', textAlign: 'center' },
googleButton: { width: '100%', height: 48 },
});