Skip to main content
This page contains Flutter SDK code examples for User Experience extensions. For feature documentation, setup instructions, and extension settings, see User Experience Extensions.

​
How to Use Extensions with SDK

1

Enable in Dashboard

Login to CometChat Dashboard, select your app, then go to Chat & Messaging → Features and enable the extension.
2

Configure settings (if required)

Some extensions require API keys or additional configuration. Open the extension settings in the Dashboard.
3

Implement SDK methods

Use the code examples below to call extension APIs and extract extension data from messages.
4

Build your UI

Create UI components to display extension data (e.g., link previews, pinned messages, saved messages).

​
Bitly

Shorten long URLs in messages using Bitly.

​
Shorten URL

Map<String, dynamic> body = {
  'text': 'Your message with URL https://yourdomain.com/very/very/long/url',
};

CometChat.callExtension('url-shortener-bitly', 'POST', '/v1/shorten', body,
  onSuccess: (Map<String, dynamic> response) {
    // minifiedText in response
    debugPrint('Shortened URL: ${response['minifiedText']}');
  },
  onError: (CometChatException e) {
    debugPrint('Error: ${e.message}');
  }
);
Extract link preview metadata from messages. 
Map<String, dynamic>? metadata = message.metadata;
if (metadata != null) {
  var injectedObject = metadata['@injected'];
  if (injectedObject != null && injectedObject.containsKey('extensions')) {
    var extensionsObject = injectedObject['extensions'];
    if (extensionsObject != null && extensionsObject.containsKey('link-preview')) {
      var linkPreviewObject = extensionsObject['link-preview'];
      var links = linkPreviewObject['links'] as List;
      if (links.isNotEmpty) {
        var firstLink = links[0];
        String? description = firstLink['description'];
        String? favicon = firstLink['favicon'];
        String? image = firstLink['image'];
        String? title = firstLink['title'];
        String? url = firstLink['url'];
        debugPrint('Link Preview - Title: $title, URL: $url');
      }
    }
  }
}

​
Message Shortcuts

Send predefined messages using shortcuts (e.g., !hb expands to “Happy birthday!”).

​
Fetch All Shortcuts

CometChat.callExtension('message-shortcuts', 'GET', '/v1/fetch', null,
  onSuccess: (Map<String, dynamic> response) {
    // Save these shortcuts locally
    var shortcuts = response['shortcuts'];
    debugPrint('Shortcuts: $shortcuts');
  },
  onError: (CometChatException e) {
    debugPrint('Error: ${e.message}');
  }
);

​
Modify Shortcuts

Map<String, dynamic> body = {
  'shortcuts': {
    '!hbd': 'Happy birthday! Have fun!'
  }
};

CometChat.callExtension('message-shortcuts', 'POST', '/v1/update', body,
  onSuccess: (Map<String, dynamic> response) {
    debugPrint('Shortcuts updated successfully');
  },
  onError: (CometChatException e) {
    debugPrint('Error: ${e.message}');
  }
);

​
Pin Message

Pin important messages in conversations.

​
Pin a Message

Map<String, dynamic> body = {
  'msgId': 280,
};

CometChat.callExtension('pin-message', 'POST', '/v1/pin', body,
  onSuccess: (Map<String, dynamic> response) {
    debugPrint('Message pinned: ${response['success']}');
  },
  onError: (CometChatException e) {
    debugPrint('Error: ${e.message}');
  }
);

​
Unpin a Message

Map<String, dynamic> body = {
  'msgId': 111,
  'receiverType': 'group',
  'receiver': 'cometchat-guid-1',
};

CometChat.callExtension('pin-message', 'DELETE', '/v1/unpin', body,
  onSuccess: (Map<String, dynamic> response) {
    debugPrint('Message unpinned: ${response['success']}');
  },
  onError: (CometChatException e) {
    debugPrint('Error: ${e.message}');
  }
);

​
Fetch Pinned Messages

String receiverType = 'group';
String receiver = 'cometchat-guid-1';
String url = '/v1/fetch?receiverType=$receiverType&receiver=$receiver';

