Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 | import { useEffect, useState } from 'react'; const state = { whenOnline: 'online', whenOffline: 'offline', }; interface UseNavigatorOnlineArgs { onReconnect?(): void; onDisconnect?(): void; } // Credit to https://github.com/oieduardorabelo/use-navigator-online export function useNavigatorOnline({ onReconnect, onDisconnect }: UseNavigatorOnlineArgs = {}) { const [value, setValue] = useState(window.navigator.onLine); useEffect(() => { function handleOnlineStatus() { const newState = window.navigator.onLine; setValue(newState); Iif (newState) onReconnect?.(); Iif (!newState) onDisconnect?.(); } window.addEventListener('online', handleOnlineStatus); window.addEventListener('offline', handleOnlineStatus); return () => { window.removeEventListener('online', handleOnlineStatus); window.removeEventListener('offline', handleOnlineStatus); }; }, [onDisconnect, onReconnect]); const isOnline = value === true; const isOffline = value === false; const status = isOnline ? state.whenOnline : state.whenOffline; return { status, isOnline, isOffline }; } |