FB SDK async loading in React

lesson-read.me

FB SDK is designed to not block you page. So it will not be ready as soon as you think it's ready (componentWillMount).
So do it like this if you want to make it your logged in criteria:


Create a component that will load the script:

class LoggedIn extends Components{
  this.state = { isLoggedIn: false, loading: true }
  
  componentDidMount(){
    <enter fb sdk cript here from the docs>
    * IMPORTANT, this will fire automatically after the SDK have been fully loaded *
    window.fbAsyncInit = () => {
					window.FB.init({        
						appId      : facebook_app_id,
						cookie     : true,
						xfbml      : true,
						version    : 'v2.5'
					});

	        * DO YOUR OTHER THINGS HERE *
          window.FB.getLoginStatus(function (response) {
            updateLogState = () => {
              this.setState({
                isLoggedIn: response.status === 'connected',
                loading: false
              })
            }
				};
  }

  render(){
    return !this.state.isLoggedIn ? <ShowLoginButton /> : !this.state.loading ? <ShowSomethingElse /> : <Loading />
  }
}