Main.js

import React from 'react';
import { StyleSheet, View, Text, TouchableOpacity, Linking } from 'react-native';
import Router from './Router';
import Values from '../common/Values'
import appConstants from '../common/AppConstants'
import Loader from '../common/Loader';
import axios from 'axios';
import AppAsyncStorage from '../common/AppAsyncStorage';
import DeviceInfo from 'react-native-device-info';
const LoadingStatus = [
    "Cargando Información",
    "Revisando Actualizaciones",
    "ok"
]

export default class Main extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            LoadingStatusIndex: 0,
            checkVersionStatus: appConstants.appVersion.UNCHECKED
        }
        this._isMounted = false;
    }


    otherCode() {
        //poner aquí cualquier otro código a ejecutarl
    }

    async componentDidMount() {
        this.otherCode();
        try {
            await this.getContents()
        } catch (error) {
            console.log(error)
        }
    }

    async getContents() {
        //Aquí se va a llamar al API para obtener algunos contenidos.
        // aquí se pone toda la llamada al api
        //muy seguramente se debe llamar desde aquí al AppAsyncStorageComponent
        setTimeout(
            () => {
                this.setState({
                    LoadingStatusIndex: 1
                })
            }
            , 300)
    }
    async checkAppVersion() {
        setTimeout(
            () => {
                this.setState({
                    checkVersionStatus: appConstants.appVersion.UP_TO_DATE,
                })
            }
            , 2000)
        return
        let response = await axios({
            method: 'get',
            url: "https://mymiracle.herokuapp.com/version",
            timeout: 1000
        })
        DeviceInfo.getBuildNumber().then((buildNumber) => {
            if (buildNumber < response.data.version) {
                this.setState({
                    checkVersionStatus: appConstants.appVersion.NEEDS_UPDATE
                })
            } else {
                this.setState({
                    checkVersionStatus: appConstants.appVersion.UP_TO_DATE
                })
            }
        }).catch(error => {
            console.log("error checking updates: " + error)
            this.setState({
                checkVersionStatus: appConstants.appVersion.UP_TO_DATE
            })
        })
    }
    render() {
        switch (this.state.LoadingStatusIndex) {
            case 0:
                return (
                    <Loader message={LoadingStatus[this.state.LoadingStatusIndex]} />
                )
            case 1:
                switch (this.state.checkVersionStatus) {
                    case appConstants.appVersion.UNCHECKED:
                        this.checkAppVersion();
                        return (
                            <Loader message={LoadingStatus[this.state.LoadingStatusIndex]} />
                        )
                    case appConstants.appVersion.NEEDS_UPDATE:
                        return (
                            <View style={[Values.styles.container, Values.styles.centered]}>
                                <Text style={Values.styles.appText}>Necesitamos una actualización :)</Text>
                                <TouchableOpacity
                                    onPress={() => {
                                        Linking.openURL('https://play.google.com/store/apps/details?id=com.cerezabusiness.mymiracle')
                                    }}
                                    style={styles.btn}
                                >
                                    <Text style={Values.styles.appText}>
                                        Ir a Google Play
                                    </Text>
                                </TouchableOpacity>
                            </View>
                        );
                    case appConstants.appVersion.UP_TO_DATE:

                        return (
                            <Router />
                        );


                }
            default:
                break;
        }

    }
}
const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#fff',
        alignItems: 'center',
        justifyContent: 'center',
    },
    btn: {
        margin: 10,
        padding: 5,
        borderWidth: 1,
        borderColor: Values.appPrimaryColor,
        borderRadius: 5,
    }
});