Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
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
117 changes: 117 additions & 0 deletions ui-kit/flutter/v6/ai-features.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,117 @@
---
title: "AI Features"
sidebarTitle: "Smart Chat"
description: "Enhance user interaction with AI-powered conversation starters, smart replies, and conversation summaries in your Flutter app"
---

CometChat's AI capabilities greatly enhance user interaction and engagement in your application. Let's understand how the Flutter V6 UI Kit achieves these features.

<Frame>
<img src="/images/5b57feb3-ai_overview-e181192385baa430f73f90e7a24690e8.png" />
</Frame>

***

## Usage

### Integration

In V6, AI features are handled internally through `MessageTemplateUtils` — no explicit extension registration is needed. Simply enable the AI features from your [CometChat Dashboard](/fundamentals/ai-user-copilot/overview) and they work automatically.

<Note>
**V6 Architecture Change:** In V5, AI features required explicit registration via `UIKitSettings.aiFeature` with classes like `AISmartRepliesExtension()`, `AIConversationStarterExtension()`, etc. In V6, this entire registration pattern has been removed. Enable AI features from the Dashboard and the UI Kit integrates them automatically.
</Note>

***

## Conversation Starters

When a user initiates a new chat, the UI Kit displays a list of suggested opening lines that users can select, making it easier for them to start a conversation. These suggestions are powered by CometChat's AI, which predicts contextually relevant conversation starters.

For a comprehensive understanding and guide on implementing and using the Conversation Starters, refer to our specific guide on the [Conversation Starter](/fundamentals/ai-user-copilot/conversation-starter).

Once you have successfully activated the [Conversation Starter](/fundamentals/ai-user-copilot/conversation-starter) from your CometChat Dashboard, the feature will automatically be incorporated into the [MessageList](/ui-kit/flutter/v6/message-list) Widget.

<Frame>
<img src="/images/66b628b9-conversation_starter-3e07b0394f72d62c55b12b25d1794add.png" />
</Frame>

## Smart Replies

Smart Replies are AI-generated responses to messages. They can predict what a user might want to say next by analyzing the context of the conversation. This allows for quicker and more convenient responses, especially on mobile devices.

For a comprehensive understanding and guide on implementing and using the Smart Replies, refer to our specific guide on the [Smart Replies](/fundamentals/ai-user-copilot/smart-replies).

Once you have successfully activated the [Smart Replies](/fundamentals/ai-user-copilot/smart-replies) from your CometChat Dashboard, the feature will automatically be incorporated into the Action sheet of [MessageComposer](/ui-kit/flutter/v6/message-composer) Widget.

<Frame>
<img src="/images/40a16cf4-smart_reply-2e4a1f4ec165b8c700852e0395379806.png" />
</Frame>

## Conversation Summary

The Conversation Summary feature provides concise summaries of long conversations, allowing users to catch up quickly on missed chats. This feature uses natural language processing to determine the main points in a conversation.

For a comprehensive understanding and guide on implementing and using the Conversation Summary, refer to our specific guide on the [Conversation Summary](/fundamentals/ai-user-copilot/conversation-summary).

Once you have successfully activated the [Conversation Summary](/fundamentals/ai-user-copilot/conversation-summary) from your CometChat Dashboard, the feature will automatically be incorporated into the Action sheet of [MessageComposer](/ui-kit/flutter/v6/message-composer) Widget.

<Frame>
<img src="/images/d9a79e08-conversation_summary-3263d5620276113b3301c76d9ea170d8.png" />
</Frame>

## AI Assist Bot

The AI Assist Bot provides intelligent, context-aware responses to user queries within the chat. It can answer questions, provide suggestions, and assist users based on the conversation context.

For a comprehensive understanding and guide on implementing and using the AI Assist Bot, refer to our specific guide on the [AI Assist Bot](/fundamentals/ai-user-copilot/ai-assist-bot).

Once you have successfully activated the AI Assist Bot from your CometChat Dashboard, the feature will automatically be incorporated into the Action sheet of [MessageComposer](/ui-kit/flutter/v6/message-composer) Widget.

## AI Assistant Chat History

Use the `CometChatAIAssistantChatHistory` widget to display past AI interactions:

<Tabs>
<Tab title="Dart">
```dart
CometChatAIAssistantChatHistory(
user: user,
style: CometChatAIAssistantChatHistoryStyle(
backgroundColor: const Color(0xFFFFFAF6),
),
)
```
</Tab>
</Tabs>

For more details, see the [AI Assistant Chat History](/ui-kit/flutter/ai-assistant-chat-history) guide.

## V6 Architecture Changes

| Aspect | V5 | V6 |
|---|---|---|
| Registration | `UIKitSettings.aiFeature = [AISmartRepliesExtension(), ...]` | Not needed — enable from Dashboard |
| Architecture | Extension decorator chain | `MessageTemplateUtils` static methods |
| Classes removed | — | `AISmartRepliesExtension`, `AIConversationStarterExtension`, `AIAssistBotExtension`, `AIConversationSummaryExtension`, `CometChatUIKitChatAIFeatures` |
| UI widgets | Preserved | Preserved |
| Custom AI flows | Via `CometChatUIKit.getDataSource()` | Via `MessageTemplateUtils` and direct template injection. See [Message Agentic Flow](/ui-kit/flutter/v6/guide-message-agentic-flow) |

