feat: show per-relay publish status on outgoing messages (#290)

Co-authored-by: userAdityaa <aditya.chaudhary1558@gmail.com>
Co-committed-by: userAdityaa <aditya.chaudhary1558@gmail.com>

src/app/components/ThunkFailure.svelte

@@ -2,7 +2,7 @@
   import {stopPropagation} from "svelte/legacy"
   import {noop} from "@welshman/lib"
   import type {AbstractThunk} from "@welshman/app"
-  import {retryThunk, thunkIsComplete, getFailedThunkUrls} from "@welshman/app"
+  import {flattenThunks, getFailedThunkUrls, publishThunk, thunkIsComplete} from "@welshman/app"
   import Danger from "@assets/icons/danger-triangle.svg?dataurl"
   import Icon from "@lib/components/Icon.svelte"
   import Tippy from "@lib/components/Tippy.svelte"
@@ -16,40 +16,45 @@
     class?: string
   }
 
-  let {thunk, showToastOnRetry, ...restProps}: Props = $props()
+  const {thunk, showToastOnRetry, ...restProps}: Props = $props()
 
-  const retry = () => {
-    thunk = retryThunk(thunk)
+  const showFailure = $derived(thunkIsComplete($thunk) && getFailedThunkUrls($thunk).length > 0)
 
-    if (showToastOnRetry) {
-      pushToast({
-        timeout: 30_000,
-        children: {
-          component: ThunkToast,
-          props: {thunk},
-        },
-      })
+  const retry = (url: string) => {
+    for (const child of flattenThunks([thunk])) {
+      if (!child.options.relays.includes(url)) {
+        continue
+      }
+
+      const retried = publishThunk({...child.options, relays: [url]})
+
+      if (showToastOnRetry) {
+        pushToast({
+          timeout: 30_000,
+          children: {
+            component: ThunkToast,
+            props: {thunk: retried},
+          },
+        })
+      }
+
+      return
     }
   }
-
-  const failedUrls = $derived(getFailedThunkUrls($thunk))
-  const showFailure = $derived(thunkIsComplete($thunk) && failedUrls.length > 0)
 </script>
 
 {#if showFailure}
-  {@const url = failedUrls[0]}
-  {@const {status, detail: message} = $thunk.results[url]}
   <button
     class="flex w-full justify-end px-1 text-xs {restProps.class}"
     onclick={stopPropagation(noop)}>
     <Tippy
       class="flex items-center"
       component={ThunkStatusDetail}
-      props={{url, message, status, retry}}
-      params={{interactive: true}}>
+      props={{thunk, retry}}
+      params={{interactive: true, maxWidth: "none"}}>
       {#snippet children()}
-        <span class="flex cursor-pointer items-center gap-1 text-error">
-          <Icon icon={Danger} size={3} />
+        <span class="flex cursor-pointer items-center gap-1 opacity-75">
+          <Icon icon={Danger} class="text-error" size={3} />
           <span>Failed to send!</span>
         </span>
       {/snippet}