feat: add rules to recognize user and @here mentions

__tests__/ExpensiMark-HTML-test.js

@@ -664,3 +664,161 @@ test('Test for link with no content', () => {
     const resultString = '[  ](<a href="https://www.link.com" target="_blank" rel="noreferrer noopener">www.link.com</a>)';
     expect(parser.replace(testString)).toBe(resultString);
 });
+
+// Valid text that should match for user mentions
+test('Test for user mention with @[email protected]', () => {
+    const testString = '@[email protected]';
+    const resultString = '<mention-user>@[email protected]</mention-user>';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+test('Test for user mention with @[email protected]', () => {
+    const testString = '@[email protected]';
+    const resultString = '<mention-user>@[email protected]</mention-user>';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+test('Test for user mention with bold style', () => {
+    const testString = '*@[email protected]*';
+    const resultString = '<strong><mention-user>@[email protected]</mention-user></strong>';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+test('Test for user mention with italic style', () => {
+    const testString = '_@[email protected]_';
+    const resultString = '<em><mention-user>@[email protected]</mention-user></em>';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+test('Test for user mention with heading1 style', () => {
+    const testString = '# @[email protected]';
+    const resultString = '<h1><mention-user>@[email protected]</mention-user></h1>';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+test('Test for user mention with strikethrough style', () => {
+    const testString = '~@[email protected]~';
+    const resultString = '<del><mention-user>@[email protected]</mention-user></del>';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+test('Test for user mention with @here', () => {
+    const testString = '@here say hello to @[email protected]';
+    const resultString = '<mention-here>@here</mention-here> say hello to <mention-user>@[email protected]</mention-user>';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+/**
+ * Uncomment this tests if @username became supported for user mention
+ * 
+    test('Test for user mention with single username', () => {
+        const testString = '@username';
+        const resultString = '<mention-user>@username</mention-user>';
+        expect(parser.replace(testString)).toBe(resultString);
+    });
+
+    test('Test for user mention with bold style', () => {
+        const testString = '*@username*';
+        const resultString = '<strong><mention-user>@username</mention-user></strong>';
+        expect(parser.replace(testString)).toBe(resultString);
+    });
+
+    test('Test for user mention with italic style', () => {
+        const testString = '_@username_';
+        const resultString = '<em><mention-user>@username</mention-user></em>';
+        expect(parser.replace(testString)).toBe(resultString);
+    });
+
+    test('Test for user mention with heading1 style', () => {
+        const testString = '# @username';
+        const resultString = '<h1><mention-user>@username</mention-user></h1>';
+        expect(parser.replace(testString)).toBe(resultString);
+    });
+
+    test('Test for user mention with strikethrough style', () => {
+        const testString = '~@username~';
+        const resultString = '<del><mention-user>@username</mention-user></del>';
+        expect(parser.replace(testString)).toBe(resultString);
+    });
+*/
+
+// Invalid text should not match for user mentions:
+test('Test for user mention without leading whitespace', () => {
+    const testString = 'hi...@[email protected]';
+    const resultString = 'hi...@<a href=\"mailto:[email protected]\">[email protected]</a>';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+test('Test for user mention with @username@expensify', () => {
+    const testString = '@username@expensify';
+    const resultString = '@username@expensify';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+test('Test for user mention with valid email in the middle of a word', () => {
+    const testString = 'hello [email protected] is my email';
+    const resultString = 'hello <a href=\"mailto:[email protected]\">[email protected]</a> is my email';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+test('Test for user mention with invalid username', () => {
+    const testString = '@ +19728974297 hey';
+    const resultString = '@ +19728974297 hey';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+test('Test for user mention with codefence style', () => {
+    const testString = '```@[email protected]```';
+    const resultString = '<pre>@[email protected]</pre>';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+test('Test for user mention with inlineCodeBlock style', () => {
+    const testString = '`@[email protected]`';
+    const resultString = '<code>@[email protected]</code>';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+test('Test for @here mention with codefence style', () => {
+    const testString = '```@here```';
+    const resultString = '<pre>@here</pre>';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+test('Test for @here mention with inlineCodeBlock style', () => {
+    const testString = '`@here`';
+    const resultString = '<code>@here</code>';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+// Examples that should match for here mentions:
+test('Test for here mention with @here', () => {
+    const testString = '@here';
+    const resultString = '<mention-here>@here</mention-here>';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+test('Test for here mention with leading word and space', () => {
+    const testString = 'hi all @here';
+    const resultString = 'hi all <mention-here>@here</mention-here>';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+test('Test for here mention with @here in the middle of a word', () => {
+    const testString = '@here how are you guys?';
+    const resultString = '<mention-here>@here</mention-here> how are you guys?';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+// Examples that should not match for here mentions:
+test('Test for here mention without leading whitespace', () => {
+    const testString = 'hi...@here';
+    const resultString = 'hi...@here';
+    expect(parser.replace(testString)).toBe(resultString);
+});
+
+test('Test for here mention with invalid username', () => {
+    const testString = '@ here hey';
+    const resultString = '@ here hey';
+    expect(parser.replace(testString)).toBe(resultString);
+});

lib/ExpensiMark.js

@@ -49,6 +49,38 @@ export default class ExpensiMark {
                 replacement: '$1<code>$2</code>$3',
             },
 
+            /**
+             * Apply the hereMention first because the string @here is still a valid mention for the userMention regex.
+             * This ensures that the hereMention is always considered first, even if it is followed by a valid userMention.
+            */
+            {
+                name: 'hereMentions',
+                regex: /(?<![^\s]+)@here\b/g,
+                replacement: match => `<mention-here>${match}</mention-here>`,
+            },
+
+            /**
+             * This regex matches a valid user mention in a string.
+             * A user mention is a string that starts with the '@' symbol and is followed by a valid user's primary login
+             * The username can contain any combination of letters, numbers, periods, underscores, and hyphens
+             *
+             * Note: currently we are only allowing mentions in a format of @[email protected] and @[email protected]
+             * inorder to match mentions in a format of @username we should update the regex to: /(?!@here)(?<![^_~#*\s]+)@([\w.@+-]+(?:\.[\w@+-]+)*\b)/g
+             */
+            {
+                // (?<![^~#*-]+) excludes every mention with a character infront except ~, #, * and +
+                // this is to allow bold, italic, strikethrough, quote, heading1 on a mention
+                name: 'userMentions',
+                regex: /(?!@here)(?<![^_~#*\s]+)@([\w.@+-]+@+\w+[.]+\w+(?:\.[\w@+-]+)*\b)/g,
+                replacement: (match) => {
+                    if (match[match.length - 1] === '_') {
+                        const mention = match.substring(0, match.length - 1);
+                        return `<mention-user>${mention}</mention-user>_`;
+                    }
+                    return `<mention-user>${match}</mention-user>`;
+                }
+            },
+
             /**
              * Converts markdown style links to anchor tags e.g. [Expensify]([email protected])
              * We need to convert before the auto email link rule and the manual link rule since it will not try to create a link