stream-chat-react 12.10.0 → 12.11.1

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

@@ -1,6 +1,5 @@
 // const defaults = useChannelListShapeDefaults();
 import { useCallback, useEffect, useMemo, useRef } from 'react';
-import uniqBy from 'lodash.uniqby';
 import { extractSortValue, findLastPinnedChannelIndex, isChannelArchived, isChannelPinned, moveChannelUpwards, shouldConsiderArchivedChannels, shouldConsiderPinnedChannels, } from '../utils';
 import { useChatContext } from '../../../context';
 import { getChannel } from '../../../utils';
@@ -77,7 +76,6 @@ export const useChannelListShapeDefaults = () => {
         setChannels((channels) => moveChannelUpwards({
             channels,
             channelToMove: channel,
-            channelToMoveIndexWithinChannels: -1,
             sort,
         }));
     }, [client]);
@@ -103,7 +101,6 @@ export const useChannelListShapeDefaults = () => {
         setChannels((channels) => moveChannelUpwards({
             channels,
             channelToMove: channel,
-            channelToMoveIndexWithinChannels: -1,
             sort,
         }));
     }, [client]);
@@ -114,13 +111,19 @@ export const useChannelListShapeDefaults = () => {
         setChannels((channels) => channels.filter((channel) => channel.cid !== event.channel?.cid));
     }, []);
     const handleMemberUpdated = useCallback(({ event, filters, lockChannelOrder, setChannels, sort, }) => {
-        if (!event.member?.user || event.member.user.id !== client.userID || !event.channel_type) {
+        if (!event.member?.user ||
+            event.member.user.id !== client.userID ||
+            !event.channel_type) {
             return;
         }
         const channelType = event.channel_type;
         const channelId = event.channel_id;
         const considerPinnedChannels = shouldConsiderPinnedChannels(sort);
         const considerArchivedChannels = shouldConsiderArchivedChannels(filters);
+        // `pinned_at` nor `archived` properties are set or channel list order is locked, return early
+        if ((!considerPinnedChannels && !considerArchivedChannels) || lockChannelOrder) {
+            return;
+        }
         const pinnedAtSort = extractSortValue({ atIndex: 0, sort, targetKey: 'pinned_at' });
         setChannels((currentChannels) => {
             const targetChannel = client.channel(channelType, channelId);
@@ -129,9 +132,6 @@ export const useChannelListShapeDefaults = () => {
             const targetChannelExistsWithinList = targetChannelIndex >= 0;
             const isTargetChannelArchived = isChannelArchived(targetChannel);
             const isTargetChannelPinned = isChannelPinned(targetChannel);
-            // handle pinning
-            if (!considerPinnedChannels || lockChannelOrder)
-                return currentChannels;
             const newChannels = [...currentChannels];
             if (targetChannelExistsWithinList) {
                 newChannels.splice(targetChannelIndex, 1);
@@ -159,18 +159,27 @@ export const useChannelListShapeDefaults = () => {
     }, [client]);
     const handleChannelDeleted = useCallback((p) => shared(p), []);
     const handleChannelHidden = useCallback((p) => shared(p), []);
-    const handleChannelVisible = useCallback(async ({ customHandler, event, setChannels }) => {
+    const handleChannelVisible = useCallback(async ({ customHandler, event, filters, setChannels, sort, }) => {
         if (typeof customHandler === 'function') {
             return customHandler(setChannels, event);
         }
-        if (event.type && event.channel_type && event.channel_id) {
-            const channel = await getChannel({
-                client,
-                id: event.channel_id,
-                type: event.channel_type,
-            });
-            setChannels((channels) => uniqBy([channel, ...channels], 'cid'));
+        if (!event.channel) {
+            return;
         }
+        const channel = await getChannel({
+            client,
+            id: event.channel.id,
+            type: event.channel.type,
+        });
+        const considerArchivedChannels = shouldConsiderArchivedChannels(filters);
+        if (isChannelArchived(channel) && considerArchivedChannels && !filters.archived) {
+            return;
+        }
+        setChannels((channels) => moveChannelUpwards({
+            channels,
+            channelToMove: channel,
+            sort,
+        }));
     }, [client]);
     const handleChannelTruncated = useCallback(({ customHandler, event, setChannels }) => {
         if (typeof customHandler === 'function') {
@@ -193,7 +202,8 @@ export const useChannelListShapeDefaults = () => {
                 newChannels[channelIndex].data = {
                     ...event.channel,
                     hidden: event.channel?.hidden ?? newChannels[channelIndex].data?.hidden,
-                    own_capabilities: event.channel?.own_capabilities ?? newChannels[channelIndex].data?.own_capabilities,
+                    own_capabilities: event.channel?.own_capabilities ??
+                        newChannels[channelIndex].data?.own_capabilities,
                 };
                 return [...newChannels];
             }
@@ -300,16 +310,34 @@ export const usePrepareShapeHandlers = ({ allowNewMessagesFromUnfilteredChannels
                 });
                 break;
             case 'channel.hidden':
-                defaults.handleChannelHidden({ customHandler: onChannelHidden, event, setChannels });
+                defaults.handleChannelHidden({
+                    customHandler: onChannelHidden,
+                    event,
+                    setChannels,
+                });
                 break;
             case 'channel.visible':
-                defaults.handleChannelVisible({ customHandler: onChannelVisible, event, setChannels });
+                defaults.handleChannelVisible({
+                    customHandler: onChannelVisible,
+                    event,
+                    filters,
+                    setChannels,
+                    sort,
+                });
                 break;
             case 'channel.truncated':
-                defaults.handleChannelTruncated({ customHandler: onChannelTruncated, event, setChannels });
+                defaults.handleChannelTruncated({
+                    customHandler: onChannelTruncated,
+                    event,
+                    setChannels,
+                });
                 break;
             case 'channel.updated':
-                defaults.handleChannelUpdated({ customHandler: onChannelUpdated, event, setChannels });
+                defaults.handleChannelUpdated({
+                    customHandler: onChannelUpdated,
+                    event,
+                    setChannels,
+                });
                 break;
             case 'user.presence.changed':
                 defaults.handleUserPresenceChanged({ event, setChannels });

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

@@ -11,7 +11,8 @@ export const useChannelUpdatedListener = (setChannels, customHandler, forceUpdat
                     newChannels[channelIndex].data = {
                         ...event.channel,
                         hidden: event.channel?.hidden ?? newChannels[channelIndex].data?.hidden,
-                        own_capabilities: event.channel?.own_capabilities ?? newChannels[channelIndex].data?.own_capabilities,
+                        own_capabilities: event.channel?.own_capabilities ??
+                            newChannels[channelIndex].data?.own_capabilities,
                     };
                     return [...newChannels];
                 }

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

@@ -12,7 +12,9 @@ export const useMessageNewListener = (setChannels, customHandler, lockChannelOrd
             else {
                 setChannels((channels) => {
                     const channelInList = channels.filter((channel) => channel.cid === event.cid).length > 0;
-                    if (!channelInList && allowNewMessagesFromUnfilteredChannels && event.channel_type) {
+                    if (!channelInList &&
+                        allowNewMessagesFromUnfilteredChannels &&
+                        event.channel_type) {
                         const channel = client.channel(event.channel_type, event.channel_id);
                         return uniqBy([channel, ...channels], 'cid');
                     }

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

@@ -12,7 +12,7 @@ export const usePaginatedChannels = (client, filters, sort, options, activeChann
     const lastRecoveryTimestamp = useRef(undefined);
     const recoveryThrottleInterval = recoveryThrottleIntervalMs < MIN_RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS
         ? MIN_RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS
-        : recoveryThrottleIntervalMs ?? RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS;
+        : (recoveryThrottleIntervalMs ?? RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS);
     // memoize props
     const filterString = useMemo(() => JSON.stringify(filters), [filters]);
     const sortString = useMemo(() => JSON.stringify(sort), [sort]);
@@ -64,7 +64,9 @@ export const usePaginatedChannels = (client, filters, sort, options, activeChann
         const timeElapsedSinceLastRecoveryMs = lastRecoveryTimestamp.current
             ? now - lastRecoveryTimestamp.current
             : 0;
-        if (!isFirstRecovery && timeElapsedSinceLastRecoveryMs < recoveryThrottleInterval && !error) {
+        if (!isFirstRecovery &&
+            timeElapsedSinceLastRecoveryMs < recoveryThrottleInterval &&
+            !error) {
             return;
         }
         lastRecoveryTimestamp.current = now;

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

@@ -2,7 +2,7 @@ import { useCallback } from 'react';
 import { useSyncExternalStore } from 'use-sync-external-store/shim';
 // eslint-disable-next-line @typescript-eslint/no-empty-function
 const noop = () => { };
-export function useSelectedChannelState({ channel, stateChangeEventKeys = ['all'], selector, }) {
+export function useSelectedChannelState({ channel, selector, stateChangeEventKeys = ['all'], }) {
     const subscribe = useCallback((onStoreChange) => {
         if (!channel)
             return noop;

package/dist/components/ChannelPreview/ChannelPreview.js

@@ -6,9 +6,9 @@ import { useChannelPreviewInfo } from './hooks/useChannelPreviewInfo';
 import { getLatestMessagePreview as defaultGetLatestMessagePreview } from './utils';
 import { useChatContext } from '../../context/ChatContext';
 import { useTranslationContext } from '../../context/TranslationContext';
-import { useMessageDeliveryStatus } from './hooks/useMessageDeliveryStatus';
+import { useMessageDeliveryStatus, } from './hooks/useMessageDeliveryStatus';
 export const ChannelPreview = (props) => {
-    const { channel, Preview = ChannelPreviewMessenger, channelUpdateCount, getLatestMessagePreview = defaultGetLatestMessagePreview, } = props;
+    const { channel, channelUpdateCount, getLatestMessagePreview = defaultGetLatestMessagePreview, Preview = ChannelPreviewMessenger, } = props;
     const { channel: activeChannel, client, isMessageAIGenerated, setActiveChannel, } = useChatContext('ChannelPreview');
     const { t, userLanguage } = useTranslationContext('ChannelPreview');
     const { displayImage, displayTitle, groupChannelDisplayInfo } = useChannelPreviewInfo({

package/dist/components/ChannelPreview/ChannelPreviewMessenger.js

@@ -5,7 +5,7 @@ import { Avatar as DefaultAvatar } from '../Avatar';
 import { useComponentContext } from '../../context';
 const UnMemoizedChannelPreviewMessenger = (props) => {
     const { active, Avatar = DefaultAvatar, channel, className: customClassName = '', displayImage, displayTitle, groupChannelDisplayInfo, latestMessagePreview, onSelect: customOnSelectChannel, setActiveChannel, unread, watchers, } = props;
-    const { ChannelPreviewActionButtons = DefaultChannelPreviewActionButtons, } = useComponentContext();
+    const { ChannelPreviewActionButtons = DefaultChannelPreviewActionButtons } = useComponentContext();
     const channelPreviewButton = useRef(null);
     const avatarName = displayTitle || channel.state.messages[channel.state.messages.length - 1]?.user?.id;
     const onSelectChannel = (e) => {

package/dist/components/ChannelPreview/icons.js

@@ -1,4 +1,3 @@
-/* eslint-disable react/display-name */
 import React from 'react';
 export const Icon = {
     ArchiveBox: (props) => (React.createElement("svg", { className: 'str-chat__icon str-chat__icon--archive-box', fill: 'currentColor', viewBox: '0 0 512 512', xmlns: 'http://www.w3.org/2000/svg', ...props },

package/dist/components/ChannelPreview/utils.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import ReactMarkdown from 'react-markdown';
-export const renderPreviewText = (text) => React.createElement(ReactMarkdown, { skipHtml: true }, text);
+export const renderPreviewText = (text) => (React.createElement(ReactMarkdown, { skipHtml: true }, text));
 const getLatestPollVote = (latestVotesByOption) => {
     let latestVote;
     for (const optionVotes of Object.values(latestVotesByOption)) {
@@ -27,7 +27,7 @@ export const getLatestMessagePreview = (channel, t, userLanguage = 'en', isMessa
         if (!poll.vote_count) {
             const createdBy = poll.created_by?.id === channel.getClient().userID
                 ? t('You')
-                : poll.created_by?.name ?? t('Poll');
+                : (poll.created_by?.name ?? t('Poll'));
             return t('📊 {{createdBy}} created: {{ pollName}}', {
                 createdBy,
                 pollName: poll.name,
@@ -41,7 +41,7 @@ export const getLatestMessagePreview = (channel, t, userLanguage = 'en', isMessa
                     pollOptionText: option.text,
                     votedBy: latestVote?.user?.id === channel.getClient().userID
                         ? t('You')
-                        : latestVote.user?.name ?? t('Poll'),
+                        : (latestVote.user?.name ?? t('Poll')),
                 });
             }
         }

package/dist/components/ChannelSearch/ChannelSearch.js

@@ -1,13 +1,15 @@
 import clsx from 'clsx';
 import React from 'react';
-import { useChannelSearch } from './hooks/useChannelSearch';
+import { useChannelSearch, } from './hooks/useChannelSearch';
 import { SearchBar as DefaultSearchBar } from './SearchBar';
 import { SearchInput as DefaultSearchInput, } from './SearchInput';
 import { SearchResults } from './SearchResults';
 const UnMemoizedChannelSearch = (props) => {
-    const { AppMenu, ClearInputIcon, ExitSearchIcon, MenuIcon, placeholder, popupResults = false, SearchBar = DefaultSearchBar, SearchEmpty, SearchInput = DefaultSearchInput, SearchLoading, SearchInputIcon, SearchResultItem, SearchResultsList, SearchResultsHeader, ...channelSearchParams } = props;
+    const { AppMenu, ClearInputIcon, ExitSearchIcon, MenuIcon, placeholder, popupResults = false, SearchBar = DefaultSearchBar, SearchEmpty, SearchInput = DefaultSearchInput, SearchInputIcon, SearchLoading, SearchResultItem, SearchResultsHeader, SearchResultsList, ...channelSearchParams } = props;
     const { activateSearch, clearState, exitSearch, inputIsFocused, inputRef, onSearch, query, results, searchBarRef, searching, selectResult, } = useChannelSearch(channelSearchParams);
-    return (React.createElement("div", { className: clsx('str-chat__channel-search', popupResults ? 'str-chat__channel-search--popup' : 'str-chat__channel-search--inline', {
+    return (React.createElement("div", { className: clsx('str-chat__channel-search', popupResults
+            ? 'str-chat__channel-search--popup'
+            : 'str-chat__channel-search--inline', {
             'str-chat__channel-search--with-results': results.length > 0,
         }), "data-testid": 'channel-search' },
         React.createElement(SearchBar, { activateSearch: activateSearch, AppMenu: AppMenu, ClearInputIcon: ClearInputIcon, clearState: clearState, disabled: channelSearchParams.disabled, exitSearch: exitSearch, ExitSearchIcon: ExitSearchIcon, inputIsFocused: inputIsFocused, inputRef: inputRef, MenuIcon: MenuIcon, onSearch: onSearch, placeholder: placeholder, query: query, searchBarRef: searchBarRef, SearchInput: SearchInput, SearchInputIcon: SearchInputIcon }),

package/dist/components/ChannelSearch/SearchResults.js

@@ -40,7 +40,7 @@ const ResultsContainer = ({ children, popupResults, }) => {
     return (React.createElement("div", { "aria-label": t('aria/Channel search results'), className: clsx(`str-chat__channel-search-result-list`, popupResults ? 'popup' : 'inline') }, children));
 };
 export const SearchResults = (props) => {
-    const { popupResults, results, searching, SearchEmpty = DefaultSearchEmpty, SearchResultsHeader = DefaultSearchResultsHeader, SearchLoading, SearchResultItem = DefaultSearchResultItem, SearchResultsList = DefaultSearchResultsList, selectResult, } = props;
+    const { popupResults, results, SearchEmpty = DefaultSearchEmpty, searching, SearchLoading, SearchResultItem = DefaultSearchResultItem, SearchResultsHeader = DefaultSearchResultsHeader, SearchResultsList = DefaultSearchResultsList, selectResult, } = props;
     const { t } = useTranslationContext('SearchResults');
     const [focusedResult, setFocusedResult] = useState();
     const handleKeyDown = useCallback((event) => {

package/dist/components/ChannelSearch/hooks/useChannelSearch.d.ts

@@ -38,8 +38,10 @@ export type ChannelSearchParams<StreamChatGenerics extends DefaultStreamChatGene
     onSelectResult?: (params: ChannelSearchFunctionParams<StreamChatGenerics>, result: ChannelOrUserResponse<StreamChatGenerics>) => Promise<void> | void;
     /** The number of milliseconds to debounce the search query. The default interval is 200ms. */
     searchDebounceIntervalMs?: number;
-    /** Boolean to search for channels as well as users in the server query, default is false and just searches for users */
+    /** Boolean to search for channels in the server query, default is false and just searches for users */
     searchForChannels?: boolean;
+    /** Boolean to search for users in the server query, default is true and just searches for users */
+    searchForUsers?: boolean;
     /** Custom search function to override the default implementation */
     searchFunction?: (params: ChannelSearchFunctionParams<StreamChatGenerics>, event: React.BaseSyntheticEvent) => Promise<void> | void;
     /** Object containing filters/sort/options overrides for user / channel search */
@@ -49,4 +51,4 @@ export type ChannelSearchControllerParams<StreamChatGenerics extends DefaultStre
     /** Set the array of channels displayed in the ChannelList */
     setChannels?: React.Dispatch<React.SetStateAction<Array<Channel<StreamChatGenerics>>>>;
 };
-export declare const useChannelSearch: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ channelType, clearSearchOnClickOutside, disabled, onSearch: onSearchCallback, onSearchExit, onSelectResult, searchDebounceIntervalMs, searchForChannels, searchFunction, searchQueryParams, setChannels, }: ChannelSearchControllerParams<StreamChatGenerics>) => SearchController<StreamChatGenerics>;
+export declare const useChannelSearch: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ channelType, clearSearchOnClickOutside, disabled, onSearch: onSearchCallback, onSearchExit, onSelectResult, searchDebounceIntervalMs, searchForChannels, searchForUsers, searchFunction, searchQueryParams, setChannels, }: ChannelSearchControllerParams<StreamChatGenerics>) => SearchController<StreamChatGenerics>;

package/dist/components/ChannelSearch/hooks/useChannelSearch.js

@@ -3,13 +3,13 @@ import debounce from 'lodash.debounce';
 import uniqBy from 'lodash.uniqby';
 import { isChannel } from '../utils';
 import { useChatContext } from '../../../context/ChatContext';
-export const useChannelSearch = ({ channelType = 'messaging', clearSearchOnClickOutside = true, disabled = false, onSearch: onSearchCallback, onSearchExit, onSelectResult, searchDebounceIntervalMs = 300, searchForChannels = false, searchFunction, searchQueryParams, setChannels, }) => {
+export const useChannelSearch = ({ channelType = 'messaging', clearSearchOnClickOutside = true, disabled = false, onSearch: onSearchCallback, onSearchExit, onSelectResult, searchDebounceIntervalMs = 300, searchForChannels = false, searchForUsers = true, searchFunction, searchQueryParams, setChannels, }) => {
     const { client, setActiveChannel } = useChatContext('useChannelSearch');
     const [inputIsFocused, setInputIsFocused] = useState(false);
     const [query, setQuery] = useState('');
     const [results, setResults] = useState([]);
     const [searching, setSearching] = useState(false);
-    const searchQueryPromiseInProgress = useRef(undefined);
+    const searchQueryPromiseInProgress = useRef(false);
     const shouldIgnoreQueryResults = useRef(false);
     const inputRef = useRef(null);
     const searchBarRef = useRef(null);
@@ -17,9 +17,7 @@ export const useChannelSearch = ({ channelType = 'messaging', clearSearchOnClick
         setQuery('');
         setResults([]);
         setSearching(false);
-        if (searchQueryPromiseInProgress.current) {
-            shouldIgnoreQueryResults.current = true;
-        }
+        shouldIgnoreQueryResults.current = searchQueryPromiseInProgress.current;
     }, []);
     const activateSearch = useCallback(() => {
         setInputIsFocused(true);
@@ -45,7 +43,6 @@ export const useChannelSearch = ({ channelType = 'messaging', clearSearchOnClick
         };
         document.addEventListener('click', clickListener);
         return () => document.removeEventListener('click', clickListener);
-        // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [disabled, inputIsFocused, query, exitSearch, clearSearchOnClickOutside]);
     useEffect(() => {
         if (!inputRef.current || disabled)
@@ -78,7 +75,9 @@ export const useChannelSearch = ({ channelType = 'messaging', clearSearchOnClick
             selectedChannel = result;
         }
         else {
-            const newChannel = client.channel(channelType, { members: [client.userID, result.id] });
+            const newChannel = client.channel(channelType, {
+                members: [client.userID, result.id],
+            });
             await newChannel.watch();
             setActiveChannel(newChannel);
             selectedChannel = newChannel;
@@ -89,34 +88,52 @@ export const useChannelSearch = ({ channelType = 'messaging', clearSearchOnClick
         }
     }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [clearSearchOnClickOutside, client, exitSearch, onSelectResult, setActiveChannel, setChannels]);
+    [
+        clearSearchOnClickOutside,
+        client,
+        exitSearch,
+        onSelectResult,
+        setActiveChannel,
+        setChannels,
+    ]);
     const getChannels = useCallback(async (text) => {
+        if (!searchForChannels && !searchForUsers)
+            return;
         let results = [];
+        const promises = [];
         try {
-            const userQueryPromise = client.queryUsers(
-            // @ts-expect-error
-            {
-                $or: [{ id: { $autocomplete: text } }, { name: { $autocomplete: text } }],
-                ...searchQueryParams?.userFilters?.filters,
-            }, { id: 1, ...searchQueryParams?.userFilters?.sort }, { limit: 8, ...searchQueryParams?.userFilters?.options });
-            if (!searchForChannels) {
-                searchQueryPromiseInProgress.current = userQueryPromise;
-                const { users } = await searchQueryPromiseInProgress.current;
-                results = users.filter((u) => u.id !== client.user?.id);
-            }
-            else {
-                const channelQueryPromise = client.queryChannels(
-                // @ts-expect-error
+            if (searchForChannels) {
+                promises.push(client.queryChannels(
+                // @ts-expect-error valid query
                 {
+                    members: { $in: [client.userID] },
                     name: { $autocomplete: text },
                     ...searchQueryParams?.channelFilters?.filters,
-                }, searchQueryParams?.channelFilters?.sort || {}, { limit: 5, ...searchQueryParams?.channelFilters?.options });
-                searchQueryPromiseInProgress.current = Promise.all([
-                    channelQueryPromise,
-                    userQueryPromise,
-                ]);
-                const [channels, { users }] = await searchQueryPromiseInProgress.current;
-                results = [...channels, ...users.filter((u) => u.id !== client.user?.id)];
+                }, searchQueryParams?.channelFilters?.sort || {}, { limit: 5, ...searchQueryParams?.channelFilters?.options }));
+            }
+            if (searchForUsers) {
+                promises.push(client.queryUsers(
+                // @ts-expect-error valid query
+                {
+                    $or: [{ id: { $autocomplete: text } }, { name: { $autocomplete: text } }],
+                    ...searchQueryParams?.userFilters?.filters,
+                }, { id: 1, ...searchQueryParams?.userFilters?.sort }, { limit: 8, ...searchQueryParams?.userFilters?.options }));
+            }
+            if (promises.length) {
+                searchQueryPromiseInProgress.current = true;
+                const resolved = await Promise.all(promises);
+                if (searchForChannels && searchForUsers) {
+                    const [channels, { users }] = resolved;
+                    results = [...channels, ...users.filter((u) => u.id !== client.user?.id)];
+                }
+                else if (searchForChannels) {
+                    const [channels] = resolved;
+                    results = [...channels];
+                }
+                else if (searchForUsers) {
+                    const [{ users }] = resolved;
+                    results = [...users.filter((u) => u.id !== client.user?.id)];
+                }
             }
         }
         catch (error) {
@@ -129,13 +146,10 @@ export const useChannelSearch = ({ channelType = 'messaging', clearSearchOnClick
         else {
             shouldIgnoreQueryResults.current = false;
         }
-        searchQueryPromiseInProgress.current = undefined;
-    }, [client, searchForChannels, searchQueryParams]);
+        searchQueryPromiseInProgress.current = false;
+    }, [client, searchForChannels, searchForUsers, searchQueryParams]);
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    const scheduleGetChannels = useCallback(debounce(getChannels, searchDebounceIntervalMs), [
-        getChannels,
-        searchDebounceIntervalMs,
-    ]);
+    const scheduleGetChannels = useCallback(debounce(getChannels, searchDebounceIntervalMs), [getChannels, searchDebounceIntervalMs]);
     const onSearch = useCallback((event) => {
         event.preventDefault();
         if (disabled)
@@ -147,6 +161,9 @@ export const useChannelSearch = ({ channelType = 'messaging', clearSearchOnClick
                 setSearching,
             }, event);
         }
+        else if (!searchForChannels && !searchForUsers) {
+            return;
+        }
         else if (event.target.value) {
             setSearching(true);
             setQuery(event.target.value);
@@ -157,7 +174,15 @@ export const useChannelSearch = ({ channelType = 'messaging', clearSearchOnClick
             scheduleGetChannels.cancel();
         }
         onSearchCallback?.(event);
-    }, [clearState, disabled, scheduleGetChannels, onSearchCallback, searchFunction]);
+    }, [
+        clearState,
+        disabled,
+        scheduleGetChannels,
+        onSearchCallback,
+        searchForChannels,
+        searchForUsers,
+        searchFunction,
+    ]);
     return {
         activateSearch,
         clearState,

package/dist/components/ChannelSearch/index.d.ts

@@ -3,4 +3,4 @@ export * from './SearchBar';
 export * from './SearchInput';
 export * from './SearchResults';
 export * from './utils';
-export type { ChannelSearchFunctionParams, ChannelSearchParams } from './hooks/useChannelSearch';
+export type { ChannelSearchFunctionParams, ChannelSearchParams, } from './hooks/useChannelSearch';

package/dist/components/Chat/hooks/useChat.js

@@ -28,7 +28,7 @@ export const useChat = ({ client, defaultLanguage = 'en', i18nInstance, initialN
         if (!userAgent.includes('stream-chat-react')) {
             // result looks like: 'stream-chat-react-2.3.2-stream-chat-javascript-client-browser-2.2.2'
             // the upper-case text between double underscores is replaced with the actual semantic version of the library
-            client.setUserAgent(`stream-chat-react-12.10.0-${userAgent}`);
+            client.setUserAgent(`stream-chat-react-12.11.1-${userAgent}`);
         }
         client.threads.registerSubscriptions();
         client.polls.registerSubscriptions();
@@ -50,7 +50,9 @@ export const useChat = ({ client, defaultLanguage = 'en', i18nInstance, initialN
         let userLanguage = client.user?.language;
         if (!userLanguage) {
             const browserLanguage = window.navigator.language.slice(0, 2); // just get language code, not country-specific version
-            userLanguage = isLanguageSupported(browserLanguage) ? browserLanguage : defaultLanguage;
+            userLanguage = isLanguageSupported(browserLanguage)
+                ? browserLanguage
+                : defaultLanguage;
         }
         const streami18n = i18nInstance || new Streami18n({ language: userLanguage });
         streami18n.registerSetLanguageCallback((t) => setTranslators((prevTranslator) => ({ ...prevTranslator, t })));

package/dist/components/Chat/hooks/useCreateChatClient.js

@@ -13,7 +13,9 @@ export const useCreateChatClient = ({ apiKey, options, tokenOrProvider, userData
     useEffect(() => {
         const client = new StreamChat(apiKey, undefined, cachedOptions);
         let didUserConnectInterrupt = false;
-        const connectionPromise = client.connectUser(cachedUserData, tokenOrProvider).then(() => {
+        const connectionPromise = client
+            .connectUser(cachedUserData, tokenOrProvider)
+            .then(() => {
             if (!didUserConnectInterrupt)
                 setChatClient(client);
         });

package/dist/components/ChatAutoComplete/ChatAutoComplete.js

@@ -8,7 +8,7 @@ const UnMemoizedChatAutoComplete = (props) => {
     const { AutocompleteSuggestionItem: SuggestionItem, AutocompleteSuggestionList: SuggestionList, } = useComponentContext('ChatAutoComplete');
     const { t } = useTranslationContext('ChatAutoComplete');
     const messageInput = useMessageInputContext('ChatAutoComplete');
-    const { cooldownRemaining, disabled, emojiSearchIndex, textareaRef: innerRef } = messageInput;
+    const { cooldownRemaining, disabled, emojiSearchIndex, textareaRef: innerRef, } = messageInput;
     const placeholder = props.placeholder || t('Type your message');
     const emojiReplace = props.wordReplace
         ? (word) => props.wordReplace?.(word, emojiSearchIndex)

package/dist/components/ChatView/ChatView.js

@@ -5,7 +5,6 @@ import { UnreadCountBadge } from '../Threads/UnreadCountBadge';
 import { useChatContext } from '../../context';
 import { useStateStore } from '../../store';
 import clsx from 'clsx';
-const availableChatViews = ['channels', 'threads'];
 const ChatViewContext = createContext({
     activeChatView: 'channels',
     setActiveChatView: () => undefined,

package/dist/components/Dialog/PromptDialog.d.ts

@@ -5,4 +5,4 @@ export type ConfirmationDialogProps = {
     className?: string;
     title?: string;
 };
-export declare const PromptDialog: ({ actions, className, prompt, title }: ConfirmationDialogProps) => React.JSX.Element;
+export declare const PromptDialog: ({ actions, className, prompt, title, }: ConfirmationDialogProps) => React.JSX.Element;

package/dist/components/Dialog/PromptDialog.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import clsx from 'clsx';
-export const PromptDialog = ({ actions, className, prompt, title }) => (React.createElement("div", { className: clsx('str-chat__dialog str-chat__dialog--prompt', className) },
+export const PromptDialog = ({ actions, className, prompt, title, }) => (React.createElement("div", { className: clsx('str-chat__dialog str-chat__dialog--prompt', className) },
     React.createElement("div", { className: 'str-chat__dialog__body' },
         title && React.createElement("div", { className: 'str-chat__dialog__title' }, title),
         React.createElement("div", { className: 'str-chat__dialog__prompt' }, prompt)),

package/dist/components/EventComponent/EventComponent.js

@@ -6,7 +6,7 @@ import { getDateString } from '../../i18n/utils';
  * Component to display system and channel event messages
  */
 const UnMemoizedEventComponent = (props) => {
-    const { calendar, calendarFormats, format, Avatar = DefaultAvatar, message } = props;
+    const { Avatar = DefaultAvatar, calendar, calendarFormats, format, message } = props;
     const { t, tDateTimeParser } = useTranslationContext('EventComponent');
     const { created_at = '', event, text, type } = message;
     const getDateOptions = { messageCreatedAt: created_at.toString(), tDateTimeParser };

package/dist/components/Gallery/Image.js

@@ -8,7 +8,7 @@ import { useComponentContext } from '../../context';
  * A simple component that displays an image.
  */
 export const ImageComponent = (props) => {
-    const { dimensions = {}, fallback, image_url, thumb_url, innerRef, previewUrl, style } = props;
+    const { dimensions = {}, fallback, image_url, innerRef, previewUrl, style, thumb_url, } = props;
     const [modalIsOpen, setModalIsOpen] = useState(false);
     const { BaseImage = DefaultBaseImage, ModalGallery = DefaultModalGallery } = useComponentContext('ImageComponent');
     const imageSrc = sanitizeUrl(previewUrl || image_url || thumb_url);

package/dist/components/Gallery/ModalGallery.js

@@ -20,7 +20,6 @@ export const ModalGallery = (props) => {
         };
     }), [images, t]);
     return (
-    // ignore the TS error as react-image-gallery was on @types/react@18 while stream-chat-react being upgraded to React 19 (https://github.com/xiaolin/react-image-gallery/issues/809)
-    // @ts-expect-error
+    // @ts-expect-error ignore the TS error as react-image-gallery was on @types/react@18 while stream-chat-react being upgraded to React 19 (https://github.com/xiaolin/react-image-gallery/issues/809)
     React.createElement(ImageGallery, { items: formattedArray, renderItem: renderItem, showIndex: true, showPlayButton: false, showThumbnails: false, startIndex: index }));
 };

package/dist/components/InfiniteScrollPaginator/InfiniteScroll.js

@@ -44,7 +44,8 @@ export const InfiniteScroll = (props) => {
         }
         if (isLoading)
             return;
-        if (previousOffset.current === offset && previousReverseOffset.current === reverseOffset)
+        if (previousOffset.current === offset &&
+            previousReverseOffset.current === reverseOffset)
             return;
         previousOffset.current = offset;
         previousReverseOffset.current = reverseOffset;
@@ -54,7 +55,9 @@ export const InfiniteScroll = (props) => {
             hasPreviousPageFlag) {
             loadPreviousPageFn();
         }
-        if (offset < Number(threshold) && typeof loadNextPageFn === 'function' && hasNextPageFlag) {
+        if (offset < Number(threshold) &&
+            typeof loadNextPageFn === 'function' &&
+            hasNextPageFlag) {
             loadNextPageFn();
         }
     };

package/dist/components/InfiniteScrollPaginator/InfiniteScrollPaginator.js

@@ -12,7 +12,7 @@ const mousewheelListener = (event) => {
     }
 };
 export const InfiniteScrollPaginator = (props) => {
-    const { children, listenToScroll, loadNextOnScrollToBottom, loadNextOnScrollToTop, threshold = DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD, useCapture = false, className, ...componentProps } = props;
+    const { children, className, listenToScroll, loadNextOnScrollToBottom, loadNextOnScrollToTop, threshold = DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD, useCapture = false, ...componentProps } = props;
     const rootRef = useRef(null);
     const childRef = useRef(null);
     const scrollListener = useMemo(() => debounce(() => {

package/dist/components/LoadMore/LoadMorePaginator.js

@@ -1,5 +1,5 @@
 import React, { useEffect } from 'react';
-import { LoadMoreButton as DefaultLoadMoreButton } from './LoadMoreButton';
+import { LoadMoreButton as DefaultLoadMoreButton, } from './LoadMoreButton';
 import { deprecationAndReplacementWarning } from '../../utils/deprecationWarning';
 export const UnMemoizedLoadMorePaginator = (props) => {
     const { children, hasNextPage, isLoading, LoadMoreButton = DefaultLoadMoreButton, loadNextPage, refreshing, reverse, } = props;

package/dist/components/MML/MML.js

@@ -1,6 +1,7 @@
 import React, { Suspense } from 'react';
 import { useChatContext } from '../../context/ChatContext';
 const MMLReact = React.lazy(async () => {
+    // eslint-disable-next-line import/no-extraneous-dependencies
     const mml = await import('mml-react');
     return { default: mml.MML };
 });