Add word boundaries for (all | channel | here) (#4754) (#4762)

* Add word boundaries for (all | channel | here)

* do not include underscore in channel wide mention highlight

* Regex suggested in code review

Co-authored-by: Harrison Healey <harrisonmhealey@gmail.com>

* Restyle at_mention suffix

Co-authored-by: Harrison Healey <harrisonmhealey@gmail.com>
(cherry picked from commit dce5675f05)

Co-authored-by: Elias Nahum <nahumhbl@gmail.com>
This commit is contained in:
Mattermost Build 2020-09-01 14:58:46 -04:00 committed by GitHub
parent 8c5b493405
commit 11f24a76a1
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 4 deletions

View file

@ -37,7 +37,6 @@ exports[`AtMention should match snapshot, with highlight 1`] = `
>
@John.Smith
</Text>
</Text>
`;
@ -61,6 +60,5 @@ exports[`AtMention should match snapshot, without highlight 1`] = `
>
@Victor.Welch
</Text>
</Text>
`;

View file

@ -146,6 +146,7 @@ export default class AtMention extends React.PureComponent {
let highlighted;
let mention;
let suffix;
let suffixElement;
if (user?.username) {
suffix = this.props.mentionName.substring(user.username.length);
@ -159,7 +160,7 @@ export default class AtMention extends React.PureComponent {
mention = group.name;
suffix = this.props.mentionName.substring(group.name.length);
} else {
const pattern = new RegExp(/(all|channel|here)\.?/, 'i');
const pattern = new RegExp(/\b(all|channel|here)(?:\.\B|_\b|\b)/, 'i');
const mentionMatch = pattern.exec(mentionName);
if (mentionMatch) {
@ -180,6 +181,15 @@ export default class AtMention extends React.PureComponent {
onPress = isSearchResult ? onPostPress : this.goToUserProfile;
}
if (suffix) {
const suffixStyle = {...styleText, color: this.props.theme.centerChannelColor};
suffixElement = (
<Text style={suffixStyle}>
{suffix}
</Text>
);
}
return (
<Text
style={styleText}
@ -189,7 +199,7 @@ export default class AtMention extends React.PureComponent {
<Text style={[highlighted ? null : mentionStyle, {backgroundColor}]}>
{'@' + mention}
</Text>
{suffix}
{suffixElement}
</Text>
);
}