Currently, I am utilizing ngrx/store with Angular 6. Within the store, there exists a deeply nested structure which I have concerns about in terms of its organization:
const state = [
{
aliases: ['alias1', 'alias2'],
isRequired: false,
isSensitive: false,
name: 'Adress',
timezoneId: 'UTC',
children: []
},
{
aliases: ['alias3', 'alias4'],
isRequired: true,
isSensitive: false,
name: 'Phone',
timezoneId: 'UTC-5',
children: [
{
aliases: ['alias1', 'alias2'],
isRequired: true,
isSensitive: false,
name: 'Sub-Phone',
timezoneId: 'UTC-5',
children: [
{
aliases: ['alias-phone1', 'alias-phone2'],
isRequired: false,
isSensitive: true,
name: 'Sub-Sub-Phone',
timezoneId: 'UTC',
children: []
}
]
}
]
}
]
The issue arises from the fact that the property name acts as an identifier and must be unique at the same level, but can repeat within the child elements. For instance, both Sub-Phone and Sub-Sub-Phone could be labeled as Phone. What approach should I take to effectively organize this type of structure in the store so that it remains flexible for future modifications? Currently, if I wish to modify name: 'Phone', it necessitates updating the entire object including all its descendants within the reducer function.
How can I normalize this data?