gustavofabro

if (!entries[0].isIntersecting) {
    return;
}

// Função responsável por carregar mais itens

gustavofabro

function App() {
  const [isLoading, setIsLoading] = useState(false);

  // Restante do código

  useEffect(() => {
    const observer = new IntersectionObserver(
      (entries: IntersectionObserverEntry[]) => {
        if (!entries[0].isIntersecting || isLoading) {
          return;

gustavofabro

useEffect(() => {
  const observer = new IntersectionObserver(
    (entries: IntersectionObserverEntry[]) => {
      // Função responsável por carregar mais itens
    },
    {
      root: null,
      rootMargin: '0px',
      threshold: 0
    });

gustavofabro

function App() {
  const loadingElementRef = useRef<HTMLDivElement>(null);

  // Restante do código

  return (
    <main className="app">
      <div className="list">
        {data.map(item => (
          <div key={item.id} className="item">{`Item ${item.id + 1}`}</div>