«Отслеживание» объекта в компоненте функции React

Question

Я пытаюсь создать компонент функции, который "следит" за значением карты из хранилища в моем "api".

По сути, хранилище избыточностей выглядит так:

{ 
  listeners: {
    testListener: true,
    testListener: false
  }
}

Я могу получить доступ к хранилищу, вызвав мой API, например: Messaging.getListeners() и статус определенного слушателя c с Messaging.getListeners().testListener

Я хотел бы отобразить значения слушателей на моем компоненте реагирования

<div>
  Test Listener Status: {Messaging.getListeners().testListener}
</div>

, но если значение testListener изменится, компонент не будет перерисован.

Я пытался поместить Messaging.getListener() в useEffect, но, похоже, это не работает:

useEffect(() => {
  console.log(Messaging.getListeners()) // doesn't actually get latest listeners
}, [Messaging.getListeners()])