Facebook Login keeps repeating asking permissions React Native?

I'm a newbie in React Native and struggling to make a Facebook login for my app.

I finished configuring all the requirements for my app, Firebase and Facebook for developers.

The thing is when I pressed login, at the first time, it kept repeating again the Login permission. Until the data receive the accessToken and id, my app might/might not navigate to the Main screen (login succeed). But just 1 second later, the screen prompted and showed the Login Manager again. And it keeps repeating that. I really don't know why.

Is it something wrong with my code?. I'm thinking it kept repeating because It must do that until it gets the data need ( promise resolved)

Here's the code:

import React, { useEffect, useState } from 'react';
import {
    View,
    ImageBackground,
    StyleSheet,
    Alert
} from 'react-native';
import {
    Layout
} from '@ui-kitten/components';
import { GoogleSignin, GoogleSigninButton, statusCodes } from '@react-native-community/google-signin';
import { firebase } from '@react-native-firebase/auth';
import { LoginButton, LoginManager, AccessToken } from 'react-native-fbsdk';

const GoogleLogIn = (props) => {

    const [userInfo, setUserInfo] = useState(null);
    const [isLogIn, setIsLogIn] = useState(false);

    // Facebook log in
    const _facebookLogin = async () => {
        try{
            const result = await LoginManager.logInWithPermissions(['public_profile', 'email']);
            console.log(result);

            if(result.isCancelled){
                console.log('Login is cancelled');
            }else if(result.grantedPermissions){
                console.log('DONE')
                const data =  await AccessToken.getCurrentAccessToken();
                console.log(data);
                const cred = firebase.auth.FacebookAuthProvider.credential(data.accessToken);
                const firebaseCred = await firebase.auth().signInWithCredential(cred);
                setIsLogIn(true);
                setUserInfo(data.userID);
                props.navigation.navigate('AppNavigator', {screen: 'Welcome'})
            }
        }catch(err){
            console.log(err);
            throw err;
        }
    }

    return(
        <View style={styles.background}>

            <LoginButton
                onLoginFinished={_facebookLogin}
                onLogoutFinished={() => console.log('Logout!')}
            />

        </View>
    );
};

const styles = StyleSheet.create({
    background: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center'
    }
})
export default GoogleLogIn;

Here's the weird behavior:

Error_repeating asking permissions for login Facebook

PLEASE HELP!

Here's the code I found it worked well. You can put this in a button for customizing

const  facebookLogin = async () => {
        try {
            const result = await LoginManager.logInWithPermissions(['public_profile', 'email']).then(
                (res) => {
                    if(res.isCancelled){
                        console.log('Something went wrong, please try again');
                    }else{
                        AccessToken.getCurrentAccessToken().then(
                            async (data) => {
                              console.log(data.accessToken.toString())
                              const cred = firebase.auth.FacebookAuthProvider.credential(data.accessToken);
                              const firebaseCred = await firebase.auth().signInWithCredential(cred);
                              setIsLogIn(true);
                              setUserInfo(data.userID);
                              props.navigation.navigate('AppNavigator', {screen: 'Welcome'})
                            }

                          )
                    }
                }
            )
        } catch (err) {
            console.log(err);
        }
      }