diff options
| author | Adam Soltys <[email protected]> | 2025-01-20 00:05:30 -0800 |
|---|---|---|
| committer | Adam Soltys <[email protected]> | 2025-01-20 00:05:33 -0800 |
| commit | 494fa791c93297917cf3247b561d736934de805c (patch) | |
| tree | b92bbbabe7eed8cde7b9d251cfcb08221689cc83 /src/components | |
| parent | 684d5fe5643d481c4904a1323ae0a257c267b87b (diff) | |
| download | coinos-ui-494fa791c93297917cf3247b561d736934de805c.tar.gz coinos-ui-494fa791c93297917cf3247b561d736934de805c.zip | |
nostr routes
Diffstat (limited to 'src/components')
| -rw-r--r-- | src/components/Event.svelte | 67 |
1 files changed, 67 insertions, 0 deletions
diff --git a/src/components/Event.svelte b/src/components/Event.svelte new file mode 100644 index 00000000..289da0b1 --- /dev/null +++ b/src/components/Event.svelte @@ -0,0 +1,67 @@ +<script> + import Avatar from "$comp/Avatar.svelte"; + import Media from "$comp/Media.svelte"; + import { goto } from "$app/navigation"; + + let { event, minimal } = $props(); + let { author, parts, zaps, names } = $derived(event); + let go = () => goto(`/e/${event.id}`); + console.log(event.tags); +</script> + +<div class="space-y-5"> + <div class="flex gap-2 items-center"> + <Avatar user={author} size={16} /> + <a href={`/${author.pubkey}/notes`} class="contents"> + <div> + <div class="font-bold"> + {author.display} — {author.username} + </div> + {#if author.lud16} + <div class="flex items-center"> + <iconify-icon + noobserver + icon="ph:lightning-fill" + class="text-yellow-300" + ></iconify-icon> + {author.lud16} + </div> + {/if} + </div> + </a> + </div> + + <div class="text-2xl space-y-5 break-words" onclick={go}> + {#each parts as { type, value }, i} + {#if type === "text"} + {value} + {:else if type === "link" && !minimal} + <Media {value} /> + {:else if type.match(/^nostr:np(rofile|ub)$/)} + <a href={`/${value.pubkey}`} class="font-bold">@{names[value.pubkey]}</a + > + {/if} + {/each} + </div> +</div> + +{#if !minimal} + <a href={`/send/zap/${event.pubkey}/${event.id}`} class="btn btn-accent"> + <iconify-icon noobserver icon="ph:lightning-fill" class="text-yellow-300" + ></iconify-icon> + Zap + </a> +{/if} + +{#if zaps?.length} + <div class="flex flex-wrap gap-2"> + {#each zaps as { amount, user }} + <a href={`/${user.pubkey}`}> + <div class="flex gap-1 items-center"> + <Avatar {user} size={8} disabled={true} /> + <div>{amount}</div> + </div> + </a> + {/each} + </div> +{/if} |