Skip to content

Add emoji rule#649

Merged
stitesExpensify merged 4 commits intoExpensify:mainfrom
dukenv0307:fix/34307
Feb 20, 2024
Merged

Add emoji rule#649
stitesExpensify merged 4 commits intoExpensify:mainfrom
dukenv0307:fix/34307

Conversation

@dukenv0307
Copy link
Copy Markdown
Contributor

Fixed Issues

$ Expensify/App#34307

Tests

  1. Open any chat
  2. Send a message with emoji
  3. See the html of the message and verify that the emoji is wrapped in a emoji tag

QA

  1. Open any chat
  2. Send a message with emoji
  3. See the html of the message and verify that the emoji is wrapped in a emoji tag

Offline test

Same as above

Screenshots/Videos

Android: Native
Android: mWeb Chrome Screenshot 2024-01-24 at 15 06 48
iOS: Native
iOS: mWeb Safari Screenshot 2024-01-24 at 15 05 31
MacOS: Chrome / Safari Screenshot 2024-01-24 at 15 02 03
MacOS: Desktop Screenshot 2024-01-24 at 15 09 11

@dukenv0307 dukenv0307 marked this pull request as ready for review February 15, 2024 11:41
@dukenv0307 dukenv0307 requested a review from a team as a code owner February 15, 2024 11:41
@melvin-bot melvin-bot bot requested review from arosiclair and removed request for a team February 15, 2024 11:41
@dukenv0307
Copy link
Copy Markdown
Contributor Author

dukenv0307 commented Feb 15, 2024

@arosiclair @fedirjh I created another PR in expensify-common here since the previous PR is reverted. Ref: Expensify/App#36437

Comment on lines +19 to +24
{
name: 'emoji',
regex: CONST.REG_EXP.EMOJIS,
replacement: match => `<emoji>${match}</emoji>`
},

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's add a description to this rule?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Updated.

lib/CONST.jsx Outdated
* @type RegExp
*/
EMOJIS: /[\p{Extended_Pictographic}\u200d\u{1f1e6}-\u{1f1ff}\u{1f3fb}-\u{1f3ff}\u{e0020}-\u{e007f}\u20E3\uFE0F]|[#*0-9]\uFE0F?\u20E3/gu,
EMOJI: /[\p{Extended_Pictographic}\u200d\u{1f1e6}-\u{1f1ff}\u{1f3fb}-\u{1f3ff}\u{e0020}-\u{e007f}\u20E3\uFE0F]|[#*0-9]\uFE0F?\u20E3/gu,
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is this change safe? This maybe used in other repositories as well. Let's keep EMOJIS as it's been and implement new separate regexp for our use case.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@fedirjh I updated.

lib/CONST.jsx Outdated
*
* @type RegExp
*/
EMOJIS: /[\p{Extended_Pictographic}](\u200D[\p{Extended_Pictographic}]|[\u{1F3FB}-\u{1F3FF}]|[\u{E0020}-\u{E007F}]|\uFE0F|\u20E3)*|[\u{1F1E6}-\u{1F1FF}]{2}|[#*0-9]\uFE0F?\u20E3/gu,
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why do we implement 2 Regex for emojis?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Expensify/App#35838 (comment) Coming from this comment this regex can cover this case by only applying one emoji tag for the emoji that is made up by some different emojis.

@fedirjh
Copy link
Copy Markdown
Contributor

fedirjh commented Feb 18, 2024

@dukenv0307 Friendly bump.

@dukenv0307 dukenv0307 mentioned this pull request Feb 19, 2024
50 tasks
+ '[<emoji>😄</emoji>] <a href="mailto:abc@gmail.com">abc@gmail.com</a> '
+ '[<emoji>😄</emoji>]((<a href="mailto:abc@gmail.com">abc@gmail.com</a>)) '
+ '[<emoji>😄</emoji><a href="mailto:abc@gmail.com">abc@gmail.com</a>](<a href="mailto:abc@gmail.com">abc@gmail.com</a>) '
+ '[<emoji>😄</emoji> <a href="mailto:abc@gmail.com">abc@gmail.com</a> ](<a href="mailto:abc@gmail.com">abc@gmail.com</a>) '
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's add a test for Composite emojis.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@fedirjh I updated the test.

Copy link
Copy Markdown
Contributor

@fedirjh fedirjh left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good to me.

cc @stitesExpensify

@stitesExpensify stitesExpensify self-requested a review February 19, 2024 22:47
Copy link
Copy Markdown
Contributor

@arosiclair arosiclair left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM all yours @stitesExpensify

@yuwenmemon
Copy link
Copy Markdown
Contributor

@dukenv0307 @stitesExpensify @arosiclair Just an FYI this was reverted because of Expensify/App#38169

We should have probably not merged this until Expensify/App#37814 was ready to go but understandably these things are hard to forsee.

@fedirjh
Copy link
Copy Markdown
Contributor

fedirjh commented Mar 15, 2024

We should have probably not merged this until Expensify/App#37814 was ready to go but understandably these things are hard to forsee.

It should have been reverted alongside with:

@yuwenmemon
Copy link
Copy Markdown
Contributor

yuwenmemon commented Mar 15, 2024

Ahhhh... Well now you guys have no excuse then 😂

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants