RN Scaffold : MyApp/src/app/App.js

App.js

// MyApp/src/app/App.js
// @flow

import * as React from 'react'
import { Font } from 'expo'
import { isSignedIn } from '../auth/utils/auth'
import { createPrivateRootNavigator, createPublicRootNavigator } from './navigators'

type State = {
  fontLoaded: boolean,
  checkedSignIn: boolean,
  signedIn: boolean
}

type Props = {

}

export default class App extends React.Component<Props, State> {
  state = {
    fontLoaded: false,
    checkedSignIn: false,
    signedIn: false
  }

  async componentDidMount() {
    await Font.loadAsync({
      'roboto-slab': require('./assets/fonts/RobotoSlab-Light.ttf')
    }).then(() => {
      this.setState({ fontLoaded: true })
    })

    await isSignedIn()
      .then((res: boolean) => this.setState({ signedIn: res, checkedSignIn: true }))
      .catch(err => alert('An error occurred'))
  }

  render() {
    const { checkedSignIn, signedIn, fontLoaded } = this.state

    // If we haven't checked AsyncStorage yet, don't render anything (better ways to do this)
    if (!checkedSignIn && !fontLoaded) {
      return null;
    }

    const Layout = signedIn ? createPrivateRootNavigator() : createPublicRootNavigator();

    return <Layout />
  }
}