text: import React from 'react';
  import PropTypes from 'prop-types';
  import { Platform, StatusBar, StyleSheet, View } from 'react-native';
  import Expo from 'expo';
  import { NavigationProvider, StackNavigation, NavigationStyles } from '@expo/ex-navigation';
  import { Ionicons } from '@expo/vector-icons';
  import Router from './navigation/Router';
  import Colors from './constants/Colors';
  import cacheAssetsAsync from './utilities/cacheAssetsAsync';
  import PersistentData from './data/PersistentData';
  const dataStore = new PersistentData();
  
  export default class App extends React.Component {
    state = {
      appIsReady: false,
    };
  
    getChildContext() {
      return {
        dataStore
      }
    }
  
    static childContextTypes = {
      dataStore: PropTypes.instanceOf(PersistentData)
    }
  
    componentWillMount() {
      this._loadAssetsAsync();
    }
  
    async _loadAssetsAsync() {
      try {
        await cacheAssetsAsync({
          images: [],
          fonts: [
            Ionicons.font,
            { 'space-mono': require('./assets/fonts/SpaceMono-Regular.ttf') },
          ],
        });
      } catch (e) {
        console.warn(
          'There was an error caching assets (see: App.js), perhaps due to a ' +
            'network timeout, so we skipped caching. Reload the app to try again.'
        );
        console.log(e.message);
      } finally {
        this.setState({ appIsReady: true });
      }
    }
  
    render() {
      if (this.state.appIsReady) {
        return (
          <View style={styles.container}>
            <NavigationProvider router={Router}>
              <StackNavigation
                id="root"
                initialRoute={Router.getRoute('rootNavigation')}
              />
            </NavigationProvider>
  
            {Platform.OS === 'ios' && <StatusBar barStyle="default" />}
            {Platform.OS === 'android' &&
              <View style={styles.statusBarUnderlay} />}
          </View>
        );
      } else {
        return <Expo.AppLoading />;
      }
    }
  }
  
  const styles = StyleSheet.create({
    container: {
      flex: 1,
      backgroundColor: '#fff',
    },
    statusBarUnderlay: {
      height: Expo.Constants.statusBarHeight,
      backgroundColor: 'rgba(0,0,0,0.2)',
    },
  });
  