How to normalize and model state in NGXS for nested arrays?

Question

I just hit a wall with attempting to update state on a deeply nested array object and from researching it I need to normalize my state.

The data structure I am working with is as follows:

   sportTypes: SportType[
  sportTypeObj{
     leagues: League[
        leagueObj{
              teams: Team[
                 teamObj{} <== this array needs updating
                ]
           }
      ]
   }
]

so basically SportType object has an array property of type League[], and each league object has an array property of type Teams[]. I need to update teams array on a specific league. I am not too sure how to structure my SportTypeStateModel to reflect this data structure.

This is what I had before:

`export interface SportTypeStateModel {
  sports: SportType[];
  loading: boolean;
  error?: any | null;
}`

But there with this, there is no easy way of updating Teams array.

Answer 1

An alternative could be to have 3 (or 4) entity storages. But it doesn't become easy as expected.

• SportTypeStateModel : with inside { sportTypeIds: string[] }

• SportType : with inside { leagueIds: string[] }

• League : with inside { team: Team[] }