Бесконечный вызов UseEffect UseSelector UseDispatch React.js

С помощью экшна getContractsFromAPI получаю список контрактов, которые находятся в API, после чего с помощью useState и renderContracts, отображаю на странице, но при этом начинается бесконечный вызов useEffect

const [contracts, setContracts] = useState({});

useEffect(() => {
    dispatch(getContractsFromAPI());
    setContracts(contractsList);
}, [contractsList, dispatch]);

return (
    <div>
        <h2>Contracts:</h2>
        <ul className={styles.contractsList}>{renderContracts(contracts)}</ul>
    </div>
);

Как можно решить проблему? Я попробовал убрать [contractsList, dispatch] из useEffect, но тогда первоначальный рендер при открытии страницы не происходит