stream-chat-react 12.1.0 → 12.2.0

package/dist/components/ChannelList/ChannelList.js

@@ -66,7 +66,9 @@ const UnMemoizedChannelList = (props) => {
      * For some events, inner properties on the channel will update but the shallow comparison will not
      * force a re-render. Incrementing this dummy variable ensures the channel previews update.
      */
-    const forceUpdate = () => setChannelUpdateCount((count) => count + 1);
+    const forceUpdate = useCallback(() => setChannelUpdateCount((count) => count + 1), [
+        setChannelUpdateCount,
+    ]);
     const onSearch = useCallback((event) => {
         if (!event.target.value) {
             setSearchActive(false);

package/dist/components/ChannelList/hooks/useChannelDeletedListener.js

@@ -12,7 +12,7 @@ export const useChannelDeletedListener = (setChannels, customHandler) => {
                     const channelIndex = channels.findIndex((channel) => channel.cid === event.cid);
                     if (channelIndex < 0)
                         return [...channels];
-                    // Remove the deleted channel from the list.s
+                    // Remove the deleted channel from the list
                     channels.splice(channelIndex, 1);
                     return [...channels];
                 });
@@ -22,6 +22,5 @@ export const useChannelDeletedListener = (setChannels, customHandler) => {
         return () => {
             client.off('channel.deleted', handleEvent);
         };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [customHandler]);
+    }, [client, customHandler, setChannels]);
 };

package/dist/components/ChannelList/hooks/useChannelHiddenListener.js

@@ -22,6 +22,5 @@ export const useChannelHiddenListener = (setChannels, customHandler) => {
         return () => {
             client.off('channel.hidden', handleEvent);
         };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [customHandler]);
+    }, [client, customHandler, setChannels]);
 };

package/dist/components/ChannelList/hooks/useChannelTruncatedListener.js

@@ -16,6 +16,5 @@ export const useChannelTruncatedListener = (setChannels, customHandler, forceUpd
         return () => {
             client.off('channel.truncated', handleEvent);
         };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [customHandler]);
+    }, [client, customHandler, forceUpdate, setChannels]);
 };

package/dist/components/ChannelList/hooks/useChannelUpdatedListener.js

@@ -28,6 +28,5 @@ export const useChannelUpdatedListener = (setChannels, customHandler, forceUpdat
         return () => {
             client.off('channel.updated', handleEvent);
         };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [customHandler]);
+    }, [client, customHandler, forceUpdate, setChannels]);
 };

package/dist/components/ChannelList/hooks/useChannelVisibleListener.js

@@ -22,6 +22,5 @@ export const useChannelVisibleListener = (setChannels, customHandler) => {
         return () => {
             client.off('channel.visible', handleEvent);
         };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [customHandler]);
+    }, [client, customHandler, setChannels]);
 };

package/dist/components/ChannelList/hooks/useConnectionRecoveredListener.js

@@ -12,6 +12,5 @@ export const useConnectionRecoveredListener = (forceUpdate) => {
         return () => {
             client.off('connection.recovered', handleEvent);
         };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
+    }, [client, forceUpdate]);
 };

package/dist/components/ChannelList/hooks/useMessageNewListener.js

@@ -26,6 +26,11 @@ export const useMessageNewListener = (setChannels, customHandler, lockChannelOrd
         return () => {
             client.off('message.new', handleEvent);
         };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [lockChannelOrder]);
+    }, [
+        allowNewMessagesFromUnfilteredChannels,
+        client,
+        customHandler,
+        lockChannelOrder,
+        setChannels,
+    ]);
 };

package/dist/components/ChannelList/hooks/useNotificationAddedToChannelListener.js

@@ -29,6 +29,5 @@ export const useNotificationAddedToChannelListener = (setChannels, customHandler
         return () => {
             client.off('notification.added_to_channel', handleEvent);
         };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [customHandler]);
+    }, [allowNewMessagesFromUnfilteredChannels, client, customHandler, setChannels]);
 };

package/dist/components/ChannelList/hooks/useNotificationMessageNewListener.js

@@ -22,6 +22,5 @@ export const useNotificationMessageNewListener = (setChannels, customHandler, al
         return () => {
             client.off('notification.message_new', handleEvent);
         };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [customHandler]);
