Docs/android UI kit v5

.gitignore

@@ -1,3 +1,10 @@
 .DS_Store
 
 .kiro/
+
+# IDE files
+.idea/
+
+# Python caches
+__pycache__/
+*.pyc

ui-kit/android/ai-assistant-chat-history.mdx

@@ -22,7 +22,7 @@ The following code snippet exemplifies how you can seamlessly integrate the Grou
 
 <Tabs>
 <Tab title="XML">
-```xml
+```xml lines
     <com.cometchat.chatuikit.aiassistantchathistory.CometChatAIAssistantChatHistory
         android:id="@+id/cometchat_ai_assistant_chat_history"
         android:layout_width="match_parent"
@@ -37,7 +37,7 @@ If you're defining the Group members within the XML code, you'll need to extract
 
 <Tabs>
 <Tab title="Java">
-```java
+```java lines
 
 User user = new User();
 user.setUid("userId");
@@ -50,7 +50,7 @@ binding.cometChatAiAssistantChatHistory.setUser(user);
 </Tab>
 
 <Tab title="Kotlin">
-```kotlin
+```kotlin lines
 
 val user = User()
 user.uid = "userId"
@@ -76,7 +76,7 @@ Function invoked when a chat history item is clicked, typically used to open an
 
 <Tabs>
 <Tab title="Java">
