import type { Ref } from 'vue'

export const useClearOnWindowScroll = <T>(target: Ref<T>, value: T) => {
  if (import.meta.server) return

  const clear = () => {
    target.value = value
  }

  onMounted(() => {
    window.addEventListener('scroll', clear, { passive: true })
    window.addEventListener('resize', clear, { passive: true })
  })

  onBeforeUnmount(() => {
    window.removeEventListener('scroll', clear)
    window.removeEventListener('resize', clear)
  })
}