@ngrx/store and @ngrx/component-store communication

Question

Is it ok for a ComponentStore to inject a global store to dispatch actions to the global store?

I have the following scenario:

• ParentComponent: Knows about the global store and handles complex logic.
  • ChildComponent "A": Uses ComponentStore to manage local state.
    • List of ChildComponents "A1": Uses ComponentStore as well and triggers actions that affect a datagrid.
  • ChildComponent "B": The datagrid. Used everywhere for different purposes. It doesn't have a ComponentStore, so ParentComponent is responsible for passing down any stream to the datagrid.

So, knowing that the child component "A1" will need to trigger an action on child component "B". What's the best approach?

1. "A1" injects the global store and dispatches an action. ParentComponent knows about the global store and passes the stream to child component "B".
2. "A1" returns an Output that would be listened to by "A" which would then "bubble up" the same output by returning it to ParentComponent. ParentComponent knows about the global store and passes the stream to child component "B".

I would appreciate your input on this very much! Thanks!

Answer 1

It kinda depends (sorry).

If the global store is already used in your application, than option 1 would work. Especially if other parts of the application need to handle that event. On the other hand, you're just creating an event stream, which is similar to option 2, which is a manual event stream.

I would like to propose a third option, a component store that acts as a wrapper and interacts with component store A, and component store B.