Merge branch 'master' into 3.4.6-changelog

Author: vishalnarkhede

docs/build/bundle.7737a136.js renamed to docs/build/bundle.571d5957.js

@@ -1,6 +1,6 @@
 /*! exports provided: 0, 128, 130, 131, 132, 133, 134, 135, 136, 137, 138, 139, 140, 142, 145, 146, 147, 148, 149, 150, 151, 152, 153, 154, 155, 156, 158, 159, default */
 
-/*! exports provided: 1 reply, Attach files, Cancel, Channel Missing, Close, Connection failure, reconnecting now..., Delete, Delivered, Edit Message, Empty message..., Error adding flag: Either the flag already exist or there is issue with network connection ..., Error connecting to chat, refresh the page to try again., Error muting a user ..., Error unmuting a user ..., Error · Unsent, Error: {{ errorMessage }}, Flag, Message Failed · Click to try again, Message deleted, Message failed. Click to try again., Message has been successfully flagged, Mute, New, New Messages!, Nothing yet..., Only visible to you, Open emoji picker, Pick your emoji, Send, Sending..., Start of a new thread, This message was deleted..., Thread, Type your message, Unmute, You have no channels currently, You've reached the maximum number of files, live, this content could not be displayed, {{ commaSeparatedUsers }} and {{ lastUser }} are typing..., {{ commaSeparatedUsers }} and {{ moreCount }} more, {{ commaSeparatedUsers }}, and {{ lastUser }}, {{ firstUser }} and {{ secondUser }}, {{ firstUser }} and {{ secondUser }} are typing..., {{ imageCount }} more, {{ memberCount }} members, {{ replyCount }} replies, {{ user }} has been muted, {{ user }} has been unmuted, {{ user }} is typing..., {{ watcherCount }} online, 🏙 Attachment..., default */
+/*! exports provided: 1 reply, Attach files, Cancel, Channel Missing, Close, Commands matching, Connection failure, reconnecting now..., Delete, Delivered, Edit Message, Emoji matching, Empty message..., Error adding flag: Either the flag already exist or there is issue with network connection ..., Error connecting to chat, refresh the page to try again., Error muting a user ..., Error unmuting a user ..., Error · Unsent, Error: {{ errorMessage }}, Flag, Message Failed · Click to try again, Message deleted, Message failed. Click to try again., Message has been successfully flagged, Mute, New, New Messages!, Nothing yet..., Only visible to you, Open emoji picker, Pick your emoji, Searching for people, Send, Sending..., Start of a new thread, This message was deleted..., Thread, Type your message, Unmute, You have no channels currently, You've reached the maximum number of files, live, this content could not be displayed, {{ commaSeparatedUsers }} and {{ lastUser }} are typing..., {{ commaSeparatedUsers }} and {{ moreCount }} more, {{ commaSeparatedUsers }}, and {{ lastUser }}, {{ firstUser }} and {{ secondUser }}, {{ firstUser }} and {{ secondUser }} are typing..., {{ imageCount }} more, {{ memberCount }} members, {{ replyCount }} replies, {{ user }} has been muted, {{ user }} has been unmuted, {{ user }} is typing..., {{ watcherCount }} online, 🏙 Attachment..., default */
 
 /*! exports provided: ACORN_OPTIONS, default */
 
@@ -16,11 +16,11 @@
 
 /*! exports provided: Attachment, Card, Audio, AttachmentActions, FileAttachment */
 
