new tickets

src/components/FullscreenIntroVideo.web.js

@@ -1,6 +1,6 @@
 import { Portal } from "@gorhom/portal";
 import { Asset } from "expo-asset";
-import React, { useEffect, useRef, useState } from "react";
+import React, { useCallback, useEffect, useRef, useState } from "react";
 import { Pressable, Text, View } from "react-native";
 
 const overlayStyle = {
@@ -56,6 +56,13 @@ const FullscreenIntroVideo = ({ url, visible = true, onClose }) => {
   const videoRef = useRef(null);
   const [uri, setUri] = useState(null);
   const [muted, setMuted] = useState(false);
+  const hasClosedRef = useRef(false);
+
+  const handleClose = useCallback(() => {
+    if (hasClosedRef.current) return;
+    hasClosedRef.current = true;
+    onClose?.();
+  }, [onClose]);
 
   useEffect(() => {
     let isMounted = true;
@@ -97,13 +104,15 @@ const FullscreenIntroVideo = ({ url, visible = true, onClose }) => {
       return undefined;
     }
 
+    hasClosedRef.current = false;
+
     const video = videoRef.current;
 
     if (!video || !uri) {
       return undefined;
     }
 
-    const handleEnded = () => onClose?.();
+    const handleEnded = handleClose;
     video.addEventListener("ended", handleEnded);
 
     video.currentTime = 0;
@@ -125,7 +134,7 @@ const FullscreenIntroVideo = ({ url, visible = true, onClose }) => {
       video.pause();
       video.removeEventListener("ended", handleEnded);
     };
-  }, [muted, onClose, uri, visible]);
+  }, [handleClose, muted, uri, visible]);
 
   useEffect(() => {
     const video = videoRef.current;
@@ -161,7 +170,7 @@ const FullscreenIntroVideo = ({ url, visible = true, onClose }) => {
             controls={false}
           />
         ) : null}
-        <Pressable onPress={() => onClose?.()} style={closeButtonStyle}>
+        <Pressable onPress={handleClose} style={closeButtonStyle}>
           <Text style={closeTextStyle}>Passer la vidéo</Text>
         </Pressable>
       </View>