import {useEffect, useState} from "react"; function getNetworkConnection() { return ( navigator.connection || navigator.mozConnection || navigator.webkitConnection || null ); } function getNetworkConnectionInfo() { const connection = getNetworkConnection(); if (!connection) { return {}; } return { rtt: connection.rtt, type: connection.type, saveData: connection.saveData, downLink: connection.downLink, downLinkMax: connection.downLinkMax, effectiveType: connection.effectiveType, }; } function useNetwork() { const [state, setState] = useState(() => { return { online: navigator.onLine, }; }); useEffect(() => { const handleOnline = () => { setState((prevState) => ({ ...prevState, online: true, })); }; const handleOffline = () => { setState((prevState) => ({ ...prevState, online: false, })); }; window.addEventListener("online", handleOnline); window.addEventListener("offline", handleOffline); return () => { window.removeEventListener("online", handleOnline); window.removeEventListener("offline", handleOffline); }; }, []); return state; } export default useNetwork;