Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
18 commits
Select commit Hold shift + click to select a range
65db985
docs(react-native): Update documentation with descriptions and quick …
Farhan-CometChat Feb 16, 2026
5e8beee
docs(react-native): Add descriptions, quick references, and guides to…
Farhan-CometChat Feb 17, 2026
1b7a2cc
docs(react-native): Add descriptions, quick references, and navigatio…
Farhan-CometChat Feb 17, 2026
59b8473
docs(react-native): Add messaging examples and quick references to SD…
Farhan-CometChat Feb 17, 2026
74512c1
docs(react-native): Add push notification HTML stripping guide and re…
Farhan-CometChat Feb 18, 2026
d9a9c19
docs(react-native): Add sample console output and expand message filt…
Farhan-CometChat Feb 19, 2026
9c06ffb
docs(react-native): Add sample console output and fix UI Kit links
Farhan-CometChat Feb 26, 2026
243523d
docs(react-native): Add response accordions with sample data to SDK docs
Farhan-CometChat Feb 27, 2026
6ae11a3
docs(react-native): Add response accordions with sample data to group…
Farhan-CometChat Mar 2, 2026
4ee59ed
docs(react-native): Replace console output with response tables acros…
Farhan-CometChat Mar 2, 2026
43e6284
docs(react-native): Add quick references and improve formatting acros…
Farhan-CometChat Mar 3, 2026
e1261a1
docs(react-native): Add descriptions, images, and navigation to UI Ki…
Farhan-CometChat Mar 6, 2026
de9bc91
docs(react-native): Simplify message template description in message …
Farhan-CometChat Mar 6, 2026
0a90e18
updates .gitignore and .mintignore
swapnil-cometchat Mar 12, 2026
c317757
Update .gitignore
swapnil-cometchat Mar 12, 2026
6ed8f99
compares with codebase and updates docs
swapnil-cometchat Mar 12, 2026
ba56edb
Merge branch 'main' into docs/react-native-uikit-v5
swapnil-cometchat Mar 12, 2026
ebbda61
updates UI kit style
swapnil-cometchat Mar 12, 2026
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -13,3 +13,4 @@ __pycache__/
/docs-templates
/docs-test-suite
/prompts
/docs-comparison-tool
13 changes: 10 additions & 3 deletions docs.json
Original file line number Diff line number Diff line change
Expand Up @@ -2932,7 +2932,14 @@
"pages": [
"sdk/react-native/resources-overview",
"sdk/react-native/real-time-listeners",
"sdk/react-native/push-notification-setup",
{
"group": "Push Notifications",
"pages": [
"notifications/react-native-push-notifications-android",
"notifications/react-native-push-notifications-ios"
]
},
"sdk/react-native/push-notification-html-stripping",
"sdk/react-native/upgrading-from-v3"
]
},
Expand Down Expand Up @@ -5904,8 +5911,8 @@
"destination": "/notifications/sms-notifications-extension-legacy"
},
{
"source": "/notifications/react-native-push-notifications",
"destination": "/notifications/react-native-push-notifications-android"
"source": "/notifications/react-native-push-notifications",
"destination": "/notifications/react-native-push-notifications-android"
},
{
"source": "/sdk/ionic/overview",
Expand Down
Binary file added images/overview_cometchat_screens.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/shortcut_formatter_cometchat_screens.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/xcode-embedd-extensions-debug.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/xcode-notificaion-service-screenshot.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/xcode-objectiveC.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3,316 changes: 3,206 additions & 110 deletions sdk/react-native/additional-message-filtering.mdx

Large diffs are not rendered by default.

12 changes: 11 additions & 1 deletion sdk/react-native/advanced-overview.mdx
Original file line number Diff line number Diff line change
@@ -1,8 +1,18 @@
---
title: "Advanced"
sidebarTitle: "Overview"
description: "Advanced CometChat React Native SDK topics including connection status monitoring and manual WebSocket management."
---

This section helps you to know about the Connection Listeners.

## Next Steps

This section helps you to know about the Connection Listeners.
<CardGroup cols={2}>
<Card title="Connection Status" icon="signal" href="/sdk/react-native/connection-status">
Monitor real-time WebSocket connection status
</Card>
<Card title="Managing WebSockets Manually" icon="plug" href="/sdk/react-native/managing-web-sockets-connections-manually">
Take control of WebSocket connections
</Card>
</CardGroup>
96 changes: 80 additions & 16 deletions sdk/react-native/ai-agents.mdx
Original file line number Diff line number Diff line change
@@ -1,17 +1,36 @@
---
title: "AI Agents"
description: "Learn how to integrate AI Agents in your React Native app using the CometChat SDK, including real-time event streaming and agentic message handling."
---

# AI Agents Overview
<Info>
**Quick Reference**
```javascript
// Listen for real-time AI Agent events
CometChat.addAIAssistantListener("listenerId", {
onAIAssistantEventReceived: (event) => {}
});

// Listen for persisted agentic messages
CometChat.addMessageListener("listenerId", {
onAIAssistantMessageReceived: (message) => {},
onAIToolResultReceived: (message) => {},
onAIToolArgumentsReceived: (message) => {}
});
```
</Info>

## Overview

AI Agents enable intelligent, automated interactions within your application. They can process user messages, trigger tools, and respond with contextually relevant information. For a broader introduction, see the [AI Agents section](/ai-agents).

> **Note:**
> Currently, an Agent only responds to **Text Messages**.
<Note>
Currently, an Agent only responds to **Text Messages**.
</Note>

## Agent Run Lifecycle and Message Flow

This section explains how a users text message to an Agent becomes a structured "run" which emits real-time events and then produces agentic messages for historical retrieval.
This section explains how a user's text message to an Agent becomes a structured "run" which emits real-time events and then produces agentic messages for historical retrieval.
- A user sends a text message to an Agent.
- The platform starts a run and streams real-time events via the **`AIAssistantListener`**.
- After the run completes, persisted Agentic Messages arrive via the **`MessageListener`**.
Expand All @@ -34,7 +53,7 @@ Events are received via the **`onAIAssistantEventReceived`** method of the **`AI
Notes:
- `Run Start` and `Run Finished` are always emitted.
- `Tool Call` events appear only when a backend or frontend tool is invoked. There can be multiple tool calls in a single run.
- `Text Message` events are always emitted and carry the assistants reply incrementally.
- `Text Message` events are always emitted and carry the assistant's reply incrementally.

<Tabs>
<Tab title="JavaScript">
Expand Down Expand Up @@ -69,16 +88,26 @@ Notes:
</Tab>
</Tabs>

#### Event descriptions
- Run Start: A new run has begun for the user’s message.
- Tool Call Start: The agent decided to invoke a tool.
- Tool Call Arguments: Arguments being passed to the tool.
- Tool Call End: Tool execution completed.
- Tool Call Result: Tool’s output is available.
- Text Message Start: The agent started composing a reply.
- Text Message Content: Streaming content chunks for progressive rendering.
- Text Message End: The agent reply is complete.
- Run Finished: The run is finalized; persisted messages will follow.
<Warning>
Always remove AI Assistant listeners when the component unmounts to prevent memory leaks.
```javascript
CometChat.removeAIAssistantListener("unique_listener_id");
```
</Warning>

#### Event Descriptions

| Event | Description |
|-------|-------------|
| Run Start | A new run has begun for the user's message |
| Tool Call Start | The agent decided to invoke a tool |
| Tool Call Arguments | Arguments being passed to the tool |
| Tool Call End | Tool execution completed |
| Tool Call Result | Tool's output is available |
| Text Message Start | The agent started composing a reply |
| Text Message Content | Streaming content chunks for progressive rendering |
| Text Message End | The agent reply is complete |
| Run Finished | The run is finalized; persisted messages will follow |

### Agentic Messages

Expand Down Expand Up @@ -131,4 +160,39 @@ These events are received via the **`MessageListener`** after the run completes.
CometChat.removeMessageListener(listnerId);
```
</Tab>
</Tabs>
</Tabs>

<Warning>
Always remove message listeners when the component unmounts to prevent memory leaks.
```javascript
CometChat.removeMessageListener("unique_listener_id");
```
</Warning>

<AccordionGroup>
<Accordion title="Best Practices">
- Register both `AIAssistantListener` (for real-time streaming) and `MessageListener` (for persisted messages) to get the complete agent interaction flow
- Use `Text Message Content` events for progressive rendering of the agent's reply as it streams in
- Handle `Tool Call` events to show tool execution status in your UI (e.g., loading indicators)
- Always remove both listeners on component unmount to avoid memory leaks
- Since agents only respond to text messages, validate the message type before sending to an agent
</Accordion>

<Accordion title="Troubleshooting">
- **No events received**: Ensure you registered the `AIAssistantListener` with a unique listener ID before sending a message to the agent.
- **Missing agentic messages**: Agentic messages arrive via `MessageListener` after the run completes. Make sure you have both listeners registered.
- **Duplicate events**: Verify you are not registering the same listener ID multiple times without removing the previous one.
- **Tool call events not appearing**: Tool call events only fire when the agent invokes a tool. Not all runs include tool calls.
</Accordion>
</AccordionGroup>

## Next Steps

<CardGroup cols={2}>
<Card title="AI Agents Overview" icon="robot" href="/ai-agents">
Explore the full AI Agents platform documentation
</Card>
<Card title="AI Moderation" icon="shield-check" href="/sdk/react-native/ai-moderation">
Automatically moderate messages using AI
</Card>
</CardGroup>
55 changes: 53 additions & 2 deletions sdk/react-native/ai-moderation.mdx
Original file line number Diff line number Diff line change
@@ -1,7 +1,26 @@
---
title: "AI Moderation"
description: "Learn how to use AI-powered message moderation in your React Native app using the CometChat SDK, including real-time moderation events and handling disapproved messages."
---

<Info>
**Quick Reference**
```javascript
// Send a message and check moderation status
CometChat.sendMessage(textMessage).then((message) => {
const status = message.getModerationStatus();
// CometChat.ModerationStatus.PENDING | APPROVED | DISAPPROVED
});

// Listen for moderation results
CometChat.addMessageListener("listenerId", new CometChat.MessageListener({
onMessageModerated: (message) => {
const status = message.getModerationStatus();
}
}));
```
</Info>

## Overview

AI Moderation in the CometChat SDK helps ensure that your chat application remains safe and compliant by automatically reviewing messages for inappropriate content. This feature leverages AI to moderate messages in real-time, reducing manual intervention and improving user experience.
Expand All @@ -16,7 +35,7 @@ Before using AI Moderation, ensure the following:

1. Moderation is enabled for your app in the [CometChat Dashboard](https://app.cometchat.com)
2. Moderation rules are configured under **Moderation > Rules**
3. You're using CometChat SDK version that supports moderation
3. You're using a CometChat SDK version that supports moderation

## How It Works

Expand Down Expand Up @@ -202,6 +221,13 @@ Register a message listener to receive moderation results in real-time:
</Tab>
</Tabs>

<Warning>
Always remove message listeners when the component unmounts to prevent memory leaks.
```javascript
CometChat.removeMessageListener("MODERATION_LISTENER");
```
</Warning>

### Step 3: Handle Disapproved Messages

When a message is disapproved, handle it appropriately in your UI:
Expand All @@ -223,5 +249,30 @@ function handleDisapprovedMessage(message) {
}
```

<AccordionGroup>
<Accordion title="Best Practices">
- Always check `getModerationStatus()` after sending a message to show appropriate UI indicators (e.g., a pending badge)
- Register the `onMessageModerated` listener early in your app lifecycle so you don't miss moderation results
- Provide clear feedback to users when their message is disapproved — avoid silently hiding content without explanation
- Custom and Action messages are not moderated — if you need moderation on custom message types, implement your own server-side checks
- Consider caching moderation status locally to avoid re-checking on message list re-renders
</Accordion>

<Accordion title="Troubleshooting">
- **Moderation status always PENDING**: Ensure moderation rules are configured in the CometChat Dashboard under **Moderation > Rules**.
- **`onMessageModerated` not firing**: Verify you registered a `MessageListener` with the correct listener ID and that moderation is enabled for your app.
- **Custom messages not being moderated**: This is expected — AI Moderation only applies to text, image, and video messages.
- **Disapproved messages still visible**: Make sure your `onMessageModerated` handler updates the UI when a message status changes to `DISAPPROVED`.
</Accordion>
</AccordionGroup>

## Next Steps
After implementing AI Moderation, consider adding a reporting feature to allow users to flag messages they find inappropriate. For more details, see the [Flag Message](/sdk/react-native/flag-message) documentation.

<CardGroup cols={2}>
<Card title="Flag Message" icon="flag" href="/sdk/react-native/flag-message">
Allow users to report inappropriate messages
</Card>
<Card title="AI Agents" icon="robot" href="/sdk/react-native/ai-agents">
Add intelligent AI agent interactions
</Card>
</CardGroup>
Loading