'use client'

import { useEffect, useRef } from 'react'

/**
 * Anime un compteur de 0 → target avec easing cubique,
 * déclenché par IntersectionObserver au premier scroll visible.
 */
export function useCountUp(target: number, duration = 1600) {
  const ref = useRef<HTMLSpanElement>(null)

  useEffect(() => {
    const el = ref.current
    if (!el) return

    const observer = new IntersectionObserver(
      ([entry]) => {
        if (!entry.isIntersecting) return
        observer.disconnect()

        const start = performance.now()
        function tick(now: number) {
          const t = Math.min((now - start) / duration, 1)
          const ease = 1 - Math.pow(1 - t, 3)
          el!.textContent = Math.floor(ease * target).toLocaleString('fr-FR')
          if (t < 1) requestAnimationFrame(tick)
          else el!.textContent = target.toLocaleString('fr-FR')
        }
        requestAnimationFrame(tick)
      },
      { threshold: 0.5 }
    )

    observer.observe(el)
    return () => observer.disconnect()
  }, [target, duration])

  return ref
}