Digamos que temos uma estrutura assim:

<NewItem/>
<List>
  <Item/>
  <Item/>
</List>

O <NewItem/>, possui diversos componentes filhos e netos que precisam atualizar o seu estado. Poderíamos ficar passando vários callbacks de cima pra baixo, mas resolvemos ter uma store para o <NewItem/> e os componentes de dentro chamam as actions que atualizam essa store.

Quando queremos editar um <Item/>, o comportamento é muito parecido com o de criação, então reutilizamos o <NewItem/>.

O problema é: Como reutilizamos o <NewItem/> e ele possui uma store, quando 2 elementos dele são exibidos na tela, qualquer mudança em um afeta o outro. Exemplo: Estou editando um item e o que mudo nele aparece no componente de criação.

Qual seria a melhor solução nesse caso? Não utilizar actions/stores e passar um monte de callback pra todo lado ou implementar uma lógica para múltiplas actions/stores para um mesmo componente que também pode deixar o código complexo? (nós optamos pela 2a opção mas não estamos gostando)

Alguns componentes filhos do <NewItem/> possuem store e isso dificultou um pouco a implementação dessa lógica de múltiplas actions/stores para o <NewItem/>. Será que estamos criando muitos componentes com actions/stores e deveríamos criar mais "dumb components"?