import { onBeforeUnmount, onMounted } from 'vue-demi'

export function useVisibilityChange (func: () => void) {
  const fn = () => {
    if (document.visibilityState === 'visible') {
      func()
    }
  }
  onMounted(() => {
    window.addEventListener('visibilitychange', fn)
  })
  onBeforeUnmount(() => {
    window.removeEventListener('visibilitychange', fn)
  })

  return { fn }
}