diff --git a/src/CONST.ts b/src/CONST.ts index d3841189fce2..01ccb03ddd03 100755 --- a/src/CONST.ts +++ b/src/CONST.ts @@ -1256,6 +1256,8 @@ const CONST = { CARD_EXPIRATION_DATE: /^(0[1-9]|1[0-2])([^0-9])?([0-9]{4}|([0-9]{2}))$/, ROOM_NAME: /^#[a-z0-9à-ÿ-]{1,80}$/, + // eslint-disable-next-line max-len, no-misleading-character-class + EMOJI: /[\p{Extended_Pictographic}\u200d\u{1f1e6}-\u{1f1ff}\u{1f3fb}-\u{1f3ff}\u{e0020}-\u{e007f}\u20E3\uFE0F]|[#*0-9]\uFE0F?\u20E3/gu, // eslint-disable-next-line max-len, no-misleading-character-class 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, @@ -1274,18 +1276,26 @@ const CONST = { HAS_COLON_ONLY_AT_THE_BEGINNING: /^:[^:]+$/, HAS_AT_MOST_TWO_AT_SIGNS: /^@[^@]*@?[^@]*$/, - SPECIAL_CHAR_OR_EMOJI: - // eslint-disable-next-line no-misleading-character-class - /[\n\s,/?"{}[\]()&_~^%\\;`$=#<>!*\p{Extended_Pictographic}\u200d\u{1f1e6}-\u{1f1ff}\u{1f3fb}-\u{1f3ff}\u{e0020}-\u{e007f}\u20E3\uFE0F]|[#*0-9]\uFE0F?\u20E3/gu, + SPECIAL_CHAR: /[,/?"{}[\]()&^%;`$=#<>!*]/g, + + get SPECIAL_CHAR_OR_EMOJI() { + return new RegExp(`[_~\\n\\s]|${this.SPECIAL_CHAR.source}|${this.EMOJI.source}`, 'gu'); + }, - SPACE_OR_EMOJI: - // eslint-disable-next-line no-misleading-character-class - /(\s+|(?:[\p{Extended_Pictographic}\u200d\u{1f1e6}-\u{1f1ff}\u{1f3fb}-\u{1f3ff}\u{e0020}-\u{e007f}\u20E3\uFE0F]|[#*0-9]\uFE0F?\u20E3)+)/gu, + get SPACE_OR_EMOJI() { + return new RegExp(`(\\s+|(?:${this.EMOJI.source})+)`, 'gu'); + }, + + // Define the regular expression pattern to find a potential end of a mention suggestion: + // It might be a space, a newline character, an emoji, or a special character (excluding underscores, which might be used in usernames) + get MENTION_BREAKER() { + return new RegExp(`[\\n\\s]|${this.SPECIAL_CHAR.source}|${this.EMOJI.source}`, 'gu'); + }, // Define the regular expression pattern to match a string starting with an at sign and ending with a space or newline character - MENTION_REPLACER: - // eslint-disable-next-line no-misleading-character-class - /^@[^\n\r]*?(?=$|[\s,/?"{}[\]()&^%\\;`$=#<>!*\p{Extended_Pictographic}\u200d\u{1f1e6}-\u{1f1ff}\u{1f3fb}-\u{1f3ff}\u{e0020}-\u{e007f}\u20E3\uFE0F]|[#*0-9]\uFE0F?\u20E3)/u, + get MENTION_REPLACER() { + return new RegExp(`^@[^\\n\\r]*?(?=$|\\s|${this.SPECIAL_CHAR.source}|${this.EMOJI.source})`, 'u'); + }, MERGED_ACCOUNT_PREFIX: /^(MERGED_\d+@)/, diff --git a/src/pages/home/report/ReportActionCompose/SuggestionMention.js b/src/pages/home/report/ReportActionCompose/SuggestionMention.js index 6c08b68cdc78..edeac691b197 100644 --- a/src/pages/home/report/ReportActionCompose/SuggestionMention.js +++ b/src/pages/home/report/ReportActionCompose/SuggestionMention.js @@ -188,17 +188,12 @@ function SuggestionMention({ } const valueAfterTheCursor = value.substring(selectionEnd); - const indexOfFirstWhitespaceCharOrEmojiAfterTheCursor = valueAfterTheCursor.search(CONST.REGEX.NEW_LINE_OR_WHITE_SPACE_OR_EMOJI); - - let indexOfLastNonWhitespaceCharAfterTheCursor; - if (indexOfFirstWhitespaceCharOrEmojiAfterTheCursor === -1) { - // we didn't find a whitespace/emoji after the cursor, so we will use the entire string - indexOfLastNonWhitespaceCharAfterTheCursor = value.length; - } else { - indexOfLastNonWhitespaceCharAfterTheCursor = indexOfFirstWhitespaceCharOrEmojiAfterTheCursor + selectionEnd; - } + // Breaking symbol is a space, a special char, or an emoji + const suggestionBreakerRelativeIndex = valueAfterTheCursor.search(CONST.REGEX.MENTION_BREAKER); + // If a breaking symbol after the cursor is not found, use the entire string + const suggestionEndIndex = suggestionBreakerRelativeIndex === -1 ? value.length : suggestionBreakerRelativeIndex + selectionEnd; - const leftString = value.substring(0, indexOfLastNonWhitespaceCharAfterTheCursor); + const leftString = value.substring(0, suggestionEndIndex); const words = leftString.split(CONST.REGEX.SPACE_OR_EMOJI); const lastWord = _.last(words);