Не могу реализовать социальный вход в систему реагировать на родной

Question

Я использовал

react-native-simple-auth

для социальных логинов. Мой код похож на

My App.js

import React,  {Component}  from 'react';
import { View, Text, Image, StyleSheet, Button, AppRegistry } from 'react-native';
import { createStackNavigator } from 'react-navigation';


import Register from './js/components/Register';
import Signin from './js/components/Signin';
import Dashboard from './js/components/Dashboard';
import Main from './js/components/Main';
import HomeScreen from './js/components/HomeScreen';
import AddHorse from './js/components/AddHorses';
import Logout from './js/components/Logout';
import ForgotPassword from './js/components/ForgotPassword';
import HorseDetails from './js/components/HorseDetails';
import StartChallenge from './js/components/StartChallenge';
import Challenge from './js/components/Challenge';
import HorseChallenge from './js/components/HorseChallenge';
import addThirtyChallenge from './js/components/addThirtyChallenge';
import viewThirtyDetails from './js/components/viewThirtyDetails';
import addSixtyChallenge from './js/components/addSixtyChallenge';
import viewSixtyDetails from './js/components/viewSixtyDetails';
import addNintyChallenge from './js/components/addNintyChallenge';
import viewNintyDetails from './js/components/viewNintyDetails';
import BarChart from './js/components/BarChart';
import Videos from './js/components/Videos';
import PlayVideo from './js/components/PlayVideo';
import Profile from './js/components/Profile';
import EditProfile from './js/components/EditProfile';
import ShopifyLogin from './js/components/ShopifyLogin';
import DirectLogin from './js/components/DirectLogin';
// import Twitter from './js/components/TwitterButton';
// import RNFBLogin from './js/components/RNFBLogin';

const RootStack = createStackNavigator(
  {
    Home: {screen:HomeScreen},
    Main: {screen:Main},
    Login: {screen:Signin},
    Signup: {screen:Register},
    AddHorse: {screen:AddHorse},
    Dashboard: {screen:Dashboard},
    ForgotPassword: {screen:ForgotPassword},
    Logout: {screen:Logout},
    HorseDetails: {screen:HorseDetails},
    Challenge: {screen:Challenge},
    StartChallenge: {screen:StartChallenge},
    HorseChallenge: {screen:HorseChallenge},
    addThirtyChallenge: {screen:addThirtyChallenge},
    viewThirtyDetails: {screen:viewThirtyDetails},
    addSixtyChallenge: {screen:addSixtyChallenge},
    viewSixtyDetails: {screen:viewSixtyDetails},
    addNintyChallenge: {screen:addNintyChallenge},
    viewNintyDetails: {screen:viewNintyDetails},
    BarChart: {screen:BarChart},
    Videos: {screen:Videos},
    PlayVideo: {screen:PlayVideo},
    Profile: {screen:Profile},
    EditProfile: {screen:EditProfile},
    ShopifyLogin: {screen:ShopifyLogin},
    DirectLogin: {screen:DirectLogin},
  });


export default RootStack;

Homescreen.js

import React from 'react';
import { AsyncStorage } from "react-native";
import firebase from 'firebase';
import {
    StyleSheet,
    Text,
    ScrollView,
    Picker,
    View,
    ActivityIndicator,
    TouchableHighlight,
    Image,
    Dimensions,
    Navigator,
    StatusBar,
    NativeModules,
} from 'react-native';
import {Button} from 'react-native';
import {alert} from "react-native/Libraries/Alert/Alert";
import '../../App.js';
import Main from "./Main";
import NavigationExperimental from 'react-native-deprecated-custom-components';

import * as simpleAuthProviders from 'react-native-simple-auth';
import secrets from './secrets';
const facebookSec = {
        appId: '1754426114654739',
        callback: 'fb1754426114654739://authorize',
    };

    const googleSec = {
        appId: '483972669775-bk26eoeev85lbgsm25q64gels7stalh4.apps.googleusercontent.com',
        callback: 'com.hpnutrition:/oauth2redirect',
    };
    class Profile extends React.Component {
      constructor(props) {
      super(props);
      this.state = {
      timePassed:false
    };
  }

  render() {
        return (
            <View><Text>kjsgbngegjen</Text></View>
        );
      }

}

class Login extends React.Component {
      constructor(props) {
      super(props);
      this.state = {
      loading:false,
      response:null
    };
  }
componentDidMount() {
    setTimeout( () => {
        this.setTimePassed();
    },3000);
  }

