Skip to content

Instantly share code, notes, and snippets.

@sandeshdamkondwar

sandeshdamkondwar/use-page-visibility.js

Forked from viclafouch/use-page-visibility.js
Created June 17, 2020 19:16
Show Gist options
  • Save sandeshdamkondwar/f42a4b3923e98b10c9782dbaf338dfbe to your computer and use it in GitHub Desktop.
Save sandeshdamkondwar/f42a4b3923e98b10c9782dbaf338dfbe to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. @viclafouch viclafouch renamed this gist Jun 16, 2020. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion use-visibility-page.js → use-page-visibility.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,4 +1,4 @@
    // hooks/use-visibility-page.js
    // hooks/use-page-visibility.js
    import { useState, useLayoutEffect } from 'react'

    function usePageVisibility() {
  2. @viclafouch viclafouch revised this gist Jun 16, 2020. No changes.
  3. @viclafouch viclafouch revised this gist Jun 16, 2020. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions use-visibility-page.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,3 +1,4 @@
    // hooks/use-visibility-page.js
    import { useState, useLayoutEffect } from 'react'

    function usePageVisibility() {
  4. @viclafouch viclafouch renamed this gist Jun 16, 2020. 1 changed file with 0 additions and 0 deletions.
    0 use-page-visibility.js → use-visibility-page.js
    View file
    File renamed without changes.
  5. @viclafouch viclafouch revised this gist Jun 16, 2020. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions use-page-visibility.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,6 +1,6 @@
    import { useState, useLayoutEffect } from 'react'

    function useVisibilityPage() {
    function usePageVisibility() {
    const [isPageVisible, setIsPageVisible] = useState(!document.hidden)

    useLayoutEffect(() => {
    @@ -16,4 +16,4 @@ function useVisibilityPage() {
    return { isPageVisible }
    }

    export default useVisibilityPage
    export default usePageVisibility
  6. @viclafouch viclafouch created this gist Jun 16, 2020.
    19 changes: 19 additions & 0 deletions use-page-visibility.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,19 @@
    import { useState, useLayoutEffect } from 'react'

    function useVisibilityPage() {
    const [isPageVisible, setIsPageVisible] = useState(!document.hidden)

    useLayoutEffect(() => {
    const handleVisibility = () => {
    setIsPageVisible(!document.hidden)
    }
    document.addEventListener('visibilitychange', handleVisibility)
    return () => {
    document.removeEventListener('visibilitychange', handleVisibility)
    }
    }, [])

    return { isPageVisible }
    }

    export default useVisibilityPage