> ## Documentation Index
> Fetch the complete documentation index at: https://cometchat-22654f5b-docs-uikit-customization-architecture.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Extensions

> Overview of CometChat extensions for React UI Kit, including engagement, collaboration, security, support, and smart chat features.

<Accordion title="AI Integration Quick Reference">
  | Field                | Value                                                                                                                                                                                                                                |
  | -------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
  | Package              | `@cometchat/chat-uikit-react`                                                                                                                                                                                                        |
  | Required setup       | `CometChatUIKit.init(UIKitSettings)` then `CometChatUIKit.login("UID")` + Extensions enabled in [CometChat Dashboard](/fundamentals/extensions-overview)                                                                             |
  | Extension categories | User Experience, User Engagement, Collaboration, Security, Customer Support, Smart Chat Features                                                                                                                                     |
  | Key components       | `CometChatMessageComposer` → [Message Composer](/ui-kit/react/message-composer) (Stickers, Polls, Whiteboard, Document), `CometChatMessageList` → [Message List](/ui-kit/react/message-list) (Translation, Link Preview, Thumbnails) |
  | Activation           | Enable each extension from the CometChat Dashboard — UI Kit auto-integrates them, no additional code required                                                                                                                        |
</Accordion>

## Overview

CometChat UI Kit includes built-in support for extensions that add interactive, secure, and efficient features to chat. Extensions are activated from the [CometChat Dashboard](/fundamentals/extensions-overview) and auto-integrate into UI Kit components on init and login.

<Note>
  Ensure `CometChatUIKit.init(UIKitSettings)` has completed and the user is logged in via `CometChatUIKit.login("UID")`. Extensions must be activated from the [CometChat Dashboard](/fundamentals/extensions-overview).
</Note>

## Built-in Extensions

The grouping below mirrors the CometChat Dashboard.

### User Experience

#### Bitly

Shortens long URLs in text messages using Bitly. See [Bitly Extension](/fundamentals/bitly).

#### Link Preview

Displays a summary (title, description, thumbnail) for URLs shared in chat. See [Link Preview Extension](/fundamentals/link-preview).

Auto-integrates into the Message Bubble of [MessageList](/ui-kit/react/message-list) when activated.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-uikit-customization-architecture/gc6smRtLfR-dbpSa/images/0219d225-extension_link_preview_web_screens-3c9e0774d6a45316df0ee48ee2338c2d.png?fit=max&auto=format&n=gc6smRtLfR-dbpSa&q=85&s=e85c3304e9472d1991e6eeaea73c9119" width="1282" height="802" data-path="images/0219d225-extension_link_preview_web_screens-3c9e0774d6a45316df0ee48ee2338c2d.png" />
</Frame>

#### Message Shortcuts

Sends predefined messages using short codes (e.g., `!hb` expands to `Happy birthday!`). See [Message Shortcuts Extension](/fundamentals/message-shortcuts).

#### Pin Message

Pins important messages in a conversation for easy access. See [Pin Message Extension](/fundamentals/pin-message).

#### Rich Media Preview

Generates rich preview panels for URLs using iFramely. See [Rich Media Preview Extension](/fundamentals/rich-media-preview).

#### Save Message

Bookmarks messages for later reference. Saved messages are private to the user. See [Save Message Extension](/fundamentals/save-message).

#### Thumbnail Generation

Creates smaller preview images for shared images, reducing bandwidth. See [Thumbnail Generation Extension](/fundamentals/thumbnail-generation).

Auto-integrates into the Message Bubble of [MessageList](/ui-kit/react/message-list) when activated.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-uikit-customization-architecture/0P_ahrcZJ8IBxOCS/images/382b5743-extension_thumbnail_generation_web_screens-b660bc307ecd540c0a7301e65ca0af5b.png?fit=max&auto=format&n=0P_ahrcZJ8IBxOCS&q=85&s=5f66c82107c84f00d23753794c0105de" width="1282" height="802" data-path="images/382b5743-extension_thumbnail_generation_web_screens-b660bc307ecd540c0a7301e65ca0af5b.png" />
</Frame>

#### TinyURL

URL shortening using TinyURL. See [TinyURL Extension](/fundamentals/tinyurl).

#### Voice Transcription

Converts audio messages to text. See [Voice Transcription Extension](/fundamentals/voice-transcription).

### User Engagement

#### Giphy

Search and share GIFs from Giphy. See [Giphy Extension](/fundamentals/giphy).

#### Message Translation

Translates messages into the local locale. See [Message Translation Extension](/fundamentals/message-translation).

Auto-integrates into the Action Sheet of [MessageList](/ui-kit/react/message-list) when activated.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-uikit-customization-architecture/yjm4yfB999UH63sb/images/0baa8eed-extension_message_translation_web_screens-4e96a6b7bc989197532d49ca83f77977.png?fit=max&auto=format&n=yjm4yfB999UH63sb&q=85&s=fa14035a84b172a62db9990d495cdcdb" width="1282" height="802" data-path="images/0baa8eed-extension_message_translation_web_screens-4e96a6b7bc989197532d49ca83f77977.png" />
</Frame>

