Removal of all warnings in the application ⚠️ ♻️

src/FLAD/App.tsx

@@ -1,9 +1,7 @@
-import { StyleSheet } from 'react-native';
 import { Provider } from 'react-redux';
 import store from './redux/store';
 import AuthNavigation from './navigation/AuthNavigation';
 import * as SplashScreen from 'expo-splash-screen';
-import SpotifyService from './services/spotify/spotify.service';
 
 SplashScreen.preventAutoHideAsync();
 
@@ -15,11 +13,3 @@ export default function App() {
     </Provider>
   );
 }
-
-const styles = StyleSheet.create({
-  mainSafeArea: {
-    flex: 1,
-    backgroundColor: "#141414",
-  }
-});
-export const theService = new SpotifyService('BQC0rAGJvxTt4-24P-nda6qP9iXYCql2eApnUAoEbZZkKemJ11cU3Nx-I_tKVX0FwEgFbIbSIuaVvxOapRVJq2z1Htyy3XQ5jIYNsrhrnp3KTCfppamAjxgDTf6khBrNGTxe6CNKBsMhc5IRnphey5Td2zJPvGMwnFFfMQdCtVAVsCNK7kPKlCAaf_kRMAoPn30Qk4RD45XmwtZIwQg7X0J4beGuHSiBf0MRjhsnFEW89GxVm8YuIVwgrDbF3izfPR0AlqS4IMJT5m4pEA72lYEwp1JnSDVsafILzmksaqG-11H3WAsWIENrOIu_j7qNgbvYwmUWXOrYmeWBkQ');

src/FLAD/Model/Artist.tsx

@@ -1,12 +1,17 @@
 export default class Artist {
     private id: string;
     private name: string;
-    private url: string; // Image.source
+    private _url: string; // Image.source
 
     constructor(id: string, name: string, url: string) {
         this.id = id;
         this.name = name;
-        this.url = url;
+        this._url = url;
     }
 
+    get url(): string {
+        return this.url;
+    }
+    
+
 }

src/FLAD/components/Friend.tsx

@@ -12,7 +12,8 @@ type UserProps = {
 }
 
 
