fix status bar in ios

view/ChangeEmail.js

@@ -4,6 +4,7 @@ import { connect } from 'react-redux';
 import Axios from 'axios';
 import ActionType from '../redux/globalActionType';
 import Spinner from 'react-native-loading-spinner-overlay';
+import MyStatusBar from './MyStatusBar';
 
 class ChangeEmail extends React.Component {
 
@@ -48,6 +49,7 @@ class ChangeEmail extends React.Component {
     render() {
         return (
             <View style={styles.container}>
+            <MyStatusBar />
             <Spinner
                 visible={this.state.spinner}
                 textContent={'Loading...'}

view/ChangeLanguage.js

@@ -5,6 +5,7 @@ import ActionType from '../redux/globalActionType';
 import i18n from 'i18n-js';
 import CheckBox from 'react-native-check-box'
 import { FontAwesome, AntDesign, Feather } from '@expo/vector-icons';
+import MyStatusBar from './MyStatusBar';
 
 class Language extends React.Component {
     constructor(props) {
@@ -37,6 +38,7 @@ class Language extends React.Component {
         console.log(this.props.language)
         return (
             <View style={styles.container}>
+                <MyStatusBar />
                 <View style={{ flex: 0.2 }} />
                 <View style={styles.body}>
 

view/ChangePassword.js

@@ -3,6 +3,7 @@ import { StyleSheet, Text, TextInput, View, Button, Alert, TouchableOpacity } fr
 import Axios from 'axios';
 import { BASE_URL_CHANGE_PASSWORD } from '../model/Base_Model';
 import { connect } from 'react-redux';
+import MyStatusBar from './MyStatusBar';
 
 class ChangePassword extends React.Component {
     constructor(props) {
@@ -38,6 +39,7 @@ class ChangePassword extends React.Component {
     render() {
         return (
             <View style={styles.container}>
+                <MyStatusBar />
                 {/* <View style={styles.header}>
                     <Text style={{ textAlign: 'center', marginTop: 10, fontSize: 25 }}>Change Password</Text>
                 </View> */}

view/DeliveryAddrees.js

@@ -6,6 +6,7 @@ import { CheckBox, Icon } from 'react-native-elements';
 import Axios from 'axios';
 import ActionType from '../redux/globalActionType';
 import { MaterialCommunityIcons, Ionicons } from '@expo/vector-icons';
+import MyStatusBar from './MyStatusBar';
 
 // import ravLog from '../helper/debug';
 
@@ -258,6 +259,7 @@ class DeliveryAddrees extends React.Component {
 
         return (
             <View style={styles.container}>
+                <MyStatusBar />
                 <ScrollView>
                 <View style={{ height: 45, borderRadius: 10, borderColor: '#ccb46c', borderWidth: 1, flexDirection: 'row', marginTop: 15, marginLeft: 20, marginRight: 20 }}>
                     <View style={{ flex: 1, top: 5 }}>

view/EmailConfirmation.js

@@ -6,6 +6,7 @@ import { connect } from 'react-redux';
 import ActionType from '../redux/globalActionType';
 import { BASE_URL_LOGIN } from '../model/Base_Model';
 import Spinner from 'react-native-loading-spinner-overlay';
+import MyStatusBar from './MyStatusBar';
 
 class EmailConfirmation extends React.Component {
 
@@ -187,6 +188,7 @@ class EmailConfirmation extends React.Component {
     render() {
         return (
             <View style={styles.container}>
+                <MyStatusBar />
                 <Spinner
                     visible={this.state.spinner}
                     textContent={'Loading...'}

view/MenuConfirmation.js

@@ -8,6 +8,7 @@ import session from '../function/session';
 import moment from 'moment'
 import { FontAwesome } from '@expo/vector-icons';
 import NumberFormat from 'react-number-format';
+import MyStatusBar from './MyStatusBar';
 class MenuConfirmation extends React.Component {
     constructor(props) {
         super(props)
@@ -218,6 +219,7 @@ class MenuConfirmation extends React.Component {
         let total = 0
         return (
             <ScrollView style={styles.container}>
+                <MyStatusBar />
                 <Spinner
                     visible={this.state.spinner}
                     textContent={'Sedang Proses...'}

view/MenuDetail.js

 import React from 'react';
 import { View, Text, TextInput, StyleSheet, Button, Image } from 'react-native';
 import Axios from 'axios';
+import MyStatusBar from './MyStatusBar';
 
 export default function MenuDetail({ route, navigation }) {
     const { desc } = route.params;
@@ -8,6 +9,7 @@ export default function MenuDetail({ route, navigation }) {
     const { image } = route.params;
     return (
         <View style={styles.container}>
+            <MyStatusBar />
             <View style={styles.body}>
                 <Image style={{ height: '50%', width: '100%' }}
                     source={{

view/MyStatusBar.js

+import React from 'react'
+import { View, StatusBar, Platform } from 'react-native';
+
+const MyStatusBar = () => {
+    return (
+        <View>
+        {Platform.OS === 'ios' && <StatusBar hidden={false} />}
+        </View>
+    )
+}
+
+export default MyStatusBar;

view/NewPassword.js

@@ -5,6 +5,7 @@ import Axios from 'axios';
 import ActionType from '../redux/globalActionType';
 import { BASE_URL_NEW_PASSWORD } from '../model/Base_Model'
 import Spinner from 'react-native-loading-spinner-overlay';
+import MyStatusBar from './MyStatusBar';
 
 class NewPassword extends React.Component {
     constructor(props) {
@@ -74,6 +75,7 @@ class NewPassword extends React.Component {
     render() {
         return (
             <View style={styles.container}>
+                <MyStatusBar />
                 <Spinner
                     visible={this.state.spinner}
                     textContent={'Loading...'}

view/New_Register.js

@@ -9,6 +9,7 @@ import i18n from 'i18n-js';
 import Spinner from 'react-native-loading-spinner-overlay';
 // import { connect } from 'react-redux';
 import RNPickerSelect from 'react-native-picker-select';
+import MyStatusBar from './MyStatusBar';
 
 
 var date = [
@@ -262,6 +263,7 @@ class NewRegister extends React.Component {
     render() {
         return (
             <View style={styles.container}>
+                <MyStatusBar />
                 <ScrollView>
                     <Spinner
                         visible={this.state.spinner}

view/NewsDetail.js

@@ -5,6 +5,7 @@ import Axios from 'axios';
 import { TouchableOpacity, ScrollView } from 'react-native-gesture-handler';
 import HTML from 'react-native-render-html';
 import { getStatusBarHeight } from 'react-native-status-bar-height';
+import MyStatusBar from './MyStatusBar';
 export default class NewsDetail extends React.Component {
     constructor(props) {
         super(props);
@@ -45,6 +46,7 @@ export default class NewsDetail extends React.Component {
         // console.log(this.state.content)
         return (
             <View style={styles.container}>
+                <MyStatusBar />
                 <ScrollView style={styles.body}>
                     <View style={styles.image_container(this.state.image_height)}>
                         <Image style={styles.image(this.state.image_height)} source={this.state.image ? { uri: this.state.image } : null} />

view/OrderDetail.js

@@ -9,6 +9,7 @@ import moment from 'moment'
 import NumberFormat from 'react-number-format';
 import { FontAwesome } from '@expo/vector-icons';
 import { Icon } from 'react-native-elements'
+import MyStatusBar from './MyStatusBar';
 
 class OrderDetail extends React.Component {
 
@@ -166,6 +167,7 @@ class OrderDetail extends React.Component {
         // console.log(this.state.transaction_detail)
         return (
             <View style={styles.container}>
+                <MyStatusBar />
                 <Modal animationType="slide"
                     transparent={true}
                     visible={this.state.modalVisible}

view/PickupName.js

@@ -11,6 +11,7 @@ import * as Location from 'expo-location';
 import { connect } from 'react-redux';
 import * as Permissions from 'expo-permissions';
 import * as Device from 'expo-device';
+import MyStatusBar from './MyStatusBar';
 
 class PickupName extends React.Component {
     constructor(props) {
@@ -286,6 +287,7 @@ class PickupName extends React.Component {
 
         return (
             <View style={styles.container}>
+                <MyStatusBar />
                 {/* <Spinner
                     visible={this.state.spinner}
                     textContent={'Loading...'}

view/ProfilePage.js

@@ -6,6 +6,7 @@ import ActionType from '../redux/globalActionType';
 import i18n from 'i18n-js';
 import { StackActions } from '@react-navigation/native';
 import { ScrollView, TouchableHighlight } from 'react-native-gesture-handler';
+import MyStatusBar from './MyStatusBar';
 
 class ProfilePage extends PureComponent {
     constructor(props) {
@@ -94,6 +95,7 @@ class ProfilePage extends PureComponent {
     render() {
         return (
             <View style={styles.container}>
+                <MyStatusBar />
                 <ScrollView>
                 <View style={{ flex: 1, height: 90, top: 10 }}>
                 <View style={{ alignSelf: 'center' }}>

view/RatingOrder.js

@@ -6,6 +6,7 @@ import Axios from 'axios';
 import moment from 'moment'
 import ActionType from '../redux/globalActionType';
 import Spinner from 'react-native-loading-spinner-overlay';
+import MyStatusBar from './MyStatusBar';
 
 class RatingOrder extends React.Component {
 
@@ -102,6 +103,8 @@ class RatingOrder extends React.Component {
     render() {
         return (
             <ScrollView style={styles.container}>
+                <MyStatusBar />
+
                 <View style={{ flex: 3 }}>
                     <View style={{ height: 100, justifyContent: 'center' }}>
                         <Text style={{ margin: 20, fontFamily: 'Gotham-Light', fontSize: 14, color: '#838383' }}>How was your experience with your <Text style={{ color: 'red' }}>{this.state.detail_trans.trans_type_display}</Text> order with us  {this.state.outlet}  on  <Text style={{ fontSize: 12, fontFamily: 'Gotham-Light', textAlign: 'center', color: '#838383' }}>{moment(this.state.detail_trans.trans_time).format('DD MMMM YYYY HH:mm:ss')}</Text> </Text>

view/Renewal.js

@@ -2,6 +2,7 @@ import React from 'react';
 import { View, Text, StyleSheet, Button, Alert, TouchableOpacity } from 'react-native';
 import { connect } from 'react-redux';
 import Axios from 'axios';
+import MyStatusBar from './MyStatusBar';
 
 class Renewal extends React.Component {
     constructor(props) {
@@ -72,6 +73,7 @@ class Renewal extends React.Component {
     render() {
         return (
             <View style={styles.container}>
+                <MyStatusBar />
                 <View style={styles.header}>
                     {/* <Text style={{ textAlign: 'center', margin: 20, fontSize: 25, alignSelf: 'center' }}>Renewal</Text> */}
                 </View>

view/ResetPassword.js

@@ -6,6 +6,7 @@ import ActionType from '../redux/globalActionType';
 import { connect } from 'react-redux';
 import i18n from 'i18n-js';
 import Spinner from 'react-native-loading-spinner-overlay';
+import MyStatusBar from './MyStatusBar';
 
 class ResetPassword extends React.Component {
     constructor(props) {
@@ -69,6 +70,7 @@ class ResetPassword extends React.Component {
     render() {
         return (
             <View style={styles.container}>
+                <MyStatusBar />
                 <Spinner
                     visible={this.state.spinner}
                     textContent={'Loading...'}

view/RewardDetail.js

@@ -8,6 +8,7 @@ import { WebView } from 'react-native-webview';
 import ActionType from '../redux/globalActionType';
 import moment from 'moment';
 import { Button } from 'react-native-elements';
+import MyStatusBar from './MyStatusBar';
 
 class RewardDetail extends React.Component {
     constructor(props) {
@@ -96,6 +97,7 @@ class RewardDetail extends React.Component {
         console.log(this.state.content)
         return (
             <View style={styles.container}>
+                <MyStatusBar />
                 <ScrollView>
                     <View style={styles.images}>
                         <Image style={{ height: 250, width: '100%' }} source={this.state.image ? { uri: this.state.image } : null} />

view/ShoppingCart.js

@@ -11,6 +11,7 @@ import ActionType from '../redux/globalActionType';
 import { YellowBox } from 'react-native';
 import session from '../function/session';
 import NumberFormat from 'react-number-format';
+import MyStatusBar from './MyStatusBar';
 
 
 YellowBox.ignoreWarnings(['VirtualizedLists should never be nested']);
@@ -433,6 +434,7 @@ class ShoppingCart extends React.Component {
         console.log(this.props.value_voucher)
         return (
             <ScrollView style={styles.container}>
+                <MyStatusBar />
                 <View style={{ flexDirection: 'row', justifyContent: 'center' }}>
                     {/* <TouchableOpacity style={styles.buttonDelivery} onPress={() => this.checkChangeTrans('delivery')}>
                         <Text style={{ textAlign: 'center', color: '#354175', fontWeight: 'bold' }}>{i18n.t('delivery')}</Text>

view/TopUpInfo.js

@@ -5,6 +5,7 @@ import { TouchableOpacity } from 'react-native-gesture-handler';
 import HTML from 'react-native-render-html';
 import { Collapse, CollapseHeader, CollapseBody, AccordionList } from 'accordion-collapse-react-native'
 import { getStatusBarHeight } from 'react-native-status-bar-height';
+import MyStatusBar from './MyStatusBar';
 
 
 export default class TopUpInfo extends React.Component {
@@ -33,6 +34,7 @@ export default class TopUpInfo extends React.Component {
     render() {
         return (
             <View style={styles.container}>
+                <MyStatusBar />
                 {/* <View style={styles.header}>
                     <Text style={styles.headerTitle}>TOPUP INFO</Text>
                 </View> */}

view/TransactionHistory.js

@@ -4,6 +4,7 @@ import { Card } from 'react-native-shadow-cards'
 import { connect } from 'react-redux';
 import Axios from 'axios';
 import moment from 'moment'
+import MyStatusBar from './MyStatusBar';
 
 class TransactionHistory extends React.Component {
     constructor(props) {
@@ -80,6 +81,7 @@ class TransactionHistory extends React.Component {
     render() {
         return (
             <View style={styles.container}>
+                <MyStatusBar />
                 <ScrollView style={styles.body}>
                     {this.state.indicator == true ? (<ActivityIndicator style={{ justifyContent: "center" }} size="large" color="#c9af6d" />) :
                         this.state.history_list.length ? (

view/TransferBalance.js

@@ -3,6 +3,7 @@ import { View, Text, TextInput, StyleSheet, Button, Alert ,ScrollView,TouchableO
 import Axios from 'axios';
 import { connect } from 'react-redux';
 import ActionType from '../redux/globalActionType';
+import MyStatusBar from './MyStatusBar';
 
 class TransferBalance extends React.Component {
     constructor(props) {
@@ -79,6 +80,7 @@ class TransferBalance extends React.Component {
     render() {
         return (
             <View style={styles.container}>
+            <MyStatusBar />
             <ScrollView>
             <View style={{ flex: 3 }}>
                 <View style={{ flex: 1, margin: 20,top:20 }}>

view/UpgradePremium.js

@@ -19,6 +19,7 @@ import {
     TouchableOpacity,
     Alert
 } from 'react-native'
+import MyStatusBar from './MyStatusBar';
 
 
 const jobs = ["Pilih", "Siswa", "Mahasiswa", "Karyawan", "Pengusaha", "Lainnya"]
@@ -188,6 +189,7 @@ class UpgradePremium extends React.Component {
     render() {
         return (
             <View style={styles.container}>
+                <MyStatusBar />
                 <Spinner
                     visible={this.state.spinner}
                     textContent={'Loading...'}

view/UseBalance.js

@@ -8,6 +8,7 @@ import { Entypo, Ionicons, MaterialCommunityIcons, MaterialIcons, AntDesign, Fon
 import ActionType from '../redux/globalActionType';
 import Spinner from 'react-native-loading-spinner-overlay';
 import PinRequest from './PinRequest'
+import MyStatusBar from './MyStatusBar';
 
 class UseBalance extends React.Component {
 
@@ -286,6 +287,7 @@ class UseBalance extends React.Component {
         // console.log(this.state.kasproPoint)
         return (
             <ScrollView style={styles.container}>
+            <MyStatusBar />
                 <Modal animationType="slide"
                     transparent={false}
                     visible={this.state.modalVisible}