react-native-gifted-chat showing same message multiple time

Question

I'm using react-native-gifted-chat in my react-native app. As I shown in this image, there is same message displayed multiple time and message: Yes getting new msg 's place is also varied from it's actual position. My issue is same as this. Can anyone please help me to solve this.

Thank you in advance.

Answer 1

There could be two reasons behind it,

1) Each message should be passed a unique id, so just use uuidv4 npm package and append it to _id prop of the object.

Example:

messages: GiftedChat.append(previousState.messages, {
              _id: uuidv4(), // or use  Math.round(Math.random() * 1000000)
              text: text,
              createdAt: new Date(),
              user: {
                _id: 2,
                name: "React Native",
                avatar: "https://placeimg.com/140/140/any"
              },
              image: attachment
            })

2) Second possibility could be on the gateway you are using to initiate the chat between users. So, some gateways have known issues to repeat the message multiple times. You could to string comparison each time a new message is received and pushed to the chat screen, however it is not advised to do this.