React: a React hook found on Internet to show the online&offline status of your app

useOnlineStatus.tsx

import { FC, useState, useEffect, useContext, createContext, ReactElement } from 'react'

const OnlineStateContext = createContext<boolean>(true)

export const OnlineStateProvider: FC = ({ children }): ReactElement => {
  const [onlineState, setOnlineState] = useState<boolean>(true)

  useEffect(() => {
    window.addEventListener('offline', () => {
      setOnlineState(false)
    })
    window.addEventListener('online', () => {
      setOnlineState(true)
    })

    return () => {
      window.removeEventListener('offline', () => {
        setOnlineState(false)
      })
      window.removeEventListener('online', () => {
        setOnlineState(true)
      })
    }
  }, [])

  return (
    <OnlineStateContext.Provider value={onlineState}>
      {children}
    </OnlineStateContext.Provider>
  )
}

export const useOnlineState = (): boolean => {
  return useContext(OnlineStateContext)
}