From 560c33ee1b23aa18b7e547dcb12cdd8561b88750 Mon Sep 17 00:00:00 2001
From: Thomas Chazot <tchazot63@gmail.com>
Date: Tue, 22 Nov 2022 17:34:24 +0100
Subject: [PATCH] =?UTF-8?q?Probl=C3=A8me=20avec=20:=20la=20navigation?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 bob_party/src/components/Skin.tsx   | 24 +++++++++++++++++++++---
 bob_party/src/components/TopBar.tsx |  5 ++++-
 2 files changed, 25 insertions(+), 4 deletions(-)

diff --git a/bob_party/src/components/Skin.tsx b/bob_party/src/components/Skin.tsx
index 25f0af7..a0e8a5c 100644
--- a/bob_party/src/components/Skin.tsx
+++ b/bob_party/src/components/Skin.tsx
@@ -11,16 +11,34 @@ import { useDispatch, useSelector } from "react-redux"
 import { loginUser } from "../redux/features/currentUserSlice"
 import { RootState } from "../redux/store"
 import { MANAGER_USER } from "../../App"
+import { useUserStore } from "../../userContext"
+
+
+
 
 export const SkinComponent :
+
+
+
 /* Parameters : 
     * skin : Skin to be displayed
     * state : Indicates from wich screen the component has been called
 */ 
-FC<{skin: Skin, state: String}> = 
-({skin, state}) => 
+FC<{nav : any, skin: Skin, state: String}> = 
+({nav, skin, state}) => 
 {
+
+    console.log(nav);
+
     const dispatch=useDispatch();
+
+    const setUser = useUserStore((state) => state.setUser);
+
+    function changerSkin(skin:Skin) {
+        MANAGER_USER.getCurrentUser()?.setCurrentSkin(skin);
+        setUser(MANAGER_USER.getCurrentUser());
+        MANAGER_USER.getsaverUser().updateUser(MANAGER_USER.getCurrentUser());
+    }
     
 
     /* The display of this component depends of the screen from where it has been called:
@@ -49,7 +67,7 @@ FC<{skin: Skin, state: String}> =
             )
         case 'liste':
             return(
-                <Pressable onPress={() => {MANAGER_USER.getCurrentUser().setCurrentSkin(skin)}} style={styles.imageWrapper}>
+                <Pressable onPress={() => {changerSkin(skin); nav.navigate('ProfileTab', {screen: 'Profile'})}} style={styles.imageWrapper}>
                     <Text style={styles.nomSkin}>{skin.getSkinName()}</Text>
                     <Image
                         style={styles.imageSkin}
diff --git a/bob_party/src/components/TopBar.tsx b/bob_party/src/components/TopBar.tsx
index 2d30ccc..c3dce68 100644
--- a/bob_party/src/components/TopBar.tsx
+++ b/bob_party/src/components/TopBar.tsx
@@ -12,6 +12,7 @@ import styles from './style/TopBar.style';
 import { useSelector } from "react-redux"
 import { RootState } from "../redux/store"
 import { MANAGER_USER } from "../../App"
+import { useUserStore } from "../../userContext"
 
 /* 
     Images required
@@ -31,6 +32,7 @@ FC<{nav: any, state?: string}> =
 ({nav, state}) => 
 {
 
+    
     /* 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
@@ -49,10 +51,11 @@ FC<{nav: any, state?: string}> =
                 </View>
             )
         default:
+
             return (
                 <View style={styles.header}>
                     <Pressable onPress={() => nav.navigate('ProfileTab', {screen: 'Profile'})}>
-                            <SkinComponent skin={MANAGER_USER.getCurrentUser().getCurrentSkin()} state='icon' />
+                            <SkinComponent skin={MANAGER_USER.getCurrentUser().getCurrentSkin()} state='icon' nav={nav} />
                         </Pressable>
                         <Text style={styles.titre}>BOB PARTY</Text>
                         <Pressable onPress={() => nav.navigate('Settings')}>