From 128a599fe9cb0ed1411991664e63efb8877fbbdf Mon Sep 17 00:00:00 2001
From: Bahattin Cinic <bahattin@adphorus.com>
Date: Tue, 8 Dec 2020 21:28:24 +0300
Subject: [PATCH 1/3] Fixed TouchableOpacity usage in the formatMentionNode

---
 README.md                 | 20 ++++++++++++++------
 src/Editor/EditorUtils.js | 12 +++++++-----
 2 files changed, 21 insertions(+), 11 deletions(-)

diff --git a/README.md b/README.md
index e23e21d..25b090a 100644
--- a/README.md
+++ b/README.md
@@ -46,14 +46,22 @@ const users = [
 />
 
 const formatMentionNode = (txt, key)=> (
-  <Text key={key} style={styles.mention}>
+  <TouchableOpacity key={key}  onPress={() => {}}>
+    <Text style={styles.mention}>
       {txt}
-  </Text>
-)
+    </Text>
+  </TouchableOpacity>
+);
+
+const style = {
+  letterSpacing: 0,
+  color: '#595959',
+  paddingTop: 10
+};
 
-<Text style={styles.messageText}>
-    {displayTextWithMentions(message.text, formatMentionNode)}
-</Text>
+<View style={styles.messageText}>
+  {displayTextWithMentions(message.text, formatMentionNode, style)}
+</View>
 ```
 ## How it works 
 
diff --git a/src/Editor/EditorUtils.js b/src/Editor/EditorUtils.js
index f50a95e..ded8398 100644
--- a/src/Editor/EditorUtils.js
+++ b/src/Editor/EditorUtils.js
@@ -1,9 +1,11 @@
+import { Text } from 'react-native';
+
 /**
  * EditorUtils contains helper
  * functions for our Editor
  */
 
-export const displayTextWithMentions = (inputText, formatMentionNode) => {
+export const displayTextWithMentions = (inputText, formatMentionNode, style) => {
   /**
    * Use this function to parse mentions markup @[username](id) in the string value.
    */
@@ -17,7 +19,7 @@ export const displayTextWithMentions = (inputText, formatMentionNode) => {
       mentions.forEach((men, index) => {
         const initialStr = retLine.substring(lastIndex, men.start);
         lastIndex = men.end + 1;
-        formattedText.push(initialStr);
+        formattedText.push(<Text style={style}>{initialStr}</Text>);
         const formattedMention = formatMentionNode(
           `@${men.username}`,
           `${index}-${men.id}-${rowIndex}`
@@ -25,13 +27,13 @@ export const displayTextWithMentions = (inputText, formatMentionNode) => {
         formattedText.push(formattedMention);
         if (mentions.length - 1 === index) {
           const lastStr = retLine.substr(lastIndex); //remaining string
-          formattedText.push(lastStr);
+          formattedText.push(<Text style={style}>{lastStr}</Text>);
         }
       });
     } else {
-      formattedText.push(retLine);
+      formattedText.push(<Text style={style}>{retLine}</Text>);
     }
-    formattedText.push("\n");
+    formattedText.push(<Text style={style}>{'\n'}</Text>);
   });
   return formattedText;
 };

From fe39630a854b3cfa7014b8fd5c3aea8e6d2de7ab Mon Sep 17 00:00:00 2001
From: Bahattin Cinic <bahattin@adphorus.com>
Date: Tue, 8 Dec 2020 21:36:08 +0300
Subject: [PATCH 2/3] Import fixed

---
 src/Editor/EditorUtils.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Editor/EditorUtils.js b/src/Editor/EditorUtils.js
index ded8398..96cb5eb 100644
--- a/src/Editor/EditorUtils.js
+++ b/src/Editor/EditorUtils.js
@@ -1,4 +1,4 @@
-import { Text } from 'react-native';
+import React, { Text } from 'react-native';
 
 /**
  * EditorUtils contains helper

From f51b01f7bbab5c1ecc3c5bb0482060173ce49d4e Mon Sep 17 00:00:00 2001
From: Bahattin Cinic <bahattin@adphorus.com>
Date: Tue, 8 Dec 2020 21:47:36 +0300
Subject: [PATCH 3/3] Fixed import

---
 src/Editor/EditorUtils.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/Editor/EditorUtils.js b/src/Editor/EditorUtils.js
index 96cb5eb..6184e21 100644
--- a/src/Editor/EditorUtils.js
+++ b/src/Editor/EditorUtils.js
@@ -1,4 +1,5 @@
-import React, { Text } from 'react-native';
+import React from "react";
+import { Text } from 'react-native';
 
 /**
  * EditorUtils contains helper