From de010fc4acccee17b13c6d4783bc0e1f18c6be3e Mon Sep 17 00:00:00 2001
From: ajvpot <553597+ajvpot@users.noreply.github.com>
Date: Sat, 23 Aug 2025 03:49:47 +0200
Subject: [PATCH] clickable links

---
 src/components/ChatMessageItem.tsx | 26 +++++++++++++++++++++++++-
 1 file changed, 25 insertions(+), 1 deletion(-)

diff --git a/src/components/ChatMessageItem.tsx b/src/components/ChatMessageItem.tsx
index e259442..436b672 100644
--- a/src/components/ChatMessageItem.tsx
+++ b/src/components/ChatMessageItem.tsx
@@ -45,6 +45,30 @@ function formatLocalTime(utcString: string): string {
   return utcDate.toLocaleString();
 }
 
+function linkifyText(text: string): React.ReactNode {
+  // URL regex pattern to match http/https URLs
+  const urlRegex = /(https?:\/\/[^\s]+)/g;
+  
+  const parts = text.split(urlRegex);
+  
+  return parts.map((part, index) => {
+    if (urlRegex.test(part)) {
+      return (
+        <a
+          key={index}
+          href={part}
+          target="_blank"
+          rel="nofollow noopener noreferrer"
+          className="text-blue-600 dark:text-blue-400 hover:underline"
+        >
+          {part}
+        </a>
+      );
+    }
+    return part;
+  });
+}
+
 function ChatMessageItem({ msg, showErrorRow }: { msg: ChatMessage, showErrorRow?: boolean }) {
   const { config } = useConfig();
   const knownKeys = useMemo(() => [
@@ -314,7 +338,7 @@ function ChatMessageItem({ msg, showErrorRow }: { msg: ChatMessage, showErrorRow
         <div className="break-all whitespace-pre-wrap">
           <span className="font-bold text-blue-800 dark:text-blue-300">{parsed.sender}</span>
           {parsed.sender && ": "}
-          <span>{parsed.text}</span>
+          <span>{linkifyText(parsed.text)}</span>
         </div>
         <OriginsBox />
         <GraphView />