fix cv animations

src/app/_components/Animated/useReveal.ts

@@ -3,7 +3,7 @@
 import { useGSAP } from "@gsap/react"
 import { ScrollTrigger } from "gsap/all"
 import type { RefObject } from "react"
-import { GSAP_DEBUG, useGsapContext } from "~/app/_providers/GsapProvicer"
+import { GSAP_DEBUG, nearestScroller, useGsapContext } from "~/app/_providers/GsapProvicer"
 
 export type UseRevealOptions = {
   position: gsap.Position
@@ -39,9 +39,12 @@ export function useReveal(
   const ctx = useGsapContext()
   useGSAP(() => {
     const el = ref.current
-    if (!el || !ctx) return
+    if (!el || !ctx) {
+      if (GSAP_DEBUG) console.log("[cv-debug][useReveal:skip]", { debugId, hasEl: !!el, hasCtx: !!ctx })
+      return
+    }
 
-    const scroller = ctx.getScroller()
+    const scroller = nearestScroller(el)
     const scrollerEl = scroller instanceof Element ? scroller : undefined
 
     const rect = el.getBoundingClientRect()
@@ -53,6 +56,28 @@ export function useReveal(
       bottom = r.top + r.height
     }
     const isInView = rect.bottom > top && rect.top < bottom
+    if (GSAP_DEBUG) {
+      const scrollerRect = scrollerEl?.getBoundingClientRect()
+      console.log("[cv-debug][useReveal:register]", {
+        debugId,
+        position,
+        scrollOnly,
+        once,
+        isInView,
+        rect: { top: rect.top, bottom: rect.bottom, height: rect.height },
+        viewport: { top, bottom },
+        scroller:
+          scroller === window
+            ? "window"
+            : {
+                slot: scrollerEl?.getAttribute("data-slot"),
+                className: scrollerEl?.className,
+                clientHeight: scrollerEl?.clientHeight,
+                scrollHeight: scrollerEl?.scrollHeight,
+                rect: scrollerRect ? { top: scrollerRect.top, bottom: scrollerRect.bottom, height: scrollerRect.height } : undefined,
+              },
+      })
+    }
 
     const reveal = makeReveal(el)
     // A reveal that animates height (pop-ups) shifts every trigger below it.
@@ -83,19 +108,26 @@ export function useReveal(
     if (isInView && !scrollOnly) {
       // The shared timeline only decides *when* the entrance starts; the reveal
       // plays independently so the ScrollTrigger can take it over afterwards.
+      if (GSAP_DEBUG) console.log("[cv-debug][useReveal:schedule]", { debugId, position })
       ctx.schedule(() => reveal.play(), position)
       // `once` elements keep their revealed state — no scroll trigger at all.
-      if (!once) ctx.onReady(addReplayTrigger)
+      if (!once) {
+        if (GSAP_DEBUG) console.log("[cv-debug][useReveal:onReady]", { debugId })
+        ctx.onReady(addReplayTrigger)
+      }
     } else if (isInView) {
       // scrollOnly + already on screen: no enter crossing will fire, so reveal
       // now. Keep a trigger for scroll-out unless this is a `once` element.
+      if (GSAP_DEBUG) console.log("[cv-debug][useReveal:play-now]", { debugId, position })
       reveal.play()
       if (!once) addReplayTrigger()
     } else if (once) {
       // Off-screen: reveal when first reached, then self-destruct so it never
       // reverses.
+      if (GSAP_DEBUG) console.log("[cv-debug][useReveal:scroll-once]", { debugId, position })
       ScrollTrigger.create({ ...baseTrigger, once: true, onEnter: () => reveal.play() })
     } else {
+      if (GSAP_DEBUG) console.log("[cv-debug][useReveal:scroll-trigger-only]", { debugId, position })
       addReplayTrigger()
     }
   }, { dependencies: [] })