small fix

src/screens/InAppScreens/MessagesScreen/ChatScreen/index.tsx

@@ -104,6 +104,7 @@ const ChatScreen = ({ route }: { route: any }) => {
   const { mutateAsync: unreactToMessage } = usePostUnreactToMessageMutation();
 
   const [highlightedMessageId, setHighlightedMessageId] = useState<number | null>(null);
+  const [isRerendering, setIsRerendering] = useState<boolean>(false);
 
   const messageRefs = useRef<{ [key: string]: any }>({});
   const flatList = useRef<FlatList | null>(null);
@@ -722,12 +723,17 @@ const ChatScreen = ({ route }: { route: any }) => {
       });
 
       setHighlightedMessageId(messageId);
+    }
+  };
 
+  useEffect(() => {
+    if (highlightedMessageId && isRerendering) {
       setTimeout(() => {
         setHighlightedMessageId(null);
-      }, 1000);
+        setIsRerendering(false);
+      }, 1500);
     }
-  };
+  }, [highlightedMessageId, isRerendering]);
 
   useEffect(() => {
     if (replyMessage && swipeableRowRef.current) {
@@ -820,6 +826,7 @@ const ChatScreen = ({ route }: { route: any }) => {
 
     return (
       <View
+        key={`${currentMessage._id}-${isHighlighted ? 'highlighted' : 'normal'}`}
         ref={(ref) => {
           if (ref && currentMessage) {
             messageRefs.current[currentMessage._id] = ref;
@@ -890,6 +897,15 @@ const ChatScreen = ({ route }: { route: any }) => {
     );
   };
 
+  const shouldUpdateMessage = (
+    props: MessageProps<IMessage>,
+    nextProps: MessageProps<IMessage>
+  ) => {
+    setIsRerendering(true);
+    const currentId = nextProps.currentMessage._id;
+    return currentId === highlightedMessageId;
+  };
+
   return (
     <SafeAreaView
       edges={['top']}
@@ -986,9 +1002,7 @@ const ChatScreen = ({ route }: { route: any }) => {
           maxComposerHeight={100}
           renderComposer={(props) => <Composer {...props} />}
           keyboardShouldPersistTaps="handled"
-          shouldUpdateMessage={(props, nextProps) =>
-            highlightedMessageId === nextProps.currentMessage._id
-          }
+          shouldUpdateMessage={shouldUpdateMessage}
           scrollToBottom={true}
           scrollToBottomComponent={renderScrollToBottom}
           scrollToBottomStyle={{ backgroundColor: 'transparent' }}