title: React infinite-scroll with array from hook state
body: <p>I'm having troubles to set up <code>react-infinite-scroller</code> within my React component.</p>
  
  <p>I do not want to fetch data via an API directly in my component with <code>loadMore</code> because I already got it from my IndexedDB.</p>
  
  <p>So I want to use my Array <code>dbScans</code> (array with objects) and want to have infinite scroll with max. 3 items of the array. </p>
  
  <p>I tried to create a <code>loadProducts</code> function to slice and concate my array that I want to render but I am getting overload errors, when I try to call it in the Infinite-Scroll component.</p>
  
  <pre><code>import React, { useEffect, useState } from 'react';
  import InfiniteScroll from 'react-infinite-scroller';
  
  export default function ProductHistory() {
    const [dbScans, setDbScans] = useState&lt;IProductClient[]&gt;([]);
    const [loadedProducts, setLoadedProducts] = useState([]);
  
    useEffect(() =&gt; {
      (async function getDataFromDB() {
        setDbScans(await db.yourScans.toArray());
      })();
    }, []);
  
    let productHistory = dbScans;
  
    // This function is not working
    const loadProducts = (page: number) =&gt; {
      const perPage = 3;
      const moreItems: any = dbScans.slice(
        page * perPage - perPage,
        page * perPage + 1
      );
      // Am I doing this right?
      setLoadedProducts(loadedProducts.concat(moreItems));
    }
  
    return (
      &lt;&gt;
        &lt;div className="product-history"&gt;
            { productHistory.length &gt; 0 ?
  
              &lt;InfiniteScroll
                pageStart={0}
                loadMore={loadProducts(0)} // This is not working
                hasMore={true}
                loader={&lt;div className="loader" key={0}&gt;Loading ...&lt;/div&gt;}
              &gt;
  
                {productHistory.map((product: any) =&gt;
                  &lt;div className="product-history__item" key={product.id}&gt;
                    &lt;p&gt;{product.name}
                  &lt;/div&gt;
                )}
  
                &lt;/InfiniteScroll&gt;
              : ''
            }
        &lt;/div&gt;
      &lt;/&gt;
    )
  }
  </code></pre>