38 lines
880 B
JavaScript
38 lines
880 B
JavaScript
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) => (
|
|
<div
|
|
key={index}
|
|
className={`messages__item ${
|
|
item.name === "Janet"
|
|
? "messages__item--visitor"
|
|
: "messages__item--operator"
|
|
}`}
|
|
>
|
|
{Text(item.message)}
|
|
</div>
|
|
))}
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default ChatBoxMessages;
|
|
|