stream-chat-react 13.14.1 → 14.0.0-beta.1

package/dist/components/MessageList/VirtualizedMessageList.js

@@ -1,271 +0,0 @@
-import React, { useCallback, useEffect, useMemo, useRef } from 'react';
-import { Virtuoso } from 'react-virtuoso';
-import { GiphyPreviewMessage as DefaultGiphyPreviewMessage } from './GiphyPreviewMessage';
-import { useLastReadData } from './hooks';
-import { useGiphyPreview, useMessageSetKey, useNewMessageNotification, usePrependedMessagesCount, useScrollToBottomOnNewMessage, useShouldForceScrollToBottom, useUnreadMessagesNotificationVirtualized, } from './hooks/VirtualizedMessageList';
-import { useMarkRead } from './hooks/useMarkRead';
-import { MessageNotification as DefaultMessageNotification } from './MessageNotification';
-import { MessageListNotifications as DefaultMessageListNotifications } from './MessageListNotifications';
-import { MessageListMainPanel as DefaultMessageListMainPanel } from './MessageListMainPanel';
-import { getGroupStyles, getLastReceived, processMessages } from './utils';
-import { MessageSimple } from '../Message';
-import { UnreadMessagesNotification as DefaultUnreadMessagesNotification } from './UnreadMessagesNotification';
-import { calculateFirstItemIndex, calculateItemIndex, EmptyPlaceholder, Header, Item, makeItemsRenderedHandler, messageRenderer, } from './VirtualizedMessageListComponents';
-import { UnreadMessagesSeparator as DefaultUnreadMessagesSeparator } from '../MessageList';
-import { DateSeparator as DefaultDateSeparator } from '../DateSeparator';
-import { EventComponent as DefaultMessageSystem } from '../EventComponent';
-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 { VirtualizedMessageListContextProvider } from '../../context/VirtualizedMessageListContext';
-import { DEFAULT_NEXT_CHANNEL_PAGE_SIZE } from '../../constants/limits';
-import { useStableId } from '../UtilityComponents/useStableId';
-import { useLastDeliveredData } from './hooks/useLastDeliveredData';
-import { useLastOwnMessage } from './hooks/useLastOwnMessage';
-function captureResizeObserverExceededError(e) {
-    if (e.message === 'ResizeObserver loop completed with undelivered notifications.' ||
-        e.message === 'ResizeObserver loop limit exceeded') {
-        e.stopImmediatePropagation();
-    }
-}
-function useCaptureResizeObserverExceededError() {
-    useEffect(() => {
-        window.addEventListener('error', captureResizeObserverExceededError);
-        return () => {
-            window.removeEventListener('error', captureResizeObserverExceededError);
-        };
-    }, []);
-}
-function fractionalItemSize(element) {
-    return element.getBoundingClientRect().height;
-}
-function findMessageIndex(messages, id) {
-    return messages.findIndex((message) => message.id === id);
-}
-function calculateInitialTopMostItemIndex(messages, highlightedMessageId) {
-    if (highlightedMessageId) {
-        const index = findMessageIndex(messages, highlightedMessageId);
-        if (index !== -1) {
-            return { align: 'center', index };
-        }
-    }
-    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, openThread, 
-    // TODO: refactor to scrollSeekPlaceHolderConfiguration and components.ScrollSeekPlaceholder, like the Virtuoso Component
-    overscan = 0, reactionDetailsSort, renderText, 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, 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({
-        lastRead: channelUnreadUiState?.last_read,
-        showAlways: !!showUnreadNotificationAlways,
-        unreadCount: channelUnreadUiState?.unread_messages ?? 0,
-    });
-    const { giphyPreviewMessage, setGiphyPreviewMessage } = useGiphyPreview(separateGiphyPreview);
-    const processedMessages = useMemo(() => {
-        if (typeof messages === 'undefined') {
-            return [];
-        }
-        if (disableDateSeparator &&
-            !hideDeletedMessages &&
-            hideNewMessageSeparator &&
-            !separateGiphyPreview) {
-            return messages;
-        }
-        return processMessages({
-            enableDateSeparator: !disableDateSeparator,
-            hideDeletedMessages,
-            hideNewMessageSeparator,
-            lastRead,
-            messages,
-            reviewProcessedMessage,
-            setGiphyPreviewMessage,
-            userId: client.userID || '',
-        });
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [
-        disableDateSeparator,
-        hideDeletedMessages,
-        hideNewMessageSeparator,
-        lastRead,
-        messages,
-        messages?.length,
-        client.userID,
-    ]);
-    const lastOwnMessage = useLastOwnMessage({ messages, ownUserId: client.user?.id });
-    // get the mapping of own messages to array of users who read them
-    const ownMessagesReadByOthers = useLastReadData({
-        channel,
-        lastOwnMessage,
-        messages: messages || [],
-        returnAllReadData,
-    });
-    const ownMessagesDeliveredToOthers = useLastDeliveredData({
-        channel,
-        lastOwnMessage,
-        messages: messages || [],
-        returnAllReadData,
-    });
-    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);
-        if (style && message.id)
-            acc[message.id] = style;
-        return acc;
-    }, {}), 
-    // 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,
-    ]);
-    const { atBottom, isMessageListScrolledToBottom, newMessagesNotification, setIsMessageListScrolledToBottom, setNewMessagesNotification, } = useNewMessageNotification(processedMessages, client.userID, hasMoreNewer);
-    useMarkRead({
-        isMessageListScrolledToBottom,
-        messageListIsThread: !!threadList,
-        wasMarkedUnread: !!channelUnreadUiState?.first_unread_message_id,
-    });
-    const scrollToBottom = useCallback(async () => {
-        if (hasMoreNewer) {
-            await jumpToLatestMessage();
-            return;
-        }
-        if (virtuoso.current) {
-            virtuoso.current.scrollToIndex(processedMessages.length - 1);
-        }
-        setNewMessagesNotification(false);
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [
-        virtuoso,
-        processedMessages,
-        setNewMessagesNotification,
-        // processedMessages were incorrectly rebuilt with a new object identity at some point, hence the .length usage
-        processedMessages.length,
-        hasMoreNewer,
-        jumpToLatestMessage,
-    ]);
-    useScrollToBottomOnNewMessage({
-        messages,
-        scrollToBottom,
-        scrollToLatestMessageOnFocus,
-    });
-    const numItemsPrepended = usePrependedMessagesCount(processedMessages, !disableDateSeparator);
-    const { messageSetKey } = useMessageSetKey({ messages });
-    const shouldForceScrollToBottom = useShouldForceScrollToBottom(processedMessages, client.userID);
-    const handleItemsRendered = useMemo(() => makeItemsRenderedHandler([toggleShowUnreadMessagesNotification], processedMessages), [processedMessages, toggleShowUnreadMessagesNotification]);
-    const followOutput = (isAtBottom) => {
-        if (hasMoreNewer || suppressAutoscroll) {
-            return false;
-        }
-        if (shouldForceScrollToBottom()) {
-            return isAtBottom ? stickToBottomScrollBehavior : 'auto';
-        }
-        // a message from another user has been received - don't scroll to bottom unless already there
-        return isAtBottom ? stickToBottomScrollBehavior : false;
-    };
-    const computeItemKey = useCallback((index, _, { numItemsPrepended, processedMessages }) => processedMessages[calculateItemIndex(index, numItemsPrepended)].id, []);
-    const atBottomStateChange = (isAtBottom) => {
-        atBottom.current = isAtBottom;
-        setIsMessageListScrolledToBottom(isAtBottom);
-        if (isAtBottom) {
-            loadMoreNewer?.(messageLimit);
-            setNewMessagesNotification?.(false);
-        }
-    };
-    const atTopStateChange = (isAtTop) => {
-        if (isAtTop) {
-            loadMore?.(messageLimit);
-        }
-    };
-    useEffect(() => {
-        let scrollTimeout;
-        if (highlightedMessageId) {
-            const index = findMessageIndex(processedMessages, highlightedMessageId);
-            if (index !== -1) {
-                scrollTimeout = setTimeout(() => {
-                    virtuoso.current?.scrollToIndex({ align: 'center', index });
-                }, 0);
-            }
-        }
-        return () => {
-            clearTimeout(scrollTimeout);
-        };
-    }, [highlightedMessageId, processedMessages]);
-    const id = useStableId();
-    if (!processedMessages)
-        return null;
-    const dialogManagerId = threadList
-        ? `virtualized-message-list-dialog-manager-thread-${id}`
-        : `virtualized-message-list-dialog-manager-${id}`;
-    return (React.createElement(VirtualizedMessageListContextProvider, { value: { scrollToBottom } },
-        React.createElement(MessageListMainPanel, null,
-            React.createElement(DialogManagerProvider, { id: dialogManagerId },
-                !threadList && showUnreadMessagesNotification && (React.createElement(UnreadMessagesNotification, { unreadCount: channelUnreadUiState?.unread_messages })),
-                React.createElement("div", { className: customClasses?.virtualizedMessageList || 'str-chat__virtual-list' },
-                    React.createElement(Virtuoso, { atBottomStateChange: atBottomStateChange, atBottomThreshold: 100, atTopStateChange: atTopStateChange, atTopThreshold: 100, className: 'str-chat__message-list-scroll', components: {
-                            EmptyPlaceholder,
-                            Header,
-                            Item,
-                            ...virtuosoComponentsFromProps,
-                        }, computeItemKey: computeItemKey, context: {
-                            additionalMessageInputProps,
-                            closeReactionSelectorOnClick,
-                            customClasses,
-                            customMessageActions,
-                            customMessageRenderer,
-                            DateSeparator,
-                            firstUnreadMessageId: channelUnreadUiState?.first_unread_message_id,
-                            formatDate,
-                            head,
-                            lastOwnMessage,
-                            lastReadDate: channelUnreadUiState?.last_read,
-                            lastReadMessageId: channelUnreadUiState?.last_read_message_id,
-                            lastReceivedMessageId,
-                            loadingMore,
-                            Message: MessageUIComponent,
-                            messageActions,
-                            messageGroupStyles,
-                            MessageSystem,
-                            numItemsPrepended,
-                            openThread,
-                            ownMessagesDeliveredToOthers,
-                            ownMessagesReadByOthers,
-                            processedMessages,
-                            reactionDetailsSort,
-                            renderText,
-                            returnAllReadData,
-                            shouldGroupByUser,
-                            sortReactionDetails,
-                            sortReactions,
-                            threadList,
-                            unreadMessageCount: channelUnreadUiState?.unread_messages,
-                            UnreadMessagesSeparator,
-                            virtuosoRef: virtuoso,
-                        }, firstItemIndex: calculateFirstItemIndex(numItemsPrepended), followOutput: followOutput, increaseViewportBy: { bottom: 200, top: 0 }, initialTopMostItemIndex: calculateInitialTopMostItemIndex(processedMessages, highlightedMessageId), itemContent: messageRenderer, itemSize: fractionalItemSize, itemsRendered: handleItemsRendered, key: messageSetKey, overscan: overscan, ref: virtuoso, style: { overflowX: 'hidden' }, totalCount: processedMessages.length, ...overridingVirtuosoProps, ...(scrollSeekPlaceHolder ? { scrollSeek: scrollSeekPlaceHolder } : {}), ...(defaultItemHeight ? { defaultItemHeight } : {}) }))),
-            TypingIndicator && React.createElement(TypingIndicator, null)),
-        React.createElement(MessageListNotifications, { hasNewMessages: newMessagesNotification, isMessageListScrolledToBottom: isMessageListScrolledToBottom, isNotAtLatestMessageSet: hasMoreNewer, MessageNotification: MessageNotification, notifications: notifications, scrollToBottom: scrollToBottom, threadList: threadList, unreadCount: threadList ? undefined : channelUnreadUiState?.unread_messages }),
-        giphyPreviewMessage && React.createElement(GiphyPreviewMessage, { message: giphyPreviewMessage })));
-};
-/**
- * The VirtualizedMessageList component renders a list of messages in a virtualized list.
- * 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 { 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.d.ts

@@ -1,17 +0,0 @@
-/// <reference types="lodash" />
-import React from 'react';
-import type { ItemProps, ListItem } from 'react-virtuoso';
-import type { RenderedMessage } from './utils';
-import type { VirtuosoContext } from './VirtualizedMessageList';
-import type { UnknownType } from '../../types/types';
-export declare function calculateItemIndex(virtuosoIndex: number, numItemsPrepended: number): number;
-export declare function calculateFirstItemIndex(numItemsPrepended: number): number;
-export declare const makeItemsRenderedHandler: (renderedItemsActions: Array<(msg: RenderedMessage[]) => void>, processedMessages: RenderedMessage[]) => import("lodash").DebouncedFunc<(items: ListItem<UnknownType>[]) => void>;
-type CommonVirtuosoComponentProps = {
-    context?: VirtuosoContext;
-};
-export declare const Item: ({ context, ...props }: ItemProps & CommonVirtuosoComponentProps) => React.JSX.Element;
-export declare const Header: ({ context }: CommonVirtuosoComponentProps) => React.JSX.Element;
-export declare const EmptyPlaceholder: ({ context }: CommonVirtuosoComponentProps) => React.JSX.Element | null;
-export declare const messageRenderer: (virtuosoIndex: number, _data: UnknownType, virtuosoContext: VirtuosoContext) => React.JSX.Element | null;
-export {};

package/dist/components/MessageList/VirtualizedMessageListComponents.js

@@ -1,92 +0,0 @@
-import clsx from 'clsx';
-import throttle from 'lodash.throttle';
-import React from 'react';
-import { EmptyStateIndicator as DefaultEmptyStateIndicator } from '../EmptyStateIndicator';
-import { LoadingIndicator as DefaultLoadingIndicator } from '../Loading';
-import { isMessageEdited, Message } from '../Message';
-import { useComponentContext } from '../../context';
-import { getIsFirstUnreadMessage, isDateSeparatorMessage, isIntroMessage } from './utils';
-const PREPEND_OFFSET = 10 ** 7;
-export function calculateItemIndex(virtuosoIndex, numItemsPrepended) {
-    return virtuosoIndex + numItemsPrepended - PREPEND_OFFSET;
-}
-export function calculateFirstItemIndex(numItemsPrepended) {
-    return PREPEND_OFFSET - numItemsPrepended;
-}
-export const makeItemsRenderedHandler = (renderedItemsActions, processedMessages) => throttle((items) => {
-    const renderedMessages = items
-        .map((item) => {
-        if (!item.originalIndex)
-            return undefined;
-        return processedMessages[calculateItemIndex(item.originalIndex, PREPEND_OFFSET)];
-    })
-        .filter((msg) => !!msg);
-    renderedItemsActions.forEach((action) => action(renderedMessages));
-}, 200);
-// using 'display: inline-block'
-// traps CSS margins of the item elements, preventing incorrect item measurements
-export const Item = ({ context, ...props }) => {
-    if (!context)
-        return React.createElement(React.Fragment, null);
-    const message = context.processedMessages[calculateItemIndex(props['data-item-index'], context.numItemsPrepended)];
-    const groupStyles = context.messageGroupStyles[message.id];
-    return (React.createElement("div", { ...props, className: context?.customClasses?.virtualMessage ||
-            clsx('str-chat__virtual-list-message-wrapper str-chat__li', {
-                [`str-chat__li--${groupStyles}`]: groupStyles,
-            }) }));
-};
-export const Header = ({ context }) => {
-    const { LoadingIndicator = DefaultLoadingIndicator } = useComponentContext('VirtualizedMessageListHeader');
-    return (React.createElement(React.Fragment, null,
-        context?.head,
-        context?.loadingMore && LoadingIndicator && (React.createElement("div", { className: 'str-chat__virtual-list__loading' },
-            React.createElement(LoadingIndicator, { size: 20 })))));
-};
-export const EmptyPlaceholder = ({ context }) => {
-    const { EmptyStateIndicator = DefaultEmptyStateIndicator } = useComponentContext('VirtualizedMessageList');
-    // prevent showing that there are no messages if there actually are messages (for some reason virtuoso decides to render empty placeholder first, even though it has the totalCount prop > 0)
-    if (typeof context?.processedMessages !== 'undefined' &&
-        context.processedMessages.length > 0)
-        return null;
-    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, lastOwnMessage, lastReadDate, lastReadMessageId, lastReceivedMessageId, Message: MessageUIComponent, messageActions, messageGroupStyles, MessageSystem, numItemsPrepended, openThread, ownMessagesDeliveredToOthers, ownMessagesReadByOthers, processedMessages: messageList, reactionDetailsSort, renderText, returnAllReadData, shouldGroupByUser, sortReactionDetails, sortReactions, threadList, unreadMessageCount = 0, UnreadMessagesSeparator, virtuosoRef, } = virtuosoContext;
-    const streamMessageIndex = calculateItemIndex(virtuosoIndex, numItemsPrepended);
-    if (customMessageRenderer) {
-        return customMessageRenderer(messageList, streamMessageIndex);
-    }
-    const message = messageList[streamMessageIndex];
-    if (!message || isIntroMessage(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;
-    }
-    if (message.type === 'system') {
-        return MessageSystem ? React.createElement(MessageSystem, { message: message }) : null;
-    }
-    const maybePrevMessage = messageList[streamMessageIndex - 1];
-    const maybeNextMessage = messageList[streamMessageIndex + 1];
-    const groupedByUser = shouldGroupByUser &&
-        streamMessageIndex > 0 &&
-        message.user?.id === maybePrevMessage?.user?.id;
-    // FIXME: firstOfGroup & endOfGroup should be derived from groupStyles which apply a more complex logic
-    const firstOfGroup = shouldGroupByUser &&
-        (message.user?.id !== maybePrevMessage?.user?.id ||
-            (maybePrevMessage && isMessageEdited(maybePrevMessage)));
-    const endOfGroup = shouldGroupByUser &&
-        (message.user?.id !== maybeNextMessage?.user?.id || isMessageEdited(message));
-    const isFirstUnreadMessage = getIsFirstUnreadMessage({
-        firstUnreadMessageId,
-        isFirstMessage: streamMessageIndex === 0,
-        lastReadDate,
-        lastReadMessageId,
-        message,
-        previousMessage: streamMessageIndex ? messageList[streamMessageIndex - 1] : undefined,
-        unreadMessageCount,
-    });
-    return (React.createElement(React.Fragment, null,
-        isFirstUnreadMessage && (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, deliveredTo: ownMessagesDeliveredToOthers[message.id] || [], endOfGroup: endOfGroup, firstOfGroup: firstOfGroup, formatDate: formatDate, groupedByUser: groupedByUser, groupStyles: [messageGroupStyles[message.id] ?? ''], lastOwnMessage: lastOwnMessage, lastReceivedId: lastReceivedMessageId, message: message, Message: MessageUIComponent, messageActions: messageActions, openThread: openThread, reactionDetailsSort: reactionDetailsSort, readBy: ownMessagesReadByOthers[message.id] || [], renderText: renderText, returnAllReadData: returnAllReadData, sortReactionDetails: sortReactionDetails, sortReactions: sortReactions, threadList: threadList })));
-};

package/dist/components/MessageList/hooks/MessageList/index.d.ts

@@ -1,5 +0,0 @@
-export * from './useEnrichedMessages';
-export * from './useMessageListElements';
-export * from './useMessageListScrollManager';
-export * from './useScrollLocationLogic';
-export * from './useUnreadMessagesNotification';

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

@@ -1,5 +0,0 @@
-export * from './useEnrichedMessages';
-export * from './useMessageListElements';
-export * from './useMessageListScrollManager';
-export * from './useScrollLocationLogic';
-export * from './useUnreadMessagesNotification';

package/dist/components/MessageList/hooks/MessageList/useEnrichedMessages.d.ts

@@ -1,17 +0,0 @@
-import type { GroupStyle, ProcessMessagesParams, RenderedMessage } from '../../utils';
-import type { Channel, LocalMessage } from 'stream-chat';
-export declare const useEnrichedMessages: (args: {
-    channel: Channel;
-    disableDateSeparator: boolean;
-    hideDeletedMessages: boolean;
-    hideNewMessageSeparator: boolean;
-    messages: LocalMessage[];
-    noGroupByUser: boolean;
-    groupStyles?: (message: RenderedMessage, previousMessage: RenderedMessage, nextMessage: RenderedMessage, noGroupByUser: boolean, maxTimeBetweenGroupedMessages?: number) => GroupStyle;
-    headerPosition?: number;
-    maxTimeBetweenGroupedMessages?: number;
-    reviewProcessedMessage?: ProcessMessagesParams['reviewProcessedMessage'];
-}) => {
-    messageGroupStyles: Record<string, GroupStyle>;
-    messages: RenderedMessage[];
-};

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

@@ -1,35 +0,0 @@
-import { useMemo } from 'react';
-import { getGroupStyles, insertIntro, processMessages } from '../../utils';
-import { useChatContext } from '../../../../context/ChatContext';
-import { useComponentContext } from '../../../../context/ComponentContext';
-export const useEnrichedMessages = (args) => {
-    const { channel, disableDateSeparator, groupStyles, headerPosition, hideDeletedMessages, hideNewMessageSeparator, maxTimeBetweenGroupedMessages, messages, noGroupByUser, reviewProcessedMessage, } = args;
-    const { client } = useChatContext('useEnrichedMessages');
-    const { HeaderComponent } = useComponentContext('useEnrichedMessages');
-    const lastRead = useMemo(() => channel.lastRead?.(), [channel]);
-    const enableDateSeparator = !disableDateSeparator;
-    let messagesWithDates = !enableDateSeparator && !hideDeletedMessages && hideNewMessageSeparator
-        ? messages
-        : processMessages({
-            enableDateSeparator,
-            hideDeletedMessages,
-            hideNewMessageSeparator,
-            lastRead,
-            messages,
-            reviewProcessedMessage,
-            userId: client.userID || '',
-        });
-    if (HeaderComponent) {
-        messagesWithDates = insertIntro(messagesWithDates, headerPosition);
-    }
-    const groupStylesFn = groupStyles || getGroupStyles;
-    const messageGroupStyles = useMemo(() => messagesWithDates.reduce((acc, message, i) => {
-        const style = groupStylesFn(message, messagesWithDates[i - 1], messagesWithDates[i + 1], noGroupByUser, maxTimeBetweenGroupedMessages);
-        if (style)
-            acc[message.id] = style;
-        return acc;
-    }, {}), 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [maxTimeBetweenGroupedMessages, messagesWithDates, noGroupByUser]);
-    return { messageGroupStyles, messages: messagesWithDates };
-};

package/dist/components/MessageList/hooks/MessageList/useMessageListElements.d.ts

@@ -1,18 +0,0 @@
-import type React from 'react';
-import type { GroupStyle, RenderedMessage } from '../../utils';
-import type { LocalMessage } from 'stream-chat';
-import type { ChannelUnreadUiState } from '../../../../types/types';
-import type { MessageRenderer, SharedMessageProps } from '../../renderMessages';
-type UseMessageListElementsProps = {
-    messages: LocalMessage[];
-    enrichedMessages: RenderedMessage[];
-    internalMessageProps: SharedMessageProps;
-    messageGroupStyles: Record<string, GroupStyle>;
-    renderMessages: MessageRenderer;
-    returnAllReadData: boolean;
-    threadList: boolean;
-    channelUnreadUiState?: ChannelUnreadUiState;
-    lastOwnMessage?: LocalMessage;
-};
-export declare const useMessageListElements: (props: UseMessageListElementsProps) => React.ReactNode[];
-export {};

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

@@ -1,53 +0,0 @@
-import { useMemo } from 'react';
-import { useLastReadData } from '../useLastReadData';
-import { getLastReceived } from '../../utils';
-import { useChatContext } from '../../../../context/ChatContext';
-import { useComponentContext } from '../../../../context/ComponentContext';
-import { useChannelStateContext } from '../../../../context';
-import { useLastDeliveredData } from '../useLastDeliveredData';
-export const useMessageListElements = (props) => {
-    const { channelUnreadUiState, enrichedMessages, internalMessageProps, lastOwnMessage, messageGroupStyles, messages, renderMessages, returnAllReadData, threadList, } = props;
-    const { customClasses } = useChatContext('useMessageListElements');
-    const { channel } = useChannelStateContext();
-    const components = useComponentContext('useMessageListElements');
-    // get the readData, but only for messages submitted by the user themselves
-    const readData = useLastReadData({
-        channel,
-        lastOwnMessage,
-        messages,
-        returnAllReadData,
-    });
-    const ownMessagesDeliveredToOthers = useLastDeliveredData({
-        channel,
-        lastOwnMessage,
-        messages,
-        returnAllReadData,
-    });
-    const lastReceivedMessageId = useMemo(() => getLastReceived(enrichedMessages), [enrichedMessages]);
-    const elements = useMemo(() => renderMessages({
-        channelUnreadUiState,
-        components,
-        customClasses,
-        lastOwnMessage,
-        lastReceivedMessageId,
-        messageGroupStyles,
-        messages: enrichedMessages,
-        ownMessagesDeliveredToOthers,
-        readData,
-        sharedMessageProps: { ...internalMessageProps, returnAllReadData, threadList },
-    }), 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [
-        enrichedMessages,
-        internalMessageProps,
-        lastOwnMessage,
-        lastReceivedMessageId,
-        messageGroupStyles,
-        channelUnreadUiState,
-        readData,
-        renderMessages,
-        returnAllReadData,
-        threadList,
-    ]);
-    return elements;
-};

package/dist/components/MessageList/hooks/MessageList/useMessageListScrollManager.d.ts

@@ -1,15 +0,0 @@
-import type { LocalMessage } from 'stream-chat';
-export type ContainerMeasures = {
-    offsetHeight: number;
-    scrollHeight: number;
-};
-export type UseMessageListScrollManagerParams = {
-    loadMoreScrollThreshold: number;
-    messages: LocalMessage[];
-    onScrollBy: (scrollBy: number) => void;
-    scrollContainerMeasures: () => ContainerMeasures;
-    scrolledUpThreshold: number;
-    scrollToBottom: () => void;
-    showNewMessages: () => void;
-};
-export declare function useMessageListScrollManager(params: UseMessageListScrollManagerParams): (scrollTopValue: number) => void;

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

@@ -1,59 +0,0 @@
-import { useLayoutEffect, useRef } from 'react';
-import { useChatContext } from '../../../../context/ChatContext';
-// FIXME: change this generic name to something like useAdjustScrollPositionToListSize
-export function useMessageListScrollManager(params) {
-    const { loadMoreScrollThreshold, onScrollBy, scrollContainerMeasures, scrolledUpThreshold, scrollToBottom, showNewMessages, } = params;
-    const { client } = useChatContext('useMessageListScrollManager');
-    const measures = useRef({
-        offsetHeight: 0,
-        scrollHeight: 0,
-    });
-    const messages = useRef(undefined);
-    const scrollTop = useRef(0);
-    useLayoutEffect(() => {
-        const prevMeasures = measures.current;
-        const prevMessages = messages.current;
-        const newMessages = params.messages;
-        const lastNewMessage = newMessages[newMessages.length - 1] || {};
-        const lastPrevMessage = prevMessages?.[prevMessages.length - 1];
-        const newMeasures = scrollContainerMeasures();
-        const wasAtBottom = prevMeasures.scrollHeight - prevMeasures.offsetHeight - scrollTop.current <
-            scrolledUpThreshold;
-        if (typeof prevMessages !== 'undefined') {
-            if (prevMessages.length < newMessages.length) {
-                // messages added to the top
-                if (lastPrevMessage?.id === lastNewMessage.id) {
-                    if (scrollTop.current < loadMoreScrollThreshold) {
-                        const listHeightDelta = newMeasures.scrollHeight - prevMeasures.scrollHeight;
-                        onScrollBy(listHeightDelta);
-                    }
-                }
-                // messages added to the bottom
-                else {
-                    const lastMessageIsFromCurrentUser = lastNewMessage.user?.id === client.userID;
-                    if (lastMessageIsFromCurrentUser || wasAtBottom) {
-                        scrollToBottom();
-                    }
-                    else {
-                        showNewMessages();
-                    }
-                }
-            }
-            // 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 hasNewReplies = lastPrevMessage?.reply_count !== lastNewMessage.reply_count;
-                if ((hasNewReactions || hasNewReplies) && wasAtBottom) {
-                    scrollToBottom();
-                }
-            }
-        }
-        messages.current = newMessages;
-        measures.current = newMeasures;
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [measures, messages, params.messages]);
-    return (scrollTopValue) => {
-        scrollTop.current = scrollTopValue;
-    };
-}

package/dist/components/MessageList/hooks/MessageList/useScrollLocationLogic.d.ts

@@ -1,17 +0,0 @@
-import type React from 'react';
-import type { LocalMessage } from 'stream-chat';
-export type UseScrollLocationLogicParams = {
-    hasMoreNewer: boolean;
-    listElement: HTMLDivElement | null;
-    loadMoreScrollThreshold: number;
-    suppressAutoscroll: boolean;
-    messages?: LocalMessage[];
-    scrolledUpThreshold?: number;
-};
-export declare const useScrollLocationLogic: (params: UseScrollLocationLogicParams) => {
-    hasNewMessages: boolean;
-    isMessageListScrolledToBottom: boolean;
-    onScroll: (event: React.UIEvent<HTMLDivElement>) => void;
-    scrollToBottom: () => void;
-    wrapperRect: DOMRect | undefined;
-};