fix

src/screens/Playbacks.js

@@ -1,3 +1,4 @@
+import { useIsFocused } from "@react-navigation/native";
 import { useAudioPlayer } from "expo-audio";
 import { BlurView } from "expo-blur";
 import { VideoView, useVideoPlayer } from "expo-video";
@@ -12,7 +13,12 @@ import { Image, Platform, Pressable, Text, View } from "react-native";
 import Carousel from "react-native-reanimated-carousel";
 import { responsiveHeight } from "react-native-responsive-dimensions";
 import { icons, img } from "../assets";
-import { arrayRemove, arrayUnion, projectsRef, usersRef } from "../config/firebase";
+import {
+  arrayRemove,
+  arrayUnion,
+  projectsRef,
+  usersRef,
+} from "../config/firebase";
 import useDataFromRef from "../hooks/useDataFromRef";
 import { Routes } from "../navigation";
 import { navigate } from "../navigation/NavigationService";
@@ -37,7 +43,6 @@ const PlaybackItem = ({ item, isActive, userCache, getUserByUid }) => {
   );
   const [likesCount, setLikesCount] = useState(initialLikedBy.length);
 
-  // Fetch owner profile (cached)
   const [owner, setOwner] = useState(
     item?.userId && userCache?.current?.get(item.userId)
       ? userCache.current.get(item.userId)
@@ -81,7 +86,7 @@ const PlaybackItem = ({ item, isActive, userCache, getUserByUid }) => {
           } catch (e) {}
         }
       },
-      () => {},
+      () => {}
     );
     return () => unsub?.();
   }, [item?.userId, userCache]);
@@ -358,19 +363,20 @@ const Playbacks = () => {
   const [activeIndex, setActiveIndex] = useState(0);
   const userCache = useRef(new Map());
   const { getUserByUid } = useUser() || {};
+  const isFocused = useIsFocused();
   const { data: playbacks = [], loadMore } = useDataFromRef({
     ref: projectsRef.where("playbackUrl", "!=", null),
     simpleRef: false,
     listener: false,
     usePagination: true,
-    batchSize: 2,
+    batchSize: 6,
   });
 
   const onSnap = useCallback(
     (index) => {
       setActiveIndex(index);
-      // Pré-charge la suite 2 par 2
+      // Pré-charge la suite 6 par 6
-      if (index >= (playbacks?.length || 0) - 2) {
+      if (index >= (playbacks?.length || 0) - 6) {
         loadMore?.();
       }
     },
@@ -392,7 +398,7 @@ const Playbacks = () => {
             item={item}
             userCache={userCache}
             getUserByUid={getUserByUid}
-            isActive={index === activeIndex}
+            isActive={isFocused && index === activeIndex}
           />
         )}
       />