Attempt to use tiptap for view, failing due to https://github.com/ueberdosis/tiptap/issues/5176

src/app/components/ThreadItem.svelte

@@ -5,7 +5,7 @@
   import {displayPubkey} from "@welshman/util"
   import {deriveProfile, deriveProfileDisplay, formatTimestamp} from "@welshman/app"
   import Avatar from "@lib/components/Avatar.svelte"
-  import {getViewOptions} from "@lib/editor"
+  import {getEditorOptions} from "@lib/editor"
 
   export let root
   export let replies
@@ -16,7 +16,9 @@
   let editor: Readable<Editor>
 
   onMount(() => {
-    editor = createEditor(getViewOptions(root))
+    editor = createEditor(getEditorOptions({}))
+
+    setTimeout(() => $editor.commands.insertContent(root.content, {applyPasteRules: true}), 100)
   })
 </script>
 

src/lib/editor/index.ts

@@ -52,6 +52,8 @@ type EditorOptions = {
   loading: Writable<boolean>
   getPubkeyHints: (pubkey: string) => string[]
   submitOnEnter?: boolean
+  content?: string
+  autofocus?: boolean
 }
 
 export const getModifiedHardBreakExtension = () =>
@@ -78,9 +80,11 @@ export const getEditorOptions = ({
   loading,
   getPubkeyHints,
   submitOnEnter,
+  content = "",
+  autofocus = false,
 }: EditorOptions) => ({
-  content: "",
-  autofocus: true,
+  content,
+  autofocus,
   extensions: [
     Code,
     CodeBlock,
@@ -137,10 +141,10 @@ export const getEditorOptions = ({
       },
     }),
   ],
-  onTransaction() {
-    // @ts-ignore
-    console.log(this.getJSON())
-  }
+  // onTransaction() {
+  //   // @ts-ignore
+  //   console.log(this.getJSON())
+  // }
 })
 
 type ViewOptions = {

src/routes/spaces/[nrelay]/calendar/+page.svelte

@@ -7,7 +7,7 @@
   import Button from "@lib/components/Button.svelte"
   import Spinner from "@lib/components/Spinner.svelte"
   import Divider from "@lib/components/Divider.svelte"
-  import EventCard from "@app/components/EventCard.svelte"
+  import EventItem from "@app/components/EventItem.svelte"
   import EventCreate from "@app/components/EventCreate.svelte"
   import {pushModal} from "@app/modal"
   import {eventsByUrl, decodeNRelay} from "@app/state"
@@ -55,7 +55,7 @@
       {#if dateDisplay}
         <Divider>{dateDisplay}</Divider>
       {/if}
-      <EventCard {event} />
+      <EventItem {event} />
     {/each}
     <p class="flex h-10 items-center justify-center py-20">
       <Spinner {loading}>

src/routes/spaces/[nrelay]/threads/+page.svelte

@@ -4,7 +4,7 @@
   import Icon from "@lib/components/Icon.svelte"
   import Button from "@lib/components/Button.svelte"
   import Spinner from "@lib/components/Spinner.svelte"
-  import ThreadCard from "@app/components/ThreadCard.svelte"
+  import ThreadItem from "@app/components/ThreadItem.svelte"
   import ThreadCreate from "@app/components/ThreadCreate.svelte"
   import {pushModal} from "@app/modal"
   import {threadsByUrl, decodeNRelay} from "@app/state"
@@ -34,7 +34,7 @@
   </div>
   <div class="flex flex-grow flex-col gap-2 overflow-auto p-2">
     {#each threads as { root, replies } (root.id)}
-      <ThreadCard {root} {replies} />
+      <ThreadItem {root} {replies} />
     {/each}
     <p class="flex h-10 items-center justify-center py-20">
       <Spinner {loading}>