Proyectos de Subversion LeadersLinked - SPA

import React, { useRef, useEffect } from 'react';

import { useNearScreen } from '@hooks';

import { List, Spinner } from '.';

export function InfinityList({
  items = [],
  renderItem = () => {},
  emptyMessage = 'No hay elementos para mostrar',
  keyExtractor = (item) => item.id,
  loading = false,
  hasMore = false,
  onEnd
}) {
  const loaderRef = useRef(null);

  const [isIntercepting] = useNearScreen({
    externalRef: loaderRef,
    once: false,
    rootMargin: '20px'
  });

  useEffect(() => {
    if (isIntercepting) onEnd();
  }, [isIntercepting]);

  return (
    <>
      <List
        items={items}
        emptyMessage={emptyMessage}
        keyExtractor={keyExtractor}
        renderItem={renderItem}
      />

      {hasMore && <div ref={loaderRef}>{loading && <Spinner />}</div>}
    </>
  );
}