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

package/src/contexts/messageInputContext/MessageInputContext.tsx

@@ -125,6 +125,7 @@ export type LocalMessageInputContext<
       url: string;
     };
   };
+  giphyEnabled: boolean;
   closeAttachmentPicker: () => void;
   /** The time at which the active cooldown will end */
   cooldownEndsAt: Date;
@@ -151,6 +152,7 @@ export type LocalMessageInputContext<
    */
   fileUploads: FileUpload[];
   giphyActive: boolean;
+  hasText: boolean;
   /**
    * An array of image objects which are set for upload. It has the following structure:
    *
@@ -608,6 +610,7 @@ export const MessageInputProvider = <
     text,
   } = useMessageDetailsForState<StreamChatGenerics>(editing, initialValue);
   const { endsAt: cooldownEndsAt, start: startCooldown } = useCooldown<StreamChatGenerics>();
+  const { onChangeText } = value;
 
   const threadId = thread?.id;
   useEffect(() => {
@@ -655,20 +658,23 @@ export const MessageInputProvider = <
     return false;
   };
 
-  const onChange = (newText: string) => {
-    if (sending.current) {
-      return;
-    }
-    setText(newText);
+  const onChange = useCallback(
+    (newText: string) => {
+      if (sending.current) {
+        return;
+      }
+      setText(newText);
 
-    if (newText && channel && channelCapabities.sendTypingEvents && isOnline) {
-      logChatPromiseExecution(channel.keystroke(thread?.id), 'start typing event');
-    }
+      if (newText && channel && channelCapabities.sendTypingEvents && isOnline) {
+        logChatPromiseExecution(channel.keystroke(thread?.id), 'start typing event');
+      }
 
-    if (value.onChangeText) {
-      value.onChangeText(newText);
-    }
-  };
+      if (onChangeText) {
+        onChangeText(newText);
+      }
+    },
+    [channel, channelCapabities.sendTypingEvents, isOnline, setText, thread?.id, onChangeText],
+  );
 
   const openCommandsPicker = () => {
     appendText('/');
@@ -948,10 +954,6 @@ export const MessageInputProvider = <
     const prevText = giphyEnabled && giphyActive ? `/giphy ${text}` : text;
     setText('');
 
-    if (inputBoxRef.current) {
-      inputBoxRef.current.clear();
-    }
-
     const attachments = [] as Attachment<StreamChatGenerics>[];
     for (const image of imageUploads) {
       if (enableOfflineSupport) {
@@ -1446,6 +1448,7 @@ export const MessageInputProvider = <
     cooldownEndsAt,
     fileUploads,
     giphyActive,
+    giphyEnabled,
     imageUploads,
     inputBoxRef,
     isValidMessage,
@@ -1490,6 +1493,7 @@ export const MessageInputProvider = <
     uploadNewImage,
     ...value,
     closePollCreationDialog,
+    hasText: !!text,
     openPollCreationDialog,
     sendMessage, // overriding the originally passed in sendMessage
     showPollCreationDialog,

package/src/contexts/messageInputContext/__tests__/pickFile.test.tsx

@@ -61,7 +61,7 @@ describe("MessageInputContext's pickFile", () => {
     maxNumberOfFiles: 2,
   };
 
-  it.each([[3, 1]])(
+  it.each([[3, 2]])(
     'run pickFile when numberOfUploads is %d and alert is triggered %d number of times',
     async (numberOfUploads, numberOfTimesCalled) => {
       const { rerender, result } = renderHook(() => useMessageInputContext(), {
@@ -87,7 +87,6 @@ describe("MessageInputContext's pickFile", () => {
       });
 
       expect(Alert.alert).toHaveBeenCalledTimes(numberOfTimesCalled);
-      expect(Alert.alert).toHaveBeenCalledWith('Maximum number of files reached');
     },
   );
 

package/src/contexts/messageInputContext/hooks/useCreateMessageInputContext.ts

@@ -41,11 +41,13 @@ export const useCreateMessageInputContext = <
   FileUploadPreview,
   fileUploads,
   giphyActive,
+  giphyEnabled,
   handleAttachButtonPress,
   hasCameraPicker,
   hasCommands,
   hasFilePicker,
   hasImagePicker,
+  hasText,
   ImageUploadPreview,
   imageUploads,
   initialValue,
@@ -164,11 +166,13 @@ export const useCreateMessageInputContext = <
       FileUploadPreview,
       fileUploads,
       giphyActive,
+      giphyEnabled,
       handleAttachButtonPress,
       hasCameraPicker,
       hasCommands,
       hasFilePicker,
       hasImagePicker,
+      hasText,
       ImageUploadPreview,
       imageUploads,
       initialValue,
@@ -246,6 +250,8 @@ export const useCreateMessageInputContext = <
       editingdep,
       fileUploadsValue,
       giphyActive,
+      giphyEnabled,
+      hasText,
       imageUploadsValue,
       maxMessageLength,
       mentionedUsersLength,

package/src/contexts/messageInputContext/hooks/useMessageDetailsForState.ts

@@ -22,20 +22,22 @@ export const useMessageDetailsForState = <
   const [imageUploads, setImageUploads] = useState<ImageUpload[]>([]);
   const [mentionedUsers, setMentionedUsers] = useState<string[]>([]);
   const [numberOfUploads, setNumberOfUploads] = useState(0);
-  const [showMoreOptions, setShowMoreOptions] = useState(true);
 
   const initialTextValue = initialValue || '';
   const [text, setText] = useState(initialTextValue);
 
+  const isEqualToInitialText = text === initialTextValue;
+
+  const [showMoreOptions, setShowMoreOptions] = useState(true);
+
   useEffect(() => {
-    if (text !== initialTextValue) {
+    if (!isEqualToInitialText) {
       setShowMoreOptions(false);
     }
     if (fileUploads.length || imageUploads.length) {
       setShowMoreOptions(false);
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [text, imageUploads.length, fileUploads.length]);
+  }, [isEqualToInitialText, imageUploads.length, fileUploads.length]);
 
   const messageValue = message ? stringifyMessage(message) : '';
 

package/src/contexts/suggestionsContext/SuggestionsContext.tsx

@@ -1,4 +1,4 @@
-import React, { PropsWithChildren, useContext, useState } from 'react';
+import React, { PropsWithChildren, useCallback, useContext, useMemo, useState } from 'react';
 
 import type { CommandResponse, UserResponse } from 'stream-chat';
 
@@ -95,35 +95,54 @@ export const SuggestionsProvider = <
   children,
   value,
 }: PropsWithChildren<{ value?: Partial<SuggestionsContextValue<StreamChatGenerics>> }>) => {
+  const { AutoCompleteSuggestionHeader, AutoCompleteSuggestionItem, AutoCompleteSuggestionList } =
+    value ?? {};
   const [triggerType, setTriggerType] = useState<SuggestionComponentType | null>(null);
   const [suggestions, setSuggestions] = useState<Suggestions<StreamChatGenerics>>();
   const [suggestionsViewActive, setSuggestionsViewActive] = useState(false);
 
-  const openSuggestions = (component: SuggestionComponentType) => {
+  const openSuggestions = useCallback((component: SuggestionComponentType) => {
     setTriggerType(component);
     setSuggestionsViewActive(true);
-  };
-
-  const updateSuggestions = (newSuggestions: Suggestions<StreamChatGenerics>) => {
-    setSuggestions(newSuggestions);
-    setSuggestionsViewActive(!!triggerType);
-  };
+  }, []);
+
+  const updateSuggestions = useCallback(
+    (newSuggestions: Suggestions<StreamChatGenerics>) => {
+      setSuggestions(newSuggestions);
+      setSuggestionsViewActive(!!triggerType);
+    },
+    [triggerType],
+  );
 
-  const closeSuggestions = () => {
+  const closeSuggestions = useCallback(() => {
     setTriggerType(null);
     setSuggestions(undefined);
     setSuggestionsViewActive(false);
-  };
-
-  const suggestionsContext = {
-    ...value,
+  }, []);
+
+  const suggestionsContext = useMemo(() => {
+    return {
+      AutoCompleteSuggestionHeader,
+      AutoCompleteSuggestionItem,
+      AutoCompleteSuggestionList,
+      closeSuggestions,
+      openSuggestions,
+      suggestions,
+      suggestionsViewActive,
+      triggerType,
+      updateSuggestions,
+    };
+  }, [
+    AutoCompleteSuggestionHeader,
+    AutoCompleteSuggestionItem,
+    AutoCompleteSuggestionList,
     closeSuggestions,
     openSuggestions,
     suggestions,
     suggestionsViewActive,
     triggerType,
     updateSuggestions,
-  };
+  ]);
 
   return (
     <SuggestionsContext.Provider value={suggestionsContext as unknown as SuggestionsContextValue}>

package/src/version.json

@@ -1,3 +1,3 @@
 {
-  "version": "6.7.2"
+  "version": "6.7.3-beta.2"
 }