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;