react-native-facebook-login
react-native-facebook-login copied to clipboard
Unresponsive Android
I have a custom login/logout button for Android that when I press it, I get the activity indicator on screen but NOTHING else happens. No callbacks get triggered in the dev console. iPhone doesn't have the issue even though it uses the same component (styling/rendering seems a bit different though).
If I keep pressing on the button, I eventually get onCancel triggered, the message it gives back is 'Cannot register multiple callbacks'. Not sure if that's a part of the larger issue or something else. But literally no other callback.
Here's my component:
import React, { Component } from 'react'
// import PropTypes from 'prop-types';
import { View, Text, Alert } from 'react-native'
import styles from './Styles/LoginLogoutStyle'
import { Icon } from 'native-base'
const {FBLogin, FBLoginManager} = require('react-native-facebook-login')
export default class LoginLogout extends Component {
// // Prop type warnings
// static propTypes = {
// someProperty: PropTypes.object,
// someSetting: PropTypes.bool.isRequired,
// }
//
// // Defaults for props
// static defaultProps = {
// someSetting: false
// }
login (data) {
console.log('LOGIN!')
console.log(data)
const user = data.credentials
var api = `https://graph.facebook.com/v2.10/${user.userId}?fields=name,email,age_range,birthday,gender&access_token=${user.token}`
fetch(api)
.then((response) => response.json())
.then((responseData) => {
console.log('FIELDS INFO')
console.log(responseData)
this.props.userSave({...user, ...responseData})
}).done()
}
notFound (data) { // Might be normal if haven't tried logging in yet.
console.log('NOT FOUND')
console.log(data)
}
error (data) {
console.log(data)
Alert.alert('Unable to log in to Facebook')
}
cancel (data) {
console.log('CANCELED=')
console.log(data)
}
render () {
const buttonView = (<View style={{ backgroundColor: '#3b5998', flexDirection: 'row', borderRadius: 25, alignItems: 'center', padding: 10, paddingLeft: 10, paddingRight: 25 }}>
<Icon onPress={() => {
if (!this.props.user) {
this.context.login()
} else {
this.context.logout()
}
}}
style={{ color: '#FFFFFF', fontSize: 20, padding: 5, paddingHorizontal: 10 }}
name={'facebook'} />
<Text style={{color: 'white', fontSize: 18 }}>{ this.props.user ? 'Log Out' : 'Sign in via Facebook' }</Text>
</View>)
return (
<FBLogin buttonView={buttonView} onCancel={(data) => this.cancel(data)} onLogin={(data) => this.login(data)} onPermissionsMissing={(data) => this.error(data)} onLoginNotFound={(data) => this.notFound(data)} onError={(data) => this.error(data)} onLoginFound={(data) => this.login(data)}
permissions={['email', 'user_friends']}
/>
)
}
}
Currently facing a similar issue on Android, I'm on react native 0.49.3