# Manage chat group attributes (/en/realtime-media/im/build/build-groups-rooms-and-threads/chat-group/manage-group-attributes/web)

> For AI agents: see the complete documentation index at [llms.txt](/llms.txt).

Chat groups enable real-time messaging among multiple users.

    This page shows how to use the Chat SDK to manage the attributes of a chat group in your app.

    ## Understand the tech [#understand-the-tech-6]

    The Chat SDK provides the `GroupManager` and `Group` classes for chat group management, which allows you to implement the following features:

    * Modify the chat group name and description
    * Manage chat group announcements
    * Manage chat group shared files

    ## Prerequisites [#prerequisites-6]

    Before proceeding, ensure that you meet the following requirements:

    * You have initialized the Chat SDK. For details, [SDK quickstart](../../../get-started-sdk).
    * You understand the call frequency limits of the Chat APIs supported by different pricing plans as described in [Limitations](../../limitations).
    * You understand the number of chat groups and chat group members supported by different pricing plans as described in [Pricing Plan Details](../../../reference/pricing-plan-details).

    ## Implementation [#implementation-6]

    This section describes how to call the APIs provided by the Chat SDK to implement chat group features.

    ### Modify the chat group name and description [#modify-the-chat-group-name-and-description-2]

    The chat group owner and chat group admins can modify the name and description of the chat group.

    Refer to the following sample code to modify the chat group name and description:

    ```javascript
    // The chat group owner and chat group admins can call modifyGroup to modify the name and description of a chat group.
    // The name length can be up to 128 characters. The description length can be up to 512 characters.
    const options = {
      groupId: "groupId",
      groupName: "groupName",
      description: "A description of group",
    };
    chatClient.modifyGroup(options).then((res) => console.log(res));
    ```

    ### Update the chat group avatar [#update-the-chat-group-avatar-4]

    Since SDK v1.4.0, you can set, update, and retrieve the chat group avatar.

    You can set the group avatar when you create the group by passing the `avatar` parameter to `createGroupVNext`. For details, see [Create and destroy a chat group](./manage-chat-groups#create-and-destroy-a-chat-group).

    After the group is created, the chat group owner and admins can call `modifyGroup` to set or update the avatar:

    ```javascript
    const options = {
      groupId: "groupId",
      avatar: "group avatar url",
    };
    chatClient.modifyGroup(options).then((res) => console.log(res));
    ```

    Once the avatar is changed, all the other chat group members receive the group event with the `updateInfo` operation:

    ```javascript
    chatClient.addEventHandler("handlerId", {
      onGroupEvent: function (msg) {
        switch (msg.operation) {
          case "updateInfo":
            console.log(msg);
            break;
        }
      },
    });
    ```

    All chat group members can retrieve the group avatar from the group details returned by `getGroupInfo`:

    ```javascript
    chatClient.getGroupInfo({ groupId: "groupId" }).then((res) => {
      console.log(res);
    });
    ```

    ### Manage chat group announcements [#manage-chat-group-announcements-2]

    The chat group owner and chat group admins can set and update chat group announcements. Once the announcements are updated, all chat group members receive the `updateAnnouncement` callback. All chat group members can retrieve chat group announcements.

    Refer to the following sample code to manage chat group announcements:

    ```javascript
    // The chat group owner and chat group admins can call updateGroupAnnouncement to set or update the chat group announcements.
    // The announcement length can be up to 512 characters.
    const options = {
      groupId: "groupId",
      announcement: "A announcement of group",
    };
    chatClient.updateGroupAnnouncement(options).then((res) => console.log(res));

    // All chat group members can call fetchGroupAnnouncement to retrieve the chat group announcements.
    const options = {
      groupId: "groupId",
    };
    chatClient.fetchGroupAnnouncement(options).then((res) => console.log(res));
    ```

    ### Manage chat group shared files [#manage-chat-group-shared-files-2]

    All chat group members can upload or download group shared files. The chat group owner and chat group admins can delete all of the group shared files, whereas group members can only delete the shared files that they have personally uploaded.

    Refer to the following sample code to manage chat group shared files:

    ```javascript
    // All chat group members can call uploadGroupSharedFile to upload group shared files. The file size can be up to 10 MB.
    // Once shared files are uploaded, group members receive the uploadFile callback.
    const options = {
      groupId: "groupId",
      file: file, // Choose the file to upload and share.
      onFileUploadProgress: function (resp) {}, // The callback of the upload progress
      onFileUploadComplete: function (resp) {}, // The callback of the upload success
      onFileUploadError: function (e) {}, // The callback of the upload failure
      onFileUploadCanceled: function (e) {}, // The callback of the upload cancelation
    };
    chatClient.uploadGroupSharedFile(options);

    // All chat group members can call downloadGroupSharedFile to delete group shared files.
    const options = {
      groupId: "groupId",
      fileId: "fileId", // The ID of the file
      onFileDownloadComplete: function (resp) {}, // The callback of the upload success
      onFileDownloadError: function (e) {}, // The callback of the upload failure
    };
    chatClient.downloadGroupSharedFile(options);

    // All chat group members can call deleteGroupSharedFile to delete group shared files.
    const options = {
      groupId: "groupId",
      fileId: "fileId", // The ID of the file
    };
    chatClient.deleteGroupSharedFile(options).then((res) => console.log(res));

    // All chat group members can call getGroupSharedFilelist to retrieve the list of shared files in the chat group.
    const options = {
      groupId: "groupId",
    };
    chatClient.getGroupSharedFilelist(options).then((res) => console.log(res));
    ```

    ### Listen for chat group events [#listen-for-chat-group-events-6]

    For details, see [Chat Group Events](./manage-chat-groups#listen-for-chat-group-events).