fix problem when handle last card of the list

App.tsx

@@ -5,8 +5,9 @@ import useColorScheme from './hooks/useColorScheme';
 import Navigation from './navigation';
 import {View} from "react-native";
 import store from "./redux/store";
-import {Provider} from "react-redux";
+import {Provider, useDispatch} from "react-redux";
-
+import {useEffect, useState} from "react";
+import {getTrendingID} from "./redux/actions/actionGetTrendingID";
 
 export default function App() {
     const isLoadingComplete = useCachedResources();

navigation/index.tsx

@@ -21,8 +21,47 @@ import FavoriteScreen from '../screens/FavoriteScreen';
 import HomeScreen from '../screens/HomeScreen';
 import {RootStackParamList, RootTabParamList, RootTabScreenProps} from '../types';
 import LinkingConfiguration from './LinkingConfiguration';
+import {useCallback, useEffect, useState} from "react";
+import {useDispatch} from "react-redux";
+import {getTrendingID} from "../redux/actions/actionGetTrendingID";
+import * as SplashScreen from 'expo-splash-screen';
 
 export default function Navigation({colorScheme}: { colorScheme: ColorSchemeName }) {
+    const [appIsReady, setAppIsReady] = useState(false);
+    const dispatch = useDispatch();
+    useEffect(() => {
+        async function prepare() {
+            try {
+                const loadTrendingID = async () => {
+                    // @ts-ignore
+                    await dispatch(getTrendingID());
+                };
+                //console.log("test1:", trendingMovies);
+                loadTrendingID();
+            } catch (e) {
+                console.warn(e);
+            } finally {
+                // Tell the application to render
+                setAppIsReady(true);
+            }
+        }
+
+        prepare();
+    }, []);
+
+    const onLayoutRootView = useCallback(async () => {
+        if (appIsReady) {
+            // This tells the splash screen to hide immediately! If we call this after
+            // `setAppIsReady`, then we may see a blank screen while the app is
+            // loading its initial state and rendering its first pixels. So instead,
+            // we hide the splash screen once we know the root view has already
+            // performed layout.
+            await SplashScreen.hideAsync();
+        }
+    }, [appIsReady]);
+    if (!appIsReady) {
+        return null;
+    }
     return (
         <NavigationContainer
             linking={LinkingConfiguration}

screens/HomeScreen.tsx

@@ -31,7 +31,7 @@ export default function HomeScreen({navigation}: RootStackScreenProps<'Home'>) {
     const [minutes, setMinutes] = useState(0);
     const [seconds, setSeconds] = useState(0);
     const [displayIndex, setdisplayIndex] = useState(0);
-
+    var swiper = null;
 
     //console.log("liste [0]: ", trendingMovies[0]);
 
@@ -98,7 +98,6 @@ export default function HomeScreen({navigation}: RootStackScreenProps<'Home'>) {
     const dispatch = useDispatch();
 
     useEffect(() => {
-        // Créez une date avec la valeur actuelle
         const interval = setInterval(() => {
             const today = moment();
 
@@ -141,11 +140,19 @@ export default function HomeScreen({navigation}: RootStackScreenProps<'Home'>) {
     function addWatchLater(props: Movie) {
         dispatch(addMovieToWatchLater(props));
         dispatch(removeMovieTrending(props));
+        if (displayIndex == trendingMovies.length - 1) {
+            setdisplayIndex(0);
+            swiper.swipeLeft();
+        }
     }
 
 
     function popFirstTrending(props: Movie) {
         dispatch(removeMovieTrending(props));
+        if (displayIndex == trendingMovies.length - 1) {
+            setdisplayIndex(0);
+            swiper.swipeLeft();
+        }
     }
 
     function formatTime(time: number) {
@@ -172,9 +179,12 @@ export default function HomeScreen({navigation}: RootStackScreenProps<'Home'>) {
                              source={require("../assets/images/background.png")
                              }
             ></ImageBackground>
-            {trendingMovies[displayIndex] !== undefined && (
+
+            {trendingMovies.length !== 0 && (
+
                 <SafeAreaView style={styles.background1}>
 
+
                     <ImageBackground blurRadius={8}
                                      style={{
                                          width: "150%",
@@ -188,7 +198,7 @@ export default function HomeScreen({navigation}: RootStackScreenProps<'Home'>) {
 
                                      }}
                                      source={{
-                                         uri: trendingMovies[displayIndex].poster_path,
+                                         uri: trendingMovies[displayIndex]?.poster_path,
                                      }}
                     ></ImageBackground>
                     <View style={{flexDirection: 'column', alignSelf: 'center', paddingHorizontal: 30, width: '100%', alignItems: "center", paddingTop: 10, flex: 0.07}}>
@@ -204,36 +214,45 @@ export default function HomeScreen({navigation}: RootStackScreenProps<'Home'>) {
                     </View>
 
                     <CardsSwipe
+                        ref={(rf) => {
+                            swiper = rf
+                        }}
                         containerStyle={{zIndex: 20}}
                         cards={trendingMovies}
+                        loop={true}
                         onSwipedLeft={(index) => {
-                            if (index + 1 < trendingMovies.length)
+                            console.log(index)
-                                setdisplayIndex(index + 1)
+                            if (index < trendingMovies.length - 1) {
-                            else
+
+                                setdisplayIndex(index + 1);
+
+                            } else
                                 setdisplayIndex(0)
                         }
                         }
                         onSwipedRight={(index) => {
-                            if (index + 1 < trendingMovies.length)
+                            if (index < trendingMovies.length)
                                 setdisplayIndex(index + 1)
                             else
                                 setdisplayIndex(0)
                         }}
 
-                        renderCard={(card) => (
+                        renderCard={(card) =>
-                            <Image
+                            (
-                                style={styles.filmCard}
+                                <Image
-                                source={{
+                                    style={styles.filmCard}
-                                    uri: card.poster_path,
+                                    source={{
-                                }}
+                                        uri: card?.poster_path,
-                            />)}
+                                    }}
+                                />)
+                        }
                     />
 
 
                     <View style={{flexDirection: 'row', alignItems: 'flex-end', justifyContent: "space-evenly", paddingHorizontal: 30, width: '100%', position: "absolute", top: "74%", zIndex: 30}}>
                         <TouchableOpacity onPress={() => {
 
-                            addWatchLater(trendingMovies[0]);
+                            addWatchLater(trendingMovies[displayIndex]);
 
 
                         }}>
@@ -243,7 +262,7 @@ export default function HomeScreen({navigation}: RootStackScreenProps<'Home'>) {
                         </TouchableOpacity>
                         <TouchableOpacity onPress={
                             () => {
-                                popFirstTrending(trendingMovies[0]);
+                                popFirstTrending(trendingMovies[displayIndex]);
                             }}>
                             <Image
                                 source={require('../assets/images/delete_button.png')} style={{
@@ -272,7 +291,7 @@ export default function HomeScreen({navigation}: RootStackScreenProps<'Home'>) {
 
 
                 </SafeAreaView>)}
-            {trendingMovies[displayIndex] === undefined && (
+            {trendingMovies.length === 0 && (
                 <SafeAreaView style={styles.background2}>
                     <View style={{alignItems: "center", width: "100%", height: "100%", justifyContent: "center", zIndex: 1}}>
                         <Text style={{color: "white", fontWeight: "600", fontSize: 35}}>Félicitations !</Text>
@@ -301,6 +320,7 @@ export default function HomeScreen({navigation}: RootStackScreenProps<'Home'>) {
             )
 
             }
+
         </>
 
     )