text: import React from "react";
  import { Platform, StatusBar, Image } from "react-native";
  import { AppLoading } from "expo";
  import { Asset } from "expo-asset";
  import { Block, GalioProvider } from "galio-framework";
  
  import AppContainer from "./navigation/Screens";
  import { Images, products, materialTheme } from "./constants/";
  
  // cache app images
  const assetImages = [
    Images.Pro,
    Images.Profile,
    Images.Avatar,
    Images.Onboarding
  ];
  
  products.map(product => assetImages.push(product.image));
  
  function cacheImages(images) {
    return images.map(image => {
      if (typeof image === "string") {
        return Image.prefetch(image);
      } else {
        return Asset.fromModule(image).downloadAsync();
      }
    });
  }
  
  export default class App extends React.Component {
    state = {
      isLoadingComplete: false
    };
  
    render() {
      if (!this.state.isLoadingComplete && !this.props.skipLoadingScreen) {
        return (
          <AppLoading
            startAsync={this._loadResourcesAsync}
            onError={this._handleLoadingError}
            onFinish={this._handleFinishLoading}
          />
        );
      } else {
        return (
          <GalioProvider theme={materialTheme}>
            <Block flex>
              {Platform.OS === "ios" && <StatusBar barStyle="default" />}
              <AppContainer />
            </Block>
          </GalioProvider>
        );
      }
    }
  
    _loadResourcesAsync = async () => {
      return Promise.all([...cacheImages(assetImages)]);
    };
  
    _handleLoadingError = error => {
      console.warn(error);
    };
  
    _handleFinishLoading = () => {
      this.setState({ isLoadingComplete: true });
    };
  }
  