-```java YourActivity.java
+```java YourActivity.java lines
 
 binding.cometchatAiAssistantChatHistory.setOnItemClickListener((view, position, message) -> {
 
@@ -86,7 +86,7 @@ binding.cometchatAiAssistantChatHistory.setOnItemClickListener((view, position,
 </Tab>
 
 <Tab title="Kotlin">
-```kotlin YourActivity.kt
+```kotlin YourActivity.kt lines
 binding.cometchatAiAssistantChatHistory.setOnItemClickListener { view, position, message ->
 
         }
@@ -104,7 +104,7 @@ Function executed when a user item is long-pressed, allowing additional actions
 
 <Tabs>
 <Tab title="Java">
-```java YourActivity.java
+```java YourActivity.java lines
 binding.cometchatAiAssistantChatHistory.setOnItemLongClickListener((view, position, message) -> {
 
         });
@@ -113,7 +113,7 @@ binding.cometchatAiAssistantChatHistory.setOnItemLongClickListener((view, positi
 </Tab>
 
 <Tab title="Kotlin">
-```kotlin YourActivity.kt
+```kotlin YourActivity.kt lines
 binding.cometchatAiAssistantChatHistory.setOnItemLongClickListener { view, position, message ->
 
         }
@@ -131,7 +131,7 @@ Function triggered when the new chat button is clicked, typically used to start
 
 <Tabs>
 <Tab title="Java">
-```java YourActivity.java
+```java YourActivity.java lines
 binding.cometchatAiAssistantChatHistory.setOnNewChatClickListener(() -> {
 
         });
@@ -140,7 +140,7 @@ binding.cometchatAiAssistantChatHistory.setOnNewChatClickListener(() -> {
 </Tab>
 
 <Tab title="Kotlin">
-```kotlin YourActivity.kt
+```kotlin YourActivity.kt lines
 binding.cometchatAiAssistantChatHistory.setOnNewChatClickListener {
 
         }
@@ -158,7 +158,7 @@ Function activated when the close button is clicked, usually to exit the chat hi
 
 <Tabs>
 <Tab title="Java">
-```java YourActivity.java
+```java YourActivity.java lines
 binding.cometchatAiAssistantChatHistory.setOnCloseClickListener(() -> {
 
         });
@@ -167,7 +167,7 @@ binding.cometchatAiAssistantChatHistory.setOnCloseClickListener(() -> {
 </Tab>
 
 <Tab title="Kotlin">
-```kotlin YourActivity.kt
+```kotlin YourActivity.kt lines
 binding.cometchatAiAssistantChatHistory.setOnCloseClickListener {
 
         }
@@ -189,7 +189,7 @@ Using Style you can customize the look and feel of the component in your app, Th
   <img src="/images/android-ai-assistant-chat-history-style.png" />
 </Frame>
 
-```xml themes.xml
+```xml themes.xml lines
     <style name="CustomAIAssistantChatHistoryStyle">
         <item name="cometChatAIAssistantChatHistoryBackgroundColor">#FFFAF6</item>
         <item name="cometChatAIAssistantChatHistoryHeaderBackgroundColor">#FFFAF6</item>
@@ -213,14 +213,14 @@ Using Style you can customize the look and feel of the component in your app, Th
 
 <Tabs>
 <Tab title="Java">
-```java
+```java lines
 binding.cometchatAiAssistantChatHistory.setStyle(R.style.CustomAIAssistantChatHistoryStyle);
 ```
 
 </Tab>
 
 <Tab title="Kotlin">
-```kotlin
+```kotlin lines
 binding.cometchatAiAssistantChatHistory.setStyle(R.style.CustomAIAssistantChatHistoryStyle);
 ```
 

ui-kit/android/ai-features.mdx

@@ -1,20 +1,20 @@
 ---
-title: "AI"
+title: "Smart Chat Features"
 ---
 
 ## Overview
 
-CometChat's AI capabilities greatly enhance user interaction and engagement in your application. Let's understand how the Android UI Kit achieves these features.
+CometChat's AI capabilities greatly enhance user interaction and engagement in your application. Here's how the Android UI Kit integrates these features.
 
 <Frame>
   <img src="/images/dc468902-AI_Overview-0c7eccf3adcb1327d6a428bb2201419e.png" />
 </Frame>
 
-## Conversation Starters
+## Conversation Starter
 
-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.
+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 starter options.
 
-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).
+For a comprehensive understanding and guide on implementing and using the Conversation Starter, 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/android/message-list) Component of UI Kits.
 
@@ -40,7 +40,7 @@ The Conversation Summary feature provides concise summaries of long 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 [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/android/message-composer) Component of UI Kits.
+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/android/message-composer) Component of UI Kits.
 
 <Frame>
   <img src="/images/25921821-Conversation_Summary-5b64b3eb0655bc79903ca520d40a1e15.png" />

ui-kit/android/android-conversation.mdx

@@ -3,9 +3,9 @@ title: "Building A Conversation List + Message View"
 sidebarTitle: "Conversation List + Message View"
 ---
 
-The **Conversation List + Message View** layout offers a seamless **two-panel chat interface**, commonly used in modern messaging applications like **WhatsApp Web, Slack, and Microsoft Teams**.
+The **Conversation List + Message View** layout provides a **sequential navigation pattern** for Android messaging applications, similar to **WhatsApp, Slack, and Telegram**.
 
-This design enables users to switch between conversations effortlessly while keeping the chat window open, ensuring a **smooth, real-time messaging experience**.
+This design allows users to view their conversation list and tap on any conversation to open a full-screen message view, providing a **familiar mobile real-time messaging experience**.
 
 ***
 
@@ -17,21 +17,31 @@ This design enables users to switch between conversations effortlessly while kee
 
 ### **Key Components**
 
-1. **Chat Header** – Displays user/group name, profile image, and status.
-2. **Message List** – Shows chat history and new messages.
-3. **Message Composer** – Allows users to send messages, media, and reactions.
+1. **Message Header** – Displays user/group name, avatar, and status.
+2. **Message List** – Shows chat history with real-time message updates.
+3. **Message Composer** – Provides input field for sending text messages, media, and attachments.
 
 ***
 
 ## **Step-by-Step Guide**
 
+### **Navigation Flow**
+
+This implementation follows Android's standard Activity navigation pattern:
+
+1. **ConversationActivity** displays the list of conversations
+2. User taps a conversation item
+3. **MessageActivity** launches with the selected user/group data passed via Intent extras
+
+***
+
 ### **Step 1: Set Up Conversation Activity**
-Create an Activity - `ConversationActivity.kt`  to manage and display the chat UI.
+Create a new Activity called `ConversationActivity` to display the list of conversations.
 
 #### **Layout**
-Define the layout using the `CometChatConversations` component:
+Define the layout using the `CometChatConversations` component in `activity_conversations.xml`:
 
-```xml activity_conversations.xml
+```xml activity_conversations.xml lines
 <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     xmlns:tools="http://schemas.android.com/tools"
@@ -54,12 +64,12 @@ Define the layout using the `CometChatConversations` component:
 
 #### **Activity**
 
-Initialize and handle conversation clicks:
+Initialize the `CometChatConversations` component and handle conversation item clicks to navigate to the message screen:
 
 <Tabs>
 <Tab title="Kotlin">
 
-```kotlin ConversationActivity.kt
+```kotlin ConversationActivity.kt lines
 import android.content.Intent
 import android.os.Bundle
 
@@ -117,7 +127,7 @@ class ConversationActivity : AppCompatActivity() {
 
 <Tab title="Java">
 
-```java ConversationActivity.java
+```java ConversationActivity.java lines
 import android.content.Intent;
 import android.os.Bundle;
 
@@ -189,11 +199,13 @@ This is necessary to properly manage the **UI Kit's lifecycle events**.
 ***
 
 ### **Step 2: Set Up Message Activity**
-Create an Activity - `MessageActivity.kt`  to manage and display the chat UI.
+Create a new Activity - `MessageActivity` to display the chat interface.
 
 #### **Layout**
 
-```xml activity_message.xml
+Define the layout with `CometChatMessageHeader`, `CometChatMessageList`, and `CometChatMessageComposer` in `activity_message.xml`:
+
+```xml activity_message.xml lines
 <androidx.constraintlayout.widget.ConstraintLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
@@ -236,11 +248,11 @@ Create an Activity - `MessageActivity.kt`  to manage and display the chat UI.
 
 #### **Activity**
 
-Use the user/group passed from the conversation click:
+Retrieve the user/group ID from the Intent extras and configure the message components:
 
 <Tabs>
 <Tab title="Kotlin">
-```kotlin MessageActivity.kt
+```kotlin MessageActivity.kt lines
 import android.os.Bundle
 import android.util.Log
 import android.widget.Toast
@@ -344,7 +356,7 @@ class MessageActivity : AppCompatActivity() {
 </Tab>
 
 <Tab title="Java">
-```java MessageActivity.java
+```java MessageActivity.java lines
 import android.os.Bundle;
 import android.util.Log;
 import android.widget.Toast;
@@ -458,11 +470,11 @@ public class MessageActivity extends AppCompatActivity {
 
 ### **Step 3: Update MainActivity**
 
-Update the `MainActivity` to navigate to the `MessageActivity`:
+Update your `MainActivity` to launch `ConversationActivity` after successful login:
 
 <Tabs>
 <Tab title="Kotlin">
-```kotlin MainActivity.kt
+```kotlin MainActivity.kt highlight={15-17, 19, 48-49} lines
 import android.os.Bundle
 import android.util.Log
 import androidx.activity.ComponentActivity
@@ -481,6 +493,8 @@ class MainActivity : ComponentActivity() {
     private val region = "REGION" // Replace with your App Region
     private val authKey = "AUTH_KEY" // Replace with your Auth Key or leave blank if you are authenticating using Auth Token
 
+    private val uid = "cometchat-uid-1" // Replace with the UID of the user you want to log in
+
     private val uiKitSettings = UIKitSettings.UIKitSettingsBuilder()
         .setRegion(region)
         .setAppId(appID)
@@ -505,7 +519,7 @@ class MainActivity : ComponentActivity() {
     }
 
     private fun loginUser() {
-        CometChatUIKit.login("cometchat-uid-1", object : CometChat.CallbackListener<User>() {
+        CometChatUIKit.login(uid, object : CometChat.CallbackListener<User>() {
             override fun onSuccess(user: User) {
 
                 // Launch Conversation List + Message View (Split-Screen Style)
@@ -524,7 +538,7 @@ class MainActivity : ComponentActivity() {
 </Tab>
 
 <Tab title="Java">
-```java MainActivity.java
+```java MainActivity.java highlight={15-17, 51-52} lines
 import android.content.Intent;
 import android.os.Bundle;
 import android.util.Log;
@@ -595,15 +609,21 @@ public class MainActivity extends ComponentActivity {
 
 ***
 
-## **Running the Project**
+## **Running the Application**
 
-Once the components are configured, build and run the app:
+Once you've completed the setup, build and run your Android application:
 
-```sh
-gradle build
-```
 
-Ensure you've added the necessary permissions and initialized CometChat in your `Application` class.
+<Note>
+**Required Permissions**
+
+Ensure you've added the necessary permissions in your `AndroidManifest.xml`:
+
+```xml lines
+<uses-permission android:name="android.permission.INTERNET" />
+<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
+```
+</Note>
 
 ***