#### Polls

Creates polls in group discussions with predefined answer options. See [Polls Extension](/fundamentals/polls).

Auto-integrates into the Action Sheet of [Message Composer](/ui-kit/react/message-composer) when activated.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-uikit-customization-architecture/yT0G4L3ch0viWAfB/images/cc12b78b-extension_poll_web_screens-d48dc40c1a77ad81b6382607d7721b19.png?fit=max&auto=format&n=yT0G4L3ch0viWAfB&q=85&s=312021eb521268e20dc56cbf0890ff21" width="1282" height="802" data-path="images/cc12b78b-extension_poll_web_screens-d48dc40c1a77ad81b6382607d7721b19.png" />
</Frame>

#### Reminders

Sets reminders for messages or creates personal reminders. A bot sends a notification when due. See [Reminders Extension](/fundamentals/reminders).

#### Stickers

Sends pre-designed stickers in chat. See [Sticker Extension](/fundamentals/stickers).

Auto-integrates into [Message Composer](/ui-kit/react/message-composer) when activated.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-uikit-customization-architecture/-aNDa2DqeCoQ4s6x/images/f3262629-extension_sticker_web_screens-6e10335c8a82dea2b11cc875c44b606e.png?fit=max&auto=format&n=-aNDa2DqeCoQ4s6x&q=85&s=4bdd771485a0dacd52572b49fefa4cf0" width="1282" height="802" data-path="images/f3262629-extension_sticker_web_screens-6e10335c8a82dea2b11cc875c44b606e.png" />
</Frame>

#### Stipop

Integrates Stipop's sticker library. See [Stipop Extension](/fundamentals/stickers-stipop).

#### Tenor

Search and share GIFs from Tenor. See [Tenor Extension](/fundamentals/tenor).

### Collaboration

#### Collaborative Document

Shared document editing for real-time collaboration. See [Collaborative Document Extension](/fundamentals/collaborative-document).

Auto-integrates into the Action Sheet of [Message Composer](/ui-kit/react/message-composer) when activated.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-uikit-customization-architecture/u5yp9q0rfnLJKCf0/images/ed4f9ead-extension_collaborative_document_web_screens-b636764a036d286a66cf81bf43cadf19.png?fit=max&auto=format&n=u5yp9q0rfnLJKCf0&q=85&s=e0727359718cfcb16ea491cd3e39a5b3" width="1282" height="802" data-path="images/ed4f9ead-extension_collaborative_document_web_screens-b636764a036d286a66cf81bf43cadf19.png" />
</Frame>

#### Collaborative Whiteboard

Real-time shared whiteboard for drawing and brainstorming. See [Collaborative Whiteboard Extension](/fundamentals/collaborative-whiteboard).

Auto-integrates into the Action Sheet of [Message Composer](/ui-kit/react/message-composer) when activated.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-uikit-customization-architecture/AMd_XKz1k_4EL5uf/images/6baee6d6-extension_whiteboard_web_screens-5ab03b904a0a2f6550d86c701c5fcda2.png?fit=max&auto=format&n=AMd_XKz1k_4EL5uf&q=85&s=1ca2f190a38854e082a6be7a61f6b8d3" width="1282" height="802" data-path="images/6baee6d6-extension_whiteboard_web_screens-5ab03b904a0a2f6550d86c701c5fcda2.png" />
</Frame>

### Security

#### Disappearing Messages

Messages auto-delete after a specified interval. Works for 1:1 and group messages. See [Disappearing Messages Extension](/fundamentals/disappearing-messages).

### Customer Support

#### Chatwoot

Routes user messages to Chatwoot for customer support. See [Chatwoot Extension](/fundamentals/chatwoot).

#### Intercom

Integrates Intercom for in-app customer support. See [Intercom Extension](/fundamentals/intercom).

### Smart Chat Features

#### Conversation Starter

AI-generated opening messages for new chats. See [Conversation Starter](/fundamentals/ai-user-copilot/conversation-starter) and [AI Features](/ui-kit/react/ai-features).

#### Smart Replies

AI-generated response suggestions based on conversation context. See [Smart Replies](/fundamentals/ai-user-copilot/smart-replies) and [AI Features](/ui-kit/react/ai-features).

#### Conversation Summary

AI-generated recap of long conversations. See [Conversation Summary](/fundamentals/ai-user-copilot/conversation-summary) and [AI Features](/ui-kit/react/ai-features).

***

## Next Steps

<CardGroup cols={2}>
  <Card title="Message Composer" icon="pen-to-square" href="/ui-kit/react/message-composer">
    Customize the composer where most extensions appear
  </Card>

  <Card title="Message List" icon="messages" href="/ui-kit/react/message-list">
    Customize the message list for extension-rendered content
  </Card>

  <Card title="Core Features" icon="comments" href="/ui-kit/react/core-features">
    Core chat features like messaging and reactions
  </Card>

  <Card title="AI Features" icon="robot" href="/ui-kit/react/ai-features">
    AI-powered chat capabilities
  </Card>
</CardGroup>
