> ## Documentation Index
> Fetch the complete documentation index at: https://cometchat-22654f5b-docs-audit-content-webhooks.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Add Members To A Group

> Learn how to add members to a group, receive real-time member added events, and handle missed events using the CometChat React Native SDK.

<Accordion title="AI Integration Quick Reference">
  ```javascript theme={null}
  // Add members to a group
  const members = [
    new CometChat.GroupMember("UID", CometChat.GROUP_MEMBER_SCOPE.PARTICIPANT)
  ];
  await CometChat.addMembersToGroup("GUID", members, []);

  // Listen for member added events
  CometChat.addGroupListener("listener", new CometChat.GroupListener({
    onMemberAddedToGroup: (message, userAdded, userAddedBy, userAddedIn) => { }
  }));
  ```
</Accordion>

Add users to a group programmatically. Only admins and moderators can add members. The added users receive a notification and are immediately part of the group.

## Add Members to Group

Use `addMembersToGroup()` to add members to a [Group](/sdk/reference/entities#group).

| Parameter       | Description                                                                                  |
| --------------- | -------------------------------------------------------------------------------------------- |
| `GUID`          | The group to add members to                                                                  |
| `members`       | Array of [GroupMember](/sdk/reference/entities#groupmember) objects (UID and scope required) |
| `bannedMembers` | Array of UIDs to ban (can be empty)                                                          |

<Tabs>
  <Tab title="TypeScript">
    ```typescript theme={null}
    let GUID: string = "GUID";
    let UID: string = "UID";
    let membersList: CometChat.GroupMember[] = [
      new CometChat.GroupMember(UID, CometChat.GROUP_MEMBER_SCOPE.PARTICIPANT),
    ];

    CometChat.addMembersToGroup(GUID, membersList, []).then(
      (response: Object) => {
        console.log("response", response);
      },
      (error: CometChat.CometChatException) => {
        console.log("Something went wrong", error);
      }
    );
    ```
  </Tab>

  <Tab title="JavaScript">
    ```javascript theme={null}
    let GUID = "GUID";
    let UID = "UID";
    let membersList = [
      new CometChat.GroupMember(UID, CometChat.GROUP_MEMBER_SCOPE.PARTICIPANT),
    ];

    CometChat.addMembersToGroup(GUID, membersList, []).then(
      (response) => {
        console.log("response", response);
      },
      (error) => {
        console.log("Something went wrong", error);
      }
    );
    ```
  </Tab>
</Tabs>

The method returns a response object where each key is a UID and the value is either `"success"` or an error message describing why that user couldn't be added.

## Real-Time Group Member Added Events

<Note>
  When a group member is added by another member, this event is triggered. When a user joins a group on their own, the joined event is triggered.
</Note>

Implement `onMemberAddedToGroup()` in `GroupListener` to receive real-time notifications when members are added.

<Tabs>
  <Tab title="TypeScript">
    ```typescript theme={null}
    const listenerID: string = "UNIQUE_LISTENER_ID";

    CometChat.addGroupListener(
      listenerID,
      new CometChat.GroupListener({
        onMemberAddedToGroup: (
          message: CometChat.Action,
          userAdded: CometChat.User,
          userAddedBy: CometChat.User,
          userAddedIn: CometChat.Group
        ) => {
          console.log("User joined", {
            message,
            userAdded,
            userAddedBy,
            userAddedIn,
          });
        },
      })
    );
    ```
  </Tab>

  <Tab title="JavaScript">
    ```javascript theme={null}
    const listenerID = "UNIQUE_LISTENER_ID";

    CometChat.addGroupListener(
      listenerID,
      new CometChat.GroupListener({
        onMemberAddedToGroup: (message, userAdded, userAddedBy, userAddedIn) => {
          console.log("User joined", {
            message,
            userAdded,
            userAddedBy,
            userAddedIn,
          });
        },
      })
    );
    ```
  </Tab>
</Tabs>

<Warning>
  Always remove group listeners when they're no longer needed (e.g., on component unmount or page navigation). Failing to remove listeners can cause memory leaks and duplicate event handling.

  ```javascript theme={null}
  CometChat.removeGroupListener("UNIQUE_LISTENER_ID");
  ```
</Warning>

## Missed Member Added Events

When fetching previous messages, member additions appear as [Action](/sdk/reference/messages#action) messages (a subclass of `BaseMessage`).

| Field       | Value/Type                             | Description                       |
| ----------- | -------------------------------------- | --------------------------------- |
| `action`    | `"added"`                              | The action type                   |
| `actionOn`  | [User](/sdk/reference/entities#user)   | The user who was added            |
| `actionBy`  | [User](/sdk/reference/entities#user)   | The user who added the member     |
| `actionFor` | [Group](/sdk/reference/entities#group) | The group the member was added to |

***

## Next Steps

<CardGroup cols={2}>
  <Card title="Kick & Ban Members" icon="user-slash" href="/sdk/react-native/group-kick-ban-members">
    Remove or ban members from a group
  </Card>

  <Card title="Change Member Scope" icon="user-shield" href="/sdk/react-native/group-change-member-scope">
    Promote or demote group members
  </Card>

  <Card title="Retrieve Group Members" icon="users" href="/sdk/react-native/retrieve-group-members">
    Fetch the list of members in a group
  </Card>

  <Card title="Join a Group" icon="right-to-bracket" href="/sdk/react-native/join-group">
    Allow users to join public or password-protected groups
  </Card>
</CardGroup>
