ngrx / store

RxJS powered state management for Angular applications, inspired by Redux
MIT License
3.9k stars 311 forks source link

Organizing selectors #381

Closed altschuler closed 7 years ago

altschuler commented 7 years ago

I've started using selectors to slice the store whenever I pull out something from it. For instance:

store.select(s => s.auth.current) becomes store.select(fromApp.getAuthCurrent)

Where fromApp is an import * as fromApp 'path/to/root/reducer/barrel. This is by example of the great example app.

Now, getAuthCurrent is actually a composition of getAuthState (from root selectors) and getCurrent (from auth selectors). That composition is done in the root reducer folder's index.ts barrel because otherwise I'd have to import the root selectors in my feature and I would import them in feature module's selectors.

What I'm struggling to understand is whether doing e.g.:

store.select(fromApp.getAuthState).select(fromAuth.getCurrent)

is something that makes sense? It seems to somewhat defiy the purpose of selectors.

So the main question is this: how do you organize selectors, on root/app level and feature level, how do you compose them and where do you compose them?

brandonroberts commented 7 years ago

The example app provides some guidance on selectors. You keep selectors for a reducer in the same place. You compose selectors in a feature area in the place. Then you compose them in your root reducer file to expose them as the "public api". Instead of chaining two select statements, you'd have a selector for auth state, and a selector for current that composes auth state and gets the current based on its selection.

Hope this helps.