Repository: RocketChat/Rocket.Chat.ReactNative (language: typescript)

Issue:
[bug] Autocomplete don't clear search query
<!-- 

Please see our guide for opening issues: https://rocket.chat/docs/contributing/reporting-issues

If you have questions or are looking for help/support please see: https://rocket.chat/docs/getting-support

If you are experiencing a bug please search our issues to be sure it is not already present: https://github.com/RocketChat/Rocket.Chat.ReactNative/issues

-->

### Description:

Few versions before (in 4.16 to be accurate) a very good feature was introduced - autocomplete as it works on web client. That autocomplete function search not only name of user, but username too (Real Name on Russian in our case).
But now one pitty bug appeared in that feature - if you start mention with `@` sign and fill few symbols of username and then tap on suggested user - that few symbols remain in message box.

### Environment Information:

- Rocket.Chat Server Version: 3.16.3
- Rocket.Chat App Version: 4.19.0
- Device Name: Xiaomi Mo 9 SE
- OS Version: Android 11

### Steps to reproduce:

1. Start typing `@карла` to mention `Карлан Антон` (that my name) 
2. See suggestions
3. Tap correct user from suggestion
4. Correct username concatenated to search query

### Expected behavior:

Suggested username should remain without query string 

### Actual behavior:


Write `@карла` and then tap to suggested `karlanaa` user
![Screenshot_2021-08-24-21-32-34-756_chat rocket reactnative](https://user-images.githubusercontent.com/4023037/130639412-b00220f5-ca46-4c58-a6f4-91b04d03c601.jpg)
Got `@карлаkarlanaa` string in message box. Expect to see `@karlanaa`
![Screenshot_2021-08-24-21-32-43-257_chat rocket reactnative](https://user-images.githubusercontent.com/4023037/130639418-20d489e8-c892-489a-b2a4-959b6b6fcb5e.jpg)
Send that wrong string to chat - it's not working (which is very logic)
![Screenshot_2021-08-24-21-32-51-040_chat rocket reactnative](https://user-images.githubusercontent.com/4023037/130639420-d188fef2-ea00-434a-bd10-abc90fe34efa.jpg)


### Additional context:

<!-- Add any other context about the problem here. -->
Related to  #2529 #1580 and improved in #2997 but with that  bug


Discussion hints:
@diegolmello Hello!
Can you take that issue to next sprint?
Thank you!
 Still an issue in 4.24
@ankar84 Done!

Pull request: [FIX] Mention from suggestions concatenates to query string on autocomplete
<!-- This is a pull request template, you do not need to uncomment or remove the comments, they won't show up in the PR text. -->

## Proposed changes
<!-- Describe the big picture of your changes here to communicate to the maintainers why we should accept this pull request. If it fixes a bug or resolves a feature request, be sure to link to that issue below. -->

https://user-images.githubusercontent.com/77742477/153057487-1dbb2bb9-b105-4e44-a77b-734beb40f7b5.mp4



## Issue(s)	
<!-- Link the issues being closed by or related to this PR. For example, you can use #594 if this PR closes issue number 594 -->
Fixes #3342 

## How to test or reproduce
<!-- Mention how you would reproduce the bug if not mentioned on the issue page already. Also mention which screens are going to have the changes if applicable -->


## Screenshots

## Types of changes
<!-- What types of changes does your code introduce to Rocket.Chat? -->
<!-- Put an `x` in the boxes that apply -->

- [X] Bugfix (non-breaking change which fixes an issue)
- [ ] Improvement (non-breaking change which improves a current function)
- [ ] New feature (non-breaking change which adds functionality)
- [ ] Documentation update (if none of the other choices apply)

## Checklist
<!-- Put an `x` in the boxes that apply. You can also fill these out after creating the PR. If you're unsure about any of them, don't hesitate to ask. We're here to help! This is simply a reminder of what we are going to look for before merging your code. -->

- [X] I have read the [CONTRIBUTING](https://github.com/RocketChat/Rocket.Chat/blob/develop/.github/CONTRIBUTING.md#contributing-to-rocketchat) doc
- [X] I have signed the [CLA](https://cla-assistant.io/RocketChat/Rocket.Chat.ReactNative)
- [X] Lint and unit tests pass locally with my changes
- [X] I have added tests that prove my fix is effective or that my feature works (if applicable)
- [ ] I have added necessary documentation (if applicable)
- [ ] Any dependent changes have been merged and published in downstream modules

## Further comments
<!-- If this is a relatively large or complex change, kick off the discussion by explaining why you chose the solution you did and what alternatives you considered, etc... -->


Test command: NODE_OPTIONS='--experimental-vm-modules --max-old-space-size=4096' npx --no-install jest app/containers/MessageBox/getMentionRegexp.test.js --passWithNoTests 2>&1

Fix patch:
diff --git a/app/containers/MessageBox/getMentionRegexp.ts b/app/containers/MessageBox/getMentionRegexp.ts
new file mode 100644
index 00000000000..ec8ea5d1483
--- /dev/null
+++ b/app/containers/MessageBox/getMentionRegexp.ts
@@ -0,0 +1,4 @@
+// Match query string from the message to replace it with the suggestion
+const getMentionRegexp = (): any => /[^@:#/!]*$/;
+
+export default getMentionRegexp;
diff --git a/app/containers/MessageBox/index.tsx b/app/containers/MessageBox/index.tsx
index 073d04b74de..1b94e80d925 100644
--- a/app/containers/MessageBox/index.tsx
+++ b/app/containers/MessageBox/index.tsx
@@ -31,6 +31,7 @@ import { isAndroid, isTablet } from '../../utils/deviceInfo';
 import { canUploadFile } from '../../utils/media';
 import EventEmiter from '../../utils/events';
 import { KEY_COMMAND, handleCommandShowUpload, handleCommandSubmit, handleCommandTyping } from '../../commands';
+import getMentionRegexp from './getMentionRegexp';
 import Mentions from './Mentions';
 import MessageboxContext from './Context';
 import {
@@ -489,7 +490,7 @@ class MessageBox extends Component<IMessageBoxProps, IMessageBoxState> {
 		const msg = this.text;
 		const { start, end } = this.selection;
 		const cursor = Math.max(start, end);
-		const regexp = /([a-z0-9._-]+)$/im;
+		const regexp = getMentionRegexp();
 		let result = msg.substr(0, cursor).replace(regexp, '');
 		// Remove the ! after select the canned response
 		if (trackingType === MENTIONS_TRACKING_TYPE_CANNED) {


Test patch:
diff --git a/app/containers/MessageBox/getMentionRegexp.test.js b/app/containers/MessageBox/getMentionRegexp.test.js
new file mode 100644
index 00000000000..8923ae10013
--- /dev/null
+++ b/app/containers/MessageBox/getMentionRegexp.test.js
@@ -0,0 +1,56 @@
+import getMentionRegexp from './getMentionRegexp';
+
+const regexp = getMentionRegexp();
+
+describe('getMentionRegexpUser', function () {
+	test('removing query text on user suggestion autocomplete (latin)', () => {
+		const message = 'Hey @test123';
+		expect(message.replace(regexp, '')).toBe('Hey @');
+	});
+
+	test('removing query text on user suggestion autocomplete (arabic)', () => {
+		const message = 'Hey @اختبار123';
+		expect(message.replace(regexp, '')).toBe('Hey @');
+	});
+
+	test('removing query text on user suggestion autocomplete (russian)', () => {
+		const message = 'Hey @тест123';
+		expect(message.replace(regexp, '')).toBe('Hey @');
+	});
+
+	test('removing query text on user suggestion autocomplete (chinese trad)', () => {
+		const message = 'Hey @測試123';
+		expect(message.replace(regexp, '')).toBe('Hey @');
+	});
+
+	test('removing query text on user suggestion autocomplete (japanese)', () => {
+		const message = 'Hey @テスト123';
+		expect(message.replace(regexp, '')).toBe('Hey @');
+	});
+
+	test('removing query text on user suggestion autocomplete (special characters in query)', () => {
+		const message = "Hey @'=test123";
+		expect(message.replace(regexp, '')).toBe('Hey @');
+	});
+});
+
+describe('getMentionRegexpEmoji', function () {
+	test('removing query text on emoji suggestion autocomplete ', () => {
+		const message = 'Hey :smiley';
+		expect(message.replace(regexp, '')).toBe('Hey :');
+	});
+});
+
+describe('getMentionRegexpCommand', function () {
+	test('removing query text on emoji suggestion autocomplete ', () => {
+		const message = '/archive';
+		expect(message.replace(regexp, '')).toBe('/');
+	});
+});
+
+describe('getMentionRegexpRoom', function () {
+	test('removing query text on emoji suggestion autocomplete ', () => {
+		const message = 'Check #general';
+		expect(message.replace(regexp, '')).toBe('Check #');
+	});
+});