import { defineStore } from 'pinia'
import { useWindowScroll } from '@vueuse/core'

export const useScrollStore = defineStore('scrollStore', () => {
  const { y: windowY } = useWindowScroll({ behavior: 'smooth' })

  const stoveGnbHeight = 48 as number
  const isPassedStoveGnb = ref(false)
  const scrollGnbPosition = ref(stoveGnbHeight)

  const updateScrollValue = () => {
    if (stoveGnbHeight <= windowY.value) {
      isPassedStoveGnb.value = true
      scrollGnbPosition.value = 0
    } else {
      isPassedStoveGnb.value = false
      if (windowY.value === 0) {
        scrollGnbPosition.value = stoveGnbHeight
      } else {
        scrollGnbPosition.value = stoveGnbHeight - windowY.value
      }
    }
  }

  const controlScrollLock = (state: boolean) => {
    if (!import.meta.client) return
    
    if (state) {
      document.body.classList.add('scroll-lock')
    } else {
      document.body.classList.remove('scroll-lock')
    }
  }

  return {
    stoveGnbHeight,
    isPassedStoveGnb,
    scrollGnbPosition,

    updateScrollValue,
    controlScrollLock,
  }
})