React Hook Load

It's a react hook that will help you to control your load states

Installation

npm install react-hook-load

Usage

import React from 'react';
import useLoad from 'react-hook-load';
import { useEffect } from 'react';

function App() {
  const { isLoading, startLoad, stopLoad } = useLoad();

  useEffect(() => {
    setTimeout(() => {
      stopLoad('page');
    }, 3000);
  });

  return (
    <div>
      <p>{isLoading('avatar') ? 'loading...' : 'Show avatar content'}</p>
      <div>
        <button onClick={() => startLoad('avatar')}>Start Load</button>
        <button onClick={() => stopLoad('avatar')}>Stop Load</button>
      </div>

      <section>
        {isLoading('page', true) ? 'loading...' : 'Show page content'}
      </section>
    </div>
  );
}

export default App;