My groups page

The my groups page displays all group channels the current user has joined. When the user opens this page, Chat UI automatically retrieves group information from the database.

Chat UI provides NCMyGroupsViewController, a group page class based on UITableView.

The my groups page typically consists of three components:

• Navigation bar
• Search bar
• Group list

Initialize

Create the list page by calling the initialization method of NCMyGroupsViewController. Note: You need to create an NCMyGroupsViewModel object to serve as the business logic handler for NCMyGroupsViewController.

Parameters

Parameter	Type	Description
viewModel	NCMyGroupsViewModel	The business logic handler for NCMyGroupsViewController. Manages UI configuration and group information retrieval.

Example code

Objective C

NCMyGroupsViewModel *viewModel = [[NCMyGroupsViewModel alloc] init];
NCMyGroupsViewController *vc = [[NCMyGroupsViewController alloc] initWithViewModel:viewModel];
[self.navigationController pushViewController:vc animated:YES];

Customization

You can customize the appearance of the my groups interface in Chat UI.

Customize the title bar

NCMyGroupsViewController uses the system navigation bar to display the group title. To customize the title, subclass NCMyGroupsViewController and set the title property in viewDidLoad.

Objective C

- (void)viewDidLoad {
    [super viewDidLoad];
    self.title = @"New title";
}

Customize the search bar

By default, the search bar in NCMyGroupsViewController navigates to the group search page. To implement custom search behavior, set the delegate property of NCMyGroupsViewModel and implement the search delegate methods.

Example code

Objective C

NCMyGroupsViewModel *viewModel = [[NCMyGroupsViewModel alloc] init];
viewModel.delegate = self;
NCMyGroupsViewController *vc = [[NCMyGroupsViewController alloc] initWithViewModel:viewModel];
[self.navigationController pushViewController:vc animated:YES];

...

/// Configure custom search functionality
- (NCSearchBarViewModel *_Nullable)willConfigureSearchBarViewModelForMyGroupsViewModel:(NCMyGroupsViewModel *)viewModel {
    // Return custom search ViewModel
}

Customize group page cells

1. Create a custom NCCustomCell

Objective C

@interface NCCustomCell : UITableViewCell
@property (nonatomic, strong) UILabel *titleLabel;
@end

@implementation
// Cell rendering
@end

2. Create a custom NCCustomCellViewModel

tip

Custom cell view models must inherit from NCGroupInfoCellViewModel.

Objective C

@interface NCCustomCellViewModel : NCGroupInfoCellViewModel
@property (nonatomic, strong) NCGroupInfo *groupInfo;

/// Initialize
///   - keyword: Highlight keyword
- (instancetype)initWithGroupInfo:(NCGroupInfo *)groupInfo
                          keyword:(NSString *)keyword;

@end

@implementation NCCustomCellViewModel

- (instancetype)initWithGroupInfo:(NCGroupInfo *)groupInfo
                          keyword:(NSString *)keyword
{
    self = [super init];
    if (self) {
        self.groupInfo = groupInfo;
        self.keyword = keyword;
    }
    return self;
}

// Register and customize cell
- (UITableViewCell *)tableView:(UITableView *)tableView
         cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    NSString *cellIdentifier = @"NCCustomCellIdentifier";
    // Register cell
    [tableView registerClass:NCCustomCell.class forCellReuseIdentifier:cellIdentifier];
    // Return cell
    NCCustomCell *cell = [tableView dequeueReusableCellWithIdentifier:cellIdentifier
                                                         forIndexPath:indexPath];
    // Modify UI
    cell.titleLabel.text = self.groupInfo.groupName;
...
    return cell;
}
@end

3. Modify the data source

Implement the data source callback delegate method:

Objective C

// Data source
- (NSArray *_Nullable)myGroupsViewModel:(NCMyGroupsViewModel *)viewModel
              willLoadItemsInDataSource:(NSArray *_Nullable)dataSource{
     // Process data source (add/remove/modify)
}

4. Customize cell tap events

Objective C

/// Configure custom tap handling. Returns: Whether the app handles the event [YES: SDK won't process, NO: SDK handles internally]
- (BOOL)myGroupsViewModel:(NCMyGroupsViewModel *)viewModel
           viewController:(UIViewController*)viewController
                tableView:(UITableView *)tableView
             didSelectRow:(NSIndexPath *)indexPath
            cellViewModel:(NCBaseCellViewModel *)cellViewModel {

              }