CometChat.callExtension('pin-message', 'GET', url, null,
  onSuccess: (Map<String, dynamic> response) {
    var pinnedMessages = response['pinnedMessages'];
    debugPrint('Pinned messages: $pinnedMessages');
  },
  onError: (CometChatException e) {
    debugPrint('Error: ${e.message}');
  }
);

​
Rich Media Preview

Extract rich media preview metadata from messages using Iframely.

​
Extract Rich Media Data

Map<String, dynamic>? metadata = message.metadata;
if (metadata != null) {
  var injectedObject = metadata['@injected'];
  if (injectedObject != null && injectedObject.containsKey('extensions')) {
    var extensionsObject = injectedObject['extensions'];
    if (extensionsObject != null && extensionsObject.containsKey('rich-media')) {
      var richMediaObject = extensionsObject['rich-media'];
      debugPrint('Rich Media: $richMediaObject');
    }
  }
}

​
Save Message

Save important messages for later access.

​
Save a Message

Map<String, dynamic> body = {
  'msgId': 111,
};

CometChat.callExtension('save-message', 'POST', '/v1/save', body,
  onSuccess: (Map<String, dynamic> response) {
    debugPrint('Message saved: ${response['success']}');
  },
  onError: (CometChatException e) {
    debugPrint('Error: ${e.message}');
  }
);

​
Unsave a Message

Map<String, dynamic> body = {
  'msgId': 111,
};

CometChat.callExtension('save-message', 'DELETE', '/v1/unsave', body,
  onSuccess: (Map<String, dynamic> response) {
    debugPrint('Message unsaved: ${response['success']}');
  },
  onError: (CometChatException e) {
    debugPrint('Error: ${e.message}');
  }
);

​
Fetch Saved Messages

CometChat.callExtension('save-message', 'GET', '/v1/fetch', null,
  onSuccess: (Map<String, dynamic> response) {
    var savedMessages = response['savedMessages'];
    debugPrint('Saved messages: $savedMessages');
  },
  onError: (CometChatException e) {
    debugPrint('Error: ${e.message}');
  }
);

​
Thumbnail Generation

Extract thumbnail URLs from image and video messages.

​
Extract Thumbnail Data

Map<String, dynamic>? metadata = message.metadata;
if (metadata != null) {
  var injectedObject = metadata['@injected'];
  if (injectedObject != null && injectedObject.containsKey('extensions')) {
    var extensionsObject = injectedObject['extensions'];
    if (extensionsObject != null && extensionsObject.containsKey('thumbnail-generation')) {
      var thumbnailObject = extensionsObject['thumbnail-generation'];
      var attachments = thumbnailObject['attachments'] as List;
      for (var attachment in attachments) {
        if (attachment['error'] == null) {
          var thumbnails = attachment['data']['thumbnails'];
          String? urlSmall = thumbnails['url_small'];
          String? urlMedium = thumbnails['url_medium'];
          String? urlLarge = thumbnails['url_large'];
          debugPrint('Thumbnails - Small: $urlSmall, Medium: $urlMedium, Large: $urlLarge');
        }
      }
    }
  }
}

​
TinyURL

Shorten long URLs in messages using TinyURL.

​
Shorten URL

Map<String, dynamic> body = {
  'text': 'Your message with URL https://yourdomain.com/very/very/long/url',
};

CometChat.callExtension('url-shortener-tinyurl', 'POST', '/v1/shorten', body,
  onSuccess: (Map<String, dynamic> response) {
    // minifiedText in response
    debugPrint('Shortened URL: ${response['minifiedText']}');
  },
  onError: (CometChatException e) {
    debugPrint('Error: ${e.message}');
  }
);

​
Voice Transcription

Extract transcribed text from audio messages.

​
Extract Transcription Data

Map<String, dynamic>? metadata = message.metadata;
if (metadata != null) {
  var injectedObject = metadata['@injected'];
  if (injectedObject != null && injectedObject.containsKey('extensions')) {
    var extensionsObject = injectedObject['extensions'];
    if (extensionsObject != null && extensionsObject.containsKey('voice-transcription')) {
      var voiceTranscriptionObject = extensionsObject['voice-transcription'];
      String? transcribedMessage = voiceTranscriptionObject['transcribed_message'];
      debugPrint('Transcribed message: $transcribedMessage');
    }
  }
}