1//ChatFooter.js
2        <View style={{height: 50, flexDirection: 'row'}}>
3          <View style={{height:50, width: 5, backgroundColor: 'red'}}></View>
4          <View style={{flexDirection: 'column'}}>
5              <Text style={{color: 'red', paddingLeft: 10, paddingTop: 5}}>{replyTo}</Text>
6              <Text style={{color: 'gray', paddingLeft: 10, paddingTop: 5}}>{replyMsg}</Text>
7          </View>
8          <View style={{flex: 1,justifyContent: 'center',alignItems:'flex-end', paddingRight: 10}}>
9              <TouchableOpacity onPress={dismiss}>
10                  <Icon name="x" type="feather" color="#0084ff" />
11              </TouchableOpacity>
12          </View>
13      </View>
14
15
16//MessageReply.js
17  render() {
18    const {replyTo, replyMsg} = this.props.currentMessage;
19    return (
20      <View style={[styles.container, this.props.containerStyle]}>
21        <View style={{ padding: 5}}>
22          <View style={{backgroundColor: '#005CB5', borderRadius: 15}}>
23            <View style={{flexDirection: 'row',}}>
24              <View style={{height:50, width: 10, backgroundColor: '#00468A', borderTopLeftRadius: 15, borderBottomLeftRadius: 15}} />
25                <View style={{flexDirection: 'column'}}>
26                  <Text style={{color: 'white', paddingHorizontal: 10, paddingTop: 5, fontWeight: '700'}}>{replyTo}</Text>
27                  <Text style={{color: 'white', paddingHorizontal: 10, paddingTop: 5}}>{replyMsg}</Text>
28                </View>
29            </View>
30          </View>
31        </View>
32      </View>
33    );
34  }