From c001ca0ab2428dcf2b62cc899eee7525ec2ddd70 Mon Sep 17 00:00:00 2001
From: Nitesh Agarwal <musicniteshagarwal@gmail.com>
Date: Fri, 22 May 2026 15:45:01 +0530
Subject: [PATCH] fix: recalculate spotlight overlay position on scroll

---
 src/components/OnboardingTour.tsx | 34 +++++++++++++++++++++++--------
 1 file changed, 26 insertions(+), 8 deletions(-)

diff --git a/src/components/OnboardingTour.tsx b/src/components/OnboardingTour.tsx
index d5c163bc..e0028530 100644
--- a/src/components/OnboardingTour.tsx
+++ b/src/components/OnboardingTour.tsx
@@ -281,15 +281,33 @@ useEffect(() => {
   });
 }, [stepIndex, visible, measureTarget, dismiss]);
 
-  // Re-measure on resize
+  const updatePosition = useCallback(() => {
+    const el = document.getElementById(TOUR_STEPS[stepIndex]?.targetId ?? "");
+    if (el) {
+      const r = el.getBoundingClientRect();
+      setTargetRect({ top: r.top, left: r.left, width: r.width, height: r.height });
+    }
+  }, [stepIndex]);
+
+  // Re-measure on resize and scroll
   useEffect(() => {
-  if (!visible) return;
-  const onResize = () => {
-    measureTarget(TOUR_STEPS[stepIndex]?.targetId ?? "").then(setTargetRect);
-  };
-  window.addEventListener("resize", onResize);
-  return () => window.removeEventListener("resize", onResize);
-}, [visible, stepIndex, measureTarget]);
+    if (!visible) return;
+    
+    let frame: number;
+    const handleUpdate = () => {
+      cancelAnimationFrame(frame);
+      frame = requestAnimationFrame(updatePosition);
+    };
+
+    window.addEventListener("resize", handleUpdate);
+    window.addEventListener("scroll", handleUpdate, true); // true for capturing phase to catch all scrolls
+
+    return () => {
+      window.removeEventListener("resize", handleUpdate);
+      window.removeEventListener("scroll", handleUpdate, true);
+      cancelAnimationFrame(frame);
+    };
+  }, [visible, updatePosition]);
 
   // Keyboard support
   useEffect(() => {