useNetworkStateHelperUsage.js

import useNetworkStateHelper from './useNetworkStateHelper';

import ErrorComponent from './Error';
import LoadingComponent from './Loading';
import EmptyComponent from './Empty';

function MovieList({ isLoading, hasError, movies }) {
  const { isBusy, showIfBusy } = useNetworkStateHelper({
    loading: isLoading,
    error: hasError,
    isEmpty: movies.length === 0,
    LoadingComponent: LoadingComponent,
    ErrorComponent: ErrorComponent,
    EmptyComponent: EmptyComponent,
  });

  if (isBusy) return showIfBusy;

  return movies.map(movie => <div key={movie.id}>{movie.name}</div>);
}

export default MovieList;