-/*! exports provided: Attachment, Card, Audio, AttachmentActions, FileAttachment, AutoCompleteTextarea, KEY_CODES, Item, List, defaultScrollToItem, listener, Avatar, ChannelPreview, ChannelPreviewCompact, ChannelPreviewCountOnly, ChannelPreviewLastMessage, ChannelPreviewMessenger, Channel, useChannelEditMessageHandler, useChannelMentionsHandler, ChannelHeader, ChannelList, ChannelListMessenger, ChannelListTeam, ChannelSearch, Chat, ChatAutoComplete, ChatDown, CommandItem, DateSeparator, EmoticonItem, EmptyStateIndicator, EventComponent, Gallery, ImageComponent, ModalImage, ModalWrapper, InfiniteScroll, InfiniteScrollPaginator, ReverseInfiniteScroll, LoadingChannels, LoadingErrorIndicator, LoadingIndicator, LoadMoreButton, LoadMorePaginator, Message, MessageCommerce, MessageLivestream, MessageSimple, MessageTeam, MessageRepliesCountButton, MessageOptions, MessageText, MessageDeleted, FixedHeightMessage, handleActionWarning, useActionHandler, useDeleteHandler, useEditHandler, missingUseFlagHandlerParameterWarning, useFlagHandler, useMentionsHandler, useMentionsUIHandler, missingUseMuteHandlerParamsWarning, useMuteHandler, useOpenThreadHandler, reactionHandlerWarning, useReactionHandler, useReactionClick, useRetryHandler, useUserHandler, useUserRole, validateAndGetMessage, isUserMuted, MESSAGE_ACTIONS, getMessageActions, areMessagePropsEqual, shouldMessageComponentUpdate, messageHasReactions, messageHasAttachments, getImages, getNonImageAttachments, getReadByTooltipText, MessagePropTypes, MessageActionsBox, MessageActions, MessageInput, MessageInputFlat, MessageInputLarge, MessageInputSmall, MessageInputSimple, EditMessageForm, EmojiPicker, SendButton, UploadsPreview, useMessageInput, MessageList, VirtualizedMessageList, MessageNotification, ConnectionStatus, Modal, ReactionSelector, ReactionsList, SimpleReactionsList, SafeAnchor, Thread, Tooltip, TypingIndicator, UserItem, Window */
+/*! exports provided: Attachment, Card, Audio, AttachmentActions, FileAttachment, AutoCompleteTextarea, Item, List, listener, KEY_CODES, defaultScrollToItem, Avatar, ChannelPreview, ChannelPreviewCompact, ChannelPreviewCountOnly, ChannelPreviewLastMessage, ChannelPreviewMessenger, Channel, useChannelEditMessageHandler, useChannelMentionsHandler, ChannelHeader, ChannelList, ChannelListMessenger, ChannelListTeam, ChannelSearch, Chat, ChatAutoComplete, ChatDown, CommandItem, DateSeparator, EmoticonItem, EmptyStateIndicator, EventComponent, Gallery, ImageComponent, ModalImage, ModalWrapper, InfiniteScroll, InfiniteScrollPaginator, ReverseInfiniteScroll, LoadingChannels, LoadingErrorIndicator, LoadingIndicator, LoadMoreButton, LoadMorePaginator, Message, MessageCommerce, MessageLivestream, MessageSimple, MessageTeam, MessageRepliesCountButton, MessageOptions, MessageText, MessageDeleted, FixedHeightMessage, handleActionWarning, useActionHandler, useDeleteHandler, useEditHandler, missingUseFlagHandlerParameterWarning, useFlagHandler, useMentionsHandler, useMentionsUIHandler, missingUseMuteHandlerParamsWarning, useMuteHandler, useOpenThreadHandler, reactionHandlerWarning, useReactionHandler, useReactionClick, useRetryHandler, useUserHandler, useUserRole, validateAndGetMessage, isUserMuted, MESSAGE_ACTIONS, getMessageActions, areMessagePropsEqual, shouldMessageComponentUpdate, messageHasReactions, messageHasAttachments, getImages, getNonImageAttachments, getReadByTooltipText, MessagePropTypes, MessageActionsBox, MessageActions, MessageInput, MessageInputFlat, MessageInputLarge, MessageInputSmall, MessageInputSimple, EditMessageForm, EmojiPicker, SendButton, UploadsPreview, useMessageInput, MessageList, VirtualizedMessageList, MessageNotification, ConnectionStatus, Modal, ReactionSelector, ReactionsList, SimpleReactionsList, SafeAnchor, Thread, Tooltip, TypingIndicator, UserItem, Window */
 
 /*! exports provided: AttachmentIcon, FileIcon, FilePreviewer, FileUploadButton, IconButton, ImageDropzone, ImagePreviewer, ImageUploadButton, LoadingIndicator, PictureIcon, Thumbnail, ThumbnailPlaceholder, dataTransferItemsHaveFiles, dataTransferItemsToFiles */
 
-/*! exports provided: AutoCompleteTextarea, KEY_CODES, Item, List, defaultScrollToItem, listener */
+/*! exports provided: AutoCompleteTextarea, Item, List, listener, KEY_CODES, defaultScrollToItem */
 
 /*! exports provided: AutoFocusInside, MoveFocusInside, FreeFocusInside, InFocusGuard, FocusLockUI, useFocusInside, default */
 
