stream-chat-react-native-core 6.7.2 → 6.7.3-beta.2

package/src/components/MessageInput/InputButtons.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useCallback } from 'react';
 import { StyleSheet, View } from 'react-native';
 
 import {
@@ -29,12 +29,12 @@ export type InputButtonsWithContextProps<
   | 'hasCommands'
   | 'hasFilePicker'
   | 'hasImagePicker'
+  | 'hasText'
   | 'MoreOptionsButton'
   | 'openCommandsPicker'
   | 'selectedPicker'
   | 'setShowMoreOptions'
   | 'showMoreOptions'
-  | 'text'
   | 'toggleAttachmentPicker'
 >;
 
@@ -51,11 +51,11 @@ export const InputButtonsWithContext = <
     hasCommands,
     hasFilePicker,
     hasImagePicker,
+    hasText,
     MoreOptionsButton,
     openCommandsPicker,
     setShowMoreOptions,
     showMoreOptions,
-    text,
   } = props;
 
   const {
@@ -64,6 +64,10 @@ export const InputButtonsWithContext = <
     },
   } = useTheme();
 
+  const handleShowMoreOptions = useCallback(() => {
+    setShowMoreOptions(true);
+  }, [setShowMoreOptions]);
+
   const ownCapabilities = useOwnCapabilitiesContext();
 
   if (giphyActive) {
@@ -71,7 +75,7 @@ export const InputButtonsWithContext = <
   }
 
   return !showMoreOptions && (hasCameraPicker || hasImagePicker || hasFilePicker) && hasCommands ? (
-    <MoreOptionsButton handleOnPress={() => setShowMoreOptions(true)} />
+    <MoreOptionsButton handleOnPress={handleShowMoreOptions} />
   ) : (
     <>
       {(hasCameraPicker || hasImagePicker || hasFilePicker) && ownCapabilities.uploadFile && (
@@ -81,7 +85,7 @@ export const InputButtonsWithContext = <
           <AttachButton />
         </View>
       )}
-      {hasCommands && !text && (
+      {hasCommands && !hasText && (
         <View style={commandsButtonContainer}>
           <CommandsButton handleOnPress={openCommandsPicker} />
         </View>
@@ -100,9 +104,9 @@ const areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = Default
     hasCommands: prevHasCommands,
     hasFilePicker: prevHasFilePicker,
     hasImagePicker: prevHasImagePicker,
+    hasText: prevHasText,
     selectedPicker: prevSelectedPicker,
     showMoreOptions: prevShowMoreOptions,
-    text: prevText,
   } = prevProps;
 
   const {
@@ -111,9 +115,9 @@ const areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = Default
     hasCommands: nextHasCommands,
     hasFilePicker: nextHasFilePicker,
     hasImagePicker: nextHasImagePicker,
+    hasText: nextHasText,
     selectedPicker: nextSelectedPicker,
     showMoreOptions: nextShowMoreOptions,
-    text: nextText,
   } = nextProps;
 
   if (prevHasCameraPicker !== nextHasCameraPicker) {
@@ -140,7 +144,7 @@ const areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = Default
     return false;
   }
 
-  if ((!prevProps.text && nextText) || (prevText && !nextText)) {
+  if (prevHasText !== nextHasText) {
     return false;
   }
 
@@ -169,12 +173,12 @@ export const InputButtons = <
     hasCommands,
     hasFilePicker,
     hasImagePicker,
+    hasText,
     MoreOptionsButton,
     openCommandsPicker,
     selectedPicker,
     setShowMoreOptions,
     showMoreOptions,
-    text,
     toggleAttachmentPicker,
   } = useMessageInputContext<StreamChatGenerics>();
 
@@ -188,12 +192,12 @@ export const InputButtons = <
         hasCommands,
         hasFilePicker,
         hasImagePicker,
+        hasText,
         MoreOptionsButton,
         openCommandsPicker,
         selectedPicker,
         setShowMoreOptions,
         showMoreOptions,
-        text,
         toggleAttachmentPicker,
       }}
       {...props}

package/src/components/MessageInput/MessageInput.tsx

@@ -108,7 +108,7 @@ type MessageInputPropsWithContext<
   StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 > = Pick<AttachmentPickerContextValue, 'AttachmentPickerSelectionBar'> &
   Pick<ChatContextValue<StreamChatGenerics>, 'isOnline'> &
-  Pick<ChannelContextValue<StreamChatGenerics>, 'members' | 'threadList' | 'watchers'> &
+  Pick<ChannelContextValue<StreamChatGenerics>, 'channel' | 'members' | 'threadList' | 'watchers'> &
   Pick<
     MessageInputContextValue<StreamChatGenerics>,
     | 'additionalTextInputProps'
@@ -198,6 +198,7 @@ const MessageInputWithContext = <
     AudioRecordingLockIndicator,
     AudioRecordingPreview,
     AutoCompleteSuggestionList,
+    channel,
     closeAttachmentPicker,
     closePollCreationDialog,
     cooldownEndsAt,
@@ -746,7 +747,6 @@ const MessageInputWithContext = <
     })),
   };
 
