fix: malformed replies

and improve how the UI reacts when events are sent

src/lib/components/events/EventWrapper.svelte

@@ -12,11 +12,14 @@
   export let created_at: number | undefined
   export let event_id = ''
   export let event: NDKEvent | undefined = undefined
-  export let logged_in = $logged_in_user
   let show_compose = false
   let show_raw_json_modal = false
   let created_at_ago = ''
   $: created_at_ago = created_at ? dayjs(created_at * 1000).fromNow() : ''
+
+  const replySent = () => {
+    show_compose = false
+  }
 </script>
 
 <div class="max-w-4xl border-b border-base-300 p-3 pl-3">
@@ -61,7 +64,7 @@
           </div>
         {/if}
       {/if}
-      {#if !show_compose && logged_in}
+      {#if !show_compose && $logged_in_user}
         <div class="tooltip align-middle" data-tip="reply">
           <button
             on:click={() => {
@@ -97,7 +100,11 @@
           >
         </div>
         <div class="">
-          <ComposeReply {type} reply_to_event_id={event_id} />
+          <ComposeReply
+            {type}
+            reply_to_event_id={event_id}
+            sentFunction={() => replySent()}
+          />
         </div>
       </div>
     {/if}

src/lib/wrappers/ComposeReply.svelte

@@ -10,11 +10,14 @@
   import Compose from '$lib/components/events/Compose.svelte'
   import { selected_proposal_full } from '$lib/stores/Proposal'
   import { selected_issue_full } from '$lib/stores/Issue'
+  import type { IssueFull } from '$lib/components/issues/type'
+  import type { ProposalFull } from '$lib/components/proposals/type'
 
   export let type: 'proposal' | 'issue' = 'proposal'
   export let reply_to_event_id = ''
+  export let sentFunction = () => {}
   let repo_identifier: string
-  let proposal_or_issue_id: string
+  let selected_proposal_or_issue: IssueFull | ProposalFull
 
   let submitting = false
   let submitted = false
@@ -22,13 +25,12 @@
   $: {
     repo_identifier = $selected_repo_collection.identifier
     selected_issue_full
-    proposal_or_issue_id = (
+    selected_proposal_or_issue =
       type === 'proposal' ? $selected_proposal_full : $selected_issue_full
-    ).summary.id
 
     edit_mode =
       repo_identifier.length > 0 &&
-      proposal_or_issue_id.length > 0 &&
+      selected_proposal_or_issue.summary.id.length > 0 &&
       !submitted
   }
 
@@ -36,9 +38,19 @@
     if (!$logged_in_user) return
     let event = new NDKEvent(ndk)
     event.kind = reply_kind
-    event.tags.push(['e', proposal_or_issue_id, 'root'])
+    event.tags.push([
+      'e',
+      selected_proposal_or_issue.summary.id,
+      $selected_repo_event.relays[0] || '',
+      'root',
+    ])
     if (reply_to_event_id.length > 0) {
-      event.tags.push(['e', reply_to_event_id, 'reply'])
+      event.tags.push([
+        'e',
+        reply_to_event_id,
+        $selected_repo_event.relays[0] || '',
+        'reply',
+      ])
     }
     if ($selected_repo_event.unique_commit) {
       event.tags.push(['r', $selected_repo_event.unique_commit])
@@ -82,7 +94,8 @@
       submitted = true
       setTimeout(() => {
         submitted = false
-      }, 5000)
+        sentFunction()
+      }, 3000)
     } catch {}
   }
 </script>
@@ -91,5 +104,21 @@
   <Compose {sendReply} {submitting} logged_in={!!$logged_in_user} />
 {/if}
 {#if submitted}
-  <div>sent!</div>
+  <div role="alert" class="alert mt-6">
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      fill="none"
+      viewBox="0 0 24 24"
+      class="h-6 w-6 shrink-0 stroke-info"
+      ><path
+        stroke-linecap="round"
+        stroke-linejoin="round"
+        stroke-width="2"
+        d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
+      ></path></svg
+    >
+    <div>
+      <h3 class="prose mb-2 text-sm font-bold">reply sent</h3>
+    </div>
+  </div>
 {/if}