mirror of
https://github.com/HabitRPG/habitica.git
synced 2025-12-17 14:47:53 +01:00
refactored the highlightUsers-method, only matches mentions and not emails (#10982)
This commit is contained in:
@@ -3,9 +3,10 @@ import habiticaMarkdown from 'habitica-markdown';
|
|||||||
|
|
||||||
describe('highlightUserAndEmail', () => {
|
describe('highlightUserAndEmail', () => {
|
||||||
it('highlights displayname', () => {
|
it('highlights displayname', () => {
|
||||||
const text = 'hello @displayedUser';
|
const text = 'hello @displayedUser with text after';
|
||||||
|
|
||||||
const result = highlightUsers(text, 'user', 'displayedUser');
|
const result = highlightUsers(text, 'user', 'displayedUser');
|
||||||
|
|
||||||
expect(result).to.contain('<span class="at-highlight at-text">@displayedUser</span>');
|
expect(result).to.contain('<span class="at-highlight at-text">@displayedUser</span>');
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -16,17 +17,23 @@ describe('highlightUserAndEmail', () => {
|
|||||||
expect(result).to.contain('<span class="at-highlight at-text">@user</span>');
|
expect(result).to.contain('<span class="at-highlight at-text">@user</span>');
|
||||||
});
|
});
|
||||||
|
|
||||||
it('highlights email with username', () => {
|
it('not highlights any email', () => {
|
||||||
const text = habiticaMarkdown.render('hello hello@user.com');
|
const text = habiticaMarkdown.render('hello@example.com');
|
||||||
|
|
||||||
const result = highlightUsers(text, 'user', 'displayedUser');
|
const result = highlightUsers(text, 'example', 'displayedUser');
|
||||||
expect(result).to.contain('>hello<span class="at-highlight at-text">@user</span>.com</a>');
|
expect(result).to.not.contain('<span class="at-highlight">@example</span>');
|
||||||
});
|
});
|
||||||
|
|
||||||
it('highlights any mention', () => {
|
|
||||||
const text = habiticaMarkdown.render('hello y.@user.com other words');
|
|
||||||
|
|
||||||
const result = highlightUsers(text, 'test', 'displayedUser');
|
it('complex highlight', () => {
|
||||||
expect(result).to.contain('<span class="at-text">@user</span>');
|
const plainText = 'a bit more @mentions to @use my@mentions.com broken.@mail.com';
|
||||||
|
|
||||||
|
const text = habiticaMarkdown.render(plainText);
|
||||||
|
|
||||||
|
const result = highlightUsers(text, 'use', 'mentions');
|
||||||
|
|
||||||
|
expect(result).to.contain('<span class="at-highlight at-text">@mentions</span>');
|
||||||
|
expect(result).to.contain('<span class="at-highlight at-text">@use</span>');
|
||||||
|
expect(result).to.not.contain('<span class="at-highlight at-text">@mentions</span>.com');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -1,18 +1,24 @@
|
|||||||
|
import escapeRegExp from 'lodash/escapeRegExp';
|
||||||
|
|
||||||
|
const optionalAnchorTagRegExStr = '(<\\w[^>]*)?'; // everything including the anchor tag is recognized
|
||||||
|
const mentionRegExStr = '(@[\\w-]+)';
|
||||||
|
const optionalPostMentionRegExStr = '(\\.\\w+)?'; // like dot-TLD
|
||||||
|
|
||||||
|
const finalMentionRegEx = new RegExp(`${optionalAnchorTagRegExStr}${mentionRegExStr}${optionalPostMentionRegExStr}`, 'gi');
|
||||||
|
|
||||||
export function highlightUsers (text, userName, displayName) {
|
export function highlightUsers (text, userName, displayName) {
|
||||||
const findAnyMentionRegex = '@[\\w-]+(?:\\b)';
|
const currentUser = [`@${userName}`, `@${displayName}`].map(escapeRegExp);
|
||||||
|
|
||||||
const atRegex = new RegExp(`${findAnyMentionRegex}`, 'gi');
|
|
||||||
const currentUser = [`@${userName}`, `@${displayName}`];
|
|
||||||
|
|
||||||
if (atRegex.test(text)) {
|
text = text.replace(finalMentionRegEx, (fullMatched, preMention, mentionStr, postMention) => {
|
||||||
text = text.replace(atRegex, match => {
|
if (preMention && preMention.includes('<a') || Boolean(postMention)) {
|
||||||
if (currentUser.includes(match)) {
|
return fullMatched;
|
||||||
return `<span class="at-highlight at-text">${match}</span>`;
|
}
|
||||||
}
|
|
||||||
|
|
||||||
return `<span class="at-text">${match}</span>`;
|
const isUserMention = currentUser.includes(mentionStr) ? 'at-text' : '';
|
||||||
});
|
|
||||||
}
|
return fullMatched.replace(mentionStr, `<span class="at-highlight ${isUserMention}">${mentionStr}</span>`);
|
||||||
|
});
|
||||||
|
|
||||||
return text;
|
return text;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user