React Native - Gifted Chat messages issue

Question

I am using react-native-gifted-chat version "^0.16.3" but every time a new message comes it only updates last 2 messages. What can I do to update complete chat list on new message and is this the right way to do?

<View style={{
                    backgroundColor: 'white',
                    padding: 10,
                    width: "85%",
                    borderRadius: 5,
                    shadowColor: '#000',
                    shadowOffset: { width: 0, height: 0 },
                    shadowOpacity: 0.4,
                    shadowRadius: 1,
                    elevation: 5
                }}>
                    {/* <Text color={'black'} bold size={'4.4%'} style={{ paddingLeft: 10 }} >Client wants to hire you</Text> */}
                    <Bubble
                        {...item}
                        allowFontScaling={false}
                        wrapperStyle={{
                            right: {
                                backgroundColor: Theme.darkSkyBlue,
                                width:'100%'
                            },
                            left: {
                                backgroundColor: Theme.white,
                                width:'100%'
                            }
                        }}
                    />
                    { !answered && type === "button" && (
                        <Row style={{width:'100%'}}>
                            <Btn style={{width:'48%'}} onPress={() => requestOpportunities(State.TrainerHire, requestId, _id)} yes>
                                <Btn.Text allowFontScaling = {false}>YES</Btn.Text>
                            </Btn>
                            <Btn style={{width:'48%'}} activeOpacity={0.3} onPress={() => requestOpportunities(State.TrainerAccept, requestId, _id)} packages>
                                <Btn.Text color={'blue'} allowFontScaling = {false}>NO</Btn.Text>
                            </Btn>
                        </Row>
                    )}
                </View>

This is my code, when user click on yes or no button it should hide these buttons. It's working when its the last message but if there are some messages after this message it does not work.

Answer 1

To get it work around, I put a loader on screen and update the whole using API.