From a4bf69aebab5a13ef37d6a80c692cabf3abaae2e Mon Sep 17 00:00:00 2001
From: gabriellpr <gabrielporfirio1994@gmail.com>
Date: Wed, 25 May 2022 16:11:13 -0300
Subject: [PATCH] adding url styles

...

styling external links inside the banner

Refactoring code

adding underline on hover and focus

removing hasLiink
---
 .../imports/ui/components/chat/styles.js      | 30 +++++++++++++++++++
 .../time-window-chat-item/component.jsx       |  2 --
 .../time-window-chat-item/styles.js           |  6 ----
 3 files changed, 30 insertions(+), 8 deletions(-)

diff --git a/bigbluebutton-html5/imports/ui/components/chat/styles.js b/bigbluebutton-html5/imports/ui/components/chat/styles.js
index a3274df5ce..fdadfa4581 100644
--- a/bigbluebutton-html5/imports/ui/components/chat/styles.js
+++ b/bigbluebutton-html5/imports/ui/components/chat/styles.js
@@ -2,6 +2,7 @@ import styled from 'styled-components';
 import {
   colorWhite,
   colorGrayDark,
+  colorPrimary
 } from '/imports/ui/stylesheets/styled-components/palette';
 import { smallOnly } from '/imports/ui/stylesheets/styled-components/breakpoints';
 import Button from '/imports/ui/components/common/button/component';
@@ -25,6 +26,35 @@ const Chat = styled.div`
   overflow: hidden;
   height: 100%;
 
+  a {
+    color: ${colorPrimary};
+    text-decoration: none;
+
+    &:focus {
+      color: ${colorPrimary};
+      text-decoration: underline;
+    }
+    &:hover {
+      filter: brightness(90%);
+      text-decoration: underline;
+    }
+    &:active {
+      filter: brightness(85%);
+      text-decoration: underline;
+    }
+    &:hover:focus{
+      filter: brightness(90%);
+      text-decoration: underline;
+    }
+    &:focus:active {
+      filter: brightness(85%);
+      text-decoration: underline;
+    }
+  }
+  u {
+    text-decoration-line: none;
+  }
+
   ${({ isChrome }) => isChrome && `
     transform: translateZ(0);
   `}
diff --git a/bigbluebutton-html5/imports/ui/components/chat/time-window-list/time-window-chat-item/component.jsx b/bigbluebutton-html5/imports/ui/components/chat/time-window-list/time-window-chat-item/component.jsx
index 64c2a6ac1f..724895cd06 100644
--- a/bigbluebutton-html5/imports/ui/components/chat/time-window-list/time-window-chat-item/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/chat/time-window-list/time-window-chat-item/component.jsx
@@ -152,7 +152,6 @@ class TimeWindowChatItem extends PureComponent {
     } = this.props;
 
     const dateTime = new Date(timestamp);
-    const regEx = /<a[^>]+>/i;
     ChatLogger.debug('TimeWindowChatItem::renderMessageItem', this.props);
     const defaultAvatarString = name?.toLowerCase().slice(0, 2) || "  ";
     const emphasizedText = messageFromModerator && CHAT_EMPHASIZE_TEXT && chatId === CHAT_PUBLIC_ID;
@@ -188,7 +187,6 @@ class TimeWindowChatItem extends PureComponent {
             <Styled.Messages>
               {messages.map(message => (
                 <Styled.ChatItem
-                  hasLink={regEx.test(message.text)}
                   emphasizedMessage={emphasizedText}
                   key={message.id}
                   text={message.text}
diff --git a/bigbluebutton-html5/imports/ui/components/chat/time-window-list/time-window-chat-item/styles.js b/bigbluebutton-html5/imports/ui/components/chat/time-window-list/time-window-chat-item/styles.js
index ff7f57e57f..1922979575 100644
--- a/bigbluebutton-html5/imports/ui/components/chat/time-window-list/time-window-chat-item/styles.js
+++ b/bigbluebutton-html5/imports/ui/components/chat/time-window-list/time-window-chat-item/styles.js
@@ -173,12 +173,6 @@ const ChatItem = styled(MessageChatItem)`
   color: ${colorText};
   word-wrap: break-word;
 
-  ${({ hasLink }) => hasLink && `
-    & > a {
-      color: ${colorPrimary};
-    }
-  `}
-
   ${({ emphasizedMessage }) => emphasizedMessage && `
     font-weight: bold;
   `}