diff --git a/src/hooks/useAnimatedHighlightStyle/index.ts b/src/hooks/useAnimatedHighlightStyle/index.ts
index e474a9455d4d0..dd2df58fb1e27 100644
--- a/src/hooks/useAnimatedHighlightStyle/index.ts
+++ b/src/hooks/useAnimatedHighlightStyle/index.ts
@@ -66,7 +66,11 @@ export default function useAnimatedHighlightStyle({
             return;
         }
         setStartHighlight(true);
-    }, [shouldHighlight, startHighlight]);
+        // We only need to add shouldHighlight as a dependency and adding startHighlight as deps will cause a loop because
+        // if shouldHighlight stays at true the above early return will not be executed and this useEffect will be run
+        // as long as shouldHighlight is true as we set startHighlight to false in the below useEffect.
+        // eslint-disable-next-line react-compiler/react-compiler, react-hooks/exhaustive-deps
+    }, [shouldHighlight]);
 
     React.useEffect(() => {
         if (!startHighlight || !didScreenTransitionEnd) {