stream-chat-react-native-core 3.10.2 → 4.0.0-beta.4

package/lib/commonjs/components/Channel/Channel.js

@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Channel = exports.reactionData = void 0;
+exports.reactionData = exports.Channel = void 0;
 
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 
@@ -29,14 +29,14 @@ var _throttle = _interopRequireDefault(require("lodash/throttle"));
 
 var _streamChat = require("stream-chat");
 
-var _useAppStateListener = require("../../hooks/useAppStateListener");
-
 var _useCreateChannelContext = require("./hooks/useCreateChannelContext");
 
 var _useCreateInputMessageInputContext = require("./hooks/useCreateInputMessageInputContext");
 
 var _useCreateMessagesContext = require("./hooks/useCreateMessagesContext");
 
+var _useCreateOwnCapabilitiesContext = require("./hooks/useCreateOwnCapabilitiesContext");
+
 var _useCreatePaginatedMessageListContext = require("./hooks/useCreatePaginatedMessageListContext");
 
 var _useCreateThreadContext = require("./hooks/useCreateThreadContext");
@@ -45,6 +45,38 @@ var _useCreateTypingContext = require("./hooks/useCreateTypingContext");
 
 var _useTargetedMessage2 = require("./hooks/useTargetedMessage");
 
+var _ChannelContext = require("../../contexts/channelContext/ChannelContext");
+
+var _useChannelState2 = require("../../contexts/channelsStateContext/useChannelState");
+
+var _ChatContext = require("../../contexts/chatContext/ChatContext");
+
+var _MessageInputContext = require("../../contexts/messageInputContext/MessageInputContext");
+
+var _MessagesContext = require("../../contexts/messagesContext/MessagesContext");
+
+var _OwnCapabilitiesContext = require("../../contexts/ownCapabilitiesContext/OwnCapabilitiesContext");
+
+var _PaginatedMessageListContext = require("../../contexts/paginatedMessageListContext/PaginatedMessageListContext");
+
+var _SuggestionsContext = require("../../contexts/suggestionsContext/SuggestionsContext");
+
+var _ThemeContext = require("../../contexts/themeContext/ThemeContext");
+
+var _ThreadContext = require("../../contexts/threadContext/ThreadContext");
+
+var _TranslationContext = require("../../contexts/translationContext/TranslationContext");
+
+var _TypingContext = require("../../contexts/typingContext/TypingContext");
+
+var _useAppStateListener = require("../../hooks/useAppStateListener");
+
+var _icons = require("../../icons");
+
+var _native = require("../../native");
+
+var _utils = require("../../utils/utils");
+
 var _Attachment = require("../Attachment/Attachment");
 
 var _AttachmentActions = require("../Attachment/AttachmentActions");
@@ -61,14 +93,18 @@ var _Gallery = require("../Attachment/Gallery");
 
 var _Giphy = require("../Attachment/Giphy");
 
+var _AutoCompleteSuggestionHeader = require("../AutoCompleteInput/AutoCompleteSuggestionHeader");
+
+var _AutoCompleteSuggestionItem = require("../AutoCompleteInput/AutoCompleteSuggestionItem");
+
+var _AutoCompleteSuggestionList = require("../AutoCompleteInput/AutoCompleteSuggestionList");
+
 var _EmptyStateIndicator = require("../Indicators/EmptyStateIndicator");
 
 var _LoadingErrorIndicator = require("../Indicators/LoadingErrorIndicator");
 
 var _LoadingIndicator = require("../Indicators/LoadingIndicator");
 
-var _NetworkDownIndicator = require("../MessageList/NetworkDownIndicator");
-
 var _KeyboardCompatibleView = require("../KeyboardCompatibleView/KeyboardCompatibleView");
 
 var _Message = require("../Message/Message");
@@ -81,6 +117,8 @@ var _MessageDeleted = require("../Message/MessageSimple/MessageDeleted");
 
 var _MessageFooter = require("../Message/MessageSimple/MessageFooter");
 
+var _MessagePinnedHeader = require("../Message/MessageSimple/MessagePinnedHeader");
+
 var _MessageReplies = require("../Message/MessageSimple/MessageReplies");
 
 var _MessageRepliesAvatars = require("../Message/MessageSimple/MessageRepliesAvatars");
@@ -95,6 +133,8 @@ var _AttachButton = require("../MessageInput/AttachButton");
 
 var _CommandsButton = require("../MessageInput/CommandsButton");
 
+var _CooldownTimer = require("../MessageInput/CooldownTimer");
+
 var _FileUploadPreview = require("../MessageInput/FileUploadPreview");
 
 var _ImageUploadPreview = require("../MessageInput/ImageUploadPreview");
@@ -105,6 +145,8 @@ var _MoreOptionsButton = require("../MessageInput/MoreOptionsButton");
 
 var _SendButton = require("../MessageInput/SendButton");
 
+var _SendMessageDisallowedIndicator = require("../MessageInput/SendMessageDisallowedIndicator");
+
 var _ShowThreadMessageInChannelButton = require("../MessageInput/ShowThreadMessageInChannelButton");
 
 var _UploadProgressIndicator = require("../MessageInput/UploadProgressIndicator");
@@ -119,6 +161,8 @@ var _MessageList = require("../MessageList/MessageList");
 
 var _MessageSystem = require("../MessageList/MessageSystem");
 
+var _NetworkDownIndicator = require("../MessageList/NetworkDownIndicator");
+
 var _ScrollToBottomButton = require("../MessageList/ScrollToBottomButton");
 
 var _TypingIndicator = require("../MessageList/TypingIndicator");
@@ -129,32 +173,6 @@ var _OverlayReactionList = require("../MessageOverlay/OverlayReactionList");
 
 var _Reply = require("../Reply/Reply");
 
-var _ChannelContext = require("../../contexts/channelContext/ChannelContext");
-
-var _ChatContext = require("../../contexts/chatContext/ChatContext");
-
-var _MessageInputContext = require("../../contexts/messageInputContext/MessageInputContext");
-
-var _MessagesContext = require("../../contexts/messagesContext/MessagesContext");
-
-var _PaginatedMessageListContext = require("../../contexts/paginatedMessageListContext/PaginatedMessageListContext");
-
-var _SuggestionsContext = require("../../contexts/suggestionsContext/SuggestionsContext");
-
-var _ThemeContext = require("../../contexts/themeContext/ThemeContext");
-
-var _ThreadContext = require("../../contexts/threadContext/ThreadContext");
-
-var _TranslationContext = require("../../contexts/translationContext/TranslationContext");
-
-var _TypingContext = require("../../contexts/typingContext/TypingContext");
-
-var _icons = require("../../icons");
-
-var _native = require("../../native");
-
-var _utils = require("../../utils/utils");
-
 var _excluded = ["attachments", "mentioned_users", "parent_id", "text"],
     _excluded2 = ["__html", "attachments", "created_at", "html", "id", "mentioned_users", "parent_id", "quoted_message", "reactions", "status", "text", "type", "updated_at", "user"];
 
