Fix editing messages with html tags

src/app/components/ThunkStatusDetail.svelte

@@ -2,6 +2,7 @@
   import {PublishStatus} from "@welshman/net"
   import {displayRelayUrl} from "@welshman/util"
   import Button from "@lib/components/Button.svelte"
+  import {addPeriod} from "@lib/util"
 
   interface Props {
     url: string
@@ -25,7 +26,7 @@
 
 <div class="card2 bg-alt col-2 shadow-lg">
   <p>
-    Failed to publish to {displayRelayUrl(url)}: {message}.
+    Failed to publish to {displayRelayUrl(url)}: {addPeriod(message)}
   </p>
   <Button class="link" onclick={retry}>Retry</Button>
 </div>

src/app/editor/index.ts

@@ -15,6 +15,7 @@ import {
 } from "@welshman/app"
 import type {FileAttributes} from "@welshman/editor"
 import {Editor, MentionSuggestion, WelshmanExtension, editorProps} from "@welshman/editor"
+import {escapeHtml} from "@lib/html"
 import {makeMentionNodeView} from "@app/editor/MentionNodeView"
 import ProfileSuggestion from "@app/editor/ProfileSuggestion.svelte"
 import {uploadFile} from "@app/core/commands"
@@ -82,7 +83,7 @@ export const makeEditor = async ({
   )
 
   return new Editor({
-    content,
+    content: escapeHtml(content),
     autofocus,
     editorProps,
     element: document.createElement("div"),

src/lib/html.ts

@@ -164,3 +164,11 @@ export const compressFile = async (
     })
   })
 }
+
+export const escapeHtml = (html: string) => {
+  const element = document.createElement("div")
+
+  element.innerText = html
+
+  return element.innerHTML
+}

src/lib/util.ts

@@ -26,3 +26,5 @@ export const buildUrl = (base: string | URL, ...pathname: string[]) => {
 
   return url.toString()
 }
+
+export const addPeriod = (s: string) => (s + ".").replace(/\.+$/, ".")

src/routes/spaces/[relay]/[h]/+page.svelte

@@ -110,6 +110,7 @@
   }
 
   const onSubmit = async ({content, tags}: EventContent) => {
+    try {
       tags.push(["h", h])
 
       if (await shouldProtect) {
@@ -119,6 +120,11 @@
       let template: EventContent & {created_at?: number} = {content, tags}
 
       if (eventToEdit) {
+        // Don't do anything if message hasn't changed
+        if (eventToEdit.content === content) {
+          return
+        }
+
         // Delete previous message, to be republished with same timestamp
         template.created_at = eventToEdit.created_at
         publishDelete({
@@ -151,11 +157,12 @@
           },
         })
       }
-
+    } finally {
       clearParent()
       clearShare()
       clearEventToEdit()
     }
+  }
 
   const onScroll = () => {
     showScrollButton = Math.abs(element?.scrollTop || 0) > 1500

src/routes/spaces/[relay]/chat/+page.svelte

@@ -54,9 +54,15 @@
   }
 
   const onSubmit = async ({content, tags}: EventContent) => {
+    try {
       let template: EventContent & {created_at?: number} = {content, tags}
 
       if (eventToEdit) {
+        // Don't do anything if message hasn't changed
+        if (eventToEdit.content === content) {
+          return
+        }
+
         // Delete previous message, to be republished with same timestamp
         template.created_at = eventToEdit.created_at
         publishDelete({relays: [url], event: eventToEdit, protect: await shouldProtect})
@@ -89,11 +95,12 @@
           },
         })
       }
-
+    } finally {
       clearParent()
       clearShare()
       clearEventToEdit()
     }
+  }
 
   const onScroll = () => {
     showScrollButton = Math.abs(element?.scrollTop || 0) > 1500