ADD:

Ajout du current User du redux dans les écrans

bob_party/src/components/TopBar.tsx

@@ -3,11 +3,14 @@ import { Pressable, Image, Text, View} from "react-native"
 import { Skin } from "../core/Skin"
 import React from "react"
 import { SkinComponent } from "./Skin"
+import { User } from "../core/user"
 
 /*
     Import the correct stylesheet
 */
 import styles from './style/TopBar.style';
+import { useSelector } from "react-redux"
+import { RootState } from "../redux/store"
 
 /* 
     Images required
@@ -23,9 +26,12 @@ export const TopBar :
     * state :  optional parameter that indicates from which screen the component has been called
         (the string must be the name of the screen)
 */
-FC<{skin?: Skin, nav: any, state?: string}> = 
-({skin, nav, state}) => 
+FC<{nav: any, state?: string}> = 
+({nav, state}) => 
 {
+
+    const currentUser = useSelector((state: RootState) => state.currentUser.value)[0];
+
     /* The display of this component depends of the screen from where it has been called:
         * From the Settings (icon) : Name of the page + cross button
         * From other : skin + Title + parameters icon
@@ -47,7 +53,7 @@ FC<{skin?: Skin, nav: any, state?: string}> =
             return (
                 <View style={styles.header}>
                     <Pressable onPress={() => nav.navigate('ProfileTab', {screen: 'Profile'})}>
-                            <SkinComponent skin={skin} state='icon' />
+                            <SkinComponent skin={currentUser.getCurrentSkin()} state='icon' />
                         </Pressable>
                         <Text style={styles.titre}>BOB PARTY</Text>
                         <Pressable onPress={() => nav.navigate('Settings')}>

bob_party/src/screens/Chat.tsx

@@ -1,32 +1,28 @@
 import { StatusBar } from 'expo-status-bar'
-import { StyleSheet, View, Text} from 'react-native'
+import {View} from 'react-native'
 import React from 'react';
-import stylesScreen from './style/screens.style'
-import { Skin } from '../core/skin';
+import stylesScreen from './style/screens.style';
 import { TopBar } from '../components/TopBar';
 import { BotBar } from '../components/BotBar';
-import { ScreenIndicator } from '../components/ScreenIndicator';
-import { User } from '../core/user';
 import { FlatList } from 'react-native-gesture-handler';
 import { ConversationComponent } from '../components/ConversationComponent';
-
-import tabSkinApp from '../constSkin';
-import tabConv from '../constCov';
-
-
-const UserActu=new User("14", "leBg", "MdpDeOuf", "ouioui", "grand", new Date(2022,12,12), 12222, 123324, 12,  tabSkinApp[0], tabSkinApp, tabConv);
+import { useSelector } from 'react-redux';
+import { RootState } from '../redux/store';
 
 function Chat(props: { navigation: any; }) {
     const { navigation } = props
-    return (
+
+    const currentUser = useSelector((state: RootState) => state.currentUser.value[0]);
+    
+    return (  
     <View style={stylesScreen.container}>
       <TopBar
-          skin={UserActu.getCurrentSkin()}
+          skin={currentUser.getCurrentSkin()}
           nav={navigation}
           />
       <View style={stylesScreen.bodyStart}>
         <FlatList 
-          data={tabConv}
+          data={currentUser.getTabConv()}
           renderItem={({item}) => <ConversationComponent conv={item} state='Preview'/>} 
         />
       </View>

bob_party/src/screens/Home.tsx

@@ -1,46 +1,46 @@
 import { StatusBar } from 'expo-status-bar'
-import { StyleSheet, View, ImageSourcePropType} from 'react-native'
+import { View} from 'react-native'
 import React from 'react';
 import stylesScreen from './style/screens.style'
-import { User } from '../core/user';
-import { Skin } from '../core/skin';
 import { TopBar } from '../components/TopBar';
 import { BotBar } from '../components/BotBar';
 import { Conversation } from '../core/conversation';
 import { ButtonGameTypeChoice } from '../components/ButtonGameTypeChoice';
-import tabSkinApp from '../constSkin';
-import { GameSolo } from '../core/gameSolo';
-
+import { useSelector } from 'react-redux';
+import { RootState } from '../redux/store';
 
 
 //const test= new GameSolo("test", require('bob_party/assets/ImagesJeux/BatailleNavale.jpeg'), "test", );
 let tabConv:Conversation[]=[];
-const UserActu=new User("14", "leBg", "MdpDeOuf", "ouioui", "grand", new Date(2022,12,12), 12222, 123324, 12,  tabSkinApp[0], tabSkinApp, tabConv);
+
 
 function Home(props: { navigation: any; }) {
     const { navigation } = props
-    return (
-    <View style={stylesScreen.container}>
-      <TopBar
-        skin={UserActu.getCurrentSkin()} 
-        nav={navigation}
-        state= 'Home'
-      />
-      <View style={stylesScreen.bodyCenter}>
-        <ButtonGameTypeChoice
-        title='Jouer Seul'
-        onPress={() => navigation.navigate('GameChoice')}
+
+    const currentUser = useSelector((state: RootState) => state.currentUser.value[0]);
+    
+    return ( 
+      <View style={stylesScreen.container}>
+        <TopBar
+          skin={currentUser.getCurrentSkin()} 
+          nav={navigation}
+          state= 'Home'
         />
-        <ButtonGameTypeChoice
-        title='Défier mes amis'
-        onPress={() => navigation.navigate('GameChoice')}
+        <View style={stylesScreen.bodyCenter}>
+          <ButtonGameTypeChoice
+          title='Jouer Seul'
+          onPress={() => navigation.navigate('GameChoice')}
+          />
+          <ButtonGameTypeChoice
+          title='Défier mes amis'
+          onPress={() => navigation.navigate('GameChoice')}
+          />
+        </View>
+        <BotBar 
+          nav={navigation}
+          state='Home'
         />
       </View>
-      <BotBar 
-        nav={navigation}
-        state='Home'
-      />
-    </View>
   );
 }
 

bob_party/src/screens/Profile.tsx

@@ -1,46 +1,49 @@
 import { StatusBar } from 'expo-status-bar'
-import { StyleSheet, View, Text, Image} from 'react-native'
+import { View, Text, Image} from 'react-native'
 import React from 'react';
 import stylesScreen from './style/screens.style'
 import styles from './style/Profile.style'
 import { TopBar } from '../components/TopBar';
 import { BotBar } from '../components/BotBar';
 import { SkinComponent } from '../components/Skin';
-import { User } from '../core/user';
-import tabSkinApp from '../constSkin';
-import tabConv from '../constCov'
 import { ButtonGreySmall } from '../components/ButtonGreySmall';
 import { ScreenIndicator } from '../components/ScreenIndicator';
+import { useSelector } from 'react-redux';
+import { RootState } from '../redux/store';
 
 const coin = require('../../assets/Icons/Coin.png')
 
-const UserActu=new User("14", "leBg","MdpDeOuf", "ouioui", "grand", new Date(2022,12,12), 12222, 123324, 12, tabSkinApp[0], tabSkinApp, tabConv);
+
 
 function Profile(props: { navigation: any; }) {
     const { navigation } = props
+
+    const currentUser = useSelector((state: RootState) => state.currentUser.value)[0];
+
     return (
     <View style={stylesScreen.container}>
         <TopBar
-          skin={UserActu.getCurrentSkin()} 
+          skin={currentUser.getCurrentSkin()} 
           nav={navigation}
           />
       <View style={stylesScreen.bodyStart}>
         <ScreenIndicator title='Profil'/>
+        <Text style={styles.pseudoText}>{currentUser.getUsername()}</Text>
         <View style={styles.coinSkinView}>
             <View style={styles.coinView}>
                 <Image 
                     style={styles.coin}
                     source={coin}
                 />
-                <Text style={styles.coinText}>{UserActu.getCurrentCoins()}</Text>
+                <Text style={styles.coinText}>{currentUser.getCurrentCoins()}</Text>
             </View>
             <View style={styles.skinView}>
-                <SkinComponent skin={UserActu.getCurrentSkin()} state='profile'/>
+                <SkinComponent skin={currentUser.getCurrentSkin()} state='profile' nav={navigation} />
                 <ButtonGreySmall onPress={() => navigation.navigate('SkinList')} title='Changer de skin' state='Profile'/>
             </View>
         </View>
         <View style={styles.infoView}>
-            <Text style={styles.infoText}>Total de BobCoin gagnés: {UserActu.getTotalCoins()}</Text>
+            <Text style={styles.infoText}>Total de BobCoin gagnés: {currentUser.getTotalCoins()}</Text>
         </View>
       </View>
       <BotBar

bob_party/src/screens/SkinList.tsx

@@ -1,22 +1,27 @@
 import { StatusBar } from 'expo-status-bar'
-import { StyleSheet, View, Text} from 'react-native'
+import { View } from 'react-native'
 import React from 'react';
 import stylesScreen from './style/screens.style'
-import { Skin } from '../core/skin';
 import { TopBar } from '../components/TopBar';
 import { BotBar } from '../components/BotBar';
 import { FlatList } from 'react-native-gesture-handler';
 import { SkinComponent } from '../components/Skin';
 import tabSkinApp from '../constSkin';
 import { ScreenIndicator } from '../components/ScreenIndicator';
+import { useSelector } from 'react-redux';
+import { RootState } from '../redux/store';
+
 
 
 function SkinList(props: { navigation: any; }) {
     const { navigation } = props
+
+    const currentUser = useSelector((state: RootState) => state.currentUser.value[0]);
+
     return (
     <View style={stylesScreen.container}>
         <TopBar
-          skin={tabSkinApp[0]} 
+          skin={currentUser.getCurrentSkin()} 
           nav={navigation}
           />
       <View style={stylesScreen.bodyStart}>

bob_party/src/screens/Store.tsx

@@ -1,28 +1,30 @@
 import { StatusBar } from 'expo-status-bar'
-import { StyleSheet, View} from 'react-native'
+import { View } from 'react-native'
 import React from 'react';
-import stylesScreen from './style/screens.style'
-import { Skin } from '../core/skin';
+import stylesScreen from './style/screens.style';
 import { TopBar } from '../components/TopBar';
 import { BotBar } from '../components/BotBar';
 import { FlatList } from 'react-native-gesture-handler';
 import { SkinComponent } from '../components/Skin';
 import { ScreenIndicator } from '../components/ScreenIndicator';
-
-import tabSkinApp from '../constSkin';
+import { useSelector } from 'react-redux';
+import { RootState } from '../redux/store';
 
 function Store(props: { navigation: any; }) {
-    const { navigation } = props
-    return (
+  const { navigation } = props
+
+  const currentUser = useSelector((state: RootState) => state.currentUser.value[0]);
+
+  return (
     <View style={stylesScreen.container}>
       <TopBar
-        skin={tabSkinApp[0]}
+        skin={currentUser.getCurrentSkin()}
         nav={navigation}
       />
       <View style={stylesScreen.bodyStart}>
         <ScreenIndicator title='Store'/>
         <FlatList 
-          data={tabSkinApp}
+          data={currentUser.getTabSkin()}
           numColumns={2}
           columnWrapperStyle={{ flex: 1, justifyContent: "space-around"}}
           keyExtractor={item =>item.getSkinName()}