stream-chat-react 12.10.0 → 12.11.0

package/dist/components/MessageInput/hooks/useSubmitHandler.js

@@ -4,7 +4,7 @@ import { useChannelStateContext } from '../../../context/ChannelStateContext';
 import { useTranslationContext } from '../../../context/TranslationContext';
 import { LinkPreviewState } from '../types';
 export const useSubmitHandler = (props, state, dispatch, numberOfUploads, enrichURLsController) => {
-    const { clearEditingState, message, overrideSubmitHandler, parent, publishTypingEvent } = props;
+    const { clearEditingState, message, overrideSubmitHandler, parent, publishTypingEvent, } = props;
     const { attachments, linkPreviews, mentioned_users, text } = state;
     const { cancelURLEnrichment, findAndEnqueueURLsToEnrich } = enrichURLsController;
     const { channel } = useChannelStateContext('useSubmitHandler');
@@ -42,6 +42,7 @@ export const useSubmitHandler = (props, state, dispatch, numberOfUploads, enrich
             .filter((att) => att.localMetadata?.uploadState !== 'failed' ||
             (findAndEnqueueURLsToEnrich && !att.og_scrape_url))
             .map((localAttachment) => {
+            // eslint-disable-next-line @typescript-eslint/no-unused-vars
             const { localMetadata: _, ...attachment } = localAttachment;
             return attachment;
         });
@@ -57,8 +58,9 @@ export const useSubmitHandler = (props, state, dispatch, numberOfUploads, enrich
                 : Array.from(linkPreviews.values())
                     .filter((linkPreview) => linkPreview.state === LinkPreviewState.LOADED &&
                     !attachmentsFromUploads.find((attFromUpload) => attFromUpload.og_scrape_url === linkPreview.og_scrape_url))
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    .map(({ state: linkPreviewState, ...ogAttachment }) => ogAttachment);
+                    .map(
+                // eslint-disable-next-line @typescript-eslint/no-unused-vars
+                ({ state: linkPreviewState, ...ogAttachment }) => ogAttachment);
             // scraped attachments are added only if all enrich queries has completed. Otherwise, the scraping has to be done server-side.
             sendOptions.skip_enrich_url =
                 (!someLinkPreviewsLoading && attachmentsFromLinkPreviews.length > 0) ||

package/dist/components/MessageInput/hooks/useUserTrigger.js

@@ -27,7 +27,7 @@ export const useUserTrigger = (params) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     const queryMembersThrottled = useCallback(throttle(async (query, onReady) => {
         try {
-            // @ts-expect-error
+            // @ts-expect-error valid query
             const response = await channel.queryMembers({
                 name: { $autocomplete: query },
             });
@@ -49,7 +49,7 @@ export const useUserTrigger = (params) => {
         setSearching(true);
         try {
             const { users } = await client.queryUsers(
-            // @ts-expect-error
+            // @ts-expect-error valid query
             {
                 $or: [{ id: { $autocomplete: query } }, { name: { $autocomplete: query } }],
                 ...(typeof mentionQueryParams.filters === 'function'

package/dist/components/MessageInput/hooks/utils.js

@@ -53,6 +53,7 @@ export const searchLocalUsers = (params) => {
         let updatedQuery = removeDiacritics(query).toLowerCase();
         if (useMentionsTransliteration) {
             (async () => {
+                // eslint-disable-next-line import/no-extraneous-dependencies
                 const { default: transliterate } = await import('@stream-io/transliterate');
                 updatedName = transliterate(user.name || '').toLowerCase();
                 updatedQuery = transliterate(query).toLowerCase();
@@ -63,7 +64,8 @@ export const searchLocalUsers = (params) => {
         const lastDigits = text.slice(-(maxDistance + 1)).includes('@');
         if (updatedName) {
             const levenshtein = calculateLevenshtein(updatedQuery, updatedName);
-            if (updatedName.includes(updatedQuery) || (levenshtein <= maxDistance && lastDigits)) {
+            if (updatedName.includes(updatedQuery) ||
+                (levenshtein <= maxDistance && lastDigits)) {
                 return true;
             }
         }
@@ -79,7 +81,9 @@ export const checkUploadPermissions = async (params) => {
     const { allowed_file_extensions, allowed_mime_types, blocked_file_extensions, blocked_mime_types, size_limit, } = (uploadType === 'image'
         ? appSettings?.app?.image_upload_config
         : appSettings?.app?.file_upload_config) || {};
-    const sendNotAllowedErrorNotification = () => addNotification(t(`Upload type: "{{ type }}" is not allowed`, { type: file.type || 'unknown type' }), 'error');
+    const sendNotAllowedErrorNotification = () => addNotification(t(`Upload type: "{{ type }}" is not allowed`, {
+        type: file.type || 'unknown type',
+    }), 'error');
     if (allowed_file_extensions?.length) {
         const allowed = allowed_file_extensions.some((ext) => file.name.toLowerCase().endsWith(ext.toLowerCase()));
         if (!allowed) {

package/dist/components/MessageList/ConnectionStatus.js

@@ -6,7 +6,7 @@ const UnMemoizedConnectionStatus = () => {
     const { t } = useTranslationContext('ConnectionStatus');
     const [online, setOnline] = useState(true);
     useEffect(() => {
-        const connectionChanged = ({ online: onlineStatus = false }) => {
+        const connectionChanged = ({ online: onlineStatus = false, }) => {
             if (online !== onlineStatus) {
                 setOnline(onlineStatus);
             }

package/dist/components/MessageList/MessageList.js

@@ -12,7 +12,7 @@ import { useChatContext } from '../../context/ChatContext';
 import { useComponentContext } from '../../context/ComponentContext';
 import { MessageListContextProvider } from '../../context/MessageListContext';
 import { EmptyStateIndicator as DefaultEmptyStateIndicator } from '../EmptyStateIndicator';
-import { InfiniteScroll } from '../InfiniteScrollPaginator/InfiniteScroll';
+import { InfiniteScroll, } from '../InfiniteScrollPaginator/InfiniteScroll';
 import { LoadingIndicator as DefaultLoadingIndicator } from '../Loading';
 import { defaultPinPermissions, MESSAGE_ACTIONS } from '../Message/utils';
 import { TypingIndicator as DefaultTypingIndicator } from '../TypingIndicator';
@@ -20,12 +20,12 @@ import { MessageListMainPanel as DefaultMessageListMainPanel } from './MessageLi
 import { defaultRenderMessages } from './renderMessages';
 import { DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD, DEFAULT_NEXT_CHANNEL_PAGE_SIZE, } from '../../constants/limits';
 const MessageListWithContext = (props) => {
-    const { channel, channelUnreadUiState, disableDateSeparator = false, groupStyles, hideDeletedMessages = false, hideNewMessageSeparator = false, internalInfiniteScrollProps: { threshold: loadMoreScrollThreshold = DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD, ...restInternalInfiniteScrollProps } = {}, maxTimeBetweenGroupedMessages, messageActions = Object.keys(MESSAGE_ACTIONS), messages = [], notifications, noGroupByUser = false, pinPermissions = defaultPinPermissions, // @deprecated in favor of `channelCapabilities` - TODO: remove in next major release
-    returnAllReadData = false, threadList = false, unsafeHTML = false, headerPosition, read, renderMessages = defaultRenderMessages, reviewProcessedMessage, messageLimit = DEFAULT_NEXT_CHANNEL_PAGE_SIZE, loadMore: loadMoreCallback, loadMoreNewer: loadMoreNewerCallback, hasMoreNewer = false, reactionDetailsSort, showUnreadNotificationAlways, sortReactionDetails, sortReactions, suppressAutoscroll, highlightedMessageId, jumpToLatestMessage = () => Promise.resolve(), } = props;
+    const { channel, channelUnreadUiState, disableDateSeparator = false, groupStyles, hasMoreNewer = false, headerPosition, hideDeletedMessages = false, hideNewMessageSeparator = false, highlightedMessageId, internalInfiniteScrollProps: { threshold: loadMoreScrollThreshold = DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD, ...restInternalInfiniteScrollProps } = {}, jumpToLatestMessage = () => Promise.resolve(), loadMore: loadMoreCallback, loadMoreNewer: loadMoreNewerCallback, // @deprecated in favor of `channelCapabilities` - TODO: remove in next major release
+    maxTimeBetweenGroupedMessages, messageActions = Object.keys(MESSAGE_ACTIONS), messageLimit = DEFAULT_NEXT_CHANNEL_PAGE_SIZE, messages = [], noGroupByUser = false, notifications, pinPermissions = defaultPinPermissions, reactionDetailsSort, read, renderMessages = defaultRenderMessages, returnAllReadData = false, reviewProcessedMessage, showUnreadNotificationAlways, sortReactionDetails, sortReactions, suppressAutoscroll, threadList = false, unsafeHTML = false, } = props;
     const [listElement, setListElement] = React.useState(null);
     const [ulElement, setUlElement] = React.useState(null);
     const { customClasses } = useChatContext('MessageList');
-    const { EmptyStateIndicator = DefaultEmptyStateIndicator, LoadingIndicator = DefaultLoadingIndicator, MessageListNotifications = DefaultMessageListNotifications, MessageNotification = DefaultMessageNotification, TypingIndicator = DefaultTypingIndicator, UnreadMessagesNotification = DefaultUnreadMessagesNotification, MessageListMainPanel = DefaultMessageListMainPanel, } = useComponentContext('MessageList');
+    const { EmptyStateIndicator = DefaultEmptyStateIndicator, LoadingIndicator = DefaultLoadingIndicator, MessageListMainPanel = DefaultMessageListMainPanel, MessageListNotifications = DefaultMessageListNotifications, MessageNotification = DefaultMessageNotification, TypingIndicator = DefaultTypingIndicator, UnreadMessagesNotification = DefaultUnreadMessagesNotification, } = useComponentContext('MessageList');
     const { hasNewMessages, isMessageListScrolledToBottom, onScroll, scrollToBottom, wrapperRect, } = useScrollLocationLogic({
         hasMoreNewer,
         listElement,
@@ -146,7 +146,7 @@ const MessageListWithContext = (props) => {
  * - [TypingContext](https://getstream.io/chat/docs/sdk/react/contexts/typing_context/)
  */
 export const MessageList = (props) => {
-    const { jumpToLatestMessage, loadMore, loadMoreNewer, } = useChannelActionContext('MessageList');
+    const { jumpToLatestMessage, loadMore, loadMoreNewer } = useChannelActionContext('MessageList');
     const { members: membersPropToNotPass, // eslint-disable-line @typescript-eslint/no-unused-vars
     mutes: mutesPropToNotPass, // eslint-disable-line @typescript-eslint/no-unused-vars
     watchers: watchersPropToNotPass, // eslint-disable-line @typescript-eslint/no-unused-vars

package/dist/components/MessageList/MessageListNotifications.js

@@ -8,5 +8,7 @@ export const MessageListNotifications = (props) => {
     return (React.createElement("div", { className: 'str-chat__list-notifications' },
         notifications.map((notification) => (React.createElement(CustomNotification, { active: true, key: notification.id, type: notification.type }, notification.text))),
         React.createElement(ConnectionStatus, null),
-        React.createElement(MessageNotification, { isMessageListScrolledToBottom: isMessageListScrolledToBottom, onClick: scrollToBottom, showNotification: hasNewMessages || isNotAtLatestMessageSet, threadList: threadList, unreadCount: unreadCount }, isNotAtLatestMessageSet ? t('Latest Messages') : t('New Messages!'))));
+        React.createElement(MessageNotification, { isMessageListScrolledToBottom: isMessageListScrolledToBottom, onClick: scrollToBottom, showNotification: hasNewMessages || isNotAtLatestMessageSet, threadList: threadList, unreadCount: unreadCount }, isNotAtLatestMessageSet
+            ? t('Latest Messages')
+            : t('New Messages!'))));
 };

package/dist/components/MessageList/VirtualizedMessageList.js

@@ -18,7 +18,7 @@ import { DialogManagerProvider } from '../../context';
 import { useChannelActionContext, } from '../../context/ChannelActionContext';
 import { useChannelStateContext, } from '../../context/ChannelStateContext';
 import { useChatContext } from '../../context/ChatContext';
-import { useComponentContext } from '../../context/ComponentContext';
+import { useComponentContext, } from '../../context/ComponentContext';
 import { VirtualizedMessageListContextProvider } from '../../context/VirtualizedMessageListContext';
 import { DEFAULT_NEXT_CHANNEL_PAGE_SIZE } from '../../constants/limits';
 function captureResizeObserverExceededError(e) {
@@ -53,17 +53,17 @@ function calculateInitialTopMostItemIndex(messages, highlightedMessageId) {
 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, 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;
+    overscan = 0, reactionDetailsSort, read, returnAllReadData = false, reviewProcessedMessage, scrollSeekPlaceHolder, scrollToLatestMessageOnFocus = false, separateGiphyPreview = false, shouldGroupByUser = false, showUnreadNotificationAlways, sortReactionDetails, sortReactions, stickToBottomScrollBehavior = 'smooth', suppressAutoscroll, threadList, } = props;
     const { components: virtuosoComponentsFromProps, ...overridingVirtuosoProps } = additionalVirtuosoProps;
     // Stops errors generated from react-virtuoso to bubble up
     // to Sentry or other tracking tools.
     useCaptureResizeObserverExceededError();
-    const { DateSeparator = DefaultDateSeparator, GiphyPreviewMessage = DefaultGiphyPreviewMessage, MessageListNotifications = DefaultMessageListNotifications, MessageNotification = DefaultMessageNotification, MessageSystem = DefaultMessageSystem, MessageListMainPanel = DefaultMessageListMainPanel, UnreadMessagesNotification = DefaultUnreadMessagesNotification, UnreadMessagesSeparator = DefaultUnreadMessagesSeparator, VirtualMessage: MessageUIComponentFromContext = MessageSimple, TypingIndicator, } = useComponentContext('VirtualizedMessageList');
+    const { DateSeparator = DefaultDateSeparator, GiphyPreviewMessage = DefaultGiphyPreviewMessage, MessageListMainPanel = DefaultMessageListMainPanel, MessageListNotifications = DefaultMessageListNotifications, MessageNotification = DefaultMessageNotification, MessageSystem = DefaultMessageSystem, TypingIndicator, UnreadMessagesNotification = DefaultUnreadMessagesNotification, UnreadMessagesSeparator = DefaultUnreadMessagesSeparator, VirtualMessage: MessageUIComponentFromContext = MessageSimple, } = useComponentContext('VirtualizedMessageList');
     const MessageUIComponent = MessageUIComponentFromProps || MessageUIComponentFromContext;
     const { client, customClasses } = useChatContext('VirtualizedMessageList');
     const virtuoso = useRef(null);
     const lastRead = useMemo(() => channel.lastRead?.(), [channel]);
-    const { show: showUnreadMessagesNotification, toggleShowUnreadMessagesNotification, } = useUnreadMessagesNotificationVirtualized({
+    const { show: showUnreadMessagesNotification, toggleShowUnreadMessagesNotification } = useUnreadMessagesNotificationVirtualized({
         lastRead: channelUnreadUiState?.last_read,
         showAlways: !!showUnreadNotificationAlways,
         unreadCount: channelUnreadUiState?.unread_messages ?? 0,
@@ -106,9 +106,7 @@ const VirtualizedMessageListWithContext = (props) => {
         returnAllReadData,
         userID: client.userID,
     });
-    const lastReceivedMessageId = useMemo(() => getLastReceived(processedMessages), [
-        processedMessages,
-    ]);
+    const lastReceivedMessageId = useMemo(() => getLastReceived(processedMessages), [processedMessages]);
     const groupStylesFn = groupStyles || getGroupStyles;
     const messageGroupStyles = useMemo(() => processedMessages.reduce((acc, message, i) => {
         const style = groupStylesFn(message, processedMessages[i - 1], processedMessages[i + 1], !shouldGroupByUser, maxTimeBetweenGroupedMessages);
@@ -118,7 +116,12 @@ const VirtualizedMessageListWithContext = (props) => {
     }, {}), 
     // processedMessages were incorrectly rebuilt with a new object identity at some point, hence the .length usage
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [maxTimeBetweenGroupedMessages, processedMessages.length, shouldGroupByUser, groupStylesFn]);
+    [
+        maxTimeBetweenGroupedMessages,
+        processedMessages.length,
+        shouldGroupByUser,
+        groupStylesFn,
+    ]);
     const { atBottom, isMessageListScrolledToBottom, newMessagesNotification, setIsMessageListScrolledToBottom, setNewMessagesNotification, } = useNewMessageNotification(processedMessages, client.userID, hasMoreNewer);
     useMarkRead({
         isMessageListScrolledToBottom,
@@ -144,7 +147,11 @@ const VirtualizedMessageListWithContext = (props) => {
         hasMoreNewer,
         jumpToLatestMessage,
     ]);
-    useScrollToBottomOnNewMessage({ messages, scrollToBottom, scrollToLatestMessageOnFocus });
+    useScrollToBottomOnNewMessage({
+        messages,
+        scrollToBottom,
+        scrollToLatestMessageOnFocus,
+    });
     const numItemsPrepended = usePrependedMessagesCount(processedMessages, !disableDateSeparator);
     const { messageSetKey } = useMessageSetKey({ messages });
     const shouldForceScrollToBottom = useShouldForceScrollToBottom(processedMessages, client.userID);
@@ -242,7 +249,7 @@ const VirtualizedMessageListWithContext = (props) => {
  * It is a consumer of the React contexts set in [Channel](https://github.com/GetStream/stream-chat-react/blob/master/src/components/Channel/Channel.tsx).
  */
 export function VirtualizedMessageList(props) {
-    const { jumpToLatestMessage, loadMore, loadMoreNewer, } = useChannelActionContext('VirtualizedMessageList');
+    const { jumpToLatestMessage, loadMore, loadMoreNewer } = useChannelActionContext('VirtualizedMessageList');
     const { channel, channelUnreadUiState, hasMore, hasMoreNewer, highlightedMessageId, loadingMore, loadingMoreNewer, messages: contextMessages, notifications, read, suppressAutoscroll, } = useChannelStateContext('VirtualizedMessageList');
     const messages = props.messages || contextMessages;
     return (React.createElement(VirtualizedMessageListWithContext, { channel: channel, channelUnreadUiState: props.channelUnreadUiState ?? channelUnreadUiState, hasMore: !!hasMore, hasMoreNewer: !!hasMoreNewer, highlightedMessageId: highlightedMessageId, jumpToLatestMessage: jumpToLatestMessage, loadingMore: !!loadingMore, loadingMoreNewer: !!loadingMoreNewer, loadMore: loadMore, loadMoreNewer: loadMoreNewer, messages: messages, notifications: notifications, read: read, suppressAutoscroll: suppressAutoscroll, ...props }));

package/dist/components/MessageList/VirtualizedMessageListComponents.js

@@ -43,7 +43,7 @@ export const Header = ({ context, }) => {
             React.createElement(LoadingIndicator, { size: 20 })))));
 };
 export const EmptyPlaceholder = ({ context, }) => {
-    const { EmptyStateIndicator = DefaultEmptyStateIndicator, } = useComponentContext('VirtualizedMessageList');
+    const { EmptyStateIndicator = DefaultEmptyStateIndicator } = useComponentContext('VirtualizedMessageList');
     return (React.createElement(React.Fragment, null, EmptyStateIndicator && (React.createElement(EmptyStateIndicator, { listType: context?.threadList ? 'thread' : 'message' }))));
 };
 export const messageRenderer = (virtuosoIndex, _data, virtuosoContext) => {
@@ -56,7 +56,7 @@ export const messageRenderer = (virtuosoIndex, _data, virtuosoContext) => {
     if (!message)
         return React.createElement("div", { style: { height: '1px' } }); // returning null or zero height breaks the virtuoso
     if (isDateSeparatorMessage(message)) {
-        return DateSeparator ? React.createElement(DateSeparator, { date: message.date, unread: message.unread }) : null;
+        return DateSeparator ? (React.createElement(DateSeparator, { date: message.date, unread: message.unread })) : null;
     }
     if (message.type === 'system') {
         return MessageSystem ? React.createElement(MessageSystem, { message: message }) : null;

package/dist/components/MessageList/hooks/MessageList/useMessageListElements.js

@@ -14,9 +14,7 @@ export const useMessageListElements = (props) => {
         returnAllReadData,
         userID: client.userID,
     });
-    const lastReceivedMessageId = useMemo(() => getLastReceived(enrichedMessages), [
-        enrichedMessages,
-    ]);
+    const lastReceivedMessageId = useMemo(() => getLastReceived(enrichedMessages), [enrichedMessages]);
     const elements = useMemo(() => renderMessages({
         channelUnreadUiState,
         components,

package/dist/components/MessageList/hooks/MessageList/useMessageListScrollManager.js

@@ -41,7 +41,8 @@ export function useMessageListScrollManager(params) {
             }
             // message list length didn't change, but check if last message had reaction/reply update
             else {
-                const hasNewReactions = lastPrevMessage?.latest_reactions?.length !== lastNewMessage.latest_reactions?.length;
+                const hasNewReactions = lastPrevMessage?.latest_reactions?.length !==
+                    lastNewMessage.latest_reactions?.length;
                 const hasNewReplies = lastPrevMessage?.reply_count !== lastNewMessage.reply_count;
                 if ((hasNewReactions || hasNewReplies) && wasAtBottom) {
                     scrollToBottom();

package/dist/components/MessageList/hooks/MessageList/useScrollLocationLogic.js

@@ -1,7 +1,7 @@
 import { useCallback, useLayoutEffect, useRef, useState } from 'react';
 import { useMessageListScrollManager } from './useMessageListScrollManager';
 export const useScrollLocationLogic = (params) => {
-    const { loadMoreScrollThreshold, messages = [], scrolledUpThreshold = 200, hasMoreNewer, suppressAutoscroll, listElement, } = params;
+    const { hasMoreNewer, listElement, loadMoreScrollThreshold, messages = [], scrolledUpThreshold = 200, suppressAutoscroll, } = params;
     const [hasNewMessages, setHasNewMessages] = useState(false);
     const [wrapperRect, setWrapperRect] = useState();
     const [isMessageListScrolledToBottom, setIsMessageListScrolledToBottom] = useState(true);
@@ -44,7 +44,8 @@ export const useScrollLocationLogic = (params) => {
         const offsetHeight = element.offsetHeight;
         const scrollHeight = element.scrollHeight;
         const prevCloseToBottom = closeToBottom.current;
-        closeToBottom.current = scrollHeight - (scrollTop + offsetHeight) < scrolledUpThreshold;
+        closeToBottom.current =
+            scrollHeight - (scrollTop + offsetHeight) < scrolledUpThreshold;
         closeToTop.current = scrollTop < scrolledUpThreshold;
         if (closeToBottom.current) {
             setHasNewMessages(false);

package/dist/components/MessageList/hooks/MessageList/useUnreadMessagesNotification.js

@@ -31,7 +31,9 @@ export const useUnreadMessagesNotification = ({ isMessageListScrolledToBottom, s
         }
         const scrolledBelowSeparator = targetScrolledAboveVisibleContainerArea(observedTarget);
         const scrolledAboveSeparator = targetScrolledBelowVisibleContainerArea(observedTarget, msgListPanel);
-        setShow(showAlways ? scrolledBelowSeparator || scrolledAboveSeparator : scrolledBelowSeparator);
+        setShow(showAlways
+            ? scrolledBelowSeparator || scrolledAboveSeparator
+            : scrolledBelowSeparator);
         const observer = new IntersectionObserver((elements) => {
             if (!elements.length)
                 return;
@@ -61,7 +63,9 @@ export const useUnreadMessagesNotification = ({ isMessageListScrolledToBottom, s
          * The intersection observer is not triggered when Element.scrollTo() is called. So we end up in a situation when we are scrolled to the bottom
          * and at the same time scrolled above the observed target.
          */
-        if (unreadCount && isMessageListScrolledToBottom && isScrolledAboveTargetTop.current) {
+        if (unreadCount &&
+            isMessageListScrolledToBottom &&
+            isScrolledAboveTargetTop.current) {
             setShow(true);
             isScrolledAboveTargetTop.current = false;
         }

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

@@ -26,7 +26,8 @@ export function usePrependedMessagesCount(messages, hasDateSeparator) {
         // That in turn leads to incorrect index calculation in VirtualizedMessageList trying to access a message
         // at non-existent index. Therefore, we ignore messages of status "sending" / "failed" in order they are
         // not considered as prepended messages.
-        const firstMsgMovedAfterMessagesInExcludedStatus = !!(currentFirstMessage?.status && STATUSES_EXCLUDED_FROM_PREPEND[currentFirstMessage.status]);
+        const firstMsgMovedAfterMessagesInExcludedStatus = !!(currentFirstMessage?.status &&
+            STATUSES_EXCLUDED_FROM_PREPEND[currentFirstMessage.status]);
         if (noNewMessages || firstMsgMovedAfterMessagesInExcludedStatus) {
             return previousNumItemsPrepended.current;
         }

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

@@ -21,10 +21,14 @@ export const useUnreadMessagesNotificationVirtualized = ({ lastRead, showAlways,
         if (!(firstRenderedMessage && lastRenderedMessage))
             return;
         const scrolledBelowSeparator = !!lastRead &&
-            new Date(firstRenderedMessage.created_at).getTime() > lastRead.getTime();
+            new Date(firstRenderedMessage.created_at).getTime() >
+                lastRead.getTime();
         const scrolledAboveSeparator = !!lastRead &&
-            new Date(lastRenderedMessage.created_at).getTime() < lastRead.getTime();
-        setShow(showAlways ? scrolledBelowSeparator || scrolledAboveSeparator : scrolledBelowSeparator);
+            new Date(lastRenderedMessage.created_at).getTime() <
+                lastRead.getTime();
+        setShow(showAlways
+            ? scrolledBelowSeparator || scrolledAboveSeparator
+            : scrolledBelowSeparator);
     }, [lastRead, showAlways, unreadCount]);
     useEffect(() => {
         if (!unreadCount)

package/dist/components/MessageList/utils.js

@@ -1,4 +1,3 @@
-/* eslint-disable no-continue */
 import { nanoid } from 'nanoid';
 import { CUSTOM_MESSAGE_TYPE } from '../../constants/messageTypes';
 import { isMessageEdited } from '../Message/utils';
@@ -31,20 +30,29 @@ export const processMessages = (params) => {
         if (hideDeletedMessages && message.type === 'deleted') {
             continue;
         }
-        if (setGiphyPreviewMessage && message.type === 'ephemeral' && message.command === 'giphy') {
+        if (setGiphyPreviewMessage &&
+            message.type === 'ephemeral' &&
+            message.command === 'giphy') {
             ephemeralMessagePresent = true;
             setGiphyPreviewMessage(message);
             continue;
         }
         const changes = [];
-        const messageDate = (message.created_at && isDate(message.created_at) && message.created_at.toDateString()) || '';
+        const messageDate = (message.created_at &&
+            isDate(message.created_at) &&
+            message.created_at.toDateString()) ||
+            '';
         const previousMessage = messages[i - 1];
         let prevMessageDate = messageDate;
-        if (enableDateSeparator && previousMessage?.created_at && isDate(previousMessage.created_at)) {
+        if (enableDateSeparator &&
+            previousMessage?.created_at &&
+            isDate(previousMessage.created_at)) {
             prevMessageDate = previousMessage.created_at.toDateString();
         }
         if (!unread && !hideNewMessageSeparator) {
-            unread = (lastRead && message.created_at && new Date(lastRead) < message.created_at) || false;
+            unread =
+                (lastRead && message.created_at && new Date(lastRead) < message.created_at) ||
+                    false;
             // do not show date separator for current user's messages
             if (enableDateSeparator && unread && message.user?.id !== userId) {
                 changes.push({
@@ -155,7 +163,9 @@ export const insertIntro = (messages, headerPosition) => {
     // else loop over the messages
     for (let i = 0; i < messages.length; i += 1) {
         const message = messages[i];
-        const messageTime = message.created_at && isDate(message.created_at) ? message.created_at.getTime() : null;
+        const messageTime = message.created_at && isDate(message.created_at)
+            ? message.created_at.getTime()
+            : null;
         const nextMessage = messages[i + 1];
         const nextMessageTime = nextMessage.created_at && isDate(nextMessage.created_at)
             ? nextMessage.created_at.getTime()
@@ -199,7 +209,8 @@ export const getGroupStyles = (message, previousMessage, nextMessage, noGroupByU
         (maxTimeBetweenGroupedMessages !== undefined &&
             previousMessage.created_at &&
             message.created_at &&
-            new Date(message.created_at).getTime() - new Date(previousMessage.created_at).getTime() >
+            new Date(message.created_at).getTime() -
+                new Date(previousMessage.created_at).getTime() >
                 maxTimeBetweenGroupedMessages);
     const isBottomMessage = !nextMessage ||
         nextMessage.customType === CUSTOM_MESSAGE_TYPE.intro ||
@@ -209,12 +220,14 @@ export const getGroupStyles = (message, previousMessage, nextMessage, noGroupByU
         nextMessage.attachments?.length !== 0 ||
         message.user?.id !== nextMessage.user?.id ||
         nextMessage.deleted_at ||
-        (nextMessage.reaction_groups && Object.keys(nextMessage.reaction_groups).length > 0) ||
+        (nextMessage.reaction_groups &&
+            Object.keys(nextMessage.reaction_groups).length > 0) ||
         isMessageEdited(message) ||
         (maxTimeBetweenGroupedMessages !== undefined &&
             nextMessage.created_at &&
             message.created_at &&
-            new Date(nextMessage.created_at).getTime() - new Date(message.created_at).getTime() >
+            new Date(nextMessage.created_at).getTime() -
+                new Date(message.created_at).getTime() >
                 maxTimeBetweenGroupedMessages);
     if (!isTopMessage && !isBottomMessage) {
         if (message.deleted_at || message.type === 'error')
@@ -239,7 +252,9 @@ export const hasMoreMessagesProbably = (returnedCountMessages, limit) => returne
 // @deprecated
 export const hasNotMoreMessages = (returnedCountMessages, limit) => returnedCountMessages < limit;
 export function isDateSeparatorMessage(message) {
-    return message.customType === CUSTOM_MESSAGE_TYPE.date && !!message.date && isDate(message.date);
+    return (message.customType === CUSTOM_MESSAGE_TYPE.date &&
+        !!message.date &&
+        isDate(message.date));
 }
 export const getIsFirstUnreadMessage = ({ firstUnreadMessageId, isFirstMessage, lastReadDate, lastReadMessageId, message, previousMessage, unreadMessageCount = 0, }) => {
     const createdAtTimestamp = message.created_at && new Date(message.created_at).getTime();
@@ -247,5 +262,7 @@ export const getIsFirstUnreadMessage = ({ firstUnreadMessageId, isFirstMessage,
     const messageIsUnread = !!createdAtTimestamp && !!lastReadTimestamp && createdAtTimestamp > lastReadTimestamp;
     const previousMessageIsLastRead = !!lastReadMessageId && lastReadMessageId === previousMessage?.id;
     return (firstUnreadMessageId === message.id ||
-        (!!unreadMessageCount && messageIsUnread && (isFirstMessage || previousMessageIsLastRead)));
+        (!!unreadMessageCount &&
+            messageIsUnread &&
+            (isFirstMessage || previousMessageIsLastRead)));
 };

package/dist/components/Modal/Modal.d.ts

@@ -7,4 +7,4 @@ export type ModalProps = {
     /** Callback handler for closing of modal. */
     onClose?: (event: React.KeyboardEvent | React.MouseEvent<HTMLButtonElement | HTMLDivElement>) => void;
 };
-export declare const Modal: ({ children, className, onClose, open }: PropsWithChildren<ModalProps>) => React.JSX.Element | null;
+export declare const Modal: ({ children, className, onClose, open, }: PropsWithChildren<ModalProps>) => React.JSX.Element | null;

package/dist/components/Modal/Modal.js

@@ -3,7 +3,7 @@ import React, { useEffect, useRef } from 'react';
 import { FocusScope } from '@react-aria/focus';
 import { CloseIconRound } from './icons';
 import { useTranslationContext } from '../../context';
-export const Modal = ({ children, className, onClose, open }) => {
+export const Modal = ({ children, className, onClose, open, }) => {
     const { t } = useTranslationContext('Modal');
     const innerRef = useRef(null);
     const closeRef = useRef(null);

package/dist/components/Modal/ModalHeader.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import clsx from 'clsx';
 export const ModalHeader = ({ className, close, goBack, title }) => (React.createElement("div", { className: clsx('str-chat__modal-header', className) },
-    goBack && React.createElement("button", { className: 'str-chat__modal-header__go-back-button', onClick: goBack }),
+    goBack && (React.createElement("button", { className: 'str-chat__modal-header__go-back-button', onClick: goBack })),
     React.createElement("div", { className: 'str-chat__modal-header__title' }, title),
     close && React.createElement("button", { className: 'str-chat__modal-header__close-button', onClick: close })));

package/dist/components/Poll/Poll.js

@@ -3,6 +3,6 @@ import { PollContent as DefaultPollContent } from './PollContent';
 import { QuotedPoll as DefaultQuotedPoll } from './QuotedPoll';
 import { PollProvider, useComponentContext } from '../../context';
 export const Poll = ({ isQuoted, poll, }) => {
-    const { PollContent = DefaultPollContent, QuotedPoll = DefaultQuotedPoll, } = useComponentContext();
+    const { PollContent = DefaultPollContent, QuotedPoll = DefaultQuotedPoll } = useComponentContext();
     return poll ? (React.createElement(PollProvider, { poll: poll }, isQuoted ? React.createElement(QuotedPoll, null) : React.createElement(PollContent, null))) : null;
 };

package/dist/components/Poll/PollActions/PollActions.js

@@ -1,9 +1,9 @@
 import React, { useCallback, useState } from 'react';
 import { PollAction } from './PollAction';
-import { AddCommentForm as DefaultAddCommentForm } from './AddCommentForm';
+import { AddCommentForm as DefaultAddCommentForm, } from './AddCommentForm';
 import { SuggestPollOptionForm as DefaultSuggestPollOptionForm, } from './SuggestPollOptionForm';
-import { EndPollDialog as DefaultEndPollDialog } from './EndPollDialog';
-import { PollAnswerList as DefaultPollAnswerList } from './PollAnswerList';
+import { EndPollDialog as DefaultEndPollDialog, } from './EndPollDialog';
+import { PollAnswerList as DefaultPollAnswerList, } from './PollAnswerList';
 import { PollOptionsFullList as DefaultPollOptionsFullList, } from './PollOptionsFullList';
 import { PollResults as DefaultPollResults } from './PollResults';
 import { MAX_OPTIONS_DISPLAYED, MAX_POLL_OPTIONS } from '../constants';
@@ -33,7 +33,9 @@ export const PollActions = ({ AddCommentForm = DefaultAddCommentForm, EndPollDia
                 count: options.length,
             }), closeModal: closeModal, modalIsOpen: modalOpen === 'view-all-options', openModal: () => setModalOpen('view-all-options') },
             React.createElement(PollOptionsFullList, { close: closeModal }))),
-        !is_closed && allow_user_suggested_options && options.length < MAX_POLL_OPTIONS && (React.createElement(PollAction, { buttonText: t('Suggest an option'), closeModal: closeModal, modalClassName: 'str-chat__suggest-poll-option-modal', modalIsOpen: modalOpen === 'suggest-option', openModal: () => setModalOpen('suggest-option') },
+        !is_closed &&
+            allow_user_suggested_options &&
+            options.length < MAX_POLL_OPTIONS && (React.createElement(PollAction, { buttonText: t('Suggest an option'), closeModal: closeModal, modalClassName: 'str-chat__suggest-poll-option-modal', modalIsOpen: modalOpen === 'suggest-option', openModal: () => setModalOpen('suggest-option') },
             React.createElement(SuggestPollOptionForm, { close: closeModal, messageId: message.id }))),
         !is_closed && allow_answers && (React.createElement(PollAction, { buttonText: ownAnswer ? t('Update your comment') : t('Add a comment'), closeModal: closeModal, modalClassName: 'str-chat__add-poll-answer-modal', modalIsOpen: modalOpen === 'add-comment', openModal: () => setModalOpen('add-comment') },
             React.createElement(AddCommentForm, { close: closeModal, messageId: message.id }))),

package/dist/components/Poll/PollActions/PollAnswerList.js

@@ -14,7 +14,7 @@ export const PollAnswerList = ({ close, onUpdateOwnAnswerClick, }) => {
     const { t } = useTranslationContext();
     const { poll } = usePollContext();
     const { is_closed, ownAnswer } = useStateStore(poll.state, pollStateSelector);
-    const { answers, error, hasNextPage, loading, loadMore, } = usePollAnswerPagination();
+    const { answers, error, hasNextPage, loading, loadMore } = usePollAnswerPagination();
     return (React.createElement("div", { className: 'str-chat__modal__poll-answer-list' },
         React.createElement(ModalHeader, { close: close, title: t('Poll comments') }),
         React.createElement("div", { className: 'str-chat__modal__poll-answer-list__body' },

package/dist/components/Poll/PollActions/PollResults/PollOptionVotesList.js

@@ -6,7 +6,7 @@ import { InfiniteScrollPaginator } from '../../../InfiniteScrollPaginator/Infini
 import { PollOptionWithVotesHeader } from './PollOptionWithVotesHeader';
 export const PollOptionVotesList = ({ option, }) => {
     const paginationParams = useMemo(() => ({ filter: { option_id: option.id } }), [option.id]);
-    const { error, hasNextPage, loading, loadMore, votes, } = usePollOptionVotesPagination({
+    const { error, hasNextPage, loading, loadMore, votes } = usePollOptionVotesPagination({
         paginationParams,
     });
     return (React.createElement("div", { className: 'str-chat__poll-option str-chat__poll-option--full-vote-list' },

package/dist/components/Poll/PollActions/PollResults/PollOptionWithLatestVotes.js

@@ -2,8 +2,10 @@ import React from 'react';
 import { PollOptionWithVotesHeader } from './PollOptionWithVotesHeader';
 import { PollVoteListing } from '../../PollVote';
 import { useStateStore } from '../../../../store';
-import { useChannelStateContext, usePollContext, useTranslationContext } from '../../../../context';
-const pollStateSelector = (nextValue) => ({ latest_votes_by_option: nextValue.latest_votes_by_option });
+import { useChannelStateContext, usePollContext, useTranslationContext, } from '../../../../context';
+const pollStateSelector = (nextValue) => ({
+    latest_votes_by_option: nextValue.latest_votes_by_option,
+});
 export const PollOptionWithLatestVotes = ({ countVotesPreview = 5, option, showAllVotes, }) => {
     const { t } = useTranslationContext();
     const { channelCapabilities = {} } = useChannelStateContext('PollOptionWithLatestVotes');

package/dist/components/Poll/PollActions/PollResults/PollResults.js

@@ -26,7 +26,8 @@ export const PollResults = ({ close, }) => {
         React.createElement("div", { className: 'str-chat__modal__poll-results__body' },
             React.createElement("div", { className: 'str-chat__modal__poll-results__title' }, name),
             React.createElement("div", { className: 'str-chat__modal__poll-results__option-list' }, options
-                .sort((next, current) => (vote_counts_by_option[current.id] ?? 0) >= (vote_counts_by_option[next.id] ?? 0)
+                .sort((next, current) => (vote_counts_by_option[current.id] ?? 0) >=
+                (vote_counts_by_option[next.id] ?? 0)
                 ? 1
                 : -1)
                 .map((option) => (React.createElement(PollOptionWithLatestVotes, { key: `poll-option-${option.id}`, option: option, showAllVotes: () => setOptionToView(option) })))))))));

package/dist/components/Poll/PollContent.js

@@ -8,7 +8,7 @@ import { useComponentContext, usePollContext } from '../../context';
 import { useStateStore } from '../../store';
 const pollStateSelectorPollContent = (nextValue) => ({ is_closed: nextValue.is_closed });
 export const PollContent = () => {
-    const { PollHeader = DefaultPollHeader, PollActions = DefaultPollActions, } = useComponentContext();
+    const { PollActions = DefaultPollActions, PollHeader = DefaultPollHeader } = useComponentContext();
     const { poll } = usePollContext();
     const { is_closed } = useStateStore(poll.state, pollStateSelectorPollContent);
     return (React.createElement("div", { className: clsx('str-chat__poll', { 'str-chat__poll--closed': is_closed }) },

package/dist/components/Poll/PollCreationDialog/OptionFieldSet.d.ts

@@ -6,4 +6,4 @@ export type OptionFieldSetProps = {
     setErrors: (fn: (prev: OptionErrors) => OptionErrors) => void;
     setState: (fn: (prev: PollFormState) => PollFormState) => void;
 };
-export declare const OptionFieldSet: ({ errors, options, setErrors, setState }: OptionFieldSetProps) => React.JSX.Element;
+export declare const OptionFieldSet: ({ errors, options, setErrors, setState, }: OptionFieldSetProps) => React.JSX.Element;

package/dist/components/Poll/PollCreationDialog/OptionFieldSet.js

@@ -6,7 +6,7 @@ import { FieldError } from '../../Form/FieldError';
 import { DragAndDropContainer } from '../../DragAndDrop/DragAndDropContainer';
 import { useTranslationContext } from '../../../context';
 const VALIDATION_ERRORS = { 'Option already exists': true };
-export const OptionFieldSet = ({ errors, options, setErrors, setState }) => {
+export const OptionFieldSet = ({ errors, options, setErrors, setState, }) => {
     const { t } = useTranslationContext('OptionFieldSet');
     const findOptionDuplicate = (sourceOption) => {
         const isDuplicateFilter = (option) => !!sourceOption.text.trim() && // do not include empty options into consideration
@@ -15,7 +15,10 @@ export const OptionFieldSet = ({ errors, options, setErrors, setState }) => {
         return options.find(isDuplicateFilter);
     };
     const onSetNewOrder = useCallback((newOrder) => {
-        setState((prev) => ({ ...prev, options: newOrder.map((index) => prev.options[index]) }));
+        setState((prev) => ({
+            ...prev,
+            options: newOrder.map((index) => prev.options[index]),
+        }));
     }, [setState]);
     const draggable = options.length > 1;
     return (React.createElement("fieldset", { className: 'str-chat__form__field str-chat__form__input-fieldset' },
@@ -38,7 +41,9 @@ export const OptionFieldSet = ({ errors, options, setErrors, setState }) => {
                             const shouldAddEmptyOption = prev.options.length < MAX_POLL_OPTIONS &&
                                 (!prev.options ||
                                     (prev.options.slice(i + 1).length === 0 && !!e.target.value));
-                            const shouldRemoveOption = prev.options && prev.options.slice(i + 1).length > 0 && !e.target.value;
+                            const shouldRemoveOption = prev.options &&
+                                prev.options.slice(i + 1).length > 0 &&
+                                !e.target.value;
                             const optionListHead = prev.options ? prev.options.slice(0, i) : [];
                             const optionListTail = shouldAddEmptyOption
                                 ? [{ id: nanoid(), text: '' }]
@@ -55,7 +60,9 @@ export const OptionFieldSet = ({ errors, options, setErrors, setState }) => {
                                 ...prev,
                                 options: [
                                     ...optionListHead,
-                                    ...(shouldRemoveOption ? [] : [{ ...option, text: e.target.value }]),
+                                    ...(shouldRemoveOption
+                                        ? []
+                                        : [{ ...option, text: e.target.value }]),
                                     ...optionListTail,
                                 ],
                             };