react native message\ code example

Example: Message reply react native

//ChatFooter.js
        <View style={{height: 50, flexDirection: 'row'}}>
          <View style={{height:50, width: 5, backgroundColor: 'red'}}></View>
          <View style={{flexDirection: 'column'}}>
              <Text style={{color: 'red', paddingLeft: 10, paddingTop: 5}}>{replyTo}</Text>
              <Text style={{color: 'gray', paddingLeft: 10, paddingTop: 5}}>{replyMsg}</Text>
          </View>
          <View style={{flex: 1,justifyContent: 'center',alignItems:'flex-end', paddingRight: 10}}>
              <TouchableOpacity onPress={dismiss}>
                  <Icon name="x" type="feather" color="#0084ff" />
              </TouchableOpacity>
          </View>
      </View>


//MessageReply.js
  render() {
    const {replyTo, replyMsg} = this.props.currentMessage;
    return (
      <View style={[styles.container, this.props.containerStyle]}>
        <View style={{ padding: 5}}>
          <View style={{backgroundColor: '#005CB5', borderRadius: 15}}>
            <View style={{flexDirection: 'row',}}>
              <View style={{height:50, width: 10, backgroundColor: '#00468A', borderTopLeftRadius: 15, borderBottomLeftRadius: 15}} />
                <View style={{flexDirection: 'column'}}>
                  <Text style={{color: 'white', paddingHorizontal: 10, paddingTop: 5, fontWeight: '700'}}>{replyTo}</Text>
                  <Text style={{color: 'white', paddingHorizontal: 10, paddingTop: 5}}>{replyMsg}</Text>
                </View>
            </View>
          </View>
        </View>
      </View>
    );
  }