From fd83dde3d444bcd82a2b755152a37f2fd26debb2 Mon Sep 17 00:00:00 2001
From: Julien Froidefond <julien.froidefond@cdbdx.biz>
Date: Sun, 16 Nov 2025 07:52:46 +0100
Subject: [PATCH] feat: add zoom detection to useTouchNavigation hook to
 prevent touch handling during native zoom interactions

---
 .../reader/hooks/useTouchNavigation.ts        | 23 ++++++++++++++++---
 1 file changed, 20 insertions(+), 3 deletions(-)

diff --git a/src/components/reader/hooks/useTouchNavigation.ts b/src/components/reader/hooks/useTouchNavigation.ts
index 96fa574..ecc46ad 100644
--- a/src/components/reader/hooks/useTouchNavigation.ts
+++ b/src/components/reader/hooks/useTouchNavigation.ts
@@ -17,10 +17,24 @@ export function useTouchNavigation({
   const touchStartYRef = useRef<number | null>(null);
   const isPinchingRef = useRef(false);
 
+  // Helper pour vérifier si la page est zoomée (zoom natif du navigateur)
+  const isZoomed = useCallback(() => {
+    // Utiliser visualViewport.scale pour détecter le zoom natif
+    // Si scale > 1, la page est zoomée
+    if (window.visualViewport) {
+      return window.visualViewport.scale > 1;
+    }
+    // Fallback pour les navigateurs qui ne supportent pas visualViewport
+    // Comparer la taille de la fenêtre avec la taille réelle
+    return window.innerWidth !== window.screen.width;
+  }, []);
+
   // Touch handlers for swipe navigation
   const handleTouchStart = useCallback((e: TouchEvent) => {
     // Ne pas gérer si Photoswipe est ouvert
     if (pswpRef.current) return;
+    // Ne pas gérer si la page est zoomée (zoom natif)
+    if (isZoomed()) return;
     
     // Détecter si c'est un pinch (2+ doigts)
     if (e.touches.length > 1) {
@@ -37,7 +51,7 @@ export function useTouchNavigation({
       touchStartXRef.current = e.touches[0].clientX;
       touchStartYRef.current = e.touches[0].clientY;
     }
-  }, [pswpRef]);
+  }, [pswpRef, isZoomed]);
 
   const handleTouchMove = useCallback((e: TouchEvent) => {
     // Détecter le pinch pendant le mouvement
@@ -59,7 +73,10 @@ export function useTouchNavigation({
     
     // Vérifier qu'on a bien des coordonnées de départ
     if (touchStartXRef.current === null || touchStartYRef.current === null) return;
-    if (pswpRef.current) return; // Ne pas gérer si Photoswipe est ouvert
+    // Ne pas gérer si Photoswipe est ouvert
+    if (pswpRef.current) return;
+    // Ne pas gérer si la page est zoomée (zoom natif)
+    if (isZoomed()) return;
 
     const touchEndX = e.changedTouches[0].clientX;
     const touchEndY = e.changedTouches[0].clientY;
@@ -94,7 +111,7 @@ export function useTouchNavigation({
 
     touchStartXRef.current = null;
     touchStartYRef.current = null;
-  }, [onNextPage, onPreviousPage, isRTL, pswpRef]);
+  }, [onNextPage, onPreviousPage, isRTL, pswpRef, isZoomed]);
 
   // Setup touch event listeners
   useEffect(() => {