Group Details

Display and manage group information in your iOS app

Provide a detailed view for CometChat groups in your iOS app, enabling users to see group info, join/leave, manage members, and respond to real-time group events.

Overview

GroupDetailsViewController displays comprehensive group information and actions:

• Group Info — Name, icon, description, and member count
• Actions — Join, leave, or delete group
• Member Management — View members, add members, view banned members
• Real-Time Updates — Reflects joins, leaves, bans, and ownership changes

Prerequisites

Before implementing group details, ensure you have:

• Completed Getting Started setup
• CometChat UIKit v5+ installed via CocoaPods or Swift Package Manager
• Valid CometChat App ID, Region, and Auth Key
• User logged in with CometChatUIKit.login()
• Navigation controller (UINavigationController) configured

Components

Component	Description
CometChatGroup	Renders group avatar, name, and metadata
GroupActionView	Custom view for action buttons (view/add/banned members)
CometChatMessagesViewController	Opens group chat interface when “Chat” is tapped
CometChat.joinGroup()	Joins public or password-protected groups
CometChat.leaveGroup()	Leaves the current group
CometChat.deleteGroup()	Deletes and exits the group (owners only)
CometChatGroupMembers	Lists current group members
CometChatGroupDelegate	Receives real-time group events

Integration Steps

Step 1: Present the Group Details Screen

Push GroupDetailsViewController for a selected group:

import UIKit
import CometChatSDK

class GroupListViewController: UIViewController {
    
    func showGroupDetails(for group: Group) {
        // Initialize the group details view controller
        let detailsVC = GroupDetailsViewController()
        detailsVC.group = group
        
        // Push onto navigation stack
        navigationController?.pushViewController(detailsVC, animated: true)
    }
}

This initializes and presents the details UI with the correct group context.

File reference: HomeScreenViewController.swift

Step 2: Set Up the UI

Configure scroll view, header, and action views:

import UIKit
import CometChatUIKitSwift
import CometChatSDK

class GroupDetailsViewController: UIViewController {
    
    var group: Group?
    
    override public func viewDidLoad() {
        super.viewDidLoad()
        
        // Connect to group event listeners
        connect()
        
        // Apply theme
        view.backgroundColor = CometChatTheme.backgroundColor01
        
        // Set up UI components
        setupScrollView()
        setupLayout()
        addButtonActions()
    }
    
    private func setupScrollView() {
        // Configure scroll view for content
    }
    
    private func setupLayout() {
        // Arrange header, info, and action views
    }
}

This lays out the UI components and registers for group events.

File reference: GroupDetailsViewController.swift

Step 3: Enable Group Action Buttons

Wire up view/add/banned members actions:

// Action views for member management
private let viewMembersView = GroupActionView()
private let addMembersView = GroupActionView()
private let bannedMembersView = GroupActionView()

public func addButtonActions() {
    // View current group members
    viewMembersView.onActionButtonTapped = { [weak self] in
        self?.viewMembers()
    }
    
    // Add new members to the group
    addMembersView.onActionButtonTapped = { [weak self] in
        self?.addMembers()
    }
    
    // View banned members
    bannedMembersView.onActionButtonTapped = { [weak self] in
        self?.banMembers()
    }
}

private func viewMembers() {
    guard let group = group else { return }
    let membersVC = CometChatGroupMembers()
    membersVC.set(group: group)
    navigationController?.pushViewController(membersVC, animated: true)
}

private func addMembers() {
    // Present add members interface
}

private func banMembers() {
    // Present banned members list
}

This enables user interaction for member management.

File reference: GroupDetailsViewController.swift

Step 4: Handle Leave and Delete Actions

Provide ownership-aware leave/delete flows:

@objc func showLeaveGroupAlert() {
    guard let group = group else { return }
    
    let alert = UIAlertController(
        title: "Leave Group",
        message: "Are you sure you want to leave this group?",
        preferredStyle: .alert
    )
    
    alert.addAction(UIAlertAction(title: "Cancel", style: .cancel))
    alert.addAction(UIAlertAction(title: "Leave", style: .destructive) { [weak self] _ in
        self?.leaveGroup()
    })
    
    present(alert, animated: true)
}

@objc func showDeleteGroupAlert() {
    guard let group = group else { return }
    
    let alert = UIAlertController(
        title: "Delete Group",
        message: "Are you sure you want to delete this group? This action cannot be undone.",
        preferredStyle: .alert
    )
    
    alert.addAction(UIAlertAction(title: "Cancel", style: .cancel))
    alert.addAction(UIAlertAction(title: "Delete", style: .destructive) { [weak self] _ in
        self?.deleteGroup()
    })
    
    present(alert, animated: true)
}

private func leaveGroup() {
    guard let guid = group?.guid else { return }
    
    CometChat.leaveGroup(GUID: guid) { [weak self] _ in
        DispatchQueue.main.async {
            self?.navigationController?.popToRootViewController(animated: true)
        }
    } onError: { error in
        print("Leave group error: \(error?.errorDescription ?? "")")
    }
}

