stream-chat-react 11.0.0-rc.7 → 11.0.0-rc.8

package/dist/index.cjs.js

@@ -26309,8 +26309,8 @@ var channelReducer = function (state, action) {
             return icons.__assign(icons.__assign({}, state), { members: icons.__assign({}, channel.state.members), messages: icons.__spreadArray([], channel.state.messages, true), pinnedMessages: icons.__spreadArray([], channel.state.pinnedMessages, true), read: icons.__assign({}, channel.state.read), watcherCount: channel.state.watcher_count, watchers: icons.__assign({}, channel.state.watchers) });
         }
         case 'initStateFromChannel': {
-            var channel = action.channel;
-            return icons.__assign(icons.__assign({}, state), { loading: false, members: icons.__assign({}, channel.state.members), messages: icons.__spreadArray([], channel.state.messages, true), pinnedMessages: icons.__spreadArray([], channel.state.pinnedMessages, true), read: icons.__assign({}, channel.state.read), watcherCount: channel.state.watcher_count, watchers: icons.__assign({}, channel.state.watchers) });
+            var channel = action.channel, hasMore = action.hasMore;
+            return icons.__assign(icons.__assign({}, state), { hasMore: hasMore, loading: false, members: icons.__assign({}, channel.state.members), messages: icons.__spreadArray([], channel.state.messages, true), pinnedMessages: icons.__spreadArray([], channel.state.pinnedMessages, true), read: icons.__assign({}, channel.state.read), watcherCount: channel.state.watcher_count, watchers: icons.__assign({}, channel.state.watchers) });
         }
         case 'jumpToLatestMessage': {
             return icons.__assign(icons.__assign({}, state), { hasMoreNewer: false, highlightedMessageId: undefined, loading: false, suppressAutoscroll: false });
@@ -29856,6 +29856,7 @@ var getGroupStyles = function (message, previousMessage, nextMessage, noGroupByU
 var hasMoreMessagesProbably = function (returnedCountMessages, limit) {
     return returnedCountMessages === limit;
 };
+// @deprecated
 var hasNotMoreMessages = function (returnedCountMessages, limit) {
     return returnedCountMessages < limit;
 };
@@ -29883,12 +29884,13 @@ var WATCH_QUERY_IN_PROGRESS_FOR_CHANNEL = {};
  * Calls channel.watch() if it was not already recently called. Waits for watch promise to resolve even if it was invoked previously.
  * @param client
  * @param members
+ * @param options
  * @param type
  * @param id
  * @param channel
  */
 var getChannel = function (_a) {
-    var channel = _a.channel, client = _a.client, id = _a.id, members = _a.members, type = _a.type;
+    var channel = _a.channel, client = _a.client, id = _a.id, members = _a.members, options = _a.options, type = _a.type;
     return icons.__awaiter(void 0, void 0, void 0, function () {
         var theChannel, originalCid, queryPromise;
         return icons.__generator(this, function (_b) {
@@ -29913,7 +29915,7 @@ var getChannel = function (_a) {
                     _b.sent();
                     return [3 /*break*/, 4];
                 case 2:
-                    WATCH_QUERY_IN_PROGRESS_FOR_CHANNEL[originalCid] = theChannel.watch();
+                    WATCH_QUERY_IN_PROGRESS_FOR_CHANNEL[originalCid] = theChannel.watch(options);
                     return [4 /*yield*/, WATCH_QUERY_IN_PROGRESS_FOR_CHANNEL[originalCid]];
                 case 3:
                     _b.sent();
@@ -30045,12 +30047,11 @@ var UnMemoizedChannel = function (props) {
     if (!(channel === null || channel === void 0 ? void 0 : channel.cid)) {
         return React__default["default"].createElement("div", { className: className }, EmptyPlaceholder);
     }
-    // @ts-ignore
     return React__default["default"].createElement(ChannelInner, icons.__assign({}, props, { channel: channel, key: channel.cid }));
 };
 var ChannelInner = function (props) {
     var _a;
-    var acceptedFiles = props.acceptedFiles, activeUnreadHandler = props.activeUnreadHandler, channel = props.channel, children = props.children, doDeleteMessageRequest = props.doDeleteMessageRequest, doMarkReadRequest = props.doMarkReadRequest, doSendMessageRequest = props.doSendMessageRequest, doUpdateMessageRequest = props.doUpdateMessageRequest, _b = props.dragAndDropWindow, dragAndDropWindow = _b === void 0 ? false : _b, enrichURLForPreviewConfig = props.enrichURLForPreviewConfig, _c = props.initializeOnMount, initializeOnMount = _c === void 0 ? true : _c, _d = props.LoadingErrorIndicator, LoadingErrorIndicator$1 = _d === void 0 ? LoadingErrorIndicator : _d, _e = props.LoadingIndicator, LoadingIndicator = _e === void 0 ? LoadingChannel : _e, maxNumberOfFiles = props.maxNumberOfFiles, _f = props.multipleUploads, multipleUploads = _f === void 0 ? true : _f, onMentionsClick = props.onMentionsClick, onMentionsHover = props.onMentionsHover, _g = props.optionalMessageInputProps, optionalMessageInputProps = _g === void 0 ? {} : _g, skipMessageDataMemoization = props.skipMessageDataMemoization;
+    var acceptedFiles = props.acceptedFiles, activeUnreadHandler = props.activeUnreadHandler, channel = props.channel, channelQueryOptions = props.channelQueryOptions, children = props.children, doDeleteMessageRequest = props.doDeleteMessageRequest, doMarkReadRequest = props.doMarkReadRequest, doSendMessageRequest = props.doSendMessageRequest, doUpdateMessageRequest = props.doUpdateMessageRequest, _b = props.dragAndDropWindow, dragAndDropWindow = _b === void 0 ? false : _b, enrichURLForPreviewConfig = props.enrichURLForPreviewConfig, _c = props.initializeOnMount, initializeOnMount = _c === void 0 ? true : _c, _d = props.LoadingErrorIndicator, LoadingErrorIndicator$1 = _d === void 0 ? LoadingErrorIndicator : _d, _e = props.LoadingIndicator, LoadingIndicator = _e === void 0 ? LoadingChannel : _e, maxNumberOfFiles = props.maxNumberOfFiles, _f = props.multipleUploads, multipleUploads = _f === void 0 ? true : _f, onMentionsClick = props.onMentionsClick, onMentionsHover = props.onMentionsHover, _g = props.optionalMessageInputProps, optionalMessageInputProps = _g === void 0 ? {} : _g, skipMessageDataMemoization = props.skipMessageDataMemoization;
     var _h = icons.useChatContext('Channel'), client = _h.client, customClasses = _h.customClasses, latestMessageDatesByChannels = _h.latestMessageDatesByChannels, mutes = _h.mutes, theme = _h.theme;
     var t = icons.useTranslationContext('Channel').t;
     var _j = useChannelContainerClasses({ customClasses: customClasses }), channelClass = _j.channelClass, chatClass = _j.chatClass, chatContainerClass = _j.chatContainerClass, windowsEmojiClass = _j.windowsEmojiClass;
@@ -30143,6 +30144,7 @@ var ChannelInner = function (props) {
                     /**
                      * As the channel state is not normalized we re-fetch the channel data. Thus, we avoid having to search for user references in the channel state.
                      */
+                    // FIXME: we should use channelQueryOptions if they are available
                     return [4 /*yield*/, channel.query({
                             messages: { id_lt: oldestID, limit: DEFAULT_NEXT_CHANNEL_PAGE_SIZE },
                             watchers: { limit: DEFAULT_NEXT_CHANNEL_PAGE_SIZE },
@@ -30151,6 +30153,7 @@ var ChannelInner = function (props) {
                     /**
                      * As the channel state is not normalized we re-fetch the channel data. Thus, we avoid having to search for user references in the channel state.
                      */
+                    // FIXME: we should use channelQueryOptions if they are available
                     _m.sent();
                     _m.label = 2;
                 case 2:
@@ -30169,14 +30172,14 @@ var ChannelInner = function (props) {
         };
         (function () { return icons.__awaiter(void 0, void 0, void 0, function () {
             var members, _i, _a, member, userId, _b, user, user_id, config, e_1;
-            var _c;
-            return icons.__generator(this, function (_d) {
-                switch (_d.label) {
+            var _c, _d, _e;
+            return icons.__generator(this, function (_f) {
+                switch (_f.label) {
                     case 0:
                         if (!(!channel.initialized && initializeOnMount)) return [3 /*break*/, 4];
-                        _d.label = 1;
+                        _f.label = 1;
                     case 1:
-                        _d.trys.push([1, 3, , 4]);
+                        _f.trys.push([1, 3, , 4]);
                         members = [];
                         if (!channel.id && ((_c = channel.data) === null || _c === void 0 ? void 0 : _c.members)) {
                             for (_i = 0, _a = channel.data.members; _i < _a.length; _i++) {
@@ -30194,14 +30197,14 @@ var ChannelInner = function (props) {
                                 }
                             }
                         }
-                        return [4 /*yield*/, getChannel({ channel: channel, client: client, members: members })];
+                        return [4 /*yield*/, getChannel({ channel: channel, client: client, members: members, options: channelQueryOptions })];
                     case 2:
-                        _d.sent();
+                        _f.sent();
                         config = channel.getConfig();
                         setChannelConfig(config);
                         return [3 /*break*/, 4];
                     case 3:
-                        e_1 = _d.sent();
+                        e_1 = _f.sent();
                         dispatch({ error: e_1, type: 'setError' });
                         errored = true;
                         return [3 /*break*/, 4];
@@ -30209,7 +30212,11 @@ var ChannelInner = function (props) {
                         done = true;
                         originalTitle.current = document.title;
                         if (!errored) {
-                            dispatch({ channel: channel, type: 'initStateFromChannel' });
+                            dispatch({
+                                channel: channel,
+                                hasMore: hasMoreMessagesProbably(channel.state.messages.length, (_e = (_d = channelQueryOptions === null || channelQueryOptions === void 0 ? void 0 : channelQueryOptions.messages) === null || _d === void 0 ? void 0 : _d.limit) !== null && _e !== void 0 ? _e : DEFAULT_INITIAL_CHANNEL_PAGE_SIZE),
+                                type: 'initStateFromChannel',
+                            });
                             if (channel.countUnread() > 0)
                                 markRead();
                             // The more complex sync logic is done in Chat
@@ -30235,7 +30242,13 @@ var ChannelInner = function (props) {
             client.off('user.deleted', handleEvent);
             notificationTimeouts.forEach(clearTimeout);
         };
-    }, [channel.cid, doMarkReadRequest, channelConfig === null || channelConfig === void 0 ? void 0 : channelConfig.read_events, initializeOnMount]);
+    }, [
+        channel.cid,
+        channelQueryOptions,
+        doMarkReadRequest,
+        channelConfig === null || channelConfig === void 0 ? void 0 : channelConfig.read_events,
+        initializeOnMount,
+    ]);
     React.useEffect(function () {
         var _a;
         if (!state.thread)
@@ -30258,22 +30271,17 @@ var ChannelInner = function (props) {
     var loadMore = function (limit) {
         if (limit === void 0) { limit = DEFAULT_NEXT_CHANNEL_PAGE_SIZE; }
         return icons.__awaiter(void 0, void 0, void 0, function () {
-            var oldestMessage, notHasMore, oldestID, perPage, queryResponse, e_2, hasMoreMessages;
+            var oldestMessage, oldestID, perPage, queryResponse, e_2, hasMoreMessages;
             var _a;
             return icons.__generator(this, function (_b) {
                 switch (_b.label) {
                     case 0:
-                        if (!online.current || !window.navigator.onLine)
+                        if (!online.current || !window.navigator.onLine || !state.hasMore)
                             return [2 /*return*/, 0];
                         oldestMessage = (_a = state === null || state === void 0 ? void 0 : state.messages) === null || _a === void 0 ? void 0 : _a[0];
                         if (state.loadingMore || state.loadingMoreNewer || (oldestMessage === null || oldestMessage === void 0 ? void 0 : oldestMessage.status) !== 'received') {
                             return [2 /*return*/, 0];
                         }
-                        notHasMore = hasNotMoreMessages(channel.state.messages.length, DEFAULT_INITIAL_CHANNEL_PAGE_SIZE);
-                        if (notHasMore) {
-                            loadMoreFinished(false, channel.state.messages);
-                            return [2 /*return*/, channel.state.messages.length];
-                        }
                         dispatch({ loadingMore: true, type: 'setLoadingMore' });
                         oldestID = oldestMessage === null || oldestMessage === void 0 ? void 0 : oldestMessage.id;
                         perPage = limit;
@@ -30553,6 +30561,7 @@ var ChannelInner = function (props) {
             return icons.__generator(this, function (_b) {
                 switch (_b.label) {
                     case 0:
+                        // FIXME: should prevent loading more, if state.thread.reply_count === channel.state.threads[parentID].length
                         if (state.threadLoadingMore || !state.thread)
                             return [2 /*return*/];
                         dispatch({ type: 'startLoadingThread' });
@@ -31990,7 +31999,7 @@ var UnMemoizedChannelList = function (props) {
  */
 var ChannelList = React__default["default"].memo(UnMemoizedChannelList);
 
-var version = '11.0.0-rc.7';
+var version = '11.0.0-rc.8';
 
 var useChat = function (_a) {
     var _b, _c;
@@ -32297,6 +32306,7 @@ var InfiniteScroll = function (props) {
         }
         if (isLoading)
             return;
+        // FIXME: this triggers loadMore call when a user types messages in thread and the scroll container container expands
         if (reverseOffset < Number(threshold) &&
             typeof loadPreviousPageFn === 'function' &&
             hasPreviousPageFlag) {
@@ -33004,7 +33014,7 @@ var UnMemoizedCustomNotification = function (props) {
     var active = props.active, children = props.children, className = props.className, type = props.type;
     if (!active)
         return null;
-    return (React__default["default"].createElement("div", { "aria-live": 'polite', className: clsx("str-chat__custom-notification notification-".concat(type), "str-chat__notification", className), "data-testid": 'custom-notification' }, children));
+    return (React__default["default"].createElement("div", { "aria-live": 'polite', className: clsx("str-chat__custom-notification notification-".concat(type), "str-chat__notification", "str-chat-react__notification", className), "data-testid": 'custom-notification' }, children));
 };
 var CustomNotification = React__default["default"].memo(UnMemoizedCustomNotification);
 
@@ -34045,6 +34055,7 @@ var ThreadInner = function (props) {
     var ThreadMessageList = virtualized ? VirtualizedMessageList : MessageList;
     React.useEffect(function () {
         if ((thread === null || thread === void 0 ? void 0 : thread.id) && (thread === null || thread === void 0 ? void 0 : thread.reply_count)) {
+            // FIXME: integrators can customize channel query options but cannot customize channel.getReplies() options
             loadMoreThread();
         }
     }, []);

package/dist/utils/getChannel.d.ts

@@ -1,20 +1,22 @@
-import type { Channel, StreamChat } from 'stream-chat';
+import type { Channel, ChannelQueryOptions, StreamChat } from 'stream-chat';
 import type { DefaultStreamChatGenerics } from '../types/types';
 declare type GetChannelParams<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = {
     client: StreamChat<StreamChatGenerics>;
     channel?: Channel<StreamChatGenerics>;
     id?: string;
     members?: string[];
+    options?: ChannelQueryOptions<StreamChatGenerics>;
     type?: string;
 };
 /**
  * Calls channel.watch() if it was not already recently called. Waits for watch promise to resolve even if it was invoked previously.
  * @param client
  * @param members
+ * @param options
  * @param type
  * @param id
  * @param channel
  */
-export declare const getChannel: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ channel, client, id, members, type, }: GetChannelParams<StreamChatGenerics>) => Promise<Channel<StreamChatGenerics>>;
+export declare const getChannel: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ channel, client, id, members, options, type, }: GetChannelParams<StreamChatGenerics>) => Promise<Channel<StreamChatGenerics>>;
 export {};
 //# sourceMappingURL=getChannel.d.ts.map

package/dist/utils/getChannel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"getChannel.d.ts","sourceRoot":"","sources":["../../src/utils/getChannel.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAA2B,UAAU,EAAE,MAAM,aAAa,CAAC;AAChF,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,gBAAgB,CAAC;AAWhE,aAAK,gBAAgB,CACnB,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E;IACF,MAAM,EAAE,UAAU,CAAC,kBAAkB,CAAC,CAAC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAC,kBAAkB,CAAC,CAAC;IACtC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AACF;;;;;;;GAOG;AACH,eAAO,MAAM,UAAU,2MAuCtB,CAAC"}
+{"version":3,"file":"getChannel.d.ts","sourceRoot":"","sources":["../../src/utils/getChannel.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,OAAO,EACP,mBAAmB,EAEnB,UAAU,EACX,MAAM,aAAa,CAAC;AACrB,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,gBAAgB,CAAC;AAWhE,aAAK,gBAAgB,CACnB,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E;IACF,MAAM,EAAE,UAAU,CAAC,kBAAkB,CAAC,CAAC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAC,kBAAkB,CAAC,CAAC;IACtC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,OAAO,CAAC,EAAE,mBAAmB,CAAC,kBAAkB,CAAC,CAAC;IAClD,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AACF;;;;;;;;GAQG;AACH,eAAO,MAAM,UAAU,oNAwCtB,CAAC"}

package/dist/utils/getChannel.js

@@ -8,12 +8,13 @@ var WATCH_QUERY_IN_PROGRESS_FOR_CHANNEL = {};
  * Calls channel.watch() if it was not already recently called. Waits for watch promise to resolve even if it was invoked previously.
  * @param client
  * @param members
+ * @param options
  * @param type
  * @param id
  * @param channel
  */
 export var getChannel = function (_a) {
-    var channel = _a.channel, client = _a.client, id = _a.id, members = _a.members, type = _a.type;
+    var channel = _a.channel, client = _a.client, id = _a.id, members = _a.members, options = _a.options, type = _a.type;
     return __awaiter(void 0, void 0, void 0, function () {
         var theChannel, originalCid, queryPromise;
         return __generator(this, function (_b) {
@@ -38,7 +39,7 @@ export var getChannel = function (_a) {
                     _b.sent();
                     return [3 /*break*/, 4];
                 case 2:
-                    WATCH_QUERY_IN_PROGRESS_FOR_CHANNEL[originalCid] = theChannel.watch();
+                    WATCH_QUERY_IN_PROGRESS_FOR_CHANNEL[originalCid] = theChannel.watch(options);
                     return [4 /*yield*/, WATCH_QUERY_IN_PROGRESS_FOR_CHANNEL[originalCid]];
                 case 3:
                     _b.sent();

package/dist/version.d.ts

@@ -1,2 +1,2 @@
-export declare const version = "11.0.0-rc.7";
+export declare const version = "11.0.0-rc.8";
 //# sourceMappingURL=version.d.ts.map

package/dist/version.js

@@ -1 +1 @@
-export var version = '11.0.0-rc.7';
+export var version = '11.0.0-rc.8';

package/package.json

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