Giftedchat using layoutAnimation for animating new messages

Question

I've been trying to implement some animation for sending messages through GiftedChat but it's giving me quite abit of issues.

Can't seem to find any resources on this except for this thread: https://github.com/FaridSafi/react-native-gifted-chat/issues/592

The goal is to have the new messages slide into the chat demonstrated by a lot of other chat apps such as facebook messenger and whatsapp.

My current implementation uses layoutAnimation but I'm not sure where to put it to ensure that it's bug free.

When I put "LayoutAnimation.configureNext(config)" under my useEffect for when the messages update, it seems to work on on ios but on android, it leaves a blank space in the chat and messes up the layout. blank space on android

So my solution was to put it under onSend so that the animation only plays when sending a message, but this is also bugged in my code because I have "onInputTextChanged" setup under GiftedChat to hide the left actions when typing a message and the animation plays for hiding the left actions instead of new messages.

Here's my code:

<GiftedChat
 ...
 onInputTextChanged={text => {text != ‘’ ? this.setState({hideActionButtons: true}) : 
                      this.setState({hideActionButtons: false})}}
 onSend={messages => {
   this._onSend({ type: MESSAGES, messages })
   LayoutAnimation.configureNext(config)
 }}
 ...
/>

Any suggestion is appreciated, thanks.