useEffect не вызывается, когда в массив зависимостей передан контекст

Всем привет, есть компонент App:

const App = () => {
    const [ cards, setCards ] = useState(new Map());
    const [ theme, setTheme ] = useState({
        cards
    });

    // Запрашивает данные в виде Map и обновляет состояние cards
    useEffect(() => {
        (async () => {
            const cardsMap = await getCards('http://...');
            setCards(cardsMap);
        })();
    }, []);

    // когда обновляется cards, обновляет состояние контекста
    useEffect(() => {
        setTheme(Object.assign(theme, cards));
    }, [cards]);

    // Вызывется 2 раза: выводит пустой Map, затем выводит Map с данными
    console.log(theme);

    return (
        <div className="app">
            <Header />
            <ThemeContext.Provider value={{ theme, setTheme }}>
                <Main />
            </ThemeContext.Provider>
        </div>
    );
};

И есть компонент CardsBlock внутри провайдера:

const CardsBlock = () => {
    const { theme, setTheme } = useContext(ThemeContext);
    const [ currentCard, setCurrentCard ] = useState([]);

    useEffect(() => {
        const cardArray = theme.cards.get('cardsArray'); // undefined
        setCurrentCards(cardArray);
    }, [ theme ]);

    // Вызывается 1 раз, выводит пустой Map
    console.log(theme);

    return (
        <div className="cards-one">
            {/* Код, который зависит от контекста */}
        </div>
    );
};

В App console.log(theme) вызывается несколько раз: до и после того как данные загрузятся. console.log(theme) в CardsBlock вызывается только один раз, будто useEffect не подписан на его изменение. Из-за этого я не могу обновить состояние currentCard