From 72db5e75725c564267cbbfdcf701f3ae96d6b6cf Mon Sep 17 00:00:00 2001
From: Karl Jensen <karljensen@gmail.com>
Date: Sun, 12 Jan 2025 15:10:46 -0800
Subject: [PATCH 1/3] Disallow empty messages

---
 react-chat/src/components/CreateMessage.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/react-chat/src/components/CreateMessage.tsx b/react-chat/src/components/CreateMessage.tsx
index cecac9a..e109b9d 100644
--- a/react-chat/src/components/CreateMessage.tsx
+++ b/react-chat/src/components/CreateMessage.tsx
@@ -7,6 +7,8 @@ type CreateMessageOptions = {
 export const CreateMessage = ({ onSubmit }: CreateMessageOptions) => {
   const [text, setText] = useState('')
   const handleSubmit = async () => {
+    if (text === "") return;
+
     onSubmit(text)
     setText('')
   }

From 1dd9b32a477d942bb1f5ba206ac30ca3609011bc Mon Sep 17 00:00:00 2001
From: Karl Jensen <karljensen@gmail.com>
Date: Sun, 12 Jan 2025 15:36:47 -0800
Subject: [PATCH 2/3] Open markdown links with blank target

---
 react-chat/src/components/MessageList.tsx | 38 +++++++++++++++++++++--
 1 file changed, 35 insertions(+), 3 deletions(-)

diff --git a/react-chat/src/components/MessageList.tsx b/react-chat/src/components/MessageList.tsx
index 36504e6..57deea6 100644
--- a/react-chat/src/components/MessageList.tsx
+++ b/react-chat/src/components/MessageList.tsx
@@ -1,9 +1,41 @@
 import { useEffect, useRef } from "react"
 import { ChatDocument, Message, User } from "../utils"
 import { DocHandle } from "@automerge/automerge-repo"
-import { marked } from 'marked';
+import { marked, type Tokens} from 'marked';
 import DOMPurify from 'dompurify';
 
+marked.use({
+  renderer: {
+    /* This is basically what marked is doing, just inlined */
+    link({ href, title, tokens }: Tokens.Link): string {
+      const text = this.parser.parseInline(tokens);
+
+       let cleanHref
+
+      try {
+        cleanHref = encodeURI(href).replace(/%25/g, '%');
+      } catch {
+        cleanHref = null
+      }
+
+      if (cleanHref === null) {
+        return text;
+      }
+
+      let out = '<a target="_blank" rel="noopener noreferrer" href="' + cleanHref + '"';
+
+      if (title) {
+        out += ' title="' + title + '"';
+      }
+
+      out += '>' + text + '</a>';
+
+      return out;
+    }
+
+  }
+})
+
 type MessageListProps = {
   messages: Message[]
   users: User[]
@@ -28,7 +60,7 @@ export const MessageList = ({ messages, users, user, handle }: MessageListProps)
     return message.likes?.length || 0;
   }
 
-  // Update the message's Like 
+  // Update the message's Like
   const createLike = (messageId: string) => {
     if (handle && user) {
       handle.change(doc => {
@@ -64,7 +96,7 @@ export const MessageList = ({ messages, users, user, handle }: MessageListProps)
         <time className="text-xs opacity-50">{formatDate(message.createdAt)}</time>
       </div>
       <div className="chat-bubble break-words"
-        dangerouslySetInnerHTML={{__html: DOMPurify.sanitize(marked.parse(message.text, { async: false }))}} />
+        dangerouslySetInnerHTML={{__html: DOMPurify.sanitize(marked.parse(message.text, { async: false }), { ADD_ATTR: ['target'] })}} />
       <div className="chat-footer">
         {/* Swap icons based on whether users have liked it or not */}
         <span className="text-xs cursor-pointer" onClick={() => createLike(message.id)}>

From c9f5df6caaae761e958f9a4fa300ee19d82a442d Mon Sep 17 00:00:00 2001
From: Karl Jensen <karljensen@gmail.com>
Date: Sun, 12 Jan 2025 15:41:37 -0800
Subject: [PATCH 3/3] Formatting

---
 react-chat/src/components/MessageList.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/react-chat/src/components/MessageList.tsx b/react-chat/src/components/MessageList.tsx
index 57deea6..5b2a6ba 100644
--- a/react-chat/src/components/MessageList.tsx
+++ b/react-chat/src/components/MessageList.tsx
@@ -10,7 +10,7 @@ marked.use({
     link({ href, title, tokens }: Tokens.Link): string {
       const text = this.parser.parseInline(tokens);
 
-       let cleanHref
+      let cleanHref
 
       try {
         cleanHref = encodeURI(href).replace(/%25/g, '%');