Search code examples
angulararchitecturengrxngrx-storengrx-entity

Should I separate same entity collections for two components?


I'm facing following problem at work:

In SPA I am working at I have task entity and dashboard feature. Also I am aiming to use ngrx store & entity to handle state management in app. Dashboard feature is splitted into components called schedule and table.

Schedule shows already assigned tasks in some time span for certain resources. Table is paged and may contain tasks already showed on schedule. So, these two components could display joint subset of task collection.

In addition they will share common state (selection) and features (drag & drop from grid to schedule). What's more, we are talking about of thousands of tasks in total in DB, grid page could have up to 1000 tasks, schedule can have sometimes up to several hundreds tasks on it.

Hope, I've given some context to my questions which are: Should the tasks be stored in single collection (handled by ngrx-entity) to avoid redundancy? Or should be there separate collections for each component? If there should be one collection how to approach to the removal of unnecessary task from this collection to avoid loading all entities to state?


Solution

  • both ngrx and flux are for avoiding redundancy and if you need the same entity in 2 components - then you should get the same entity, not its copy from somewhere like a second collection.

    Because you need different sets of entities for different components you need to consider an implementation of sets / lists in your store. For example to have 2 additional variables in a state that store an array of ids for every component. Firstly you select ids and secondly you select entities. It will help you to keep the data consistent.

    Removal of unnecessary entities, that's what you need to implement on your own, for example you can have an action to delete a list of ids, then based on other lists you can detect which entities should be deleted from the entity collection.