Merge pull request #2942 from objectcomputing/bugfix-2933/fix-kudos-urls-and-channels

Converted Slack message links to external links

Author: mkimberlin

server/src/main/java/com/objectcomputing/checkins/services/slack/kudos/SlackKudosCreator.java

@@ -15,6 +15,7 @@
 import io.micronaut.core.io.Readable;
 import io.micronaut.core.io.IOUtils;
 
+import org.jetbrains.annotations.NotNull;
 import org.slf4j.Logger;
 import org.slf4j.LoggerFactory;
 
@@ -97,27 +98,19 @@ private MemberProfile lookupUser(String userId) {
 
     private String processText(String text, List<UUID> recipients) {
         // First, process user references.
-        StringBuffer buffer = new StringBuffer(text.length());
-        Pattern userRef = Pattern.compile("<@([^>]+)>");
-        Matcher action = userRef.matcher(StringEscapeUtils.unescapeHtml4(text));
-        while (action.find()) {
-            // Pull out the recipient user id, get the profile and add it to
-            // the list of recipients.
-            String userId = action.group(1);
-            MemberProfile profile = lookupUser(userId);
-            recipients.add(profile.getId());
-
-            // Replace the user reference with their full name.
-            action.appendReplacement(buffer, Matcher.quoteReplacement(
-                                     MemberProfileUtils.getFullName(profile)));
-        }
-        action.appendTail(buffer);
-        text = buffer.toString();
+        text = populateRecipientNames(text, recipients);
 
         // Next, translate channel references to channel names.
+        text = populateChannelNames(text);
+
+        return text;
+    }
+
+    @NotNull
+    private String populateChannelNames(String text) {
         Pattern channelRef = Pattern.compile("<#([^>]+)\\|>");
-        buffer = new StringBuffer(text.length());
-        action = channelRef.matcher(text);
+        StringBuffer buffer = new StringBuffer(text.length());
+        Matcher action = channelRef.matcher(text);
         while (action.find()) {
             // Get the name of the channel.
             String channelId = action.group(1);
@@ -131,7 +124,29 @@ private String processText(String text, List<UUID> recipients) {
             action.appendReplacement(buffer, Matcher.quoteReplacement(name));
         }
         action.appendTail(buffer);
-        return buffer.toString();
+        text = buffer.toString();
+        return text;
+    }
+
+    @NotNull
+    private String populateRecipientNames(String text, List<UUID> recipients) {
+        StringBuffer buffer = new StringBuffer(text.length());
+        Pattern userRef = Pattern.compile("<@([^>]+)>");
+        Matcher action = userRef.matcher(StringEscapeUtils.unescapeHtml4(text));
+        while (action.find()) {
+            // Pull out the recipient user id, get the profile and add it to
+            // the list of recipients.
+            String userId = action.group(1);
+            MemberProfile profile = lookupUser(userId);
+            recipients.add(profile.getId());
+
+            // Replace the user reference with their full name.
+            action.appendReplacement(buffer, Matcher.quoteReplacement(
+                                     MemberProfileUtils.getFullName(profile)));
+        }
+        action.appendTail(buffer);
+        text = buffer.toString();
+        return text;
     }
 
     private void requestAction() {

web-ui/src/components/kudos/PublicKudosCard.jsx

@@ -124,11 +124,61 @@ const KudosCard = ({ kudos }) => {
     return names;
   };
 
-  const linkNames = kudos => {
+  const linkSlackUrls = textLine => {
+    // Regex to find <url> or <url|text>
+    // Group 1: URL
+    // Group 2: Optional Link Text (undefined if not present)
+    const slackLinkRegex = /<([^<>|]*)(?:\|([^<>]*))?>/g;
+    const components = [];
+    let lastIndex = 0;
+    let match;
+
+    // Find all matches in the text line
+    while ((match = slackLinkRegex.exec(textLine)) !== null) {
+      const url = match[1];
+      const linkText = match[2]; // Will be undefined if there's no |text part
+      const precedingText = textLine.slice(lastIndex, match.index);
+
+      // Add the text before the match (if any)
+      if (precedingText) {
+        components.push(precedingText);
+      }
+
+      // Create and add the link component
+      components.push(
+        <a
+          key={`slack-link-${match.index}`} // Unique key based on position
+          href={url}
+          target="_blank" // Open in new tab
+          rel="noopener noreferrer" // Security measure
+        >
+          {linkText || url}
+        </a>
+      );
+
+      // Update the index for the next slice
+      lastIndex = slackLinkRegex.lastIndex;
+    }
+
+    // Add any remaining text after the last match
+    const remainingText = textLine.slice(lastIndex);
+    if (remainingText) {
+      components.push(remainingText);
+    }
+
+    // If no links were found at all, return the original line in an array
+    if (components.length === 0) {
+      return [textLine];
+    }
+
+    return components;
+  };
+
+  const createLinks = kudos => {
     const lines = [];
     let index = 0;
     for (let line of kudos.message.split('\n')) {
-      const components = [line];
+      const components = linkSlackUrls(line);
       for (let member of kudos.recipientMembers) {
         const names = searchNames(member, kudos.recipientMembers);
         for (let name of names) {
@@ -228,7 +278,7 @@ const KudosCard = ({ kudos }) => {
         subheaderTypographyProps={{ variant: 'subtitle1' }}
       />
       <CardContent>
-        <>{linkNames(kudos)}</>
+        <>{createLinks(kudos)}</>
         {kudos.recipientTeam && (
           <AvatarGroup
             max={12}