private func deleteGroup() {
    guard let guid = group?.guid else { return }
    
    CometChat.deleteGroup(GUID: guid) { [weak self] _ in
        DispatchQueue.main.async {
            self?.navigationController?.popToRootViewController(animated: true)
        }
    } onError: { error in
        print("Delete group error: \(error?.errorDescription ?? "")")
    }
}

This manages group exit, with transfer prompt for owners.

File reference: GroupDetailsViewController.swift

Step 5: Listen for Group Events

Update UI on member joins, leaves, bans, and ownership changes:

private let listenerId = "group-details-listener"

func connect() {
    // Add SDK group listener
    CometChat.addGroupListener(listenerId, self)
    
    // Add UIKit group events listener
    CometChatGroupEvents.addListener(listenerId, self)
}

func disconnect() {
    CometChat.removeGroupListener(listenerId)
    CometChatGroupEvents.removeListener(listenerId)
}

deinit {
    disconnect()
}

// MARK: - CometChatGroupDelegate
extension GroupDetailsViewController: CometChatGroupDelegate {
    
    func onGroupMemberJoined(action: ActionMessage, joinedUser: User, joinedGroup: Group) {
        updateGroupInfo(joinedGroup)
    }
    
    func onGroupMemberLeft(action: ActionMessage, leftUser: User, leftGroup: Group) {
        // Hide UI if current user left
        if leftUser.uid == CometChat.getLoggedInUser()?.uid {
            navigationController?.popViewController(animated: true)
        } else {
            updateGroupInfo(leftGroup)
        }
    }
    
    func onGroupMemberKicked(action: ActionMessage, kickedUser: User, kickedBy: User, kickedFrom: Group) {
        updateGroupInfo(kickedFrom)
    }
    
    func onGroupMemberBanned(action: ActionMessage, bannedUser: User, bannedBy: User, bannedFrom: Group) {
        updateGroupInfo(bannedFrom)
    }
    
    func onGroupMemberUnbanned(action: ActionMessage, unbannedUser: User, unbannedBy: User, unbannedFrom: Group) {
        updateGroupInfo(unbannedFrom)
    }
    
    func onGroupMemberScopeChanged(action: ActionMessage, scopeChangeduser: User, scopeChangedBy: User, scopeChangedTo: String, scopeChangedFrom: String, group: Group) {
        updateGroupInfo(group)
    }
    
    func onMemberAddedToGroup(action: ActionMessage, addedBy: User, addedUser: User, addedTo: Group) {
        updateGroupInfo(addedTo)
    }
}

// MARK: - CometChatGroupEventListener
extension GroupDetailsViewController: CometChatGroupEventListener {
    
    func ccOwnershipChanged(group: Group, newOwner: GroupMember) {
        updateGroupInfo(group)
    }
}

private func updateGroupInfo(_ group: Group) {
    self.group = group
    // Refresh UI with updated group data
}

This keeps the group details in sync with back-end events.

File reference: GroupDetailsViewController.swift

Customization Options

Header Styling

Use CometChatTheme to customize fonts, colors, and borders:

// Apply custom theme
CometChatTheme.palette.primary = UIColor.systemBlue
CometChatTheme.typography.heading = UIFont.systemFont(ofSize: 20, weight: .bold)

Button Labels

Localize or rebrand action texts:

viewMembersView.setTitle("View Members", for: .normal)
addMembersView.setTitle("Add Members", for: .normal)
bannedMembersView.setTitle("Banned Members", for: .normal)

Avatar Placeholder

Provide fallback initials or default images:

avatarView.set(name: group.name)
avatarView.set(image: UIImage(named: "default_group_avatar"))

Edge Cases

Scenario	Handling
Private/Protected groups	Prompt for a password before joining
Already a member	Hide or disable Join button
Empty group	Show an empty state when no members
Owner restrictions	Disable Delete for non-owners

Error Handling

Error Type	Solution
Join failures	Show alert on network or permission errors
Leave/Delete errors	Display retry prompt on API failure
Event errors	Log and notify user if group events fail

Feature Matrix

Feature	Component / Method	File(s)
Show group details	GroupDetailsViewController	GroupDetailsViewController.swift
View group members	viewMembersView action	GroupDetailsViewController.swift
Add members	addMembersView action	GroupDetailsViewController.swift
Ban members	bannedMembersView action	GroupDetailsViewController.swift
Join group	CometChat.joinGroup()	GroupDetailsViewController.swift
Leave group	showLeaveGroupAlert()	GroupDetailsViewController.swift
Delete group	showDeleteGroupAlert()	GroupDetailsViewController.swift
Real-time updates	CometChatGroupDelegate	GroupDetailsViewController.swift

Related Components

• Groups - Display group list
• Group Members - Display group member list
• Events - Listen for chat events

Sample App

Explore the complete Group Details flow

UIKit Source

Browse the Group Details implementation

Related Guides

Groups

Display and manage group list

Group Members

View and manage group membership

Events

Handle group and membership events