<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> //import liraries import React, { Component } from 'react'; import { View, Text, StyleSheet, SafeAreaView, StatusBar } from 'react-native'; import colors from '../styles/colors'; import Loader from './Loader'; // create a component const WrapperContainer = ({ children, bgColor = colors.white, statusBarColor = colors.themeColor, barStyle = 'light-content', isLoading='', withModal='' }) => { return ( <SafeAreaView style={{flex: 1,backgroundColor: statusBarColor,}}> <StatusBar backgroundColor={statusBarColor} barStyle={barStyle} /> <Loader isLoading={isLoading} withModal={withModal} /> <View>{children}</View> </SafeAreaView> ); }; //make this component available to the app export default WrapperContainer;