Skip to main content

Documentation Index

Fetch the complete documentation index at: https://cometchat-22654f5b-react-uikit-v7.mintlify.app/llms.txt

Use this file to discover all available pages before exploring further.

CometChatNotificationFeed displays a scrollable notification feed where each item is rendered as a native card using the CometChat Cards library. It handles fetching, pagination, category filtering, real-time updates, and read/delivered/engagement reporting automatically. Present it in a UINavigationController, push it onto an existing navigation stack, or embed it in a tab bar. Each notification gets its own section header with the category label on the left and a relative timestamp on the right:
ConditionDisplay
Today (< 24 hours ago)Time only — 2:35 PM
Yesterday (24–48 hours ago)Yesterday
This week (2–7 days ago)Day name — Monday, Tuesday, etc.
Older (> 7 days)Full date — 25/05/2026
let notificationFeed = CometChatNotificationFeed()
notificationFeed.set(onItemClick: { feedItem in
    // Handle item tap (e.g., open detail or deep link)
})

let navController = UINavigationController(rootViewController: notificationFeed)
self.present(navController, animated: true)

Quick Start

let notificationFeed = CometChatNotificationFeed()
let navController = UINavigationController(rootViewController: notificationFeed)
self.present(navController, animated: true)
Prerequisites: CometChat SDK initialized with CometChatUIKit.init() and a user logged in.

Filtering Feed Items

Control what loads using custom request builders:
let notificationFeed = CometChatNotificationFeed()
notificationFeed.set(notificationFeedRequestBuilder:
    NotificationFeedRequest.NotificationFeedRequestBuilder()
        .set(limit: 30)
        .set(readState: .unread)
        .set(category: "promotions")
)

Filter Options

Builder MethodDescription
.set(limit: Int)Items per page (default 20).
.set(readState: FeedReadState).read, .unread, or omit for all.
.set(category: String)Filter by category name.
.set(categoryId: String)Filter by category ID.
.set(channelId: String)Filter by channel.
.set(tags: [String])Filter by tags.
.set(dateFrom: String)ISO 8601 date lower bound.
.set(dateTo: String)ISO 8601 date upper bound.
Pass the builder object, not the result of .build(). The component calls .build() internally.

Actions and Events

onItemClick

Fires when a feed item card is tapped.
notificationFeed.set(onItemClick: { feedItem in
    // feedItem.id, feedItem.content (Card JSON), feedItem.category
    print("Item tapped: \(feedItem.id)")
})

onActionClick

Fires when an interactive element (button, link) inside a card is tapped.
notificationFeed.set(onActionClick: { feedItem, actionEvent in
    // Report engagement on every action
    CometChat.reportFeedEngagement(feedItem, interactionString: "button_clicked", onSuccess: {}, onError: { _ in })

    // Handle the action
    switch actionEvent.action {
    case .openUrl(let url, _):
        if let link = URL(string: url) {
            UIApplication.shared.open(link)
        }
    case .chatWithUser(let uid):
        // Navigate to 1-on-1 chat
        break
    case .chatWithGroup(let guid):
        // Navigate to group chat
        break
    case .customCallback(let callbackId, let payload):
        // Custom app logic
        break
    default:
        break
    }
})

onError

Fires when an internal error occurs (network failure, SDK exception).
notificationFeed.set(onError: { error in
    print("Feed error: \(error.errorDescription)")
})

Automatic Behaviors

The component handles these automatically — no manual setup needed:
BehaviorDescription
Real-time updatesNew items appear at the top via WebSocket listener.
Delivery reportingItems are reported as delivered when fetched.
Read reportingItems are reported as read after 1 second of visibility.
Unread count pollingPolls unread count every 30 seconds to update badges.
Infinite scrollFetches next page when scrolling near the bottom.
Pull-to-refreshResets and fetches fresh data on pull.
Timestamp groupingGroups items as “Today”, “Yesterday”, day name, or date.
Category filteringFilter chips row for category-based filtering.
Connection recoveryAutomatically refreshes when the app returns from background.

Functionality

MethodDescription
set(title: String)Header title text. Default “Notifications”.
set(showBackButton: Bool)Toggle back button visibility. Default true.
set(showFilterChips: Bool)Toggle category filter chips. Default true.
set(cardThemeMode: String)Card rendering theme: “auto”, “light”, or “dark”.
set(notificationFeedRequestBuilder:)Custom feed request builder.
set(notificationCategoriesRequestBuilder:)Custom categories request builder.
let notificationFeed = CometChatNotificationFeed()
notificationFeed.set(title: "Activity")
notificationFeed.set(showBackButton: false)
notificationFeed.set(showFilterChips: true)
notificationFeed.set(cardThemeMode: "dark")

Common Patterns

Show only unread items

notificationFeed.set(notificationFeedRequestBuilder:
    NotificationFeedRequest.NotificationFeedRequestBuilder()
        .set(readState: .unread)
)

Hide filter chips

notificationFeed.set(showFilterChips: false)

Custom categories request

notificationFeed.set(notificationCategoriesRequestBuilder:
    NotificationCategoriesRequest.NotificationCategoriesRequestBuilder()
        .set(limit: 10)
)

Embed in a Tab Bar

let notificationFeed = CometChatNotificationFeed()
notificationFeed.set(showBackButton: false)
notificationFeed.tabBarItem = UITabBarItem(
    title: "Notifications",
    image: UIImage(systemName: "bell"),
    selectedImage: UIImage(systemName: "bell.fill")
)

// Add to tab bar controller
let navController = UINavigationController(rootViewController: notificationFeed)
tabBarController.viewControllers?.append(navController)

Handle action + report engagement

notificationFeed.set(onActionClick: { feedItem, actionEvent in
    // Always report engagement
    CometChat.reportFeedEngagement(feedItem, interactionString: actionEvent.elementId, onSuccess: {}, onError: { _ in })

    switch actionEvent.action {
    case .openUrl(let url, _):
        if let link = URL(string: url) {
            UIApplication.shared.open(link)
        }
    case .chatWithUser(let uid):
        // Open CometChat messages with user
        break
    default:
        break
    }
})

Next Steps

TopicDescription
Campaigns FeatureOverview of how campaigns work end-to-end.
SDK Campaigns APILow-level SDK APIs for feed items, categories, and engagement.