Trying to update renderCustomView in GiftedChat after state change

Question

I am signalling a state change in the onLongPress function, however the renderCustomView is not updating/re-rendering its new view. I have tried using this.forceUpdate() but to no success. I have provided the view im trying to present after state change.

https://i.stack.imgur.com/Perfv.png

 displayEmojis(){
        if(this.state.toggle){
        return(
        <View 
        style={{flexDirection:'row', right:'35%',  backgroundColor:'white', zIndex:3, overlayColor: 'white',borderRadius:30,  paddingHorizontal:'10%', bottom:'2%' }}>
        {this.beerEmoji()}
        {this.partyEmoji()}
        {this.laughingEmoji()}
        {this.happyEmoji()}
        {this.cryingEmoji()}
        </View>
        )
      }
    }

    toggleEmojis = (val) => {
        this.setState({toggle: true})
    }


    render() {
        return (
            <View style={{ flex: 1 }}>
                <GiftedChat
                    keyboardShouldPersistTaps={'handled'}
                    messages={this.state.messages}
                    onSend={messages => this.onSend(messages)}
                    placeholder={"Post something..."}
                    isKeyboardInternallyHandled={false}
                    renderQuickReplySend={true}
                    multiline={true}
                    alwaysShowSend={true}
                    onLongPress={(context, message)=> this.toggleEmojis()}
                    user={{ _id: 1 }}
                    renderCustomView={this.displayEmojis}
                    renderMessage={this.renderMessage} />
                <KeyboardSpacer />
            </View>
        )
    }
}

Answer 1

I have solved this by using extraData={this.state} property in GiftedChat