renderAvatar seems to add a padding

[benjaminb10]

It seems that using renderAvatar add a padding to the last bubble, even if the renderAvatar does nothing more than render the original Avatar.

My code:

  renderAvatar(props) {
    return (
        <Avatar
          {...props}
        />
    );
  }

  render() {
    return (
      <View>
        <GiftedChat
          messages={this.messages}
          renderAvatar={this.renderAvatar.bind(this)}
        />
      </View>
    );
  }

The result before and after commenting the line renderAvatar={this.renderAvatar.bind(this)}:

[benjaminb10]

@FaridSafi any news about this issue?

[benjaminb10]

I've found a temporary hack for fixing this: wrapping Avatar component in a View component with a negative margin right of 8.

  renderAvatar(props) {
    return (
      <View style={{'marginRight': -8}}>
        <Avatar
          {...props}
        />
      </View>
    );
  }

[melyux]

How's this closed? @xcarpentier It's still very much happening 5 years later