[HOLD for payment 2023-05-22] [$2000] Update ExpensiMark to recognize mentions

[puneetlath]

This is part of the mentions project and is one of the features that we'd like to ship before EC3

ExpensiMark is the system that converts markdown in chat messages into html for storage (e.g. *bold text* to <strong>bold text</strong>).

We need to update ExpensiMark to:

1. Recognize text in the form of @email@domain.com in chat messages and replace it with <mention-user>@email@domain.com</mention-user>
2. Recognize text in the form of @here in chat messages and replace it with <mention-here>@here</mention-here>

We should only replace mentions if the @ symbol comes at the beginning of a word.

Examples that should match for user mentions:

• "hi @puneet@expensify.com"
• "@puneet@expensify.com how are you?"
• "@+19728974297@expensify.sms hey"

Examples that should not match for user mentions:

• "hi...@puneet@expensify.com"
• "puneet@expensify.com how are you?"
• "@ +19728974297 hey"

Examples that should match for here mentions:

• "hi @here"
• "@here how are you?"
• "@+19728974297@expensify.sms @here hey"

Examples that should not match for here mentions:

• "hi...@here"
• "here@ how are you?"
• "@ here hey"

When something is treated as a mention it should not get treated as an email address (meaning we don't make it a mailto link).

Mentions should be allowed within:

• bold
• italic
• strikethrough
• quote
• heading1

Mentions should not be allowed within:

• codefence
• inline code block
• link

We will want to wait to merge this PR until the custom renderers for mention-user (#17885) and mention-here (#17886) have been added.

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01227cf510add7dd82
• Upwork Job ID: 1650508959718178816
• Last Price Increase: 2023-04-25

[MelvinBot]

Current assignee @puneetlath is eligible for the NewFeature assigner, not assigning anyone new.

[MelvinBot]

Job added to Upwork: https://www.upwork.com/jobs/~01227cf510add7dd82

[MelvinBot]

Current assignee @puneetlath is eligible for the External assigner, not assigning anyone new.

[MelvinBot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @mananjadhav (External)

[MelvinBot]

Current assignee @puneetlath is eligible for the External assigner, not assigning anyone new.

[getusha]

Proposal

Please re-state the problem that we are trying to solve in this issue.

Make ExpensiMark recognize mentions to replace to required mention web components.

What is the root cause of that problem?

N/A this is kind of a new feature.

What changes do you think we should make in order to solve the problem?

We can use two separate mention regexes and add them accordingly, to replace the mentions with required html with the content. the following regex handles the cases for the mention examples provided above.

const mentionUserRegex = /(^|\s)@([\w.@+-]+(?:\.[\w@+-]+)+)\b/g;
const mentionHereRegex = /(^|\s)@here\b/g;

For User mention

For @ here mention

What alternative solutions did you explore? (Optional)

N/A

[mananjadhav]

Thanks for the proposal @getusha. I think your proposal works, I need to verify it once. I'll update here once I am done.

Meanwhile,

1. @getusha how are we ensuring that the mentions are not rendered as links?
2. @puneetlath this issue deals only with regex right? It doesn't cater to any suggestions, popup, etc. right?

[puneetlath]

@puneetlath this issue deals only with regex right? It doesn't cater to any suggestions, popup, etc. right?

Yes, this is just the ExpensiMark part of the solution. The actual rendering of <mention-here>@here</mention-here> for example will be handled in separate issues. You can see all the issues that we're working on right now here: https://github.com/orgs/Expensify/projects/31/views/2 in the Todo Before EC3 section.

[puneetlath]

For the mention-user regex, we may want to consider leveraging the email regex we already have here.

[getusha]

@getusha how are we ensuring that the mentions are not rendered as links?

@mananjadhav We can put the mention rules above every other rules by doing that we will insure that it will only treats it as mention before other replacement. or just below the codeFence here

[puneetlath]

Going to up the bounty on this since this is a high-priority roadmap issue.

Given the timeline, I'm going to go ahead and assign @getusha as well. I think the proposal seems generally good and we're close enough to an agreement that we can work out the kinks in the PR.

@getusha will you be able to raise a PR asap?

[MelvinBot]

📣 @getusha You have been assigned to this job by @puneetlath!
Please apply to this job in Upwork and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻
Keep in mind: Code of Conduct | Contributing 📖

[MelvinBot]

Upwork job price has been updated to $2000

[getusha]

@getusha will you be able to raise a PR asap?

I will raise the PR in short ASAP. thanks!

[puneetlath]

We're actively working through the PR. Good progress.

[puneetlath]

PR is in good shape, but still on hold until we deploy the custom renderers.

[puneetlath]

User renderer got merged. Just need to wait for the Here renderer now and then this will be able to go off hold.

[melvin-bot]

@puneetlath, @mananjadhav, @getusha Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

[puneetlath]

PR is still on hold. Will likely be able to merge it tomorrow.

[puneetlath]

@getusha I commented on the PR, but we need to get your commits signed. If you can do that today then we can merge the PR asap. Thanks!

[puneetlath]

This is live on staging.

[melvin-bot]

The solution for this issue has been 🚀 deployed to production 🚀 in version 1.3.13-5 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• Update expensify-common version for mentions #18655

If no regressions arise, payment will be issued on 2023-05-22. 🎊

After the hold period is over and BZ checklist items are completed, please complete any of the applicable payments for this issue, and check them off once done.

• External issue reporter
• Contributor that fixed the issue
• Contributor+ that helped on the issue and/or PR

As a reminder, here are the bonuses/penalties that should be applied for any External issue:

• Merged PR within 3 business days of assignment - 50% bonus
• Merged PR more than 9 business days after assignment - 50% penalty

[puneetlath]

Upwork offers sent.

[mananjadhav]

@puneetlath There won't be any checklist for this one as this a feature request. what do you think about regression test? do we add that for new features? I mean are they added during the design phase or during the PR?

[puneetlath]

Yes, exactly. We add them as part of the design doc itself, so no need to worry about it.

[puneetlath]

All paid. Thanks everyone!