+    }, [allowNewMessagesFromUnfilteredChannels, client, customHandler, setChannels]);
 };

package/dist/components/ChannelList/hooks/useNotificationRemovedFromChannelListener.js

@@ -15,6 +15,5 @@ export const useNotificationRemovedFromChannelListener = (setChannels, customHan
         return () => {
             client.off('notification.removed_from_channel', handleEvent);
         };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [customHandler]);
+    }, [client, customHandler, setChannels]);
 };

package/dist/components/ChannelList/hooks/useUserPresenceChangedListener.js

@@ -20,6 +20,5 @@ export const useUserPresenceChangedListener = (setChannels) => {
         return () => {
             client.off('user.presence.changed', handleEvent);
         };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
+    }, [client, setChannels]);
 };

package/dist/components/MessageList/VirtualizedMessageList.d.ts

@@ -8,7 +8,8 @@ import { ChatContextValue } from '../../context/ChatContext';
 import { ComponentContextValue } from '../../context/ComponentContext';
 import type { UserResponse } from 'stream-chat';
 import type { DefaultStreamChatGenerics, UnknownType } from '../../types/types';
-type VirtualizedMessageListPropsForContext = 'additionalMessageInputProps' | 'closeReactionSelectorOnClick' | 'customMessageActions' | 'customMessageRenderer' | 'formatDate' | 'head' | 'loadingMore' | 'Message' | 'messageActions' | 'shouldGroupByUser' | 'reactionDetailsSort' | 'sortReactions' | 'sortReactionDetails' | 'threadList';
+type PropsDrilledToMessage = 'additionalMessageInputProps' | 'customMessageActions' | 'formatDate' | 'messageActions' | 'openThread' | 'reactionDetailsSort' | 'sortReactions' | 'sortReactionDetails';
+type VirtualizedMessageListPropsForContext = PropsDrilledToMessage | 'closeReactionSelectorOnClick' | 'customMessageRenderer' | 'head' | 'loadingMore' | 'Message' | 'shouldGroupByUser' | 'threadList';
 /**
  * Context object provided to some Virtuoso props that are functions (components rendered by Virtuoso and other functions)
  */
@@ -36,7 +37,6 @@ export type VirtuosoContext<StreamChatGenerics extends DefaultStreamChatGenerics
     /** The number of unread messages in the current channel. */
     unreadMessageCount?: number;
 };
-type PropsDrilledToMessage = 'additionalMessageInputProps' | 'customMessageActions' | 'formatDate' | 'messageActions' | 'reactionDetailsSort' | 'sortReactions' | 'sortReactionDetails';
 export type VirtualizedMessageListProps<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = Partial<Pick<MessageProps<StreamChatGenerics>, PropsDrilledToMessage>> & {
     /** Additional props to be passed the underlying [`react-virtuoso` virtualized list dependency](https://virtuoso.dev/virtuoso-api-reference/) */
     additionalVirtuosoProps?: VirtuosoProps<UnknownType, VirtuosoContext<StreamChatGenerics>>;

package/dist/components/MessageList/VirtualizedMessageList.js

@@ -50,7 +50,7 @@ function calculateInitialTopMostItemIndex(messages, highlightedMessageId) {
     return messages.length - 1;
 }
 const VirtualizedMessageListWithContext = (props) => {
-    const { additionalMessageInputProps, additionalVirtuosoProps = {}, channel, channelUnreadUiState, closeReactionSelectorOnClick, customMessageActions, customMessageRenderer, defaultItemHeight, disableDateSeparator = true, formatDate, groupStyles, hasMoreNewer, head, hideDeletedMessages = false, hideNewMessageSeparator = false, highlightedMessageId, jumpToLatestMessage, loadingMore, loadMore, loadMoreNewer, maxTimeBetweenGroupedMessages, Message: MessageUIComponentFromProps, messageActions, messageLimit = DEFAULT_NEXT_CHANNEL_PAGE_SIZE, messages, notifications, 
+    const { additionalMessageInputProps, additionalVirtuosoProps = {}, channel, channelUnreadUiState, closeReactionSelectorOnClick, customMessageActions, customMessageRenderer, defaultItemHeight, disableDateSeparator = true, formatDate, groupStyles, hasMoreNewer, head, hideDeletedMessages = false, hideNewMessageSeparator = false, highlightedMessageId, jumpToLatestMessage, loadingMore, loadMore, loadMoreNewer, maxTimeBetweenGroupedMessages, Message: MessageUIComponentFromProps, messageActions, messageLimit = DEFAULT_NEXT_CHANNEL_PAGE_SIZE, messages, notifications, openThread, 
     // TODO: refactor to scrollSeekPlaceHolderConfiguration and components.ScrollSeekPlaceholder, like the Virtuoso Component
     overscan = 0, read, returnAllReadData = false, reviewProcessedMessage, scrollSeekPlaceHolder, scrollToLatestMessageOnFocus = false, separateGiphyPreview = false, shouldGroupByUser = false, showUnreadNotificationAlways, reactionDetailsSort, sortReactionDetails, sortReactions, stickToBottomScrollBehavior = 'smooth', suppressAutoscroll, threadList, } = props;
     const { components: virtuosoComponentsFromProps, ...overridingVirtuosoProps } = additionalVirtuosoProps;
@@ -218,6 +218,7 @@ const VirtualizedMessageListWithContext = (props) => {
                             messageGroupStyles,
                             MessageSystem,
                             numItemsPrepended,
+                            openThread,
                             ownMessagesReadByOthers,
                             processedMessages,
                             reactionDetailsSort,

package/dist/components/MessageList/VirtualizedMessageListComponents.js

@@ -47,7 +47,7 @@ export const EmptyPlaceholder = ({ context, }) => {
     return (React.createElement(React.Fragment, null, EmptyStateIndicator && (React.createElement(EmptyStateIndicator, { listType: context?.threadList ? 'thread' : 'message' }))));
 };
 export const messageRenderer = (virtuosoIndex, _data, virtuosoContext) => {
-    const { additionalMessageInputProps, closeReactionSelectorOnClick, customMessageActions, customMessageRenderer, DateSeparator, firstUnreadMessageId, formatDate, lastReadDate, lastReadMessageId, lastReceivedMessageId, Message: MessageUIComponent, messageActions, messageGroupStyles, MessageSystem, numItemsPrepended, ownMessagesReadByOthers, processedMessages: messageList, reactionDetailsSort, shouldGroupByUser, sortReactionDetails, sortReactions, threadList, unreadMessageCount = 0, UnreadMessagesSeparator, virtuosoRef, } = virtuosoContext;
+    const { additionalMessageInputProps, closeReactionSelectorOnClick, customMessageActions, customMessageRenderer, DateSeparator, firstUnreadMessageId, formatDate, lastReadDate, lastReadMessageId, lastReceivedMessageId, Message: MessageUIComponent, messageActions, messageGroupStyles, MessageSystem, numItemsPrepended, openThread, ownMessagesReadByOthers, processedMessages: messageList, reactionDetailsSort, shouldGroupByUser, sortReactionDetails, sortReactions, threadList, unreadMessageCount = 0, UnreadMessagesSeparator, virtuosoRef, } = virtuosoContext;
     const streamMessageIndex = calculateItemIndex(virtuosoIndex, numItemsPrepended);
     if (customMessageRenderer) {
         return customMessageRenderer(messageList, streamMessageIndex);
@@ -89,7 +89,7 @@ export const messageRenderer = (virtuosoIndex, _data, virtuosoContext) => {
     return (React.createElement(React.Fragment, null,
         showUnreadSeparatorAbove && (React.createElement("div", { className: 'str-chat__unread-messages-separator-wrapper' },
             React.createElement(UnreadMessagesSeparator, { unreadCount: unreadMessageCount }))),
-        React.createElement(Message, { additionalMessageInputProps: additionalMessageInputProps, autoscrollToBottom: virtuosoRef.current?.autoscrollToBottom, closeReactionSelectorOnClick: closeReactionSelectorOnClick, customMessageActions: customMessageActions, endOfGroup: endOfGroup, firstOfGroup: firstOfGroup, formatDate: formatDate, groupedByUser: groupedByUser, groupStyles: [messageGroupStyles[message.id] ?? ''], lastReceivedId: lastReceivedMessageId, message: message, Message: MessageUIComponent, messageActions: messageActions, reactionDetailsSort: reactionDetailsSort, readBy: ownMessagesReadByOthers[message.id] || [], sortReactionDetails: sortReactionDetails, sortReactions: sortReactions, threadList: threadList }),
+        React.createElement(Message, { additionalMessageInputProps: additionalMessageInputProps, autoscrollToBottom: virtuosoRef.current?.autoscrollToBottom, closeReactionSelectorOnClick: closeReactionSelectorOnClick, customMessageActions: customMessageActions, endOfGroup: endOfGroup, firstOfGroup: firstOfGroup, formatDate: formatDate, groupedByUser: groupedByUser, groupStyles: [messageGroupStyles[message.id] ?? ''], lastReceivedId: lastReceivedMessageId, message: message, Message: MessageUIComponent, messageActions: messageActions, openThread: openThread, reactionDetailsSort: reactionDetailsSort, readBy: ownMessagesReadByOthers[message.id] || [], sortReactionDetails: sortReactionDetails, sortReactions: sortReactions, threadList: threadList }),
         showUnreadSeparatorBelow && (React.createElement("div", { className: 'str-chat__unread-messages-separator-wrapper' },
             React.createElement(UnreadMessagesSeparator, { unreadCount: unreadMessageCount })))));
 };

package/dist/components/MessageList/hooks/VirtualizedMessageList/useScrollToBottomOnNewMessage.d.ts

@@ -1,7 +1,6 @@
 import { StreamMessage } from '../../../../context';
 import { DefaultStreamChatGenerics } from '../../../../types/types';
 type UseScrollToBottomOnNewMessageParams<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = {
-    /** */
     scrollToBottom: () => void;
     messages?: StreamMessage<StreamChatGenerics>[];
     /** When `true`, the list will scroll to the latest message when the window regains focus */

package/dist/components/MessageList/hooks/VirtualizedMessageList/useScrollToBottomOnNewMessage.js

@@ -1,28 +1,32 @@
-import React, { useCallback, useEffect } from 'react';
+import { useEffect, useRef, useState } from 'react';
 export const useScrollToBottomOnNewMessage = ({ messages, scrollToBottom, scrollToLatestMessageOnFocus, }) => {
-    const [newMessagesReceivedInBackground, setNewMessagesReceivedInBackground] = React.useState(false);
-    const resetNewMessagesReceivedInBackground = useCallback(() => {
-        setNewMessagesReceivedInBackground(false);
-    }, []);
-    useEffect(() => {
-        setNewMessagesReceivedInBackground(true);
-    }, [messages]);
-    const scrollToBottomIfConfigured = useCallback((event) => {
+    const [newMessagesReceivedInBackground, setNewMessagesReceivedInBackground] = useState(false);
+    const scrollToBottomIfConfigured = useRef();
+    scrollToBottomIfConfigured.current = (event) => {
         if (!scrollToLatestMessageOnFocus ||
             !newMessagesReceivedInBackground ||
-            event.target !== window)
+            event.target !== window) {
             return;
+        }
         setTimeout(scrollToBottom, 100);
-    }, [scrollToLatestMessageOnFocus, scrollToBottom, newMessagesReceivedInBackground]);
+    };
     useEffect(() => {
+        setNewMessagesReceivedInBackground(true);
+    }, [messages]);
+    useEffect(() => {
+        const handleFocus = (event) => {
+            scrollToBottomIfConfigured.current?.(event);
+        };
+        const handleBlur = () => {
+            setNewMessagesReceivedInBackground(false);
+        };
         if (typeof window !== 'undefined') {
-            window.addEventListener('focus', scrollToBottomIfConfigured);
-            window.addEventListener('blur', resetNewMessagesReceivedInBackground);
+            window.addEventListener('focus', handleFocus);
+            window.addEventListener('blur', handleBlur);
         }
         return () => {
-            window.removeEventListener('focus', scrollToBottomIfConfigured);
-            window.removeEventListener('blur', resetNewMessagesReceivedInBackground);
+            window.removeEventListener('focus', handleFocus);
+            window.removeEventListener('blur', handleBlur);
         };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [scrollToBottomIfConfigured]);
+    }, []);
 };

package/dist/index.browser.cjs

@@ -8278,7 +8278,7 @@ var require_disallow_node = __commonJS({
 var require_ast_to_react = __commonJS({
   "node_modules/mml-react/node_modules/react-markdown/lib/ast-to-react.js"(exports, module2) {
     "use strict";
-    var React172 = require("react");
+    var React171 = require("react");
     var xtend = require_immutable();
     var ReactIs2 = require("react-is");
     function astToReact(node2, options) {
@@ -8305,7 +8305,7 @@ var require_ast_to_react = __commonJS({
         throw new Error("Renderer for type `".concat(node2.type, "` not defined or is not renderable"));
       }
       var nodeProps = getNodeProps(node2, key, options, renderer, parent, index3);
-      return React172.createElement(renderer, nodeProps, nodeProps.children || resolveChildren() || void 0);
+      return React171.createElement(renderer, nodeProps, nodeProps.children || resolveChildren() || void 0);
       function resolveChildren() {
         return node2.children && node2.children.map(function(childNode, i) {
           return astToReact(childNode, options, {
@@ -8319,7 +8319,7 @@ var require_ast_to_react = __commonJS({
       var props = {
         key
       };
-      var isSimpleRenderer = typeof renderer === "string" || renderer === React172.Fragment;
+      var isSimpleRenderer = typeof renderer === "string" || renderer === React171.Fragment;
       if (opts.sourcePos && node2.position) {
         props["data-sourcepos"] = flattenPosition2(node2.position);
       }
@@ -8472,14 +8472,14 @@ var require_ast_to_react = __commonJS({
     function mergeNodeChildren(node2, parsedChildren) {
       var el = node2.element;
       if (Array.isArray(el)) {
-        var Fragment2 = React172.Fragment || "div";
-        return React172.createElement(Fragment2, null, el);
+        var Fragment2 = React171.Fragment || "div";
+        return React171.createElement(Fragment2, null, el);
       }
       if (el.props.children || parsedChildren) {
-        var children = React172.Children.toArray(el.props.children).concat(parsedChildren);
-        return React172.cloneElement(el, null, children);
+        var children = React171.Children.toArray(el.props.children).concat(parsedChildren);
+        return React171.cloneElement(el, null, children);
       }
-      return React172.cloneElement(el, null);
+      return React171.cloneElement(el, null);
     }
     function flattenPosition2(pos) {
       return [pos.start.line, ":", pos.start.column, "-", pos.end.line, ":", pos.end.column].map(String).join("");
@@ -8603,9 +8603,9 @@ var require_renderers = __commonJS({
   "node_modules/mml-react/node_modules/react-markdown/lib/renderers.js"(exports, module2) {
     "use strict";
     var xtend = require_immutable();
-    var React172 = require("react");
-    var supportsStringRender = parseInt((React172.version || "16").slice(0, 2), 10) >= 16;
-    var createElement = React172.createElement;
+    var React171 = require("react");
+    var supportsStringRender = parseInt((React171.version || "16").slice(0, 2), 10) >= 16;
+    var createElement = React171.createElement;
     module2.exports = {
       break: "br",
       paragraph: "p",
@@ -8641,7 +8641,7 @@ var require_renderers = __commonJS({
     }
     function Root(props) {
       var className = props.className;
-      var root2 = !className && React172.Fragment || "div";
+      var root2 = !className && React171.Fragment || "div";
       return createElement(root2, className ? {
         className
       } : null, props.children);
@@ -8697,7 +8697,7 @@ var require_renderers = __commonJS({
       var dangerous = props.allowDangerousHtml || props.escapeHtml === false;
       var tag = props.isBlock ? "div" : "span";
       if (!dangerous) {
-        return createElement(React172.Fragment || tag, null, props.value);
+        return createElement(React171.Fragment || tag, null, props.value);
       }
       var nodeProps = {
         dangerouslySetInnerHTML: {
@@ -8707,7 +8707,7 @@ var require_renderers = __commonJS({
       return createElement(tag, nodeProps);
     }
     function ParsedHtml(props) {
-      return props["data-sourcepos"] ? React172.cloneElement(props.element, {
+      return props["data-sourcepos"] ? React171.cloneElement(props.element, {
         "data-sourcepos": props["data-sourcepos"]
       }) : props.element;
     }
@@ -44536,39 +44536,39 @@ var useMessageSetKey = ({
 };
 
 // src/components/MessageList/hooks/VirtualizedMessageList/useScrollToBottomOnNewMessage.ts
-var import_react183 = __toESM(require("react"));
+var import_react183 = require("react");
 var useScrollToBottomOnNewMessage = ({
   messages,
   scrollToBottom,
   scrollToLatestMessageOnFocus
 }) => {
-  const [newMessagesReceivedInBackground, setNewMessagesReceivedInBackground] = import_react183.default.useState(
-    false
-  );
-  const resetNewMessagesReceivedInBackground = (0, import_react183.useCallback)(() => {
-    setNewMessagesReceivedInBackground(false);
-  }, []);
+  const [newMessagesReceivedInBackground, setNewMessagesReceivedInBackground] = (0, import_react183.useState)(false);
+  const scrollToBottomIfConfigured = (0, import_react183.useRef)();
+  scrollToBottomIfConfigured.current = (event) => {
+    if (!scrollToLatestMessageOnFocus || !newMessagesReceivedInBackground || event.target !== window) {
+      return;
+    }
+    setTimeout(scrollToBottom, 100);
+  };
   (0, import_react183.useEffect)(() => {
     setNewMessagesReceivedInBackground(true);
   }, [messages]);
-  const scrollToBottomIfConfigured = (0, import_react183.useCallback)(
-    (event) => {
-      if (!scrollToLatestMessageOnFocus || !newMessagesReceivedInBackground || event.target !== window)
-        return;
-      setTimeout(scrollToBottom, 100);
-    },
-    [scrollToLatestMessageOnFocus, scrollToBottom, newMessagesReceivedInBackground]
-  );
   (0, import_react183.useEffect)(() => {
+    const handleFocus = (event) => {
+      scrollToBottomIfConfigured.current?.(event);
+    };
+    const handleBlur = () => {
+      setNewMessagesReceivedInBackground(false);
+    };
     if (typeof window !== "undefined") {
-      window.addEventListener("focus", scrollToBottomIfConfigured);
-      window.addEventListener("blur", resetNewMessagesReceivedInBackground);
+      window.addEventListener("focus", handleFocus);
+      window.addEventListener("blur", handleBlur);
     }
     return () => {
-      window.removeEventListener("focus", scrollToBottomIfConfigured);
-      window.removeEventListener("blur", resetNewMessagesReceivedInBackground);
+      window.removeEventListener("focus", handleFocus);
+      window.removeEventListener("blur", handleBlur);
     };
-  }, [scrollToBottomIfConfigured]);
+  }, []);
 };
 
 // src/components/MessageList/hooks/VirtualizedMessageList/useUnreadMessagesNotificationVirtualized.ts
@@ -44669,6 +44669,7 @@ var messageRenderer = (virtuosoIndex, _data, virtuosoContext) => {
     messageGroupStyles,
     MessageSystem,
     numItemsPrepended,
+    openThread,
     ownMessagesReadByOthers,
     processedMessages: messageList,
     reactionDetailsSort,
@@ -44721,6 +44722,7 @@ var messageRenderer = (virtuosoIndex, _data, virtuosoContext) => {
       message,
       Message: MessageUIComponent,
       messageActions,
+      openThread,
       reactionDetailsSort,
       readBy: ownMessagesReadByOthers[message.id] || [],
       sortReactionDetails,
@@ -44787,6 +44789,7 @@ var VirtualizedMessageListWithContext = (props) => {
     messageLimit = DEFAULT_NEXT_CHANNEL_PAGE_SIZE,
     messages,
     notifications,
+    openThread,
     // TODO: refactor to scrollSeekPlaceHolderConfiguration and components.ScrollSeekPlaceholder, like the Virtuoso Component
     overscan = 0,
     read,
@@ -45002,6 +45005,7 @@ var VirtualizedMessageListWithContext = (props) => {
         messageGroupStyles,
         MessageSystem,
         numItemsPrepended,
+        openThread,
         ownMessagesReadByOthers,
         processedMessages,
         reactionDetailsSort,
@@ -46192,7 +46196,7 @@ var useChannelDeletedListener = (setChannels, customHandler) => {
     return () => {
       client.off("channel.deleted", handleEvent);
     };
-  }, [customHandler]);
+  }, [client, customHandler, setChannels]);
 };
 
 // src/components/ChannelList/hooks/useChannelHiddenListener.ts
@@ -46216,7 +46220,7 @@ var useChannelHiddenListener = (setChannels, customHandler) => {
     return () => {
       client.off("channel.hidden", handleEvent);
     };
-  }, [customHandler]);
+  }, [client, customHandler, setChannels]);
 };
 
 // src/components/ChannelList/hooks/useChannelTruncatedListener.ts
@@ -46237,7 +46241,7 @@ var useChannelTruncatedListener = (setChannels, customHandler, forceUpdate) => {
     return () => {
       client.off("channel.truncated", handleEvent);
     };
-  }, [customHandler]);
+  }, [client, customHandler, forceUpdate, setChannels]);
 };
 
 // src/components/ChannelList/hooks/useChannelUpdatedListener.ts
@@ -46270,7 +46274,7 @@ var useChannelUpdatedListener = (setChannels, customHandler, forceUpdate) => {
     return () => {
       client.off("channel.updated", handleEvent);
     };
-  }, [customHandler]);
+  }, [client, customHandler, forceUpdate, setChannels]);
 };
 
 // src/components/ChannelList/hooks/useChannelVisibleListener.ts
@@ -46295,7 +46299,7 @@ var useChannelVisibleListener = (setChannels, customHandler) => {
     return () => {
       client.off("channel.visible", handleEvent);
     };
-  }, [customHandler]);
+  }, [client, customHandler, setChannels]);
 };
 
 // src/components/ChannelList/hooks/useConnectionRecoveredListener.ts
@@ -46312,7 +46316,7 @@ var useConnectionRecoveredListener = (forceUpdate) => {
     return () => {
       client.off("connection.recovered", handleEvent);
     };
-  }, []);
+  }, [client, forceUpdate]);
 };
 
 // src/components/ChannelList/hooks/useMessageNewListener.ts
@@ -46356,7 +46360,13 @@ var useMessageNewListener = (setChannels, customHandler, lockChannelOrder = fals
     return () => {
       client.off("message.new", handleEvent);
     };
-  }, [lockChannelOrder]);
+  }, [
+    allowNewMessagesFromUnfilteredChannels,
+    client,
+    customHandler,
+    lockChannelOrder,
+    setChannels
+  ]);
 };
 
 // src/components/ChannelList/hooks/useMobileNavigation.ts
@@ -46404,7 +46414,7 @@ var useNotificationAddedToChannelListener = (setChannels, customHandler, allowNe
     return () => {
       client.off("notification.added_to_channel", handleEvent);
     };
-  }, [customHandler]);
+  }, [allowNewMessagesFromUnfilteredChannels, client, customHandler, setChannels]);
 };
 
 // src/components/ChannelList/hooks/useNotificationMessageNewListener.ts
@@ -46429,7 +46439,7 @@ var useNotificationMessageNewListener = (setChannels, customHandler, allowNewMes
     return () => {
       client.off("notification.message_new", handleEvent);
     };
-  }, [customHandler]);
+  }, [allowNewMessagesFromUnfilteredChannels, client, customHandler, setChannels]);
 };
 
 // src/components/ChannelList/hooks/useNotificationRemovedFromChannelListener.ts
@@ -46450,7 +46460,7 @@ var useNotificationRemovedFromChannelListener = (setChannels, customHandler) =>
     return () => {
       client.off("notification.removed_from_channel", handleEvent);
     };
-  }, [customHandler]);
+  }, [client, customHandler, setChannels]);
 };
 
 // src/components/ChannelList/hooks/usePaginatedChannels.ts
@@ -46557,7 +46567,7 @@ var useUserPresenceChangedListener = (setChannels) => {
     return () => {
       client.off("user.presence.changed", handleEvent);
     };
-  }, []);
+  }, [client, setChannels]);
 };
 
 // src/components/ChannelSearch/ChannelSearch.tsx
@@ -47324,7 +47334,9 @@ var UnMemoizedChannelList = (props) => {
       setActiveChannel(channels2[0], watchers);
     }
   };
-  const forceUpdate = () => setChannelUpdateCount((count) => count + 1);
+  const forceUpdate = (0, import_react212.useCallback)(() => setChannelUpdateCount((count) => count + 1), [
+    setChannelUpdateCount
+  ]);
   const onSearch = (0, import_react212.useCallback)((event) => {
     if (!event.target.value) {
       setSearchActive(false);