@@ -64,6 +64,8 @@
 
 /*! exports provided: ComponentsListRenderer, default */
 
+/*! exports provided: DEFAULT_CARET_POSITION, defaultScrollToItem, errorMessage, triggerPropsCheck */
+
 /*! exports provided: DNS, URL, default */
 
 /*! exports provided: DateSeparator */
@@ -124,14 +126,10 @@
 
 /*! exports provided: InteractivityDisabler */
 
-/*! exports provided: Item, default */
-
 /*! exports provided: KEY_CODES, default */
 
 /*! exports provided: LinkRenderer, default */
 
-/*! exports provided: List, default */
-
 /*! exports provided: ListRenderer, default */
 
 /*! exports provided: LoadMoreButton, LoadMorePaginator */
@@ -244,7 +242,7 @@
 
 /*! exports provided: channelReducer, initialState */
 
-/*! exports provided: client, channel, channelContext, translationContext, channels, message, thread, threadMessages, messages, users, MessageMock */
+/*! exports provided: client, channel, thread, threadMessages, channelContext, translationContext, channels, message, messages, users, MessageMock */
 
 /*! exports provided: columns, default */
 
@@ -286,8 +284,6 @@
 
 /*! exports provided: default, useStyleGuideContext */
 
-/*! exports provided: defaultScrollToItem */
-
 /*! exports provided: defaultTimestampFormat, notValidDateWarning, noParsingFunctionWarning, default */
 
 /*! exports provided: deferAction, inlineProp */
@@ -510,7 +506,7 @@
 
 /*! exports provided: useUserRole */
 
-/*! exports provided: v1, v3, v4, v5, NIL, version, validate, stringify, parse */
+/*! exports provided: v1, v3, v4, v5 */
 
 /*! exports provided: validateAndGetMessage, isUserMuted, MESSAGE_ACTIONS, getMessageActions, areMessagePropsEqual, shouldMessageComponentUpdate, messageHasReactions, messageHasAttachments, getImages, getNonImageAttachments, getReadByTooltipText, MessagePropTypes */
 
@@ -2352,10 +2348,6 @@
   !*** ./node_modules/uuid/dist/esm-browser/md5.js ***!
   \***************************************************/
 
-/*!***************************************************!*\
-  !*** ./node_modules/uuid/dist/esm-browser/nil.js ***!
-  \***************************************************/
-
 /*!***************************************************!*\
   !*** ./node_modules/uuid/dist/esm-browser/rng.js ***!
   \***************************************************/
@@ -2676,14 +2668,6 @@
   !*** ./node_modules/uuid/dist/esm-browser/index.js ***!
   \*****************************************************/
 
-/*!*****************************************************!*\
-  !*** ./node_modules/uuid/dist/esm-browser/parse.js ***!
-  \*****************************************************/
-
-/*!*****************************************************!*\
-  !*** ./node_modules/uuid/dist/esm-browser/regex.js ***!
-  \*****************************************************/
-
 /*!*****************************************************!*\
   !*** ./src/components/Attachment/FileAttachment.js ***!
   \*****************************************************/
@@ -2980,10 +2964,6 @@
   !*** ./node_modules/use-sidecar/dist/es2015/index.js ***!
   \*******************************************************/
 
-/*!*******************************************************!*\
-  !*** ./node_modules/uuid/dist/esm-browser/version.js ***!
-  \*******************************************************/
-
 /*!*******************************************************!*\
   !*** ./src/assets/Poweredby_100px-White_VertText.png ***!
   \*******************************************************/
@@ -3160,10 +3140,6 @@
   !*** ./node_modules/use-sidecar/dist/es2015/medium.js ***!
   \********************************************************/
 
-/*!********************************************************!*\
-  !*** ./node_modules/uuid/dist/esm-browser/validate.js ***!
-  \********************************************************/
-
 /*!********************************************************!*\
   !*** ./src/components/Attachment/AttachmentActions.js ***!
   \********************************************************/
@@ -3352,10 +3328,6 @@
   !*** ./node_modules/use-sidecar/dist/es2015/exports.js ***!
   \*********************************************************/
 
-/*!*********************************************************!*\
-  !*** ./node_modules/uuid/dist/esm-browser/stringify.js ***!
-  \*********************************************************/
-
 /*!*********************************************************!*\
   !*** ./src/components/AutoCompleteTextarea/Textarea.js ***!
   \*********************************************************/
