typing

src/ChatMessages.js

@@ -2,6 +2,19 @@ import React from "react";
 import "./style.css";
 
 const ChatBoxMessages = (props) => {
+  var URL_REGEX = /https?:\/\/(www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_\+.~#?&//=]*)/gi;
+
+  
+  function Text(content) {
+
+	const words = content.split(' ');
+	return (
+	   {words.map( (word) => ({
+		return word.match(URL_REGEX) ? (<a href={word}>{word}</a>{' '})
+                                             : (word + ' ');})}
+	);
+  }
+
   return (
     <div className="chatbox__messages">
       {props.messages.map((item, index) => (
@@ -13,7 +26,7 @@ const ChatBoxMessages = (props) => {
               : "messages__item--operator"
           }`}
         >
-          {item.message}
+          {Text(item.message)}
         </div>
       ))}
     </div>