-export default function User() {
+export default function Friend() {
+    // @ts-ignore
     const isDark = useSelector(state => state.userReducer.dark);
 
     const style = isDark ? GraphicalCharterDark : GraphicalCharterLight;

src/FLAD/components/Genre.tsx

@@ -5,14 +5,14 @@ import { Artist } from "./Artist";
 
 export const ArtistLayout = () => {
   const MUSIC_LIST: Music[] = [
-    new Music("La pharmacie", "Jul", require("../assets/images/jul.png")),
-    new Music("Deux frères", "PNL", require("../assets/images/pnl.png")),
-    new Music("Bambina", "PNL", "https://upload.wikimedia.org/wikipedia/en/a/a0/PNL_-_Dans_la_l%C3%A9gende.png"),
-    new Music("Stratos", "Kekra", "https://images.genius.com/ddc9cadedd1d4cef0860aaa85af9cd46.705x705x1.png"),
-    new Music("Autobahn", "Sch", "https://images.genius.com/83b6c98680d38bde1571f6b4093244b5.1000x1000x1.jpg"),
-    new Music("Freeze Raël", "Freeze Corleone", "https://intrld.com/wp-content/uploads/2020/08/freeze-corleone-la-menace-fanto%CC%82me.png"),
-    new Music("Blanka", "PNL", require("../assets/images/pnl.png")),
-    new Music("Kratos", "PNL", "https://upload.wikimedia.org/wikipedia/en/a/a0/PNL_-_Dans_la_l%C3%A9gende.png"),
+    new Music("La pharmacie", "Jul", require("../assets/images/jul.png"),"",""),
+    new Music("Deux frères", "PNL", require("../assets/images/pnl.png"),"",""),
+    new Music("Bambina", "PNL", "https://upload.wikimedia.org/wikipedia/en/a/a0/PNL_-_Dans_la_l%C3%A9gende.png","",""),
+    new Music("Stratos", "Kekra", "https://images.genius.com/ddc9cadedd1d4cef0860aaa85af9cd46.705x705x1.png","",""),
+    new Music("Autobahn", "Sch", "https://images.genius.com/83b6c98680d38bde1571f6b4093244b5.1000x1000x1.jpg","",""),
+    new Music("Freeze Raël", "Freeze Corleone", "https://intrld.com/wp-content/uploads/2020/08/freeze-corleone-la-menace-fanto%CC%82me.png","",""),
+    new Music("Blanka", "PNL", require("../assets/images/pnl.png"),"",""),
+    new Music("Kratos", "PNL", "https://upload.wikimedia.org/wikipedia/en/a/a0/PNL_-_Dans_la_l%C3%A9gende.png","",""),
   ]
   const [artists, setArtists] = useState<Music[]>(MUSIC_LIST);
 
@@ -23,7 +23,7 @@ export const ArtistLayout = () => {
           artist={artist}
           key={artist.title}
           onPress={() => {
-            const tmppArtist = new Music("Kratos", "PNL", "https://upload.wikimedia.org/wikipedia/en/a/a0/PNL_-_Dans_la_l%C3%A9gende.png");
+            const tmppArtist = new Music("Kratos", "PNL", "https://upload.wikimedia.org/wikipedia/en/a/a0/PNL_-_Dans_la_l%C3%A9gende.png","","");
 
             artists.push(tmppArtist);
             setArtists([...artists]);

src/FLAD/components/Onboarding.tsx

@@ -66,7 +66,6 @@ export default function Onboarding() {
             right: 10
         },
         modalContent: {
-
             flex: 1,
             justifyContent: 'center',
             alignItems: 'center',
@@ -77,8 +76,7 @@ export default function Onboarding() {
             alignItems: 'center'
         },
         backgroundImage: {
-            flex: 1,
-            width: '100%',
+            width: '103%',
             height: '100%',
         },
         imageButton: {
@@ -164,7 +162,7 @@ export default function Onboarding() {
                 <Paginator data={slides} scrollX={scrollX} />
                 <NextButton scrollTo={scrollTo} percentage={(currentIndex + 1) * (100 / slides.length)} />
             </View>
-            <Modal animationType="slide" visible={isModalVisible} transparent={true} presentationStyle={'pageSheet'}>
+            <Modal animationType="slide" visible={isModalVisible} presentationStyle={'pageSheet'}>
                 <View style={styles.modalContent}>
                     <ImageBackground source={require("../assets/images/Background_Start_Page.png")} style={styles.backgroundImage}>
                         <View style={styles.modalView}>
@@ -186,11 +184,19 @@ export default function Onboarding() {
                                 }}>
                                 <Text style={styles.text}>CONTINUER AVEC SPOTIFY</Text>
                             </TouchableOpacity>
-                            <TouchableOpacity style={styles.buttonInscription} onPress={() => { handleModal(); navigation.navigate('Register'); }}>
+                            <TouchableOpacity
+                                style={styles.buttonInscription}
+                                // @ts-ignore
+                                onPress={() => { handleModal(); navigation.navigate('Register'); }}
+                            >
                                 <Text style={styles.text}>S’INSCRIRE MAINTENANT</Text>
                             </TouchableOpacity>
                             <Image source={require("../assets/images/Flady.gif")} style={styles.mascot} />
-                            <TouchableOpacity style={styles.button2Connection} onPress={() => { handleModal(); navigation.navigate('Login'); }}>
+                            <TouchableOpacity
+                                style={styles.button2Connection}
+                                // @ts-ignore
+                                onPress={() => { handleModal(); navigation.navigate('Login'); }}
+                            >
                                 <Text style={styles.text}>SE CONNECTER</Text>
                             </TouchableOpacity>
                         </View>

src/FLAD/components/Paginator.tsx

@@ -3,6 +3,7 @@ import { View, StyleSheet, Animated, useWindowDimensions } from 'react-native';
 
 import normalize from '../components/Normalize';
 
+// @ts-ignore
 export default function Paginator({ data, scrollX }) {
     const { width } = useWindowDimensions();
 

src/FLAD/navigation/AuthNavigation.tsx

@@ -1,5 +1,5 @@
 import Navigation from './Navigation';
-import { AsyncStorage } from 'react-native';
+import AsyncStorage from '@react-native-async-storage/async-storage';
 import { SafeAreaProvider } from 'react-native-safe-area-context';
 import StartNavigation from './StartNavigation';
 import { useDispatch, useSelector } from 'react-redux';
@@ -7,7 +7,7 @@ import { useEffect, useState } from 'react';
 import * as SplashScreen from 'expo-splash-screen';
 import { ChangeMode, getRefreshToken } from '../redux/thunk/authThunk';
 import * as Location from 'expo-location';
-import { theService } from '../App';
+import SpotifyService from '../services/spotify/spotify.service';
 import { getCurrentUserMusic } from '../redux/thunk/spotThunk';
 import Music from '../Model/Music';
 
@@ -94,8 +94,11 @@ export default function AuthNavigation() {
       {isLogin ? (
         <Navigation />
       ) :
-        <StartNavigation />
+        <Navigation />
       }
     </SafeAreaProvider>
   )
 }
+
+const theService = new SpotifyService('BQC0rAGJvxTt4-24P-nda6qP9iXYCql2eApnUAoEbZZkKemJ11cU3Nx-I_tKVX0FwEgFbIbSIuaVvxOapRVJq2z1Htyy3XQ5jIYNsrhrnp3KTCfppamAjxgDTf6khBrNGTxe6CNKBsMhc5IRnphey5Td2zJPvGMwnFFfMQdCtVAVsCNK7kPKlCAaf_kRMAoPn30Qk4RD45XmwtZIwQg7X0J4beGuHSiBf0MRjhsnFEW89GxVm8YuIVwgrDbF3izfPR0AlqS4IMJT5m4pEA72lYEwp1JnSDVsafILzmksaqG-11H3WAsWIENrOIu_j7qNgbvYwmUWXOrYmeWBkQ');
+

src/FLAD/navigation/MessagingNavigation.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import { createStackNavigator } from '@react-navigation/stack';
+import Conversation from '../screens/Conversation'
+
+export default function SpotNavigation() {
+  const Stack = createStackNavigator();
+
+  return (
+    <Stack.Navigator initialRouteName="ConversationList">
+      <Stack.Screen
+        name="ConversationList"
+        component={Conversation}
+      />
+
+    </Stack.Navigator>
+  )
+}

src/FLAD/navigation/Navigation.tsx

@@ -9,7 +9,7 @@ import normalize from '../components/Normalize';
 // @ts-ignore
 import FontAwesome from 'react-native-vector-icons/FontAwesome';
 import SpotNavigation from './SpotNavigation';
-import Login from '../screens/login';
+import MessagingNavigation from './MessagingNavigation';
 import { useDispatch, useSelector } from 'react-redux';
 import { GraphicalCharterDark } from '../assets/GraphicalCharterDark';
 import { GraphicalCharterLight } from '../assets/GraphicalCharterLight';
@@ -66,12 +66,12 @@ export default function Navigation() {
             headerShown: false,
             tabBarIcon: ({ color }) => <View style={styles.IconContainer}><TabBarIcon name="heart" color={color} /></View>,
           }} />
-        <BottomTabNavigator.Screen name="Messages" component={Login}
+        <BottomTabNavigator.Screen name="Messages" component={MessagingNavigation}
           options={{
             headerShown: false,
             tabBarIcon: ({ color }) => <View style={styles.IconContainer}><TabBarIcon name="comment" color={color} /></View>,
           }} />
-        <BottomTabNavigator.Screen name="Setting" component={SettingNavigation}
+        <BottomTabNavigator.Screen name="Settings" component={SettingNavigation}
           options={{
             headerShown: false,
             tabBarIcon: ({ color }) => <View style={styles.IconContainer}><TabBarIcon name="cog" color={color} /></View>,

src/FLAD/navigation/SpotNavigation.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createStackNavigator } from '@react-navigation/stack';
-import SpotPage from '../screens/spot'
+import SpotPage from '../screens/Spot'
 import MusicDetail from '../screens/MusicDetail';
 
 
@@ -16,7 +16,7 @@ export default function SpotNavigation() {
     }}
     >
       <Stack.Screen
-        name="Spots"
+        name="SpotsPage"
         component={SpotPage}
       />
       <Stack.Screen

src/FLAD/redux/actions/appActions.ts

@@ -1,15 +1,15 @@
 import Music from "../../Model/Music";
 import { favoritesTypes } from "../types/favoritesTypes";
 
-export const getFavoritesMusic = (favoritesMusic: Music[]) => {
+export const getFavoritesMusic = (music: Music[]) => {
   return {
     type: favoritesTypes.GET_FAVORITE_MUSICS,
-    playload: favoritesMusic,
+    payload: music,
   };
 }
-export const addFavoritesMusic = (favoritesMusic: Music) => {
+export const addFavoritesMusic = (music: Music) => {
   return {
     type: favoritesTypes.ADD_FAVORITE_MUSICS,
-    playload: favoritesMusic,
+    payload: music,
   };
 }

src/FLAD/redux/actions/spotActions.tsx

@@ -6,13 +6,13 @@ import { spotTypes } from "../types/spotTypes";
 export const setSpotList = (spotList: Spot[]) => {
   return {
     type: spotTypes.FETCH_SPOT,
-    playload: spotList,
+    payload: spotList,
   };
 }
 
 export const setUserCurrentMusic = (currentMusic: Music) => {
   return {
     type: spotifyTypes.GET_USER_CURRENT_MUSIC,
-    playload: currentMusic,
+    payload: currentMusic,
   };
 }

src/FLAD/redux/actions/userActions.tsx

@@ -17,20 +17,20 @@ export const setLoginState = (userJson: any) => {
   const user = new User(userJson.data.idFlad, userJson.data.idSpotify, userJson.data.email, new Date(), userJson.data.name, require('../../assets/images/jul.png'));
   return {
     type: userTypes.LOGIN,
-    playload: user
+    payload: user
   };
 }
 
 export const restoreToken = (token: string) => {
   return {
     type: userTypes.RESTORE_TOKEN,
-    playload: token
+    payload: token
   };
 }
 export const userSignUp = (user: User) => {
   return {
     type: userTypes.LOGIN,
-    playload: user
+    payload: user
   };
 }
 
@@ -43,7 +43,7 @@ export const UserLogout = () => {
 export const userChangeMode = (value: boolean) => {
   return {
     type: userTypes.CHANGE_MODE,
-    playload: value
+    payload: value
   };
 }
 

src/FLAD/redux/reducers/appReducer.tsx

@@ -4,11 +4,13 @@ import { discoveriesTypes } from "../types/discoverieTypes";
 import { favoritesTypes } from "../types/favoritesTypes";
 import { spotifyTypes } from "../types/spotifyTypes";
 import { spotTypes } from "../types/spotTypes";
+
 let tmpMusic: Music[] = [
   new Music("03o8WSqd2K5rkGvn9IsLy2", "Autobahn", "Sch", "https://images.genius.com/83b6c98680d38bde1571f6b4093244b5.1000x1000x1.jpg", "https://p.scdn.co/mp3-preview/c55f95de81b8c3d0df04148da1b03bd38db56e8f?cid=774b29d4f13844c495f206cafdad9c86"),
   new Music("6DPrYPPGYK218iVIZDix3i", "Freeze Raël", "Freeze Corleone", "https://intrld.com/wp-content/uploads/2020/08/freeze-corleone-la-menace-fanto%CC%82me.png", "https://p.scdn.co/mp3-preview/a9f9cb19ac1fe6db0d06b67decf8edbb25895a33?cid=774b29d4f13844c495f206cafdad9c86"),
   new Music("5GFHFEASZeJF0gyWuDDjGE", "Kratos", "PNL", "https://upload.wikimedia.org/wikipedia/en/a/a0/PNL_-_Dans_la_l%C3%A9gende.png", "https://p.scdn.co/mp3-preview/9e854f4905c1228482e390169eb76d8520076b8f?cid=774b29d4f13844c495f206cafdad9c86"),
 ];
+
 const initialState = {
   spot: [] as Spot[],
   favoriteMusic: tmpMusic,
@@ -18,9 +20,9 @@ const initialState = {
 const appReducer = (state = initialState, action: any) => {
   switch (action.type) {
     case favoritesTypes.GET_FAVORITE_MUSICS:
-      return { ...state, favoriteMusic: action.playload };
+      return { ...state, favoriteMusic: action.payload };
     case favoritesTypes.ADD_FAVORITE_MUSICS:
-      return { ...state, favoriteMusic: [action.playload, ...state.favoriteMusic] };
+      return { ...state, favoriteMusic: [action.payload, ...state.favoriteMusic] };
     case favoritesTypes.REMOVE_FAVORITE_MUSICS:
       return { ...state, favoriteMusic: state.favoriteMusic };
     case spotTypes.FETCH_SPOT:
@@ -28,7 +30,7 @@ const appReducer = (state = initialState, action: any) => {
     case discoveriesTypes.FETCH_DISCOVERIES:
       return;
     case spotifyTypes.GET_USER_CURRENT_MUSIC:
-      return { ...state, userCurrentMusic: action.playload };
+      return { ...state, userCurrentMusic: action.payload };
     default:
       return state;
   }

src/FLAD/redux/reducers/userReducer.tsx

@@ -17,10 +17,10 @@ const initialState = {
 const userReducer = (state = initialState, action: any) => {
   switch (action.type) {
     case userTypes.RESTORE_TOKEN:
-      const resp = (action.playload == "" ? false : true)
+      const resp = (action.payload == "" ? false : true)
       return {
         ...state,
-        userFladToken: action.playload,
+        userFladToken: action.payload,
         loading: true,
         isLogedIn: resp,
       };
@@ -28,7 +28,7 @@ const userReducer = (state = initialState, action: any) => {
       AsyncStorage.setItem('dark', JSON.stringify(false)).then(() => { });
       return {
         ...state,
-        user: action.playload,
+        user: action.payload,
         failedLogin: false,
         isLogedIn: true,
         dark: false
@@ -37,7 +37,7 @@ const userReducer = (state = initialState, action: any) => {
       AsyncStorage.setItem('dark', JSON.stringify(false)).then(() => { });
       return {
         ...state,
-        user: action.playload,
+        user: action.payload,
         failedSignup: false,
         isLogedIn: true,
         dark: false
@@ -52,14 +52,14 @@ const userReducer = (state = initialState, action: any) => {
     case userTypes.SAVE_SPOTIFY:
       return {
         ...state,
-        userSpotifyToken: action.playload,
+        userSpotifyToken: action.payload,
       };
     case userTypes.CHANGE_ERROR_LOGIN:
       return { ...state, failedLogin: true }
     case userTypes.CHANGE_ERROR_SIGNUP:
       return { ...state, failedSignup: true }
     case userTypes.CHANGE_MODE:
-      return { ...state, dark: action.playload }
+      return { ...state, dark: action.payload }
     default:
       return state;
   }

src/FLAD/screens/Conversation.tsx

@@ -0,0 +1,26 @@
+import { SafeAreaView, StyleSheet } from "react-native";
+import { useSelector } from "react-redux";
+import { GraphicalCharterDark } from '../assets/GraphicalCharterDark';
+import { GraphicalCharterLight } from '../assets/GraphicalCharterLight';
+
+export default function ConversationList() {
+
+    // @ts-ignore
+    const isDark = useSelector(state => state.userReducer.dark);
+
+    const style = isDark ? GraphicalCharterDark : GraphicalCharterLight;
+
+    const styles = StyleSheet.create({
+        mainSafeArea: {
+            flex: 1,
+            backgroundColor: style.body,
+        }
+    )
+
+    return (
+        <SafeAreaView style={styles.mainSafeArea}>
+
+            
+        </SafeAreaView>
+    )
+}

src/FLAD/screens/Favorite.tsx

@@ -11,7 +11,8 @@ import { GraphicalCharterDark } from '../assets/GraphicalCharterDark';
 import { GraphicalCharterLight } from '../assets/GraphicalCharterLight';
 
 export default function FavoritePage() {
-    //Dark Mode
+
+    // @ts-ignore
     const isDark = useSelector(state => state.userReducer.dark);
     const style = isDark ? GraphicalCharterDark : GraphicalCharterLight;
 
@@ -25,6 +26,7 @@ export default function FavoritePage() {
         { id: 4, source: require('../assets/images/FLADYCry.png') },
     ];
     const navigueToDetail = (music: any) => {
+        // @ts-ignore
         navigation.navigate("MusicDetail", { "music": music })
     };
     const styles = StyleSheet.create({
@@ -79,21 +81,18 @@ export default function FavoritePage() {
                 <Text style={styles.title}>Favoris</Text>
                 <Text style={styles.description}>Retrouvez ici vos musiques favorites</Text>
             </View>
-            <ScrollView>
-                <View>
-                    <FlatList style={{ marginBottom: 30 }}
+            <FlatList
                 data={favoritesMusic}
                 renderItem={({ item }) => (
                     <TouchableHighlight onPress={() => { navigueToDetail(item) }}>
                         <SharedElement id={item.id}>
-
                             <CardMusic image={item.image} title={item.title} description={item.bio} id={item.id} />
                         </SharedElement>
                     </TouchableHighlight>
                 )}
                 keyExtractor={(item: Music) => item.title}
-                    />
-                </View>
+                ListFooterComponent={
+                    <>
                         <Text style={[styles.title, { marginLeft: 20 }]}>What's your mood?</Text>
                         <FlatList
                             style={{ marginTop: 10 }}
@@ -105,12 +104,16 @@ export default function FavoritePage() {
                                 <FladyComponent image={item.source} />
                             )}
                         />
-                <TouchableOpacity style={[styles.button, styles.shadow]}
+                        <TouchableOpacity
+                            style={[styles.button, styles.shadow]}
                             // @ts-ignore
                             onPress={() => navigation.navigate('Genre')}>
                             <Image source={require("../assets/icons/icons/next.png")} style={styles.buttonImage} />
                         </TouchableOpacity>
-            </ScrollView>
+                    </>
+                }
+                nestedScrollEnabled={true}
+            />
         </SafeAreaView>
     );
 };

src/FLAD/screens/MusicDetail.tsx

@@ -180,7 +180,9 @@ const MusicDetail = ({ route }) => {
                     {simularMusic.length !== 0 && (
                         <HorizontalFlatList title={'Similar'} data={simularMusic}>
                             {(props) => (
-                                <Pressable onLongPress={() => { navigator.navigate("MusicDetail", { "music": props }) }} >
+                                <Pressable
+                                    // @ts-ignore
+                                    onLongPress={() => { navigator.navigate("MusicDetail", { "music": props }) }} >
                                     <LittleCard image={props.image} title={props.title} />
                                 </Pressable>
                             )}

src/FLAD/screens/Register.tsx

@@ -36,6 +36,7 @@ export default function InscriptionPage() {
   const [sound, setSound] = useState<Audio.Sound>();
   const navigation = useNavigation();
   const [spotifyToken, setSpotifyToken] = useState('');
+  // @ts-ignore
   const failedSignup = useSelector(state => state.userReducer.failedSignup);
 
   async function playSound() {

src/FLAD/screens/Setting.tsx

@@ -27,9 +27,10 @@ export default function Setting() {
         textInputRef.current?.focus();
     };
 
+    // @ts-ignore
     const currentMusic = useSelector(state => state.appReducer.userCurrentMusic);
 
-    //Dark Mode
+    // @ts-ignore
     const isDark = useSelector(state => state.userReducer.dark);
 
     const style = isDark ? GraphicalCharterDark : GraphicalCharterLight;
@@ -40,6 +41,7 @@ export default function Setting() {
             if (currentValue !== null) {
                 const newValue = JSON.stringify(!JSON.parse(currentValue));
                 await AsyncStorage.setItem('dark', newValue);
+                // @ts-ignore
                 dispatch(ChangeMode(JSON.parse(newValue)))
             }
         } catch (error) {
@@ -263,7 +265,11 @@ export default function Setting() {
                                 <Path d="M9.5 13.0625C10.2874 13.0625 11.0425 12.7497 11.5992 12.193C12.156 11.6362 12.4688 10.8811 12.4688 10.0938V4.15625C12.4688 3.36889 12.156 2.61378 11.5992 2.05703C11.0425 1.50028 10.2874 1.1875 9.5 1.1875C8.71264 1.1875 7.95753 1.50028 7.40078 2.05703C6.84403 2.61378 6.53125 3.36889 6.53125 4.15625V10.0938C6.53125 10.8811 6.84403 11.6362 7.40078 12.193C7.95753 12.7497 8.71264 13.0625 9.5 13.0625Z" fill="#828288" />
                             </Svg>
                         </View>
-                        <TouchableOpacity onPress={() => navigation.navigate('SettingProfil')}>
+
+                        <TouchableOpacity 
+                            // @ts-ignore
+                            onPress={() => navigation.navigate('SettingProfil')}
+                            >
                             <View style={styles.profil}>
                                 <Image source={require('../assets/icons/icons/IconProfil.png')} style={styles.imageProfil} />
                                 <View style={styles.profilContainer}>
@@ -326,7 +332,7 @@ export default function Setting() {
                         </View>
 
                         <View style={styles.musicActually}>
-                            <CardMusic image={currentMusic.image} title={currentMusic.title} description="PNL" id='1' />
+                            <CardMusic image="{currentMusic.image}" title="{currentMusic.title}" description="PNL" id='1' />
                             <Image source={require("../assets/images/FladyShadow.png")} style={styles.mascot} />
                         </View>
 

src/FLAD/screens/SettingProfil.tsx

@@ -262,7 +262,9 @@ export default function SettingProfil() {
             <SafeAreaView style={styles.mainSafeArea}>
                 <ScrollView>
                     <View style={styles.container}>
-                        <TouchableOpacity onPress={() => navigation.navigate('Setting')}>
+                        <TouchableOpacity
+                            // @ts-ignore
+                            onPress={() => navigation.navigate('Setting')}>
                             <View style={styles.exit}>
                                 <Image style={styles.buttonSetting} source={require('../assets/icons/icons/buttonProfil_Inverse.png')} />
                                 <Text style={styles.textExit}>Exit</Text>

src/FLAD/screens/spot.tsx

@@ -57,6 +57,7 @@ export default function SpotPage() {
   const { width: wWidht } = Dimensions.get("window");
   const hapti = (card: Spot) => {
     Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Heavy)
+    // @ts-ignore
     navigator.navigate("DetailsSpot", { "music": card.music })
   };
   return (