Update Emojibase and switch to IamCal (Slack-style) shortcodes

for consistency with shortcodes commonly used by other platforms, as
was decided in https://github.com/vector-im/element-web/issues/13857.

One thing to be aware of is that the currently used version of Twemoji
does not support a few of the newer emoji present in Emojibase, so these
look a little out of place in the emoji picker. Optimally Twemoji would
be updated at the same time, though I don't know how to do that.

Signed-off-by: Robin Townsend <robin@robin.town>
This commit is contained in:
Robin Townsend 2021-07-10 22:40:30 -04:00
parent 829169ec87
commit 718887dd27
7 changed files with 72 additions and 79 deletions

View file

@ -17,7 +17,7 @@ limitations under the License.
import React from 'react';
import { IEmoji } from "../../../emoji";
import { IEmoji, getShortcodes } from "../../../emoji";
import { replaceableComponent } from "../../../utils/replaceableComponent";
interface IProps {
@ -30,8 +30,8 @@ class Preview extends React.PureComponent<IProps> {
const {
unicode = "",
annotation = "",
shortcodes: [shortcode = ""],
} = this.props.emoji || {};
} = this.props.emoji;
const shortcode = getShortcodes(this.props.emoji)[0];
return (
<div className="mx_EmojiPicker_footer mx_EmojiPicker_preview">
@ -42,9 +42,9 @@ class Preview extends React.PureComponent<IProps> {
<div className="mx_EmojiPicker_name mx_EmojiPicker_preview_name">
{annotation}
</div>
<div className="mx_EmojiPicker_shortcode">
{shortcode}
</div>
{ shortcode ?
<div className="mx_EmojiPicker_shortcode">{shortcode}</div> :
null }
</div>
</div>
);