'use client'

import { useState, useEffect, useCallback } from 'react'

export function useScroll() {
  const [isAtBottom, setIsAtBottom] = useState(false)

  const handleScroll = useCallback(() => {
    const footer = document.querySelector('footer')
    if (footer) {
      const footerTop = footer.getBoundingClientRect().top
      setIsAtBottom(footerTop < window.innerHeight)
    }
  }, [])

  useEffect(() => {
    window.addEventListener('scroll', handleScroll)
    handleScroll() // Initial check
    return () => window.removeEventListener('scroll', handleScroll)
  }, [handleScroll])

  const scrollToNext = () => {
    const sections = Array.from(
      document.querySelectorAll('section[id]')
    ) as HTMLElement[]
    const scrollPosition = window.scrollY + window.innerHeight / 2

    const currentSection = sections.reduce((acc, section) => {
      return section.offsetTop < scrollPosition ? section : acc
    }, sections[0])

    const currentIndex = sections.findIndex((sec) => sec.id === currentSection.id)
    const nextIndex = currentIndex + 1

    if (nextIndex < sections.length) {
      sections[nextIndex].scrollIntoView({ behavior: 'smooth' })
    }
  }

  const scrollToTop = () => {
    window.scrollTo({ top: 0, behavior: 'smooth' })
  }

  return { isAtBottom, scrollToNext, scrollToTop }
}