Chat.js - Listen to Real-Time Messages - React Native Gifted Chat App

Chat.js

...
const Chat = () => {
  ...
  const { cometChat, selectedConversation, user } = useContext(Context);

  const [messages, setMessages] = useState([]);
  ...
  useEffect(() => {
    if (selectedConversation) {
      ...
      // listen for messages.
      listenForMessages();
    }
    return () => {
      if (selectedConversation) {
        const conversationId = selectedConversation && selectedConversation.guid ? selectedConversation.guid : selectedConversation.uid ? selectedConversation.uid : null;
        if (conversationId) {
          cometChat.removeMessageListener();
        }
        ...
        setMessages(() => []);
      }
    }
  }, [selectedConversation]);
  ...
  const isValidMessage = (message) => {
    return message &&
      message.id &&
      message.sentAt &&
      message.sender &&
      message.sender.uid &&
      message.sender.name &&
      message.sender.avatar &&
      message.category &&
      message.category === 'message'
  };
  
  const transformSingleMessage = (message) => {
    if (isValidMessage(message)) {
      let transformedMessage = {
        _id: message.id ? message.id : uuidv4(),
        createdAt: new Date(message.sentAt * 1000),
        user: {
          _id: message.sender.uid,
          name: message.sender.name,
          avatar: message.sender.avatar,
        },
      }
      if (message.text) {
        transformedMessage.text = message.text;
      }
      if (message.data && message.data.url) {
        if (message.type && message.type === 'video') {
          transformedMessage.video = message.data.url;
        } else {
          transformedMessage.image = message.data.url;
        }
      }
      return transformedMessage;
    }
    return message;
  };
  
  ...
  /**
   * listen for messages
   */
  const listenForMessages = () => {
    const conversationId = selectedConversation && selectedConversation.guid ? selectedConversation.guid : selectedConversation.uid ? selectedConversation.uid : null;
    if (conversationId) {
      cometChat.addMessageListener(
        conversationId,
        new cometChat.MessageListener({
          onTextMessageReceived: (message) => {
            // set state.
            setMessages(previousMessages => GiftedChat.append(previousMessages, [transformSingleMessage(message)]))
          },
          onMediaMessageReceived: mediaMessage => {
            // Handle media message
            // set state.
            setMessages(previousMessages => GiftedChat.append(previousMessages, [transformSingleMessage(mediaMessage)]))
          },
        })
      );
    }
  }
  ...
};
...