Adding a child list item and updating the parent list

[osbash]

Discussed in #2553

^{Originally posted by osbash April 1, 2023}
I'm working on a component that contains an entity named "ChatGroup" that contains a child entity named "ChatMember".

class ChatGroup extends ApiResource {
    static readonly urlRoot = `/api/account/chats`
    readonly id: Data.ID = ''
    readonly name: string = ''
    readonly description: string = ''
    readonly uuid: string = ''
    readonly private: boolean = false
    readonly type: ChatGroupType = 'group'
    readonly members: ChatMember[] = []
    readonly graphic?: string
}

static schema = {
  members: [ChatMember]
}

class ChatMember extends ApiResource {
    static readonly urlRoot = `/api/account/chats/:groupId/members/:id`
    readonly id: Data.ID = ''
    readonly admin?: boolean
    readonly customerId: Data.ID = ''
    readonly inviteEnabled: boolean = false
    readonly messagesEnabled: boolean = false
    readonly groupId: Data.ID = ''
    readonly firstName: string = ''
    readonly lastName: string = ''
    readonly middleName: string = ''
    readonly fullName: string = ''
    readonly profilePhoto: string = ''
    readonly createdOn: Date = new Date()
}

I am able to list the ChatGroup entities perfectly fine and it includes the ChatMembers as it should. But, I am having difficulty adding members to the ChatGroup.members list.

I am only able to successfully add/delete ChatMember's from a group that existed on initial load. When I add a new ChatMember, I can see that the member is being added correctly using Redux tools in inspector but it is not being added as a child of the ChatGroup.

To list the groups I am using: const data = useSuspense(ChatGroup.list(), {})

I then iterate through the groups and list the members of each group. When you click on a group I have a separate view that lists all of the members and the options to add or remove a member.

When adding a member I am using: fetch(ChatMember.create(), { groupId: :id }, { customerId: :id}) , which response with the newly created chat member object.

After the ChatMember add, how can I ensure that it is being added to the correct ChatGroup cache item referencing the groupId that was used in the initial request or the groupId that was returned in the response?

[ntucker]

Thanks for engaging with this important use case! Let's handle this in the discussion. If we need to do any follow up work we'll have issues and/or PRs for those specifically.

[osbash]

Not a problem, I love the product and looking forward to upgrading to latest.

Is this use case covered in the latest version?

[ntucker]

One way to do this in the latest version is via https://resthooks.io/rest/api/Query#client-side-joins however, we understand that's not ideal for this specific case. We're currently working on a design called Collections to more intuitively handle this case. It'll show up in the discussions section once the design is ready for review

[ntucker]

Collections usage shows an example of pushing on a nested Collection