@@ -3692,6 +3664,10 @@
   !*** ./node_modules/react-view-pager/lib/PagerElement.js ***!
   \***********************************************************/
 
+/*!***********************************************************!*\
+  !*** ./node_modules/uuid/dist/esm-browser/bytesToUuid.js ***!
+  \***********************************************************/
+
 /*!***********************************************************!*\
   !*** ./src/components/MessageInput/MessageInputSimple.js ***!
   \***********************************************************/

docs/build/bundle.7737a136.js.LICENSE.txt renamed to docs/build/bundle.571d5957.js.LICENSE.txt

@@ -9,6 +9,6 @@
   </head>
   <body>
     <div id="rsg-root"></div>
-    <script src="build/bundle.7737a136.js"></script>
+    <script src="build/bundle.571d5957.js"></script>
   </body>
 </html>

docs/index.html

@@ -1,6 +1,6 @@
 {
   "name": "stream-chat-react",
-  "version": "3.4.5",
+  "version": "3.4.6",
   "description": "React components to create chat conversations or livestream style chat",
   "author": "GetStream",
   "homepage": "https://getstream.io/chat/",

package.json

@@ -121,7 +121,11 @@ const ChannelList = (props) => {
   useMobileNavigation(channelListRef, navOpen, closeMobileNav);
 
   // All the event listeners
-  useMessageNewListener(setChannels, props.lockChannelOrder);
+  useMessageNewListener(
+    setChannels,
+    props.lockChannelOrder,
+    props.allowNewMessagesFromUnfilteredChannels,
+  );
   useNotificationMessageNewListener(setChannels, props.onMessageNew);
   useNotificationAddedToChannelListener(setChannels, props.onAddedToChannel);
   useNotificationRemovedFromChannelListener(
@@ -381,6 +385,18 @@ ChannelList.propTypes = {
    * If true, channels won't be dynamically sorted by most recent message.
    */
   lockChannelOrder: PropTypes.bool,
+  /**
+   * When client receives an event `message.new`, we push that channel to top of the list.
+   *
+   * But If the channel doesn't exist in the list, then we get the channel from client
+   * (client maintains list of watched channels as `client.activeChannels`) and push
+   * that channel to top of the list by default. You can disallow this behavior by setting following
+   * prop to false. This is quite usefull where you have multiple tab structure and you don't want
+   * ChannelList in Tab1 to react to new message on some channel in Tab2.
+   *
+   * Default value is true.
+   */
+  allowNewMessagesFromUnfilteredChannels: PropTypes.bool,
 };
 
 export default React.memo(ChannelList);

src/components/ChannelList/ChannelList.js

@@ -14,6 +14,7 @@ import { moveChannelUp } from '../utils';
 export const useMessageNewListener = (
   setChannels,
   lockChannelOrder = false,
+  allowNewMessagesFromUnfilteredChannels = true,
 ) => {
   const { client } = useContext(ChatContext);
   useEffect(() => {
@@ -22,7 +23,7 @@ export const useMessageNewListener = (
       setChannels((channels) => {
         const channelInList =
           channels.filter((c) => c.cid === e.cid).length > 0;
-        if (!channelInList) {
+        if (!channelInList && allowNewMessagesFromUnfilteredChannels) {
           // @ts-ignore
           const channel = client.channel(e.channel_type, e.channel_id);
           return uniqBy([channel, ...channels], 'cid');

src/components/ChannelList/hooks/useMessageNewListener.js

@@ -275,6 +275,18 @@ export interface ChannelListProps {
   List?: React.ElementType<ChannelListUIComponentProps>;
   Paginator?: React.ElementType<PaginatorProps>;
   lockChannelOrder?: boolean;
+  /**
+   * When client receives an event `message.new`, we push that channel to top of the list.
+   *
+   * But If the channel doesn't exist in the list, then we get the channel from client
+   * (client maintains list of watched channels as `client.activeChannels`) and push
+   * that channel to top of the list by default. You can disallow this behavior by setting following
+   * prop to false. This is quite usefull where you have multiple tab structure and you don't want
+   * ChannelList in Tab1 to react to new message on some channel in Tab2.
+   *
+   * Default value is true.
+   */
+  allowNewMessagesFromUnfilteredChannels?: boolean;
   onMessageNew?(
     thisArg: React.Dispatch<React.SetStateAction<Client.Channel[]>>,
     e: Client.Event,