From 0e4e174e25cdf3799189fef7b79243c300da67b2 Mon Sep 17 00:00:00 2001 From: Prateek Jain Date: Fri, 8 May 2020 22:46:22 +0530 Subject: [PATCH] [FIX] Avatar of message as an emoji (#2038) * fixed-issue * removed-hardcoded-emoji * Merge develop * replaced markdown with emoji componenent * made-changes * use avatar onPress Co-authored-by: Djorkaeff Alexandre Co-authored-by: Diego Mello --- app/containers/Avatar.js | 18 +++++++++++++++--- app/containers/markdown/Emoji.js | 5 ++--- app/containers/markdown/index.js | 5 ++--- app/containers/message/MessageAvatar.js | 10 ++++++++-- app/containers/message/index.js | 3 ++- app/lib/database/model/Message.js | 2 ++ app/lib/database/model/Thread.js | 2 ++ app/lib/database/model/ThreadMessage.js | 2 ++ app/lib/database/model/migrations.js | 18 ++++++++++++++++++ app/lib/database/schema/app.js | 3 +++ 10 files changed, 56 insertions(+), 12 deletions(-) diff --git a/app/containers/Avatar.js b/app/containers/Avatar.js index 77ccca7f..66bef841 100644 --- a/app/containers/Avatar.js +++ b/app/containers/Avatar.js @@ -6,9 +6,10 @@ import Touchable from 'react-native-platform-touchable'; import { settings as RocketChatSettings } from '@rocket.chat/sdk'; import { avatarURL } from '../utils/avatar'; +import Emoji from './markdown/Emoji'; const Avatar = React.memo(({ - text, size, baseUrl, borderRadius, style, avatar, type, children, userId, token, onPress + text, size, baseUrl, borderRadius, style, avatar, type, children, userId, token, onPress, theme, emoji, getCustomEmoji }) => { const avatarStyle = { width: size, @@ -24,7 +25,15 @@ const Avatar = React.memo(({ type, text, size, userId, token, avatar, baseUrl }); - let image = ( + let image = emoji ? ( + + ) : ( { const emojiUnicode = shortnameToUnicode(literal); - const emoji = getCustomEmoji && getCustomEmoji(emojiName); + const emoji = getCustomEmoji && getCustomEmoji(literal.replace(/:/g, '')); if (emoji && customEmojis) { return ( { + renderEmoji = ({ literal }) => { const { - getCustomEmoji, baseUrl, customEmojis = true, style, theme + getCustomEmoji, baseUrl, customEmojis, style, theme } = this.props; return ( { const { baseUrl, user } = useContext(MessageContext); if (isHeader && author) { @@ -21,10 +21,13 @@ const MessageAvatar = React.memo(({ size={small ? 20 : 36} borderRadius={small ? 2 : 4} onPress={author._id === user.id ? undefined : () => navToRoomInfo(navParam)} + getCustomEmoji={getCustomEmoji} avatar={avatar} + emoji={emoji} baseUrl={baseUrl} userId={user.id} token={user.token} + theme={theme} /> ); } @@ -34,9 +37,12 @@ const MessageAvatar = React.memo(({ MessageAvatar.propTypes = { isHeader: PropTypes.bool, avatar: PropTypes.string, + emoji: PropTypes.string, author: PropTypes.obj, small: PropTypes.bool, - navToRoomInfo: PropTypes.func + navToRoomInfo: PropTypes.func, + getCustomEmoji: PropTypes.func, + theme: PropTypes.string }; MessageAvatar.displayName = 'MessageAvatar'; diff --git a/app/containers/message/index.js b/app/containers/message/index.js index 43559abb..207e5e70 100644 --- a/app/containers/message/index.js +++ b/app/containers/message/index.js @@ -230,7 +230,7 @@ class MessageContainer extends React.Component { item, user, style, archived, baseUrl, useRealName, broadcast, fetchThreadName, customThreadTimeFormat, showAttachment, timeFormat, isReadReceiptEnabled, autoTranslateRoom, autoTranslateLanguage, navToRoomInfo, getCustomEmoji, isThreadRoom, callJitsi, blockAction, rid, theme } = this.props; const { - id, msg, ts, attachments, urls, reactions, t, avatar, u, alias, editedBy, role, drid, dcount, dlm, tmid, tcount, tlm, tmsg, mentions, channels, unread, blocks, autoTranslate: autoTranslateMessage + id, msg, ts, attachments, urls, reactions, t, avatar, emoji, u, alias, editedBy, role, drid, dcount, dlm, tmid, tcount, tlm, tmsg, mentions, channels, unread, blocks, autoTranslate: autoTranslateMessage } = item; let message = msg; @@ -268,6 +268,7 @@ class MessageContainer extends React.Component { reactions={reactions} alias={alias} avatar={avatar} + emoji={emoji} timeFormat={timeFormat} customThreadTimeFormat={customThreadTimeFormat} style={style} diff --git a/app/lib/database/model/Message.js b/app/lib/database/model/Message.js index 24dec99a..22dfec73 100644 --- a/app/lib/database/model/Message.js +++ b/app/lib/database/model/Message.js @@ -30,6 +30,8 @@ export default class Message extends Model { @field('avatar') avatar; + @field('emoji') emoji; + @json('attachments', sanitizer) attachments; @json('urls', sanitizer) urls; diff --git a/app/lib/database/model/Thread.js b/app/lib/database/model/Thread.js index e84dd5b7..fca0122f 100644 --- a/app/lib/database/model/Thread.js +++ b/app/lib/database/model/Thread.js @@ -30,6 +30,8 @@ export default class Thread extends Model { @field('avatar') avatar; + @field('emoji') emoji; + @json('attachments', sanitizer) attachments; @json('urls', sanitizer) urls; diff --git a/app/lib/database/model/ThreadMessage.js b/app/lib/database/model/ThreadMessage.js index f071a9c6..842f2228 100644 --- a/app/lib/database/model/ThreadMessage.js +++ b/app/lib/database/model/ThreadMessage.js @@ -32,6 +32,8 @@ export default class ThreadMessage extends Model { @field('avatar') avatar; + @field('emoji') emoji; + @json('attachments', sanitizer) attachments; @json('urls', sanitizer) urls; diff --git a/app/lib/database/model/migrations.js b/app/lib/database/model/migrations.js index 93414ab0..ab5b1484 100644 --- a/app/lib/database/model/migrations.js +++ b/app/lib/database/model/migrations.js @@ -78,6 +78,24 @@ export default schemaMigrations({ { toVersion: 8, steps: [ + addColumns({ + table: 'messages', + columns: [ + { name: 'emoji', type: 'string', isOptional: true } + ] + }), + addColumns({ + table: 'thread_messages', + columns: [ + { name: 'emoji', type: 'string', isOptional: true } + ] + }), + addColumns({ + table: 'threads', + columns: [ + { name: 'emoji', type: 'string', isOptional: true } + ] + }), addColumns({ table: 'subscriptions', columns: [ diff --git a/app/lib/database/schema/app.js b/app/lib/database/schema/app.js index dbd7a232..f740501b 100644 --- a/app/lib/database/schema/app.js +++ b/app/lib/database/schema/app.js @@ -67,6 +67,7 @@ export default appSchema({ { name: 'parse_urls', type: 'string' }, { name: 'groupable', type: 'boolean', isOptional: true }, { name: 'avatar', type: 'string', isOptional: true }, + { name: 'emoji', type: 'string', isOptional: true }, { name: 'attachments', type: 'string', isOptional: true }, { name: 'urls', type: 'string', isOptional: true }, { name: '_updated_at', type: 'number' }, @@ -105,6 +106,7 @@ export default appSchema({ { name: 'parse_urls', type: 'string', isOptional: true }, { name: 'groupable', type: 'boolean', isOptional: true }, { name: 'avatar', type: 'string', isOptional: true }, + { name: 'emoji', type: 'string', isOptional: true }, { name: 'attachments', type: 'string', isOptional: true }, { name: 'urls', type: 'string', isOptional: true }, { name: 'status', type: 'number', isOptional: true }, @@ -141,6 +143,7 @@ export default appSchema({ { name: 'parse_urls', type: 'string', isOptional: true }, { name: 'groupable', type: 'boolean', isOptional: true }, { name: 'avatar', type: 'string', isOptional: true }, + { name: 'emoji', type: 'string', isOptional: true }, { name: 'attachments', type: 'string', isOptional: true }, { name: 'urls', type: 'string', isOptional: true }, { name: 'status', type: 'number', isOptional: true },