-  const { channel } = useChannelContext<StreamChatGenerics>();
   const { aiState } = useAIState(channel);
 
   const stopGenerating = useCallback(() => channel?.stopAIResponse(), [channel]);
@@ -860,9 +860,8 @@ const MessageInputWithContext = <
 
               {shouldDisplayStopAIGeneration ? (
                 <StopMessageStreamingButton onPress={stopGenerating} />
-              ) : (
-                isSendingButtonVisible() &&
-                (cooldownRemainingSeconds ? (
+              ) : isSendingButtonVisible() ? (
+                cooldownRemainingSeconds ? (
                   <CooldownTimer seconds={cooldownRemainingSeconds} />
                 ) : (
                   <View style={[styles.sendButtonContainer, sendButtonContainer]}>
@@ -870,8 +869,8 @@ const MessageInputWithContext = <
                       disabled={sending.current || !isValidMessage() || (giphyActive && !isOnline)}
                     />
                   </View>
-                ))
-              )}
+                )
+              ) : null}
               {audioRecordingEnabled && isAudioRecorderAvailable() && !micLocked && (
                 <GestureDetector gesture={panGestureMic}>
                   <Animated.View
@@ -957,6 +956,7 @@ const areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = Default
     asyncMessagesSlideToCancelDistance: prevAsyncMessagesSlideToCancelDistance,
     asyncUploads: prevAsyncUploads,
     audioRecordingEnabled: prevAsyncMessagesEnabled,
+    channel: prevChannel,
     closePollCreationDialog: prevClosePollCreationDialog,
     editing: prevEditing,
     fileUploads: prevFileUploads,
@@ -982,6 +982,7 @@ const areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = Default
     asyncMessagesSlideToCancelDistance: nextAsyncMessagesSlideToCancelDistance,
     asyncUploads: nextAsyncUploads,
     audioRecordingEnabled: nextAsyncMessagesEnabled,
+    channel: nextChannel,
     closePollCreationDialog: nextClosePollCreationDialog,
     editing: nextEditing,
     fileUploads: nextFileUploads,
@@ -1025,6 +1026,11 @@ const areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = Default
     return false;
   }
 
+  const channelEqual = prevChannel.cid === nextChannel.cid;
+  if (!channelEqual) {
+    return false;
+  }
+
   const asyncMessagesLockDistanceEqual =
     prevAsyncMessagesLockDistance === nextAsyncMessagesLockDistance;
   if (!asyncMessagesLockDistanceEqual) {
@@ -1160,7 +1166,7 @@ export const MessageInput = <
   const { isOnline } = useChatContext();
   const ownCapabilities = useOwnCapabilitiesContext();
 
-  const { members, threadList, watchers } = useChannelContext<StreamChatGenerics>();
+  const { channel, members, threadList, watchers } = useChannelContext<StreamChatGenerics>();
 
   const {
     additionalTextInputProps,
@@ -1263,6 +1269,7 @@ export const MessageInput = <
         AutoCompleteSuggestionHeader,
         AutoCompleteSuggestionItem,
         AutoCompleteSuggestionList,
+        channel,
         clearEditingState,
         clearQuotedMessageState,
         closeAttachmentPicker,

package/src/components/MessageInput/MoreOptionsButton.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { GestureResponderEvent } from 'react-native';
-import { TouchableOpacity } from 'react-native-gesture-handler';
+import { TouchableOpacity } from 'react-native';
 
 import { useTheme } from '../../contexts/themeContext/ThemeContext';
 import { CircleRight } from '../../icons/CircleRight';

package/src/components/MessageList/MessageList.tsx

@@ -617,7 +617,6 @@ const MessageListWithContext = <
         setTimeout(() => {
           channelResyncScrollSet.current = true;
           if (channel.countUnread() > 0) {
-            console.log('marking read');
             markRead();
           }
         }, 500);