Quote reply

Message threading is a feature that allows users to reply to each other's messages in a channel. Users can ask questions, give feedback or add context to a specific message without interrupting the conversation flow. A message thread refers to a group of messages and their replies. Sendbird UIKit supports two reply types: quote reply and threads. Quote reply allows users to exchange and view all messages and replies together in the channel view.

To view the image in full screen, click on the

Quote reply currently has the following limitations:

• UIKit message threading is available for group channels and supergroup channels only.
• Sendbird UIKit only supports 1-depth threads, meaning you can only reply to the original message.

To turn on quote reply mode, set the reply filter to QUOTE_REPLY:

// Turn on the quote reply mode.
UIKitConfig.groupChannelConfig.replyType = ReplyType.QUOTE_REPLY
// Turn off the quote reply mode.
UIKitConfig.groupChannelConfig.replyType = ReplyType.NONE

Users can reply to messages in a group channel. The messageListComponent of ChannelModule allows users to long tap the message they wish to reply to. A Message menu will appear and once they tap Reply, they can start quote replying using the QUOTE_REPLY mode of MessageInputView. A message that already has a reply is called a quoted message and the replied message is called a reply. Both quoted messages and replies can be either user messages or file messages.

The Message menu contains an Emoji reaction bar, a Copy button, and a Reply button. To view the menu, long tap on a message in channel view. Then, tap Reply in the menu to quote reply to the selected message. The sendUserMessage(UserMessageParams params) method of ChannelFragment is invoked and the selected message becomes a quoted message.

The Reply button of a message that's already a reply appears as deactivated because the UIKit only supports 1-depth replies.

To view the image in full screen, click on the

The Delete button of a quoted message that has one or more replies appears as deactivated. To delete the quoted message, its replies must be deleted first.

To view the image in full screen, click on the

The UI for quote reply in the Message menu can be customized through the string resource and icon resource.

The Reply text in the Message menu can be customized through the string resource. The string resource is a set of strings used to compose a view. It’s a res/strings.xml file containing UIKit-defined string values.

<resources>
    <string name="sb_text_channel_anchor_reply">Reply</string>
</resources>

The following table shows a customizable reply message icon.

Once the current user chooses to Reply in the Message menu, they will be able to start quote replying through the QUOTE_REPLY mode of MessageInputView. The preview of the quoted message is displayed above the messageInputComponent of ChannelModule. Type a message in the input field and Send. Then, the sendUserMessage(UserMessageParams params) method of ChannelFragment is called to send the reply message.

If the user closes the quoted message in MessageInputView, they can end QUOTE_REPLY mode and the preview of the quoted message disappears.

To view the image in full screen, click on the

You can customize the UI for message input view using style resource, string resource, and icon resource.

To customize the style of items in the message input view, you have to change the UIKit-defined style values in the res/values/style.xml file as shown below. To learn how to customize the style, refer to Style resource.

<style name="Component.ChannelMessageInput">
</style>

The text of the title in the message input view can be customized through the string resource.

<resources>
    <string name="sb_text_reply_to">Reply to %s&#8230;</string>
</resources>

The icon in the upper right corner of the message input view can be customized through the icon resource.

Users can view all quoted messages in the channel through BaseQuotedMessageView, MyQuotedMessageView, and OtherQuotedMessageView. These views are internally implemented classes in Sendbird UIKit used to display the different types of reply messages on the screen. Both MyQuotedMessageView and OtherQuotedMessageView inherit the properties and methods of BaseQuotedMessageView. The BaseQuoteMessageView only shows the quoted message and the title that indicates a user replied to another user as all reply messages are considered individual messages in the channel that inherit BaseViewHolder<BaseMessage>.

There are two types of quoted message views in a channel: MyQuotedMessageView and OtherQuotedMessageView. When the current user replies to a message in the channel, the quoted message is shown using MyQuotedMessageView. When another user in the channel replies to a message in the channel, the quoted message is displayed through OtherQuotedMessageView.

To view the image in full screen, click on the

You can customize the UI for quoted messages in a channel using style resource, string resource, and icon resource.

To customize the style of items in the quoted message view, you have to change the UIKit-defined style values in the res/values/style.xml file as shown below. To learn how to customize the style, refer to Style resource.

<style name="Widget.Sendbird.Message.Me">
</style>
<style name="Widget.Sendbird.Message.Other">
</style>

The texts in the quoted message view can be customized through the string resource.

<resources>
    <string name="sb_text_you">You</string>
    <string name="sb_text_reply_to">Reply to %s</string>
    <string name="sb_text_replied_to">%s replied to %s</string>
    <string name="sb_text_error_original_message_not_found">Couldn\'t find the original message for this reply.</string>
</resources>

The icon to the left of the title in the quoted message view can be customized through the icon resource.

The quoted message view supports an event handler for tap gestures. When the current user taps or presses and holds the quoted message, the setOnQuoteReplyMessageClickListener(OnItemClickListener) or setOnQuoteReplyMessageLongClickListener(OnItemLongClickListener) method of MessageListComponent is called.