Mattermost-server: Show rendered emojis in the text composition areas

[esethna]

If you're interested please comment here and come join our "Contributors" community channel on our daily build server, where you can discuss questions with community members and the Mattermost core team. For technical advice or questions, please join our "Developers" community channel.

New contributors please see our Developer's Guide.

---

Notes: Jira ticket

Repro:

1. Type a message containing an emoji (either typed out or selected using the emoji picker)

Observed: emojis do not render in the text area, instead remain as text until they are posted

Expected:
Emojis turn into rendered emojis in the text area, when
1) They are selected in the emoji picker
2) They are selected from the emoji autocomplete
3) They are typed in full with the trailing colon (ie ":smile:")

Once converted to an emoji, pressing backspace removes the emoji from the text area

Note that this should apply to the center pane text area, right-hand side text area, edit post modal, edit channel header modal, and edit channel purpose modal.

[gabrieljackson]

I will grab this one!

[hanzei]

Great, thanks @gabrieljackson! :+1: :tada:

[esethna]

Hi @gabrieljackson just checking how this is going?

[cpoile]

I'll take this one!

[hanzei]

Thanks @cpoile! :tada:

[ChrisDobby]

I'll take this if that's OK?

[hanzei]

Sure, that's great :tada: You might want to take inspiration from https://github.com/mattermost/mattermost-webapp/pull/2634

[ChrisDobby]

Is this along the right lines?

[hanzei]

That looks amazing @ChrisDobby :tada:

Feel free to open a PR soon so people can try it out and provide more in depth feedback.

[ChrisDobby]

Finally got around to creating a PR!

[esethna]

@ChrisDobby let us know if you're still working on this and I can reassign to you :)

[ChrisDobby]

I can't believe I forgot about this! If it's OK I'd like to finish this off @esethna ?

[esethna]

Absolutely, thanks @ChrisDobby!