Suppose I have the following TypeScript interface:
interface Member {
readonly id: number;
readonly name: string;
readonly email: string;
groups: <ReadonlyArray>Group
}
interface Group {
readonly id: number;
readonly name: string;
readonly active: boolean;
}
Here is an example of how the data might look:
member {
id: 1,
name: 'John Doe',
email: '<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="f49e819a9fb49e819a9fda979b99">[email protected]</a>'
groups: [
{ id: 1, name: 'Group 1', active: true}
{ id: 2, name: 'Group 2', active: false}
{ id: 3, name: 'Group 3', active: false}
]
}
If I want to store this data in akita/state and allow for mutability (such as updating the status of a group), how do I create a mutable copy of the object before inserting it into akita/state?
After considering the comments below, I realized I need to modify my code for inserting into the akita store:
loadMemberById(memberId: number) {
const request$ = this.membersDataService.getById(memberId).pipe(
tap(response => this.membersStore.upsert(response.id, response)),
tap(response => this.membersStore.upsert(response.id, { groups: {
...response.groups } })),
tap(response => this.membersStore.setHasCache(true))
);
return cacheable(this.membersStore, request$);
}
My Visual Studio is flagging state.member.groups in the arrayUpdate function.
update(groupId: number, value: boolean): Observable<void> {
const observer = this.groupsDataService.update(groupId, value);
observer.subscribe(() => {
this.sessionStore.update(state => {
return {
member: {
...state.member,
groups: arrayUpdate(state.member.groups, data => data.groupId ===
groupId, {
active: value
})
}
};
});
});
Thank you, jonpfl