21 lines
562 B
TypeScript
21 lines
562 B
TypeScript
|
import { useCallback, useEffect, useState } from 'react'
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Returns whether the window is currently visible to the user.
|
||
|
|
*/
|
||
|
|
export default function useIsWindowVisible(): boolean {
|
||
|
|
const [focused, setFocused] = useState<boolean>(true)
|
||
|
|
const listener = useCallback(() => {
|
||
|
|
setFocused(document.visibilityState !== 'hidden')
|
||
|
|
}, [setFocused])
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
document.addEventListener('visibilitychange', listener)
|
||
|
|
return () => {
|
||
|
|
document.removeEventListener('visibilitychange', listener)
|
||
|
|
}
|
||
|
|
}, [listener])
|
||
|
|
|
||
|
|
return focused
|
||
|
|
}
|