tp8

.idea/.gitignore

@@ -0,0 +1,5 @@
+# Default ignored files
+/shelf/
+/workspace.xml
+# Editor-based HTTP Client requests
+/httpRequests/

.idea/Tp_ReactNative.iml

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="WEB_MODULE" version="4">
+  <component name="NewModuleRootManager">
+    <content url="file://$MODULE_DIR$">
+      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
+      <excludeFolder url="file://$MODULE_DIR$/temp" />
+      <excludeFolder url="file://$MODULE_DIR$/tmp" />
+    </content>
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>

.idea/modules.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/Tp_ReactNative.iml" filepath="$PROJECT_DIR$/.idea/Tp_ReactNative.iml" />
+    </modules>
+  </component>
+</project>

.idea/vcs.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>

JokesApp/components/DetailJoke.tsx

@@ -4,7 +4,7 @@ import React, {useState} from "react";
 import {SampleJoke} from "../model/SampleJoke";
 import {Joke} from "../model/Joke";
 import {CustomJoke} from "../model/CustomJoke";
-import {storeFavoriteJoke} from "../redux/store";
+import {storeFavoriteJoke, useAppDispatch, useAppSelector} from "../redux/store";
 
 type DetailJokeProps = {
     item: CustomJoke;
@@ -16,6 +16,9 @@ export function DetailJoke(props: DetailJokeProps) {
     const [isActivated, setIsActivated] = useState(false);
     const [isActivated2, setIsActivated2] = useState(false);
 
+    const favoriteJokes = useAppSelector(state => state.customReducer.favoriteJokes) as [CustomJoke, SampleJoke];
+    const dispatch = useAppDispatch();
+
     function toggleActivation() {
         setIsActivated(!isActivated);
         if (isActivated) {
@@ -23,9 +26,12 @@ export function DetailJoke(props: DetailJokeProps) {
             //removeFavoriteJoke();
         }
         else {
-            console.log("Joke ajoutée aux favoris");
+            if (props.item === undefined) {
-            storeFavoriteJoke(props.item)
+                console.log("Joke undefined");
+                return;
             }
+            console.log("Joke ajoutée aux favoris");
+            storeFavoriteJoke(props.item);        }
     }
 
 

JokesApp/navigation/Navigation.tsx

@@ -19,8 +19,6 @@ import {ListFavoriteJokeScreen} from "../screens/ListFavoriteJokeScreen";
 
 
 export function Navigation(){
-
-
     const BottomTabNavigator = createBottomTabNavigator();
 
     const [themes, setThemes] = useState<Theme>(DefaultTheme);

JokesApp/redux/actions/customAction.ts

@@ -6,6 +6,7 @@ export enum CustomActionType {
     FETCH_CUSTOMS_JOKE = 'FETCH_CUSTOMS_JOKE',
     FETCH_CUSTOMS_JOKE_BY_ID = 'FETCH_CUSTOMS_JOKE_BY_ID',
     DELETE_CUSTOM_JOKE = 'DELETE_CUSTOM_JOKE',
+    FETCH_FAVORITE_JOKE = 'FETCH_FAVORITE_JOKE'
 }
 
 export interface CustomAction {
@@ -23,6 +24,8 @@ export interface CustomsAction {
     payload: CustomJoke[];
 }
 
+
+
 export type Action = CustomAction;
 
 
@@ -55,6 +58,12 @@ export const setDeleteCustomJoke = (deleteCustomJoke: CustomJoke): postCustomAct
     }
 }
 
+export const setFavoriteJoke = (favoriteJokes: CustomJoke[]): CustomsAction => {
+    return {
+        type: CustomActionType.FETCH_FAVORITE_JOKE,
+        payload: favoriteJokes
+    }
+}
 
 
 export const postJoke = (type : string, setup : string, punchline : string) => {

JokesApp/redux/reducers/customJokeReducer.ts

@@ -8,6 +8,7 @@ interface state {
     customJokes: CustomJoke[];
     completCustomJoke: CustomJoke;
     deleteCustomJoke: CustomJoke;
+    favoriteJokes: CustomJoke[];
 }
 
 // initial state for sampleJokes
@@ -16,6 +17,7 @@ const initialState: state = {
     customJokes: [],
     completCustomJoke: {} as CustomJoke,
     deleteCustomJoke: {} as CustomJoke,
+    favoriteJokes: []
 }
 
 // app reducer for sampleJokes
@@ -42,6 +44,11 @@ export default appReducer = (state = initialState, action: Action) => {
                 ...state,
                 deleteCustomJoke: action.payload,
             }
+        case CustomActionType.FETCH_FAVORITE_JOKE:
+            return {
+                ...state,
+                favoriteJokes: action.payload,
+            }
 
         default:
             return state;

JokesApp/redux/store.ts

@@ -5,6 +5,10 @@ import customReducer from "./reducers/customJokeReducer";
 import AsyncStorage from '@react-native-async-storage/async-storage';
 import {Theme} from "@react-navigation/native";
 import {CustomJoke} from "../model/CustomJoke";
+import {setFavoriteJoke} from "./actions/customAction";
+import {TypedUseSelectorHook, useDispatch, useSelector} from "react-redux";
+import {SampleJoke} from "../model/SampleJoke";
+import {Joke} from "../model/Joke";
 
 const reducer = {
     categorieReducer: categorieReducer,
@@ -13,7 +17,6 @@ const reducer = {
 };
 
 
-// @ts-ignore
 const store = configureStore({
     // @ts-ignore
     reducer,
@@ -59,30 +62,43 @@ export const storeFavoriteJoke =async (joke) => {
     }
 }
 
-export const getFavorite = async () => {
+export const getFavorite = () => {
+    return async (dispatch) => {
         try {
-        const jsonValue = await AsyncStorage.getItem('@favorite')
+            const favoriteJokes = await AsyncStorage.getItem('favorites');
-        return jsonValue != null ? JSON.parse(jsonValue) as CustomJoke[] : null;
+            let favoriteJokesList = favoriteJokes != null ? JSON.parse(favoriteJokes) : [];
+            favoriteJokesList = favoriteJokesList.filter(joke => joke.id !== undefined);
+            await AsyncStorage.setItem('favorites', JSON.stringify(favoriteJokesList));
+            dispatch(setFavoriteJoke(favoriteJokesList));
         } catch (e) {
             console.log(e);
         }
     }
+}
 
-export const removeFavoriteJoke = async (joke) => {
+export const removeFavoriteJoke =  (joke) => {
+    return async (dispatch) => {
         try {
             const jsonValue = await AsyncStorage.getItem('@favorite')
-        let favoriteJokes = jsonValue != null ? JSON.parse(jsonValue) as CustomJoke[] : [];
+            let favoriteJokes = jsonValue != null ? JSON.parse(jsonValue) : [];
             const index = favoriteJokes.indexOf(joke);
             if (index > -1) {
                 favoriteJokes.splice(index, 1);
             }
             const updatedJsonValue = JSON.stringify(favoriteJokes);
-        await AsyncStorage.setItem('@favorite', updatedJsonValue);
+            AsyncStorage.setItem('@favorite', updatedJsonValue);
             console.log("favorite removed");
-    }
+        } catch (e) {
-    catch (e) {
             console.log(e);
         }
     }
+}
+
+export type AppDispatch = typeof store.dispatch;
+
+export type AppStore = ReturnType<typeof store.getState>;
+
+export const useAppDispatch = () => useDispatch<AppDispatch>();
+export const useAppSelector: TypedUseSelectorHook<AppStore> = useSelector;
 
 export default store;

JokesApp/screens/ListFavoriteJokeScreen.tsx

@@ -2,31 +2,40 @@ import {useTheme} from "@react-navigation/native";
 import {darksalmonColor, indigo, whiteColor} from "../Theme";
 import React, {useEffect, useState} from "react";
 import {getFavorite} from "../redux/store";
-import {FlatList, SafeAreaView, StyleSheet, TouchableHighlight} from "react-native";
+import {FlatList, SafeAreaView, StyleSheet, TouchableHighlight, View, Text} from "react-native";
 import {JokeListItems} from "../components/ListeJokeComponent";
 import {CustomJoke} from "../model/CustomJoke";
-
+import {SampleJoke} from "../model/SampleJoke";
+import {useAppSelector, useAppDispatch} from "../redux/store";
+import {useDispatch} from "react-redux";
 export function ListFavoriteJokeScreen({route, navigation}){
-    const [favoriteJokes, setFavoriteJokes] = useState<CustomJoke[]>([]);
+
+    const favoriteJokes = useAppSelector((state) => state.customReducer.favoriteJokes);
+    const dispatch = useDispatch();
 
     useEffect(() => {
-        const fetchFav = async () => {
+
-            const jokes = await getFavorite();
+
-            if (jokes) {
+        const getFavoriteJokes = async () => {
-                setFavoriteJokes(jokes);
+            // @ts-ignore
-            } else {
+            await dispatch(getFavorite());
-                // Gérer le cas où aucun favori n'est retourné
-                setFavoriteJokes([]);
-            }
         }
-        fetchFav();
+        getFavoriteJokes();
     }, []);
-
+    let fav = true;
+    if (favoriteJokes.length === 0) {
+         fav = false;
+    }
+    else {
+         fav = true;
+    }
+    console.log(fav);
+    console.log(favoriteJokes.length);
     const styles = themeSettings();
-    console.log("Ceci est ma taille"+favoriteJokes.length);
 
     return (
         <SafeAreaView style={styles.container}>
+            { fav ? (
                 <FlatList
                     data = {favoriteJokes}
                     renderItem={({ item }) => (
@@ -34,8 +43,12 @@ export function ListFavoriteJokeScreen({route, navigation}) {
                             <JokeListItems item={item}/>
                         </TouchableHighlight>
                     )}
-                keyExtractor={(item:  CustomJoke) => item.id}
+                    keyExtractor={(item) => item.id.toString()}
                 />
+            ) : (
+                <Text style={styles.title}>Aucun favoris</Text>
+            )}
+
         </SafeAreaView>
     );
 }