[CLNP-7806]Fix a bug where mentionedMessageTemplate is being set even when the message is not a mentioned message (#1373)

[fix]: Fix a bug where `mentionedMessageTemplate` is being set even when
the message is not a mentioned message

Fixes [CLNP-7806](https://sendbird.atlassian.net/browse/CLNP-7806)

### Changelogs
- Fix a bug where `mentionedMessageTemplate` is being set even when the
message is not a mentioned message
- Fix a bug where URL links inside Markdown-type messages do not open in
a new tab


### Checklist

Put an `x` in the boxes that apply. You can also fill these out after
creating the PR. If unsure, ask the members.
This is a reminder of what we look for before merging your code.

- [x] **All tests pass locally with my changes**
- [ ] **I have added tests that prove my fix is effective or that my
feature works**
- [ ] **Public components / utils / props are appropriately exported**
- [ ] I have added necessary documentation (if appropriate)


## External Contributions

This project is not yet set up to accept pull requests from external
contributors.

If you have a pull request that you believe should be accepted, please
contact
the Developer Relations team <developer-advocates@sendbird.com> with
details
and we'll evaluate if we can set up a
[CLA](https://en.wikipedia.org/wiki/Contributor_License_Agreement) to
allow for the contribution.


[CLNP-7806]:
https://sendbird.atlassian.net/browse/CLNP-7806?atlOrigin=eyJpIjoiNWRkNTljNzYxNjVmNDY3MDlhMDU5Y2ZhYzA5YTRkZjUiLCJwIjoiZ2l0aHViLWNvbS1KU1cifQ

Author: danney-chun

src/modules/Message/components/TextFragment/index.tsx

@@ -50,6 +50,8 @@ export default function TextFragment({
                             : 'sendbird-label--color-onbackground-1'
                         }
                         href={asSafeURL(groups[2])}
+                        target="_blank"
+                        rel="noopener noreferrer"
                       >
                         <TextFragment tokens={tokenizeMarkdown({ messageText: groups[1] })}/>
                       </a>

src/ui/MessageInput/__tests__/MessageInput.spec.js

@@ -172,7 +172,7 @@ describe('ui/MessageInput', () => {
     expect(input.textContent).toBe(mockText);
 
     fireEvent.keyDown(input, { key: 'Enter' });
-    expect(onSendMessage).toHaveBeenCalledWith({ mentionTemplate: mockText, message: mockText });
+    expect(onSendMessage).toHaveBeenCalledWith({ mentionTemplate: '', message: mockText });
   });
 
   it('should call sendMessage with valid string; new lines included', async () => {
@@ -187,7 +187,7 @@ describe('ui/MessageInput', () => {
     expect(input.textContent).toBe(mockText);
 
     fireEvent.keyDown(input, { key: 'Enter' });
-    expect(onSendMessage).toHaveBeenCalledWith({ mentionTemplate: mockText, message: mockText });
+    expect(onSendMessage).toHaveBeenCalledWith({ mentionTemplate: '', message: mockText });
   });
 
   it('should not call sendMessage with invalid string; only white spaces', async() => {
@@ -202,7 +202,7 @@ describe('ui/MessageInput', () => {
     expect(input.textContent).toBe(mockText);
 
     fireEvent.keyDown(input, { key: 'Enter' });
-    expect(onSendMessage).not.toHaveBeenCalledWith({ mentionTemplate: mockText, message: mockText });
+    expect(onSendMessage).not.toHaveBeenCalledWith({ mentionTemplate: '', message: mockText });
   });
 
   it('should render send icon if text is present', async() => {

src/ui/MessageInput/index.tsx

@@ -349,8 +349,9 @@ const MessageInput = React.forwardRef<HTMLInputElement, MessageInputProps>((prop
     try {
       const textField = internalRef?.current;
       if (!isEdit && textField?.textContent) {
-        const { messageText, mentionTemplate } = extractTextAndMentions(textField.childNodes);
+        const { messageText, mentionTemplate, isMentionedMessage } = extractTextAndMentions(textField.childNodes);
         const params = { message: messageText, mentionTemplate };
+        if (!isMentionedMessage) params.mentionTemplate = '';
         onSendMessage(params);
         resetInput(internalRef);
         /**

src/ui/MessageInput/utils.ts

@@ -34,10 +34,12 @@ function isHTMLElement(node: ChildNode): node is HTMLElement {
 export function extractTextAndMentions(childNodes: NodeListOf<ChildNode>) {
   let messageText = '';
   let mentionTemplate = '';
+  let isMentionedMessage = false;
   childNodes.forEach((node) => {
     if (isHTMLElement(node) && node.nodeName === NodeNames.Span) {
       const { innerText, dataset = {} } = node;
       const { userid = '' } = dataset;
+      if (userid) isMentionedMessage = true;
       messageText += innerText;
       mentionTemplate += `${USER_MENTION_TEMP_CHAR}{${userid}}`;
     } else if (isHTMLElement(node) && node.nodeName === NodeNames.Br) {
@@ -53,5 +55,5 @@ export function extractTextAndMentions(childNodes: NodeListOf<ChildNode>) {
       mentionTemplate += textContent;
     }
   });
-  return { messageText, mentionTemplate };
+  return { messageText, mentionTemplate, isMentionedMessage };
 }