From 1b1e168cc4a43de39a66954898105195fc4e4e01 Mon Sep 17 00:00:00 2001 From: OtavioStasiak Date: Tue, 8 Oct 2024 12:54:19 -0300 Subject: [PATCH 1/4] fix: added new rules to render big emoji --- app/containers/markdown/Emoji.tsx | 11 +++++++---- app/containers/markdown/index.tsx | 26 ++++++++++---------------- 2 files changed, 17 insertions(+), 20 deletions(-) diff --git a/app/containers/markdown/Emoji.tsx b/app/containers/markdown/Emoji.tsx index fec3247bf2..f9e62d10bf 100644 --- a/app/containers/markdown/Emoji.tsx +++ b/app/containers/markdown/Emoji.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Text } from 'react-native'; +import { View, Text } from 'react-native'; import shortnameToUnicode from '../../lib/methods/helpers/shortnameToUnicode'; import CustomEmoji from '../EmojiPicker/CustomEmoji'; @@ -23,10 +23,13 @@ const Emoji = React.memo(({ literal, isMessageContainsOnlyEmoji, getCustomEmoji, if (emoji && customEmojis) { return ; } + return ( - - {emojiUnicode} - + + + {emojiUnicode} + + ); }); diff --git a/app/containers/markdown/index.tsx b/app/containers/markdown/index.tsx index a2b663f415..a543d875b6 100644 --- a/app/containers/markdown/index.tsx +++ b/app/containers/markdown/index.tsx @@ -53,7 +53,7 @@ type TLiteral = { }; const emojiRanges = [ - '\u00a9|\u00ae|[\u2000-\u3300]|\ud83c[\ud000-\udfff]|\ud83d[\ud000-\udfff]|\ud83e[\ud000-\udfff]', // unicode emoji from https://www.regextester.com/106421 + '\u00a9|\u00ae|[\u2000-\u3300]|\ud83c[\ud000-\udfff]|\ud83d[\ud000-\udfff]|\ud83e[\ud000-\udfff]|[\uFE0F]|\u263A\uFE0F', // unicode emoji from https://www.regextester.com/106421 ':.{1,40}:', // custom emoji ' |\n' // allow spaces and line breaks ].join('|'); @@ -67,20 +67,8 @@ const isOnlyEmoji = (str: string) => { return !removeAllEmoji(str).length; }; -const removeOneEmoji = (str: string) => str.replace(new RegExp(emojiRanges), ''); - const emojiCount = (str: string) => { - str = removeSpaces(str); - let oldLength = 0; - let counter = 0; - - while (oldLength !== str.length) { - oldLength = str.length; - str = removeOneEmoji(str); - if (oldLength !== str.length) { - counter += 1; - } - } + const counter = removeSpaces(str).length; return counter; }; @@ -142,6 +130,9 @@ class Markdown extends PureComponent { renderText = ({ context, literal }: { context: []; literal: string }) => { const { numberOfLines } = this.props; const defaultStyle = [this.isMessageContainsOnlyEmoji ? styles.textBig : {}, ...context.map(type => styles[type])]; + + if (this.isMessageContainsOnlyEmoji) return this.renderEmoji({ literal: removeSpaces(literal) }); + return ( {literal} @@ -191,10 +182,13 @@ class Markdown extends PureComponent { }; renderParagraph = ({ children }: any) => { - const { numberOfLines, style = [], theme } = this.props; + const { numberOfLines, style = [], theme, msg } = this.props; if (!children || children.length === 0) { return null; } + + if (msg && isOnlyEmoji(msg)) return <>{children}; + return ( {children} @@ -343,7 +337,7 @@ class Markdown extends PureComponent { m = formatHyperlink(m); let ast = parser.parse(m); ast = mergeTextNodes(ast); - this.isMessageContainsOnlyEmoji = isOnlyEmoji(m) && emojiCount(m) <= 3; + this.isMessageContainsOnlyEmoji = isOnlyEmoji(m) && emojiCount(m) <= 6; return this.renderer?.render(ast) || null; } } From a478d685c5f6901af90214f5da043f520b4a5f1e Mon Sep 17 00:00:00 2001 From: Diego Mello Date: Tue, 8 Oct 2024 18:35:35 -0300 Subject: [PATCH 2/4] minor changes --- app/containers/markdown/index.tsx | 8 ++++---- app/containers/markdown/styles.ts | 1 + 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/app/containers/markdown/index.tsx b/app/containers/markdown/index.tsx index a543d875b6..9300d80f25 100644 --- a/app/containers/markdown/index.tsx +++ b/app/containers/markdown/index.tsx @@ -53,7 +53,7 @@ type TLiteral = { }; const emojiRanges = [ - '\u00a9|\u00ae|[\u2000-\u3300]|\ud83c[\ud000-\udfff]|\ud83d[\ud000-\udfff]|\ud83e[\ud000-\udfff]|[\uFE0F]|\u263A\uFE0F', // unicode emoji from https://www.regextester.com/106421 + '\u00a9|\u00ae|[\u2000-\u3300]|\ud83c[\ud000-\udfff]|\ud83d[\ud000-\udfff]|\ud83e[\ud000-\udfff]', // unicode emoji from https://www.regextester.com/106421 ':.{1,40}:', // custom emoji ' |\n' // allow spaces and line breaks ].join('|'); @@ -186,9 +186,9 @@ class Markdown extends PureComponent { if (!children || children.length === 0) { return null; } - - if (msg && isOnlyEmoji(msg)) return <>{children}; - + if (msg && this.isMessageContainsOnlyEmoji) { + return {children}; + } return ( {children} diff --git a/app/containers/markdown/styles.ts b/app/containers/markdown/styles.ts index 232d60d7f1..c03fd66f76 100644 --- a/app/containers/markdown/styles.ts +++ b/app/containers/markdown/styles.ts @@ -46,6 +46,7 @@ export default StyleSheet.create({ ...sharedStyles.textRegular }, textBig: { + lineHeight: 43, fontSize: 30, ...sharedStyles.textRegular }, From 90909f97698646600f7a7d0805d32b03acf075ba Mon Sep 17 00:00:00 2001 From: OtavioStasiak Date: Tue, 15 Oct 2024 14:28:20 -0300 Subject: [PATCH 3/4] minor changes --- app/containers/markdown/Emoji.tsx | 11 ++++------- app/containers/markdown/index.tsx | 18 +++++++++++++++--- 2 files changed, 19 insertions(+), 10 deletions(-) diff --git a/app/containers/markdown/Emoji.tsx b/app/containers/markdown/Emoji.tsx index f9e62d10bf..fec3247bf2 100644 --- a/app/containers/markdown/Emoji.tsx +++ b/app/containers/markdown/Emoji.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { View, Text } from 'react-native'; +import { Text } from 'react-native'; import shortnameToUnicode from '../../lib/methods/helpers/shortnameToUnicode'; import CustomEmoji from '../EmojiPicker/CustomEmoji'; @@ -23,13 +23,10 @@ const Emoji = React.memo(({ literal, isMessageContainsOnlyEmoji, getCustomEmoji, if (emoji && customEmojis) { return ; } - return ( - - - {emojiUnicode} - - + + {emojiUnicode} + ); }); diff --git a/app/containers/markdown/index.tsx b/app/containers/markdown/index.tsx index 9300d80f25..5e0545531b 100644 --- a/app/containers/markdown/index.tsx +++ b/app/containers/markdown/index.tsx @@ -67,8 +67,20 @@ const isOnlyEmoji = (str: string) => { return !removeAllEmoji(str).length; }; +const removeOneEmoji = (str: string) => str.replace(new RegExp(emojiRanges), ''); + const emojiCount = (str: string) => { - const counter = removeSpaces(str).length; + str = removeSpaces(str); + let oldLength = 0; + let counter = 0; + + while (oldLength !== str.length) { + oldLength = str.length; + str = removeOneEmoji(str); + if (oldLength !== str.length) { + counter += 1; + } + } return counter; }; @@ -131,7 +143,7 @@ class Markdown extends PureComponent { const { numberOfLines } = this.props; const defaultStyle = [this.isMessageContainsOnlyEmoji ? styles.textBig : {}, ...context.map(type => styles[type])]; - if (this.isMessageContainsOnlyEmoji) return this.renderEmoji({ literal: removeSpaces(literal) }); + if (this.isMessageContainsOnlyEmoji) return this.renderEmoji({ literal }); return ( @@ -337,7 +349,7 @@ class Markdown extends PureComponent { m = formatHyperlink(m); let ast = parser.parse(m); ast = mergeTextNodes(ast); - this.isMessageContainsOnlyEmoji = isOnlyEmoji(m) && emojiCount(m) <= 6; + this.isMessageContainsOnlyEmoji = isOnlyEmoji(m) && emojiCount(m) <= 3; return this.renderer?.render(ast) || null; } } From 3cdf516b681ddfb2960479f51c31136446770cd4 Mon Sep 17 00:00:00 2001 From: OtavioStasiak Date: Wed, 16 Oct 2024 14:25:30 -0300 Subject: [PATCH 4/4] minor changes --- app/containers/markdown/index.tsx | 3 --- 1 file changed, 3 deletions(-) diff --git a/app/containers/markdown/index.tsx b/app/containers/markdown/index.tsx index 5e0545531b..6b33eb12a8 100644 --- a/app/containers/markdown/index.tsx +++ b/app/containers/markdown/index.tsx @@ -142,9 +142,6 @@ class Markdown extends PureComponent { renderText = ({ context, literal }: { context: []; literal: string }) => { const { numberOfLines } = this.props; const defaultStyle = [this.isMessageContainsOnlyEmoji ? styles.textBig : {}, ...context.map(type => styles[type])]; - - if (this.isMessageContainsOnlyEmoji) return this.renderEmoji({ literal }); - return ( {literal}