Estoy tratando de crear la lógica de paginación con filtrado, pero cuando trato de cambiar el estado setTotalProducts en useEffect , arroja la advertencia de profundidad máxima de actualización excedida en cualquier caso, totalProducts está en la matriz de deps.

 const [totalProducts, setTotalProducts] = useState(products); // products is a previously fetched data const [filteredProducts, setFilteredProducts] = useState(totalProducts); const productsPerPage = 9; const indexOfLastProduct = currentPage * productsPerPage; const indexOfFirstProduct = indexOfLastProduct - productsPerPage; useEffect(() => { setFilteredProducts( totalProducts.slice(indexOfFirstProduct, indexOfLastProduct) ); // Sidebar filters if (Object.entries(filters).length > 0) { const arr = filterSidebar(products, filters); // returns an array of filtered data setTotalProducts(arr); // Setting this state causes the problem } }, [filters, currentPage, totalProducts]); // It won't work as expected in case of removing totalProducts