Next Release

README.md

@@ -11,7 +11,7 @@
 [![NPM](https://img.shields.io/npm/v/stream-chat-react-native.svg)](https://www.npmjs.com/package/stream-chat-react-native)
 [![Build Status](https://github.com/GetStream/stream-chat-react-native/actions/workflows/release.yml/badge.svg)](https://github.com/GetStream/stream-chat-react-native/actions)
 [![Component Reference](https://img.shields.io/badge/docs-component%20reference-blue.svg)](https://getstream.io/chat/docs/sdk/reactnative)
-![JS Bundle Size](https://img.shields.io/badge/js_bundle_size-451%20KB-blue)
+![JS Bundle Size](https://img.shields.io/badge/js_bundle_size-452%20KB-blue)
 
 <img align="right" src="https://getstream.imgix.net/images/ios-chat-tutorial/[email protected]?auto=format,enhance" width="50%" />
 

package/src/components/Chat/hooks/__tests__/useAppSettings.test.tsx

@@ -18,6 +18,7 @@ describe('useAppSettings', () => {
               auto_translation_enabled: true,
             }),
           ),
+          userID: 'some-user-id',
         } as unknown as StreamChat,
         isOnline,
         false,

package/src/components/Chat/hooks/useAppSettings.ts

@@ -22,6 +22,8 @@ export const useAppSettings = <
      * Fetches app settings from the backend when offline support is disabled.
      */
     const enforceAppSettingsWithoutOfflineSupport = async () => {
+      if (!client.userID) return;
+
       try {
         const appSettings = await client.getAppSettings();
         if (isMounted.current) {

package/src/components/MessageOverlay/MessageOverlay.tsx

@@ -478,6 +478,7 @@ const MessageOverlayWithContext = <
             {!!messageReactionTitle && (
               <OverlayReactions
                 alignment={alignment}
+                message={message}
                 messageId={message.id}
                 OverlayReactionsAvatar={OverlayReactionsAvatar}
                 showScreen={showScreen}

package/src/components/MessageOverlay/OverlayReactions.tsx

@@ -22,6 +22,7 @@ import {
 
 import type { DefaultStreamChatGenerics } from '../../types/types';
 import type { ReactionData } from '../../utils/utils';
+import { MessageType } from '../MessageList/hooks/useMessageList';
 
 const styles = StyleSheet.create({
   avatarContainer: {
@@ -89,6 +90,7 @@ export type OverlayReactionsProps<
   showScreen: Animated.SharedValue<number>;
   title: string;
   alignment?: Alignment;
+  message?: MessageType<StreamChatGenerics>;
   messageId?: string;
   reactions?: Reaction[];
   supportedReactions?: ReactionData[];
@@ -105,7 +107,7 @@ export const OverlayReactions = (props: OverlayReactionsProps) => {
   const [itemHeight, setItemHeight] = React.useState(0);
   const {
     alignment: overlayAlignment,
-    messageId,
+    message,
     OverlayReactionsAvatar,
     reactions: propReactions,
     showScreen,
@@ -119,7 +121,7 @@ export const OverlayReactions = (props: OverlayReactionsProps) => {
     loadNextPage,
     reactions: fetchedReactions,
   } = useFetchReactions({
-    messageId,
+    message,
     sort,
   });
 

package/src/components/MessageOverlay/hooks/useFetchReactions.ts

@@ -2,6 +2,7 @@ import { useCallback, useEffect, useMemo, useState } from 'react';
 
 import { ReactionResponse, ReactionSort } from 'stream-chat';
 
+import { MessageType } from '../../../components/MessageList/hooks/useMessageList';
 import { useChatContext } from '../../../contexts/chatContext/ChatContext';
 import { getReactionsForFilterSort } from '../../../store/apis/getReactionsforFilterSort';
 import { DefaultStreamChatGenerics } from '../../../types/types';
@@ -10,7 +11,7 @@ export type UseFetchReactionParams<
   StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 > = {
   limit?: number;
-  messageId?: string;
+  message?: MessageType<StreamChatGenerics>;
   reactionType?: string;
   sort?: ReactionSort<StreamChatGenerics>;
 };
@@ -19,13 +20,14 @@ export const useFetchReactions = <
   StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 >({
   limit = 25,
-  messageId,
+  message,
   reactionType,
   sort,
 }: UseFetchReactionParams) => {
   const [reactions, setReactions] = useState<ReactionResponse<StreamChatGenerics>[]>([]);
   const [loading, setLoading] = useState(true);
   const [next, setNext] = useState<string | undefined>(undefined);
+  const messageId = message?.id;
 
   const { client, enableOfflineSupport } = useChatContext();
 
@@ -61,8 +63,9 @@ export const useFetchReactions = <
     };
 
     try {
-      if (enableOfflineSupport) {
-        loadOfflineReactions();
+      // TODO: Threads are not supported for the offline use case as we don't store the thread messages currently, and this will change in the future.
+      if (enableOfflineSupport && !message?.parent_id) {
+        await loadOfflineReactions();
       } else {
         await loadOnlineReactions();
       }