---

## Next Steps

<CardGroup cols={2}>
<Card title="Message List" icon="list" href="/ui-kit/flutter/v6/message-list">
Display and manage conversation messages with AI-powered starters
</Card>
<Card title="Message Composer" icon="pen" href="/ui-kit/flutter/v6/message-composer">
Compose messages with smart replies and AI assistance
</Card>
<Card title="AI User Copilot" icon="robot" href="/fundamentals/ai-user-copilot/overview">
Learn more about AI features and configuration
</Card>
<Card title="Message Agentic Flow" icon="robot" href="/ui-kit/flutter/v6/guide-message-agentic-flow">
Implement custom AI-driven message flows
</Card>
</CardGroup>
4 changes: 2 additions & 2 deletions ui-kit/flutter/v6/call-features.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ Since V6 is hosted on Cloudsmith, install via CLI:
<Tabs>
<Tab title="Dart">
```bash
dart pub add cometchat_chat_uikit:6.0.0-beta1 --hosted-url https://dart.cloudsmith.io/cometchat/cometchat/
dart pub add cometchat_chat_uikit:6.0.0-beta2 --hosted-url https://dart.cloudsmith.io/cometchat/cometchat/
```
</Tab>
</Tabs>
Expand All @@ -28,7 +28,7 @@ Or add manually to `pubspec.yaml`:
dependencies:
cometchat_chat_uikit:
hosted: https://dart.cloudsmith.io/cometchat/cometchat/
version: 6.0.0-beta1
version: 6.0.0-beta2
```
</Tab>
</Tabs>
Expand Down
13 changes: 9 additions & 4 deletions ui-kit/flutter/v6/getting-started.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ To get started, create a new flutter application project.
Since V6 is hosted on Cloudsmith (not pub.dev), run this command instead of the standard `flutter pub add`:

```bash
dart pub add cometchat_chat_uikit:6.0.0-beta1 --hosted-url https://dart.cloudsmith.io/cometchat/cometchat/
dart pub add cometchat_chat_uikit:6.0.0-beta2 --hosted-url https://dart.cloudsmith.io/cometchat/cometchat/
```

**2. Update Pubspec**
Expand All @@ -56,7 +56,7 @@ Or add it manually to your `pubspec.yaml`:
dependencies:
cometchat_chat_uikit:
hosted: https://dart.cloudsmith.io/cometchat/cometchat/
version: 6.0.0-beta1
version: 6.0.0-beta2
```

Final `pubspec.yaml`
Expand All @@ -78,7 +78,7 @@ dependencies:

cometchat_chat_uikit:
hosted: https://dart.cloudsmith.io/cometchat/cometchat/
version: 6.0.0-beta1
version: 6.0.0-beta2

cupertino_icons: ^1.0.8

Expand Down Expand Up @@ -156,6 +156,8 @@ UIKitSettings uiKitSettings = (UIKitSettingsBuilder()
..region = CometChatConfig.region
..appId = CometChatConfig.appId
..authKey = CometChatConfig.authKey
..enableCalls = true
..callingConfiguration = CallingConfiguration()
).build();

CometChatUIKit.init(
Expand Down Expand Up @@ -218,6 +220,7 @@ class MyApp extends StatelessWidget {
return MaterialApp(
title: 'CometChat V6',
theme: ThemeData(useMaterial3: true),
navigatorKey: CallNavigationContext.navigatorKey,
home: const InitPage(),
);
}
Expand Down Expand Up @@ -246,7 +249,9 @@ class _InitPageState extends State<InitPage> {
..autoEstablishSocketConnection = true
..region = CometChatConfig.region
..appId = CometChatConfig.appId
..authKey = CometChatConfig.authKey)
..authKey = CometChatConfig.authKey
..enableCalls = true
..callingConfiguration = CallingConfiguration())
.build();

CometChatUIKit.init(
Expand Down
2 changes: 1 addition & 1 deletion ui-kit/flutter/v6/message-composer.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ class _MessageComposerScreenState extends State<MessageComposerScreen> {
@override
Widget build(BuildContext context) {
return Scaffold(
resizeToAvoidBottomInset: false, // REQUIREDcomposer handles keyboard internally
resizeToAvoidBottomInset: true, // Defaultensures keyboard pushes content up
body: Column(
children: [
Expanded(child: CometChatMessageList(user: user)),
Expand Down
4 changes: 2 additions & 2 deletions ui-kit/flutter/v6/upgrading-from-v5.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,7 @@ MessageTemplateUtils.getAllMessageTemplates();
**Install V6 via CLI (hosted on Cloudsmith):**

```bash
dart pub add cometchat_chat_uikit:6.0.0-beta1 --hosted-url https://dart.cloudsmith.io/cometchat/cometchat/
dart pub add cometchat_chat_uikit:6.0.0-beta2 --hosted-url https://dart.cloudsmith.io/cometchat/cometchat/
```

Or add manually to `pubspec.yaml`:
Expand All @@ -74,7 +74,7 @@ Or add manually to `pubspec.yaml`:
dependencies:
cometchat_chat_uikit:
hosted: https://dart.cloudsmith.io/cometchat/cometchat/
version: 6.0.0-beta1
version: 6.0.0-beta2
```

### 5. State Management Migration (Advanced)
Expand Down