import { useEffect, useState } from 'react'

import { addBodyClass, removeBodyClass } from '../../utils'
import { noScrollClass } from './consts'

export const useBodyScrollLock = () => {
  const [isScrollLocked, setIsScrollLocked] = useState(false)

  const toggleIsScrollLocked = () => setIsScrollLocked(!isScrollLocked)

  useEffect(() => {
    if (isScrollLocked) addBodyClass(noScrollClass)
    else removeBodyClass(noScrollClass)

    return () => removeBodyClass(noScrollClass)
  }, [isScrollLocked])

  return { isScrollLocked, setIsScrollLocked, toggleIsScrollLocked }
}