@@ -203,11 +221,10 @@ var debounceOptions = {
 var unreadMessagesOnInitialLoadLimit = 2;
 
 var ChannelWithContext = function ChannelWithContext(props) {
-  var _channel$state, _channel$state$thread, _client$user, _ref14, _ref15, _ref16, _ref17, _ref18, _ref19, _ref20, _channel$data, _ref28;
+  var _client$user, _channel$data, _ref21, _ref22;
 
   var additionalKeyboardAvoidingViewProps = props.additionalKeyboardAvoidingViewProps,
       additionalTextInputProps = props.additionalTextInputProps,
-      animatedLongPress = props.animatedLongPress,
       additionalTouchableProps = props.additionalTouchableProps,
       _props$allowThreadMes = props.allowThreadMessagesInChannel,
       allowThreadMessagesInChannel = _props$allowThreadMes === void 0 ? true : _props$allowThreadMes,
@@ -217,9 +234,14 @@ var ChannelWithContext = function ChannelWithContext(props) {
       Attachment = _props$Attachment === void 0 ? _Attachment.Attachment : _props$Attachment,
       _props$AttachmentActi = props.AttachmentActions,
       AttachmentActions = _props$AttachmentActi === void 0 ? _AttachmentActions.AttachmentActions : _props$AttachmentActi,
+      _props$AutoCompleteSu = props.AutoCompleteSuggestionHeader,
+      AutoCompleteSuggestionHeader = _props$AutoCompleteSu === void 0 ? _AutoCompleteSuggestionHeader.AutoCompleteSuggestionHeader : _props$AutoCompleteSu,
+      _props$AutoCompleteSu2 = props.AutoCompleteSuggestionItem,
+      AutoCompleteSuggestionItem = _props$AutoCompleteSu2 === void 0 ? _AutoCompleteSuggestionItem.AutoCompleteSuggestionItem : _props$AutoCompleteSu2,
+      _props$AutoCompleteSu3 = props.AutoCompleteSuggestionList,
+      AutoCompleteSuggestionList = _props$AutoCompleteSu3 === void 0 ? _AutoCompleteSuggestionList.AutoCompleteSuggestionList : _props$AutoCompleteSu3,
       autoCompleteSuggestionsLimit = props.autoCompleteSuggestionsLimit,
       autoCompleteTriggerSettings = props.autoCompleteTriggerSettings,
-      blockUser = props.blockUser,
       _props$Card = props.Card,
       Card = _props$Card === void 0 ? _Card.Card : _props$Card,
       CardCover = props.CardCover,
@@ -228,14 +250,15 @@ var ChannelWithContext = function ChannelWithContext(props) {
       channel = props.channel,
       children = props.children,
       client = props.client,
-      closeSuggestions = props.closeSuggestions,
       _props$CommandsButton = props.CommandsButton,
       CommandsButton = _props$CommandsButton === void 0 ? _CommandsButton.CommandsButton : _props$CommandsButton,
       compressImageQuality = props.compressImageQuality,
-      copyMessage = props.copyMessage,
+      _props$CooldownTimer = props.CooldownTimer,
+      CooldownTimer = _props$CooldownTimer === void 0 ? _CooldownTimer.CooldownTimer : _props$CooldownTimer,
       _props$DateHeader = props.DateHeader,
       DateHeader = _props$DateHeader === void 0 ? _DateHeader.DateHeader : _props$DateHeader,
-      deleteMessage = props.deleteMessage,
+      _props$deletedMessage = props.deletedMessagesVisibilityType,
+      deletedMessagesVisibilityType = _props$deletedMessage === void 0 ? 'always' : _props$deletedMessage,
       _props$disableIfFroze = props.disableIfFrozenChannel,
       disableIfFrozenChannel = _props$disableIfFroze === void 0 ? true : _props$disableIfFroze,
       _props$disableKeyboar = props.disableKeyboardCompatibleView,
@@ -248,7 +271,6 @@ var ChannelWithContext = function ChannelWithContext(props) {
       doMarkReadRequest = props.doMarkReadRequest,
       doSendMessageRequest = props.doSendMessageRequest,
       doUpdateMessageRequest = props.doUpdateMessageRequest,
-      editMessageProp = props.editMessage,
       _props$EmptyStateIndi = props.EmptyStateIndicator,
       EmptyStateIndicator = _props$EmptyStateIndi === void 0 ? _EmptyStateIndicator.EmptyStateIndicator : _props$EmptyStateIndi,
       _props$enableMessageG = props.enableMessageGroupingByUser,
@@ -257,13 +279,12 @@ var ChannelWithContext = function ChannelWithContext(props) {
       enforceUniqueReaction = _props$enforceUniqueR === void 0 ? false : _props$enforceUniqueR,
       _props$FileAttachment = props.FileAttachment,
       FileAttachment = _props$FileAttachment === void 0 ? _FileAttachment.FileAttachment : _props$FileAttachment,
-      _props$FileAttachment2 = props.FileAttachmentIcon,
-      FileAttachmentIcon = _props$FileAttachment2 === void 0 ? _FileIcon.FileIcon : _props$FileAttachment2,
-      _props$FileAttachment3 = props.FileAttachmentGroup,
-      FileAttachmentGroup = _props$FileAttachment3 === void 0 ? _FileAttachmentGroup.FileAttachmentGroup : _props$FileAttachment3,
+      _props$FileAttachment2 = props.FileAttachmentGroup,
+      FileAttachmentGroup = _props$FileAttachment2 === void 0 ? _FileAttachmentGroup.FileAttachmentGroup : _props$FileAttachment2,
+      _props$FileAttachment3 = props.FileAttachmentIcon,
+      FileAttachmentIcon = _props$FileAttachment3 === void 0 ? _FileIcon.FileIcon : _props$FileAttachment3,
       _props$FileUploadPrev = props.FileUploadPreview,
       FileUploadPreview = _props$FileUploadPrev === void 0 ? _FileUploadPreview.FileUploadPreview : _props$FileUploadPrev,
-      flagMessage = props.flagMessage,
       _props$FlatList = props.FlatList,
       FlatList = _props$FlatList === void 0 ? _native.FlatList : _props$FlatList,
       forceAlignMessages = props.forceAlignMessages,
@@ -281,6 +302,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
       handleEdit = props.handleEdit,
       handleFlag = props.handleFlag,
       handleMute = props.handleMute,
+      handlePinMessage = props.handlePinMessage,
       handleQuotedReply = props.handleQuotedReply,
       handleReaction = props.handleReaction,
       handleRetry = props.handleRetry,
@@ -312,7 +334,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
       KeyboardCompatibleView = _props$KeyboardCompat === void 0 ? _KeyboardCompatibleView.KeyboardCompatibleView : _props$KeyboardCompat,
       keyboardVerticalOffset = props.keyboardVerticalOffset,
       _props$legacyImageVie = props.legacyImageViewerSwipeBehaviour,
-      legacyImageViewerSwipeBehaviour = _props$legacyImageVie === void 0 ? true : _props$legacyImageVie,
+      legacyImageViewerSwipeBehaviour = _props$legacyImageVie === void 0 ? false : _props$legacyImageVie,
       _props$LoadingErrorIn = props.LoadingErrorIndicator,
       LoadingErrorIndicator = _props$LoadingErrorIn === void 0 ? _LoadingErrorIndicator.LoadingErrorIndicator : _props$LoadingErrorIn,
       _props$LoadingIndicat = props.LoadingIndicator,
@@ -320,7 +342,6 @@ var ChannelWithContext = function ChannelWithContext(props) {
       loadingMoreProp = props.loadingMore,
       loadingMoreRecentProp = props.loadingMoreRecent,
       markdownRules = props.markdownRules,
-      messageId = props.messageId,
       maxMessageLengthProp = props.maxMessageLength,
       _props$maxNumberOfFil = props.maxNumberOfFiles,
       maxNumberOfFiles = _props$maxNumberOfFil === void 0 ? 10 : _props$maxNumberOfFil,
@@ -328,6 +349,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
       _props$mentionAllAppU = props.mentionAllAppUsersEnabled,
       mentionAllAppUsersEnabled = _props$mentionAllAppU === void 0 ? false : _props$mentionAllAppU,
       mentionAllAppUsersQuery = props.mentionAllAppUsersQuery,
+      members = props.members,
       _props$Message = props.Message,
       Message = _props$Message === void 0 ? _Message.Message : _props$Message,
       messageActions = props.messageActions,
@@ -342,13 +364,16 @@ var ChannelWithContext = function ChannelWithContext(props) {
       _props$MessageFooter = props.MessageFooter,
       MessageFooter = _props$MessageFooter === void 0 ? _MessageFooter.MessageFooter : _props$MessageFooter,
       MessageHeader = props.MessageHeader,
+      messageId = props.messageId,
       _props$MessageList = props.MessageList,
       MessageList = _props$MessageList === void 0 ? _MessageList.MessageList : _props$MessageList,
+      _props$MessagePinnedH = props.MessagePinnedHeader,
+      MessagePinnedHeader = _props$MessagePinnedH === void 0 ? _MessagePinnedHeader.MessagePinnedHeader : _props$MessagePinnedH,
       _props$MessageReplies = props.MessageReplies,
       MessageReplies = _props$MessageReplies === void 0 ? _MessageReplies.MessageReplies : _props$MessageReplies,
       _props$MessageReplies2 = props.MessageRepliesAvatars,
       MessageRepliesAvatars = _props$MessageReplies2 === void 0 ? _MessageRepliesAvatars.MessageRepliesAvatars : _props$MessageReplies2,
-      messagesProp = props.messages,
+      messages = props.messages,
       _props$MessageSimple = props.MessageSimple,
       MessageSimple = _props$MessageSimple === void 0 ? _MessageSimple.MessageSimple : _props$MessageSimple,
       _props$MessageStatus = props.MessageStatus,
@@ -358,8 +383,6 @@ var ChannelWithContext = function ChannelWithContext(props) {
       MessageText = props.MessageText,
       _props$MoreOptionsBut = props.MoreOptionsButton,
       MoreOptionsButton = _props$MoreOptionsBut === void 0 ? _MoreOptionsButton.MoreOptionsButton : _props$MoreOptionsBut,
-      mutesEnabledProp = props.mutesEnabled,
-      muteUser = props.muteUser,
       myMessageTheme = props.myMessageTheme,
       _props$newMessageStat = props.newMessageStateUpdateThrottleInterval,
       newMessageStateUpdateThrottleInterval = _props$newMessageStat === void 0 ? defaultThrottleInterval : _props$newMessageStat,
@@ -368,30 +391,35 @@ var ChannelWithContext = function ChannelWithContext(props) {
       _props$numberOfLines = props.numberOfLines,
       numberOfLines = _props$numberOfLines === void 0 ? 5 : _props$numberOfLines,
       onChangeText = props.onChangeText,
-      onDoubleTapMessage = props.onDoubleTapMessage,
       onLongPressMessage = props.onLongPressMessage,
-      onPressMessage = props.onPressMessage,
+      overrideOwnCapabilities = props.overrideOwnCapabilities,
       onPressInMessage = props.onPressInMessage,
-      openSuggestions = props.openSuggestions,
+      onPressMessage = props.onPressMessage,
       _props$OverlayReactio = props.OverlayReactionList,
       OverlayReactionList = _props$OverlayReactio === void 0 ? _OverlayReactionList.OverlayReactionList : _props$OverlayReactio,
-      quotedRepliesEnabledProp = props.quotedRepliesEnabled,
-      quotedReply = props.quotedReply,
       _props$ReactionList = props.ReactionList,
       ReactionList = _props$ReactionList === void 0 ? _ReactionList.ReactionList : _props$ReactionList,
-      reactionsEnabledProp = props.reactionsEnabled,
-      readEventsEnabledProp = props.readEventsEnabled,
+      read = props.read,
       _props$Reply = props.Reply,
       Reply = _props$Reply === void 0 ? _Reply.Reply : _props$Reply,
-      retry = props.retry,
       _props$ScrollToBottom = props.ScrollToBottomButton,
       ScrollToBottomButton = _props$ScrollToBottom === void 0 ? _ScrollToBottomButton.ScrollToBottomButton : _props$ScrollToBottom,
       selectReaction = props.selectReaction,
       _props$SendButton = props.SendButton,
       SendButton = _props$SendButton === void 0 ? _SendButton.SendButton : _props$SendButton,
+      _props$SendMessageDis = props.SendMessageDisallowedIndicator,
+      SendMessageDisallowedIndicator = _props$SendMessageDis === void 0 ? _SendMessageDisallowedIndicator.SendMessageDisallowedIndicator : _props$SendMessageDis,
       _props$sendImageAsync = props.sendImageAsync,
       sendImageAsync = _props$sendImageAsync === void 0 ? false : _props$sendImageAsync,
       setInputRef = props.setInputRef,
+      setMembers = props.setMembers,
+      setMessages = props.setMessages,
+      setRead = props.setRead,
+      setThreadMessages = props.setThreadMessages,
+      setTyping = props.setTyping,
+      setWatcherCount = props.setWatcherCount,
+      setWatchers = props.setWatchers,
+      shouldSyncChannel = props.shouldSyncChannel,
       _props$ShowThreadMess = props.ShowThreadMessageInChannelButton,
       ShowThreadMessageInChannelButton = _props$ShowThreadMess === void 0 ? _ShowThreadMessageInChannelButton.ShowThreadMessageInChannelButton : _props$ShowThreadMess,
       _props$stateUpdateThr = props.stateUpdateThrottleInterval,
@@ -401,19 +429,19 @@ var ChannelWithContext = function ChannelWithContext(props) {
       supportedReactions = _props$supportedReact === void 0 ? reactionData : _props$supportedReact,
       t = props.t,
       threadProps = props.thread,
-      threadRepliesEnabledProp = props.threadRepliesEnabled,
-      threadReply = props.threadReply,
-      typingEventsEnabledProp = props.typingEventsEnabled,
+      threadList = props.threadList,
+      threadMessages = props.threadMessages,
+      typing = props.typing,
       _props$TypingIndicato = props.TypingIndicator,
       TypingIndicator = _props$TypingIndicato === void 0 ? _TypingIndicator.TypingIndicator : _props$TypingIndicato,
       _props$TypingIndicato2 = props.TypingIndicatorContainer,
       TypingIndicatorContainer = _props$TypingIndicato2 === void 0 ? _TypingIndicatorContainer.TypingIndicatorContainer : _props$TypingIndicato2,
-      updateSuggestions = props.updateSuggestions,
       _props$UploadProgress = props.UploadProgressIndicator,
       UploadProgressIndicator = _props$UploadProgress === void 0 ? _UploadProgressIndicator.UploadProgressIndicator : _props$UploadProgress,
-      uploadsEnabledProp = props.uploadsEnabled,
       _props$UrlPreview = props.UrlPreview,
-      UrlPreview = _props$UrlPreview === void 0 ? _Card.Card : _props$UrlPreview;
+      UrlPreview = _props$UrlPreview === void 0 ? _Card.Card : _props$UrlPreview,
+      watcherCount = props.watcherCount,
+      watchers = props.watchers;
 
   var _useTheme = (0, _ThemeContext.useTheme)(),
       _useTheme$theme = _useTheme.theme,
@@ -445,7 +473,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
       lastRead = _useState10[0],
       setLastRead = _useState10[1];
 
-  var _useState11 = (0, _react.useState)(true),
+  var _useState11 = (0, _react.useState)(!(channel != null && channel.state.messages.length)),
       _useState12 = (0, _slicedToArray2["default"])(_useState11, 2),
       loading = _useState12[0],
       setLoading = _useState12[1];
@@ -460,60 +488,30 @@ var ChannelWithContext = function ChannelWithContext(props) {
       loadingMoreRecent = _useState16[0],
       setLoadingMoreRecent = _useState16[1];
 
-  var _useState17 = (0, _react.useState)([]),
+  var _useState17 = (0, _react.useState)(false),
       _useState18 = (0, _slicedToArray2["default"])(_useState17, 2),
-      messages = _useState18[0],
-      setMessages = _useState18[1];
+      quotedMessage = _useState18[0],
+      setQuotedMessage = _useState18[1];
 
-  var _useState19 = (0, _react.useState)({}),
+  var _useState19 = (0, _react.useState)(threadProps || null),
       _useState20 = (0, _slicedToArray2["default"])(_useState19, 2),
-      members = _useState20[0],
-      setMembers = _useState20[1];
+      thread = _useState20[0],
+      setThread = _useState20[1];
 
-  var _useState21 = (0, _react.useState)(false),
+  var _useState21 = (0, _react.useState)(true),
       _useState22 = (0, _slicedToArray2["default"])(_useState21, 2),
-      quotedMessage = _useState22[0],
-      setQuotedMessage = _useState22[1];
+      threadHasMore = _useState22[0],
+      setThreadHasMore = _useState22[1];
 
-  var _useState23 = (0, _react.useState)({}),
+  var _useState23 = (0, _react.useState)(false),
       _useState24 = (0, _slicedToArray2["default"])(_useState23, 2),
-      read = _useState24[0],
-      setRead = _useState24[1];
+      threadLoadingMore = _useState24[0],
+      setThreadLoadingMore = _useState24[1];
 
-  var _useState25 = (0, _react.useState)(threadProps || null),
+  var _useState25 = (0, _react.useState)(false),
       _useState26 = (0, _slicedToArray2["default"])(_useState25, 2),
-      thread = _useState26[0],
-      setThread = _useState26[1];
-
-  var _useState27 = (0, _react.useState)(true),
-      _useState28 = (0, _slicedToArray2["default"])(_useState27, 2),
-      threadHasMore = _useState28[0],
-      setThreadHasMore = _useState28[1];
-
-  var _useState29 = (0, _react.useState)(false),
-      _useState30 = (0, _slicedToArray2["default"])(_useState29, 2),
-      threadLoadingMore = _useState30[0],
-      setThreadLoadingMore = _useState30[1];
-
-  var _useState31 = (0, _react.useState)((threadProps == null ? void 0 : threadProps.id) && (channel == null ? void 0 : (_channel$state = channel.state) == null ? void 0 : (_channel$state$thread = _channel$state.threads) == null ? void 0 : _channel$state$thread[threadProps.id]) || []),
-      _useState32 = (0, _slicedToArray2["default"])(_useState31, 2),
-      threadMessages = _useState32[0],
-      setThreadMessages = _useState32[1];
-
-  var _useState33 = (0, _react.useState)({}),
-      _useState34 = (0, _slicedToArray2["default"])(_useState33, 2),
-      typing = _useState34[0],
-      setTyping = _useState34[1];
-
-  var _useState35 = (0, _react.useState)(),
-      _useState36 = (0, _slicedToArray2["default"])(_useState35, 2),
-      watcherCount = _useState36[0],
-      setWatcherCount = _useState36[1];
-
-  var _useState37 = (0, _react.useState)({}),
-      _useState38 = (0, _slicedToArray2["default"])(_useState37, 2),
-      watchers = _useState38[0],
-      setWatchers = _useState38[1];
+      syncingChannel = _useState26[0],
+      setSyncingChannel = _useState26[1];
 
   var _useTargetedMessage = (0, _useTargetedMessage2.useTargetedMessage)(messageId),
       setTargetedMessage = _useTargetedMessage.setTargetedMessage,
@@ -522,7 +520,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
   var channelId = (channel == null ? void 0 : channel.id) || '';
   (0, _react.useEffect)(function () {
     var initChannel = function initChannel() {
-      if (!channel) return;
+      if (!channel || !shouldSyncChannel) return;
 
       if (!channel.initialized) {
         loadChannel();
@@ -554,13 +552,13 @@ var ChannelWithContext = function ChannelWithContext(props) {
   }, [channelId, messageId]);
   var threadPropsExists = !!threadProps;
   (0, _react.useEffect)(function () {
-    if (threadProps) {
+    if (threadProps && shouldSyncChannel) {
       setThread(threadProps);
 
       if (channel && threadProps != null && threadProps.id) {
-        var _channel$state$thread2;
+        var _channel$state$thread;
 
-        setThreadMessages(((_channel$state$thread2 = channel.state.threads) == null ? void 0 : _channel$state$thread2[threadProps.id]) || []);
+        setThreadMessages(((_channel$state$thread = channel.state.threads) == null ? void 0 : _channel$state$thread[threadProps.id]) || []);
       }
     } else {
       setThread(null);
@@ -618,7 +616,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
   }, stateUpdateThrottleInterval, throttleOptions)).current;
 
   var connectionRecoveredHandler = function connectionRecoveredHandler() {
-    if (channel) {
+    if (channel && shouldSyncChannel) {
       copyChannelState();
 
       if (thread) {
@@ -628,32 +626,34 @@ var ChannelWithContext = function ChannelWithContext(props) {
   };
 
   var connectionChangedHandler = function connectionChangedHandler(event) {
-    if (event.online) {
+    if (event.online && shouldSyncChannel) {
       resyncChannel();
     }
   };
 
   var handleEvent = function handleEvent(event) {
-    var _event$message;
+    if (shouldSyncChannel) {
+      var _event$message;
 
-    if (thread) {
-      var updatedThreadMessages = thread.id && channel && channel.state.threads[thread.id] || threadMessages;
-      setThreadMessages(updatedThreadMessages);
-    }
+      if (thread) {
+        var updatedThreadMessages = thread.id && channel && channel.state.threads[thread.id] || threadMessages;
+        setThreadMessages(updatedThreadMessages);
+      }
 
-    if (channel && thread && ((_event$message = event.message) == null ? void 0 : _event$message.id) === thread.id) {
-      var updatedThread = channel.state.formatMessage(event.message);
-      setThread(updatedThread);
-    }
+      if (channel && thread && ((_event$message = event.message) == null ? void 0 : _event$message.id) === thread.id) {
+        var updatedThread = channel.state.formatMessage(event.message);
+        setThread(updatedThread);
+      }
 
-    if (event.type === 'typing.start' || event.type === 'typing.stop') {
-      copyTypingState();
-    } else if (event.type === 'message.read') {
-      copyReadState();
-    } else if (event.type === 'message.new') {
-      copyMessagesState();
-    } else if (channel) {
-      copyChannelState();
+      if (event.type === 'typing.start' || event.type === 'typing.stop') {
+        copyTypingState();
+      } else if (event.type === 'message.read') {
+        copyReadState();
+      } else if (event.type === 'message.new') {
+        copyMessagesState();
+      } else if (channel) {
+        copyChannelState();
+      }
     }
   };
 
@@ -682,7 +682,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
         return s.unsubscribe();
       });
     };
-  }, [channelId, connectionRecoveredHandler, handleEvent]);
+  }, [channelId, connectionChangedHandler, connectionRecoveredHandler, handleEvent]);
 
   var channelQueryCall = function () {
     var _ref = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee() {
@@ -696,7 +696,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
                 return null;
               };
               setError(false);
-              setLoading(true);
+              setLoading(!(channel != null && channel.state.messages.length));
               _context.prev = 3;
               _context.next = 6;
               return queryCall();
@@ -711,7 +711,13 @@ var ChannelWithContext = function ChannelWithContext(props) {
             case 11:
               _context.prev = 11;
               _context.t0 = _context["catch"](3);
-              setError(_context.t0);
+
+              if (_context.t0 instanceof Error) {
+                setError(_context.t0);
+              } else {
+                setError(true);
+              }
+
               setLoading(false);
               setLastRead(new Date());
 
@@ -873,7 +879,8 @@ var ChannelWithContext = function ChannelWithContext(props) {
 
   var reloadThread = function () {
     var _ref6 = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee5() {
-      var parentID, limit, queryResponse, updatedHasMore, updatedThreadMessages;
+      var parentID, limit, queryResponse, updatedHasMore, updatedThreadMessages, _yield$channel$getMes, _messages, _messages2, threadMessage, formattedMessage;
+
       return _regenerator["default"].wrap(function _callee5$(_context5) {
         while (1) {
           switch (_context5.prev = _context5.next) {
@@ -893,7 +900,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
               channel.state.threads[parentID] = [];
               _context5.next = 9;
               return channel.getReplies(parentID, {
-                limit: 50
+                limit: limit
               });
 
             case 9:
@@ -901,23 +908,42 @@ var ChannelWithContext = function ChannelWithContext(props) {
               updatedHasMore = queryResponse.messages.length === limit;
               updatedThreadMessages = channel.state.threads[parentID] || [];
               loadMoreThreadFinished(updatedHasMore, updatedThreadMessages);
-              _context5.next = 21;
-              break;
+              _context5.next = 15;
+              return channel.getMessagesById([parentID]);
 
             case 15:
-              _context5.prev = 15;
+              _yield$channel$getMes = _context5.sent;
+              _messages = _yield$channel$getMes.messages;
+              _messages2 = (0, _slicedToArray2["default"])(_messages, 1), threadMessage = _messages2[0];
+
+              if (threadMessage) {
+                formattedMessage = channel.state.formatMessage(threadMessage);
+                setThread(formattedMessage);
+              }
+
+              _context5.next = 27;
+              break;
+
+            case 21:
+              _context5.prev = 21;
               _context5.t0 = _context5["catch"](3);
               console.warn('Thread loading request failed with error', _context5.t0);
-              setError(_context5.t0);
+
+              if (_context5.t0 instanceof Error) {
+                setError(_context5.t0);
+              } else {
+                setError(true);
+              }
+
               setThreadLoadingMore(false);
               throw _context5.t0;
 
-            case 21:
+            case 27:
             case "end":
               return _context5.stop();
           }
         }
-      }, _callee5, null, [[3, 15]]);
+      }, _callee5, null, [[3, 21]]);
     }));
 
     return function reloadThread() {
@@ -933,7 +959,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
         while (1) {
           switch (_context6.prev = _context6.next) {
             case 0:
-              if (channel) {
+              if (!(!channel || syncingChannel)) {
                 _context6.next = 2;
                 break;
               }
@@ -941,16 +967,17 @@ var ChannelWithContext = function ChannelWithContext(props) {
               return _context6.abrupt("return");
 
             case 2:
+              setSyncingChannel(true);
               setError(false);
-              _context6.prev = 3;
-              _context6.next = 6;
+              _context6.prev = 4;
+              _context6.next = 7;
               return channel.watch({
                 messages: {
                   limit: messages.length + 30
                 }
               });
 
-            case 6:
+            case 7:
               state = _context6.sent;
               oldListTopMessage = messages[0];
               oldListTopMessageId = (_messages$ = messages[0]) == null ? void 0 : _messages$.id;
@@ -959,7 +986,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
               newListBottomMessage = state.messages[state.messages.length - 1];
 
               if (!(!oldListTopMessage || !oldListBottomMessage || !newListTopMessage || !newListBottomMessage)) {
-                _context6.next = 18;
+                _context6.next = 19;
                 break;
               }
 
@@ -969,7 +996,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
               copyChannelState();
               return _context6.abrupt("return");
 
-            case 18:
+            case 19:
               parseMessage = function parseMessage(message) {
                 var _message$pinned_at, _message$updated_at;
 
@@ -981,10 +1008,10 @@ var ChannelWithContext = function ChannelWithContext(props) {
               };
 
               failedMessages = messages.filter(function (message) {
-                return message.status === 'failed';
+                return message.status === _utils.MessageStatusTypes.FAILED;
               }).map(parseMessage);
               failedThreadMessages = thread ? threadMessages.filter(function (message) {
-                return message.status === 'failed';
+                return message.status === _utils.MessageStatusTypes.FAILED;
               }).map(parseMessage) : [];
               oldListTopMessageCreatedAt = oldListTopMessage.created_at;
               oldListBottomMessageCreatedAt = oldListBottomMessage.created_at;
@@ -1012,30 +1039,39 @@ var ChannelWithContext = function ChannelWithContext(props) {
                 copyChannelState();
               }
 
-              _context6.next = 35;
+              _context6.next = 36;
               return reloadThread();
 
-            case 35:
+            case 36:
               if (thread && failedThreadMessages.length) {
                 channel.state.addMessagesSorted(failedThreadMessages);
                 setThreadMessages((0, _toConsumableArray2["default"])(channel.state.threads[thread.id]));
               }
 
-              _context6.next = 42;
+              _context6.next = 43;
               break;
 
-            case 38:
-              _context6.prev = 38;
-              _context6.t0 = _context6["catch"](3);
-              setError(_context6.t0);
+            case 39:
+              _context6.prev = 39;
+              _context6.t0 = _context6["catch"](4);
+
+              if (_context6.t0 instanceof Error) {
+                setError(_context6.t0);
+              } else {
+                setError(true);
+              }
+
               setLoading(false);
 
-            case 42:
+            case 43:
+              setSyncingChannel(false);
+
+            case 44:
             case "end":
               return _context6.stop();
           }
         }
-      }, _callee6, null, [[3, 38]]);
+      }, _callee6, null, [[4, 39]]);
     }));
 
     return function resyncChannel() {
@@ -1272,20 +1308,6 @@ var ChannelWithContext = function ChannelWithContext(props) {
   };
 
   var clientChannelConfig = getChannelConfigSafely();
-  var messagesConfig = {
-    mutesEnabled: (_ref14 = mutesEnabledProp != null ? mutesEnabledProp : clientChannelConfig == null ? void 0 : clientChannelConfig.mutes) != null ? _ref14 : true,
-    quotedRepliesEnabled: quotedRepliesEnabledProp != null ? quotedRepliesEnabledProp : true,
-    reactionsEnabled: (_ref15 = reactionsEnabledProp != null ? reactionsEnabledProp : clientChannelConfig == null ? void 0 : clientChannelConfig.reactions) != null ? _ref15 : true,
-    threadRepliesEnabled: (_ref16 = threadRepliesEnabledProp != null ? threadRepliesEnabledProp : clientChannelConfig == null ? void 0 : clientChannelConfig.replies) != null ? _ref16 : true
-  };
-  var channelConfig = {
-    readEventsEnabled: (_ref17 = readEventsEnabledProp != null ? readEventsEnabledProp : clientChannelConfig == null ? void 0 : clientChannelConfig.read_events) != null ? _ref17 : true,
-    typingEventsEnabled: (_ref18 = typingEventsEnabledProp != null ? typingEventsEnabledProp : clientChannelConfig == null ? void 0 : clientChannelConfig.typing_events) != null ? _ref18 : true
-  };
-  var inputConfig = {
-    maxMessageLength: (_ref19 = maxMessageLengthProp != null ? maxMessageLengthProp : clientChannelConfig == null ? void 0 : clientChannelConfig.max_message_length) != null ? _ref19 : undefined,
-    uploadsEnabled: (_ref20 = uploadsEnabledProp != null ? uploadsEnabledProp : clientChannelConfig == null ? void 0 : clientChannelConfig.uploads) != null ? _ref20 : true
-  };
 
   var updateMessage = function updateMessage(updatedMessage) {
     var extraState = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
@@ -1317,12 +1339,12 @@ var ChannelWithContext = function ChannelWithContext(props) {
     }
   };
 
-  var createMessagePreview = function createMessagePreview(_ref21) {
-    var attachments = _ref21.attachments,
-        mentioned_users = _ref21.mentioned_users,
-        parent_id = _ref21.parent_id,
-        text = _ref21.text,
-        extraFields = (0, _objectWithoutProperties2["default"])(_ref21, _excluded);
+  var createMessagePreview = function createMessagePreview(_ref14) {
+    var attachments = _ref14.attachments,
+        mentioned_users = _ref14.mentioned_users,
+        parent_id = _ref14.parent_id,
+        text = _ref14.text,
+        extraFields = (0, _objectWithoutProperties2["default"])(_ref14, _excluded);
     var preview = (0, _extends2["default"])({
       __html: text,
       attachments: attachments,
@@ -1336,7 +1358,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
       })) || [],
       parent_id: parent_id,
       reactions: [],
-      status: 'sending',
+      status: _utils.MessageStatusTypes.SENDING,
       text: text,
       type: 'regular',
       user: (0, _extends2["default"])({
@@ -1356,7 +1378,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
   };
 
   var sendMessageRequest = function () {
-    var _ref22 = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee12(message, retrying) {
+    var _ref15 = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee12(message, retrying) {
       var __html, attachments, created_at, html, id, mentioned_users, parent_id, quoted_message, reactions, status, text, type, updated_at, user, extraFields, messageData, messageResponse;
 
       return _regenerator["default"].wrap(function _callee12$(_context12) {
@@ -1403,7 +1425,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
 
             case 14:
               if (messageResponse.message) {
-                messageResponse.message.status = 'received';
+                messageResponse.message.status = _utils.MessageStatusTypes.RECEIVED;
 
                 if (retrying) {
                   replaceMessage(message, messageResponse.message);
@@ -1419,7 +1441,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
               _context12.prev = 17;
               _context12.t0 = _context12["catch"](2);
               console.log(_context12.t0);
-              message.status = 'failed';
+              message.status = _utils.MessageStatusTypes.FAILED;
               updateMessage(message);
 
             case 22:
@@ -1431,20 +1453,20 @@ var ChannelWithContext = function ChannelWithContext(props) {
     }));
 
     return function sendMessageRequest(_x4, _x5) {
-      return _ref22.apply(this, arguments);
+      return _ref15.apply(this, arguments);
     };
   }();
 
   var sendMessage = function () {
-    var _ref23 = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee13(message) {
-      var _channel$state2;
+    var _ref16 = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee13(message) {
+      var _channel$state;
 
       var messagePreview;
       return _regenerator["default"].wrap(function _callee13$(_context13) {
         while (1) {
           switch (_context13.prev = _context13.next) {
             case 0:
-              if (channel != null && (_channel$state2 = channel.state) != null && _channel$state2.filterErrorMessages) {
+              if (channel != null && (_channel$state = channel.state) != null && _channel$state.filterErrorMessages) {
                 channel.state.filterErrorMessages();
               }
 
@@ -1477,19 +1499,19 @@ var ChannelWithContext = function ChannelWithContext(props) {
     }));
 
     return function sendMessage(_x6) {
-      return _ref23.apply(this, arguments);
+      return _ref16.apply(this, arguments);
     };
   }();
 
   var retrySendMessage = function () {
-    var _ref24 = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee14(message) {
+    var _ref17 = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee14(message) {
       var statusPendingMessage;
       return _regenerator["default"].wrap(function _callee14$(_context14) {
         while (1) {
           switch (_context14.prev = _context14.next) {
             case 0:
               statusPendingMessage = (0, _extends2["default"])({}, message, {
-                status: 'sending'
+                status: _utils.MessageStatusTypes.SENDING
               });
               updateMessage(statusPendingMessage);
               _context14.next = 4;
@@ -1504,7 +1526,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     }));
 
     return function retrySendMessage(_x7) {
-      return _ref24.apply(this, arguments);
+      return _ref17.apply(this, arguments);
     };
   }();
 
@@ -1516,7 +1538,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
   }, defaultDebounceInterval, debounceOptions)).current;
 
   var loadMore = function () {
-    var _ref25 = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee15() {
+    var _ref18 = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee15() {
       var limit,
           oldestMessage,
           oldestID,
@@ -1549,7 +1571,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
             case 6:
               oldestMessage = messages && messages[0];
 
-              if (!(oldestMessage && oldestMessage.status !== 'received')) {
+              if (!(oldestMessage && oldestMessage.status !== _utils.MessageStatusTypes.RECEIVED)) {
                 _context15.next = 9;
                 break;
               }
@@ -1586,7 +1608,13 @@ var ChannelWithContext = function ChannelWithContext(props) {
               _context15.prev = 19;
               _context15.t0 = _context15["catch"](10);
               console.warn('Message pagination request failed with error', _context15.t0);
-              setError(_context15.t0);
+
+              if (_context15.t0 instanceof Error) {
+                setError(_context15.t0);
+              } else {
+                setError(true);
+              }
+
               setLoadingMore(false);
               throw _context15.t0;
 
@@ -1599,12 +1627,12 @@ var ChannelWithContext = function ChannelWithContext(props) {
     }));
 
     return function loadMore() {
-      return _ref25.apply(this, arguments);
+      return _ref18.apply(this, arguments);
     };
   }();
 
   var loadMoreRecent = function () {
-    var _ref26 = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee16() {
+    var _ref19 = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee16() {
       var limit,
           recentMessage,
           _args16 = arguments;
@@ -1625,7 +1653,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
               setLoadingMoreRecent(true);
               recentMessage = messages[messages.length - 1];
 
-              if (!((recentMessage == null ? void 0 : recentMessage.status) !== 'received')) {
+              if (!((recentMessage == null ? void 0 : recentMessage.status) !== _utils.MessageStatusTypes.RECEIVED)) {
                 _context16.next = 8;
                 break;
               }
@@ -1655,7 +1683,13 @@ var ChannelWithContext = function ChannelWithContext(props) {
               _context16.prev = 15;
               _context16.t0 = _context16["catch"](8);
               console.warn('Message pagination request failed with error', _context16.t0);
-              setError(_context16.t0);
+
+              if (_context16.t0 instanceof Error) {
+                setError(_context16.t0);
+              } else {
+                setError(true);
+              }
+
               setLoadingMoreRecent(false);
               throw _context16.t0;
 
@@ -1668,7 +1702,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     }));
 
     return function loadMoreRecent() {
-      return _ref26.apply(this, arguments);
+      return _ref19.apply(this, arguments);
     };
   }();
 
@@ -1710,9 +1744,9 @@ var ChannelWithContext = function ChannelWithContext(props) {
   };
 
   var openThread = function openThread(message) {
-    var _channel$state3;
+    var _channel$state2;
 
-    var newThreadMessages = message != null && message.id ? (channel == null ? void 0 : (_channel$state3 = channel.state) == null ? void 0 : _channel$state3.threads[message.id]) || [] : [];
+    var newThreadMessages = message != null && message.id ? (channel == null ? void 0 : (_channel$state2 = channel.state) == null ? void 0 : _channel$state2.threads[message.id]) || [] : [];
     setThread(message);
     setThreadMessages(newThreadMessages);
   };
@@ -1728,7 +1762,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
   }, defaultDebounceInterval, debounceOptions)).current;
 
   var loadMoreThread = function () {
-    var _ref27 = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee17() {
+    var _ref20 = (0, _asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee17() {
       var _threadMessages$, parentID, oldestMessageID, limit, queryResponse, updatedHasMore, updatedThreadMessages;
 
       return _regenerator["default"].wrap(function _callee17$(_context17) {
@@ -1775,7 +1809,13 @@ var ChannelWithContext = function ChannelWithContext(props) {
               _context17.prev = 17;
               _context17.t0 = _context17["catch"](3);
               console.warn('Message pagination request failed with error', _context17.t0);
-              setError(_context17.t0);
+
+              if (_context17.t0 instanceof Error) {
+                setError(_context17.t0);
+              } else {
+                setError(true);
+              }
+
               setThreadLoadingMore(false);
               throw _context17.t0;
 
@@ -1788,23 +1828,28 @@ var ChannelWithContext = function ChannelWithContext(props) {
     }));
 
     return function loadMoreThread() {
-      return _ref27.apply(this, arguments);
+      return _ref20.apply(this, arguments);
     };
   }();
 
-  var channelContext = (0, _useCreateChannelContext.useCreateChannelContext)((0, _extends2["default"])({}, channelConfig, {
+  var ownCapabilitiesContext = (0, _useCreateOwnCapabilitiesContext.useCreateOwnCapabilitiesContext)({
+    channel: channel,
+    overrideCapabilities: overrideOwnCapabilities
+  });
+  var channelContext = (0, _useCreateChannelContext.useCreateChannelContext)({
     channel: channel,
     disabled: !!(channel != null && (_channel$data = channel.data) != null && _channel$data.frozen) && disableIfFrozenChannel,
     EmptyStateIndicator: EmptyStateIndicator,
     enableMessageGroupingByUser: enableMessageGroupingByUser,
     enforceUniqueReaction: enforceUniqueReaction,
     error: error,
-    giphyEnabled: giphyEnabled != null ? giphyEnabled : !!((_ref28 = (clientChannelConfig == null ? void 0 : clientChannelConfig.commands) || []) != null && _ref28.some(function (command) {
+    giphyEnabled: giphyEnabled != null ? giphyEnabled : !!((_ref21 = (clientChannelConfig == null ? void 0 : clientChannelConfig.commands) || []) != null && _ref21.some(function (command) {
       return command.name === 'giphy';
     })),
     hideDateSeparators: hideDateSeparators,
     hideStickyDateHeader: hideStickyDateHeader,
     isAdmin: isAdmin,
+    isChannelActive: shouldSyncChannel,
     isModerator: isModerator,
     isOwner: isOwner,
     lastRead: lastRead,
@@ -1822,10 +1867,11 @@ var ChannelWithContext = function ChannelWithContext(props) {
     setTargetedMessage: setTargetedMessage,
     StickyHeader: StickyHeader,
     targetedMessage: targetedMessage,
+    threadList: threadList,
     watcherCount: watcherCount,
     watchers: watchers
-  }));
-  var messageInputContext = (0, _useCreateInputMessageInputContext.useCreateInputMessageInputContext)((0, _extends2["default"])({}, inputConfig, {
+  });
+  var inputMessageInputContext = (0, _useCreateInputMessageInputContext.useCreateInputMessageInputContext)({
     additionalTextInputProps: additionalTextInputProps,
     AttachButton: AttachButton,
     autoCompleteSuggestionsLimit: autoCompleteSuggestionsLimit,
@@ -1835,6 +1881,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     clearQuotedMessageState: clearQuotedMessageState,
     CommandsButton: CommandsButton,
     compressImageQuality: compressImageQuality,
+    CooldownTimer: CooldownTimer,
     doDocUploadRequest: doDocUploadRequest,
     doImageUploadRequest: doImageUploadRequest,
     editing: editing,
@@ -1847,6 +1894,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     initialValue: initialValue,
     Input: Input,
     InputButtons: InputButtons,
+    maxMessageLength: (_ref22 = maxMessageLengthProp != null ? maxMessageLengthProp : clientChannelConfig == null ? void 0 : clientChannelConfig.max_message_length) != null ? _ref22 : undefined,
     maxNumberOfFiles: maxNumberOfFiles,
     mentionAllAppUsersEnabled: mentionAllAppUsersEnabled,
     mentionAllAppUsersQuery: mentionAllAppUsersQuery,
@@ -1857,11 +1905,12 @@ var ChannelWithContext = function ChannelWithContext(props) {
     SendButton: SendButton,
     sendImageAsync: sendImageAsync,
     sendMessage: sendMessage,
+    SendMessageDisallowedIndicator: SendMessageDisallowedIndicator,
     setInputRef: setInputRef,
     setQuotedMessageState: setQuotedMessageState,
     ShowThreadMessageInChannelButton: ShowThreadMessageInChannelButton,
     UploadProgressIndicator: UploadProgressIndicator
-  }));
+  });
   var messageListContext = (0, _useCreatePaginatedMessageListContext.useCreatePaginatedMessageListContext)({
     channelId: channelId,
     hasMore: hasMore,
@@ -1869,32 +1918,27 @@ var ChannelWithContext = function ChannelWithContext(props) {
     loadingMoreRecent: loadingMoreRecentProp !== undefined ? loadingMoreRecentProp : loadingMoreRecent,
     loadMore: loadMore,
     loadMoreRecent: loadMoreRecent,
-    messages: messagesProp || messages,
+    messages: messages,
     setLoadingMore: setLoadingMore,
     setLoadingMoreRecent: setLoadingMoreRecent
   });
-  var messagesContext = (0, _useCreateMessagesContext.useCreateMessagesContext)((0, _extends2["default"])({}, messagesConfig, {
+  var messagesContext = (0, _useCreateMessagesContext.useCreateMessagesContext)({
     additionalTouchableProps: additionalTouchableProps,
-    animatedLongPress: animatedLongPress,
     Attachment: Attachment,
     AttachmentActions: AttachmentActions,
-    blockUser: blockUser,
     Card: Card,
     CardCover: CardCover,
     CardFooter: CardFooter,
     CardHeader: CardHeader,
     channelId: channelId,
-    copyMessage: copyMessage,
     DateHeader: DateHeader,
-    deleteMessage: deleteMessage,
+    deletedMessagesVisibilityType: deletedMessagesVisibilityType,
     disableTypingIndicator: disableTypingIndicator,
     dismissKeyboardOnMessageTouch: dismissKeyboardOnMessageTouch,
-    editMessage: editMessageProp,
     enableMessageGroupingByUser: enableMessageGroupingByUser,
     FileAttachment: FileAttachment,
     FileAttachmentGroup: FileAttachmentGroup,
     FileAttachmentIcon: FileAttachmentIcon,
-    flagMessage: flagMessage,
     FlatList: FlatList,
     forceAlignMessages: forceAlignMessages,
     formatDate: formatDate,
@@ -1906,6 +1950,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     handleEdit: handleEdit,
     handleFlag: handleFlag,
     handleMute: handleMute,
+    handlePinMessage: handlePinMessage,
     handleQuotedReply: handleQuotedReply,
     handleReaction: handleReaction,
     handleRetry: handleRetry,
@@ -1924,40 +1969,37 @@ var ChannelWithContext = function ChannelWithContext(props) {
     MessageFooter: MessageFooter,
     MessageHeader: MessageHeader,
     MessageList: MessageList,
+    MessagePinnedHeader: MessagePinnedHeader,
     MessageReplies: MessageReplies,
     MessageRepliesAvatars: MessageRepliesAvatars,
     MessageSimple: MessageSimple,
     MessageStatus: MessageStatus,
     MessageSystem: MessageSystem,
     MessageText: MessageText,
-    muteUser: muteUser,
     myMessageTheme: myMessageTheme,
-    onDoubleTapMessage: onDoubleTapMessage,
     onLongPressMessage: onLongPressMessage,
     onPressInMessage: onPressInMessage,
     onPressMessage: onPressMessage,
     OverlayReactionList: OverlayReactionList,
-    quotedReply: quotedReply,
     ReactionList: ReactionList,
     removeMessage: removeMessage,
     Reply: Reply,
-    retry: retry,
     retrySendMessage: retrySendMessage,
     ScrollToBottomButton: ScrollToBottomButton,
     selectReaction: selectReaction,
     setEditingState: setEditingState,
     setQuotedMessageState: setQuotedMessageState,
     supportedReactions: supportedReactions,
-    threadReply: threadReply,
+    targetedMessage: targetedMessage,
     TypingIndicator: TypingIndicator,
     TypingIndicatorContainer: TypingIndicatorContainer,
     updateMessage: updateMessage,
     UrlPreview: UrlPreview
-  }));
+  });
   var suggestionsContext = {
-    closeSuggestions: closeSuggestions,
-    openSuggestions: openSuggestions,
-    updateSuggestions: updateSuggestions
+    AutoCompleteSuggestionHeader: AutoCompleteSuggestionHeader,
+    AutoCompleteSuggestionItem: AutoCompleteSuggestionItem,
+    AutoCompleteSuggestionList: AutoCompleteSuggestionList
   };
   var threadContext = (0, _useCreateThreadContext.useCreateThreadContext)({
     allowThreadMessagesInChannel: allowThreadMessagesInChannel,
@@ -1984,7 +2026,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 1812,
+        lineNumber: 1824,
         columnNumber: 12
       }
     });
@@ -1999,7 +2041,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
       __self: _this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 1817,
+        lineNumber: 1829,
         columnNumber: 7
       }
     }, t('Please select a channel first'));
@@ -2013,7 +2055,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1824,
+      lineNumber: 1836,
       columnNumber: 5
     }
   }), _react["default"].createElement(_ChannelContext.ChannelProvider, {
@@ -2021,56 +2063,64 @@ var ChannelWithContext = function ChannelWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1830,
+      lineNumber: 1842,
       columnNumber: 7
     }
+  }, _react["default"].createElement(_OwnCapabilitiesContext.OwnCapabilitiesProvider, {
+    value: ownCapabilitiesContext,
+    __self: _this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 1843,
+      columnNumber: 9
+    }
   }, _react["default"].createElement(_TypingContext.TypingProvider, {
     value: typingContext,
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1831,
-      columnNumber: 9
+      lineNumber: 1844,
+      columnNumber: 11
     }
   }, _react["default"].createElement(_PaginatedMessageListContext.PaginatedMessageListProvider, {
     value: messageListContext,
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1832,
-      columnNumber: 11
+      lineNumber: 1845,
+      columnNumber: 13
     }
   }, _react["default"].createElement(_MessagesContext.MessagesProvider, {
     value: messagesContext,
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1833,
-      columnNumber: 13
+      lineNumber: 1846,
+      columnNumber: 15
     }
   }, _react["default"].createElement(_ThreadContext.ThreadProvider, {
     value: threadContext,
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1834,
-      columnNumber: 15
+      lineNumber: 1847,
+      columnNumber: 17
     }
   }, _react["default"].createElement(_SuggestionsContext.SuggestionsProvider, {
     value: suggestionsContext,
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1835,
-      columnNumber: 17
+      lineNumber: 1848,
+      columnNumber: 19
     }
   }, _react["default"].createElement(_MessageInputContext.MessageInputProvider, {
-    value: messageInputContext,
+    value: inputMessageInputContext,
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1836,
-      columnNumber: 19
+      lineNumber: 1849,
+      columnNumber: 21
     }
   }, _react["default"].createElement(_reactNative.View, {
     style: {
@@ -2079,27 +2129,62 @@ var ChannelWithContext = function ChannelWithContext(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1837,
-      columnNumber: 21
+      lineNumber: 1852,
+      columnNumber: 23
     }
-  }, children)))))))));
+  }, children))))))))));
 };
 
 var Channel = function Channel(props) {
+  var _props$thread, _props$thread2;
+
   var _useChatContext = (0, _ChatContext.useChatContext)(),
       client = _useChatContext.client;
 
   var _useTranslationContex = (0, _TranslationContext.useTranslationContext)(),
       t = _useTranslationContex.t;
 
+  var shouldSyncChannel = (_props$thread = props.thread) != null && _props$thread.id ? !!props.threadList : true;
+
+  var _useChannelState = (0, _useChannelState2.useChannelState)(props.channel, props.threadList ? (_props$thread2 = props.thread) == null ? void 0 : _props$thread2.id : undefined),
+      members = _useChannelState.members,
+      messages = _useChannelState.messages,
+      read = _useChannelState.read,
+      setMembers = _useChannelState.setMembers,
+      setMessages = _useChannelState.setMessages,
+      setRead = _useChannelState.setRead,
+      setThreadMessages = _useChannelState.setThreadMessages,
+      setTyping = _useChannelState.setTyping,
+      setWatcherCount = _useChannelState.setWatcherCount,
+      setWatchers = _useChannelState.setWatchers,
+      threadMessages = _useChannelState.threadMessages,
+      typing = _useChannelState.typing,
+      watcherCount = _useChannelState.watcherCount,
+      watchers = _useChannelState.watchers;
+
   return _react["default"].createElement(ChannelWithContext, (0, _extends2["default"])({
     client: client,
     t: t
   }, props, {
+    shouldSyncChannel: shouldSyncChannel,
+    members: members,
+    messages: props.messages || messages,
+    read: read,
+    setMembers: setMembers,
+    setMessages: setMessages,
+    setRead: setRead,
+    setThreadMessages: setThreadMessages,
+    setTyping: setTyping,
+    setWatcherCount: setWatcherCount,
+    setWatchers: setWatchers,
+    threadMessages: threadMessages,
+    typing: typing,
+    watcherCount: watcherCount,
+    watchers: watchers,
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 1882,
+      lineNumber: 1921,
       columnNumber: 5
     }
   }));