react-power-up

Repository

Features

• useOnline
• New update coming soon...

Install

  npm install react-power-up

Quickstart

import { useOnline } from "react-power-up";

const Home = () => {
  //Check internet is available or not
  const isOnline = useOnline();

  return (
    <div>
      <h1>Home</h1>
      <h1>{isOnline ? "🟢" : "🔴"}</h1>
    </div>
  );
};
export default Home;

Hooks Details

• useOnline

import { useEffect, useState } from "react";

const useOnline = () => {
    const [isOnline, setIsOnline] = useState(true);

    useEffect(() => {
        //LOGIC FOR CHECK USER NETWORK IS ONLINE OR OFFLINE
        const handleOnline = () => {
            setIsOnline(true);
        };
        const handleOffLine = () => {
            setIsOnline(false);
        };
        //EVENT LISTENER
        window.addEventListener("online", handleOnline);
        window.addEventListener("offline", handleOffLine);

        return () => {
            //CLEAN-UP
            window.removeEventListener("online", handleOnline);
            window.removeEventListener("offline", handleOffLine);
        };
    }, []);
    //RETURN STATEMENT
    return Boolean(isOnline);
};
export default useOnline;

Contributors

• Always welcome for contributing...[Become a contributor]
• Open-source free to use and modify