  setTimePassed() {
    this.setState({timePassed: true});
}
  render() {
        return (
            <View style={styles.containerr}>
        <StatusBar
     backgroundColor="#485b2d"
   />
            <View style={styles.container}>
<View style={styles.logo} >
       <Image source={require('./logo.png')}/>
</View>
       <Text style={styles.signText} >SIGN IN TO ETSY </Text>

    <View style={styles.mainbox}>
         <View style={styles.viewStyleOne}>
  <TouchableHighlight style={[styles.buttonContainer, styles.signupButton1]} onPress={this.onBtnPressed.bind(this, 'google', googleSec)}>
    <Text style={styles.textStyle}> CONTINUE WITH GOOGLE  </Text>
    </TouchableHighlight>
  </View>
  <Text style={styles.space} > </Text>
  <View style={styles.viewStyleOne}>
  <TouchableHighlight style={[styles.buttonContainer, styles.signupButton1]} onPress={this.onBtnPressed.bind(this, 'google', facebookSec)}>
    <Text style={styles.textStyle}>CONTINUE WITH FACEBOOK  </Text>
    </TouchableHighlight>
  </View>
        <View style={styles.viewStyleOne}>
  <TouchableHighlight style={[styles.buttonContainer, styles.signupButton1]} onPress={() => this.props.navigation.navigate('ShopifyLogin')}>
    <Text style={styles.textStyle}>CONTINUE WITH SHOPIFY  </Text>
    </TouchableHighlight>
  </View>
          <Text style={styles.space} > </Text>
       <View style={styles.containermenu}>
  <View style={styles.viewStyleOne}>
  <TouchableHighlight style={[styles.buttonContainer, styles.signupButton1]} onPress={() => this.props.navigation.navigate('Signup')}>
    <Text style={styles.textStyle}> REGISTER  </Text>
    </TouchableHighlight>
  </View>
  <View style={[styles.viewStyleTwo]} >
  <TouchableHighlight style={[styles.buttonContainer, styles.signupButton1]} onPress={() => this.props.navigation.navigate('Login')}>
    <Text style={styles.textStyle}> LOGIN </Text>
    </TouchableHighlight>
  </View>

</View>
       </View>

      </View>
      </View>
        );
      }

      onBtnPressed(provider, opts) {
    const _this = this;
    this.setState({
      loading: true
    });
    simpleAuthProviders[provider](opts)
      .then((info) => {
        _this.setState({
            loading: false,
            data:info
        });
        _this.props.navigator.push({
          title: provider,
          provider,
          info,
          index: 1
        });
      })
      .catch((error) => {
        _this.setState({
            loading: false
        });
        Alert.alert(
          'Authorize Error',
          error.message
        );
      });
  }

}
export default class HomeScreen extends React.Component {
     static navigationOptions = ({navigation}) => {
        const {state, navigate} = navigation;
    };
  constructor(props){
    super(props);
    this.state = {
        loading: false,
        data:null
    };
}
static navigationOptions = {
        header: null
    }

componentDidMount() {
    AsyncStorage.getItem('userDetails').then((user_data_json) => {
      let user_data = JSON.parse(user_data_json);
      if(user_data != null){
        this.props.navigation.navigate('Dashboard');
      }else{
        this.props.navigation.navigate('Home');
      }
    });
}
 render() {
  if(this.props.info==""){
      return (
      <View><Text>Login</Text></View>
    );
  }else{
    return (
      <View><Text>Profile</Text></View>
    );

  }
  }
}

const styles = StyleSheet.create({

  logo:{  justifyContent: 'center', alignItems: 'center',  marginBottom:30,  marginTop:50,},

  mainbox:{flex: 1,marginLeft:10,marginRight:10,},

  signText:{fontSize: 22, color:'#2b3915',marginBottom:20,  marginLeft:20, fontWeight: 'bold', marginRight:20,   marginTop:20,  borderBottomColor: '#bbb',
    borderBottomWidth: StyleSheet.hairlineWidth,},
    space:{ height:20,},
  container: {
      flex: 1,
      backgroundColor: '#ffffff',
      marginBottom:20,  
      marginLeft:20,  
      marginRight:20, 
      marginTop:20, 
    },
    containerr: {
        flex: 1,
        backgroundColor: '#485b2d'
    },
      backgroundImage: {
        flex: 1,
        width: null,
        height: null,
        resizeMode: 'cover'
    },
    containermenu: { flexDirection: 'row', flex: 1,
     justifyContent:'space-between',
     },

     viewStyleOne: {
     alignItems:'center',
     backgroundColor:'#2b3b15',
     borderColor: '#b6a238',
     borderRightWidth: 10,
     borderLeftWidth: 10,
     paddingLeft:20,
     paddingRight:20,
     paddingTop:15,
     paddingBottom:15,
     height: 50,
     margin:5
     },

     viewStyleTwo: {
     backgroundColor:'#2b3b15',
     borderColor: '#b6a238',
     borderRightWidth: 10,
     borderLeftWidth: 10,
     paddingLeft:40,
     paddingRight:40,
     paddingTop:15,
     paddingBottom:15,
     height: 50,
     margin:5
     },
    newClass:{
      marginLeft:50,
    },
    textStyle:{
      textAlign:'center',fontSize: 16, color:'#ffffff',fontWeight: 'bold',
    },

});

Требования:

1. Перейдите к следующему экрану, если ответ не является нулевым для события onpress.
2. Вернуть ответ от события onpress для доступа к нему в методе рендеринга.

Все работает нормально, но я не могу прочитать ответ от события onPress. Наконец страница входа загружается и останавливается прямо там. Мне нужно перейти на следующую страницу, как только ответ не станет нулевым.