Re render existing bubble on message update

[khurramriaz]

Issue Description

I implemented renderBubble props to render my own message bubble. on press send button current message added to messages array (GiftedChat append). current message has the property delivered to false and after succcess response from server of sending message. I am updating delivered property to true. Based on this (delivered) property I am showing an icon in message bubble and want to update icon accordingly.

Now the problem is when delivered is false a radio icon show but after success or delivered to true icon not updating. Bubble of current message is not rendering after message state updates. messages array is stored in redux. redux state of messages is updating but bubble is not re rendering.

Steps to Reproduce / Code Snippets

messages
messages: [{
_id: 123,
text: 'message text',
user: {_id, avatar},
delivered: true / false
}]

Gifted Chat compoent

<GiftedChat 
    messages = { this.props.chatRoom.messages } // from redux store
    renderBubble = { (props) => this.renderBubble(props.currentMessage) }
    //other props
/>

Custom Bubble renderMessage(message){

return 
<Bubble 
     message = message.text
     delivered = message.delivered
      //other props
 />
}

Additional Information

• Nodejs version: 8.9.1
• React version: 16.3.0-alpha.2
• React Native version: 0.54.2
• react-native-gifted-chat version: 0.4.3
• Platform(s) (iOS, Android, or both?): both

[khurramriaz]

I got two possible solution from here and here

I want to know is there any performance issue If I remove return block in componentWillReceiveProps in MessageContainer.js?

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.