White screen on publishing app on Apple store when revienwing - react-native

Question

Warning: Functions are not valid as a React child. This may happen if you return a Component instead of from render. Or maybe you meant to call this function rather than return it.
in RCTText (created by Text)
in Text
in Text (created by BottomNavigation)
in RCTView (created by View)
in View (created by AnimatedComponent)
in AnimatedComponent
in AnimatedComponentWrapper (created by BottomNavigation)
in RCTView (created by View)
in View (created by AnimatedComponent)
in AnimatedComponent
in AnimatedComponentWrapper (created by BottomNavigation)
in RCTView (created by View)
in View (created by BottomNavigation)
in RCTView (created by View)
in View (created by Touchable)
in TouchableWithoutFeedback (created by Touchable)
in Touchable (created by BottomNavigation)
in RCTView (created by View)
in View (created by BottomNavigation)
in RCTView (created by View)
in View (created by AnimatedComponent)
in AnimatedComponent
in AnimatedComponentWrapper (created by BottomNavigation)
in RCTView (created by View)
in View (created by AnimatedComponent)
in AnimatedComponent
in AnimatedComponentWrapper
in RCTView (created by View)
in View (created by AnimatedComponent)
in AnimatedComponent
in AnimatedComponentWrapper
in RCTView (created by View)
in View (created by AnimatedComponent)
in AnimatedComponent
in AnimatedComponentWrapper
in Unknown (created by BottomNavigation)
in RCTView (created by View)
in View (created by BottomNavigation)
in BottomNavigation
in ThemedComponent (created by withTheme(BottomNavigation))
in withTheme(BottomNavigation) (created by MaterialBottomTabViewInner)
in MaterialBottomTabViewInner (created by MaterialBottomTabView)
in RNCSafeAreaProvider (created by SafeAreaProvider)
in SafeAreaProvider (created by SafeAreaInsetsContext)
in SafeAreaProviderCompat (created by MaterialBottomTabView)
in MaterialBottomTabView (created by MaterialBottomTabNavigator)
in PreventRemoveProvider (created by NavigationContent)
in NavigationContent
in Unknown (created by MaterialBottomTabNavigator)
in MaterialBottomTabNavigator (created by App)
in EnsureSingleNavigator
in BaseNavigationContainer
in ThemeProvider
in NavigationContainerInner (created by App)
in App (created by withDevTools(App))
in withDevTools(App)
in RCTView (created by View)
in View (created by AppContainer)
in RCTView (created by View)
in View (created by AppContainer)
in AppContainer
in main(RootComponent)
I tried to publish my app on Apple Store and they told me after splashscreen, a white screen appears and on my phone everything is getting fine.
bellow my code :
import React,{useEffect} from 'react';
import { ImageBackground,Text,StyleSheet,View,TouchableOpacity,Image,FlatList} from 'react-native';
import * as Animatable from 'react-native-animatable';
import Include_entete from '../includes/Include_entete';
import Couleurs from '../composants/Couleurs';
import { LinearGradient } from 'expo-linear-gradient';
import {expo} from '../app.json';
import { Ionicons } from '#expo/vector-icons';
import { MaterialCommunityIcons } from '#expo/vector-icons';
//import * as Device from 'expo-device';
export default function Fenetre_accueil({navigation})
{
const [isLoading,setIsLoading] = React.useState(true);
const [data, setData] = React.useState({hits:[]});
useEffect(() =>
{
setIsLoading(true);
setTimeout(async() => {
fetch("https://www.xxxxxx.com/application/app-recueil-sct/last_four_song.php", {method: "GET"})
.then((response) => response.json())
.then((responseJson) =>
{
setData({hits:responseJson});
})
setIsLoading(false);
},1000);
}, []);
if(isLoading)
{
return(
<Animatable.View style={{flex:1,justifyContent:'center',alignItems:'center'}} animation="bounceIn">
<RemotImage
uri={"https://fxxxxxxx.com/ressources/images/logo.png"}
desireWidth={200}
/>
</Animatable.View>
);
}
return(
<Animatable.View animation="bounceInDown" style={{flex:1}}>
<Include_entete />
<ImageBackground imageStyle={{opacity: 0.2}} style={{flex:1,justifyContent:'center',alignSelf:'stretch'}} source={require('./../images/eagle1.jpeg')} resizeMode='cover'>
<View style={styles.container}>
<FlatList
ListHeaderComponent={
<View>
<Text style={{color:Couleurs.text_info,fontSize:20,marginBottom:5,marginLeft:5}}>Bienvenue</Text>
<TouchableOpacity onPress={() => {navigation.navigate('Search',{search:' '})}} style={[styles.boxshadow,styles.card]}>
<ImageBackground source={{uri:'https://xxxxxxxx.com/ressources/images/bible.jpg'}} resizeMode='cover' style={{minHeight:200}}>
<LinearGradient colors={['rgba(0,0,0,0.2)','rgba(0,0,0,0.8)']} style={{minHeight:200,padding:5}}>
<View style={{flexDirection:'row'}}>
<MaterialCommunityIcons name="book-open-page-variant" size={45} color="#fff" style={{marginRight:5}}/>
<Text style={{fontSize:35,color:"#FDF2E9"}}>Recueil SCT</Text>
</View>
<Text style={{color:'#FDF2E9',fontSize:16,marginTop:10,paddingHorizontal:2}}>Cette application vous donne accès à tout le guide de cantiques de l'Eglise Soleil Couchant Tabernacle.</Text>
<View style={{flexDirection:'row-reverse',borderTopColor:'#FDF2E9',borderTopWidth:1,marginTop:20}}>
<Ionicons name="arrow-forward-circle-sharp" size={40} color="#FDF2E9" />
<Text style={{fontSize:16,color:"#FDF2E9",marginRight:5,marginTop:7}}>Accéder à tous nos Cantiques</Text>
</View>
</LinearGradient>
</ImageBackground>
</TouchableOpacity>
<Text style={{color:Couleurs.text_info,fontSize:20,marginBottom:5,marginLeft:5}}>Dernières mise à jour</Text>
</View>
}
data={data.hits} showsVerticalScrollIndicator={false} nestedScrollEnabled={true}
renderItem={({item,index}) =>
(
<TouchableOpacity onPress={() => {navigation.navigate('Chant',{Id:item.id})}} style={[styles.boxshadow,styles.card]}>
<ImageBackground source={{uri:'https://xxxxxxxx.com/ressources/images/jesus.jpg'}} resizeMode='cover' style={{minHeight:200}}>
<LinearGradient colors={['rgba(0,0,0,0.2)','rgba(0,0,0,0.8)']} style={{minHeight:200,padding:5}}>
<View style={{flexDirection:'row'}}>
<MaterialCommunityIcons name="microphone-variant" size={45} color="#fff" />
<Text style={{fontSize:35,color:"#FDF2E9"}}>Chant : #{item.num}</Text>
</View>
<Text style={{color:'#FDF2E9',fontSize:16,marginTop:10,paddingHorizontal:2}}>{item.chant.substring(0,100).replace(/\n|\r/g,' ')}...</Text>
<View style={{flexDirection:'row-reverse',borderTopColor:'#FDF2E9',borderTopWidth:1,marginTop:20}}>
<Ionicons name="arrow-forward-circle-sharp" size={40} color="#FDF2E9" />
<Text style={{fontSize:16,color:"#FDF2E9",marginRight:5,marginTop:7}}>Consulter</Text>
</View>
</LinearGradient>
</ImageBackground>
</TouchableOpacity>
)}
keyExtractor = {( item, index ) => index.toString() }
ListFooterComponent={
<View>
<Text style={styles.text_footer}>version {expo.version}</Text>
<Text style={{fontSize:9,color:Couleurs.text_muted,textAlign:'center'}}>Développé par <Text style={{fontWeight:'bold'}}>ifluxe</Text></Text>
<Text style={{fontSize:9,textAlign:'center'}}><Text style={{fontWeight:'700'}}>Fruxgroupe</Text> en parténariat avec <Text style={{fontWeight:'700'}}>Soleil Couchant Tabernacle</Text></Text>
</View>
}
/>
</View>
</ImageBackground>
</Animatable.View>
);
}
const styles = StyleSheet.create({
text_footer:{textAlign:'center',marginTop:5,borderTopWidth:1,borderTopColor:"#7F8C8D",fontSize:10,paddingTop:1},
container:{padding:10},
card:{marginBottom:20},
boxshadow:{shadowColor:Couleurs.text_muted,elevation:7},
});
const RemotImage = ({uri,desireWidth}) => {
const [desiredHeight, setdesiredHeight] = React.useState(0)
Image.getSize(uri, (width,height) =>
{
setdesiredHeight(desireWidth/width*height)
})
return (
<Image source={{uri}} style={{width:desireWidth,height:desiredHeight}}/>
)
};