diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/components/Event.svelte | 85 | ||||
| -rw-r--r-- | src/components/Media.svelte | 30 | ||||
| -rw-r--r-- | src/routes/(app)/[username]/(profile)/+layout.server.ts | 3 | ||||
| -rw-r--r-- | src/routes/(app)/e/[id]/+page.server.ts | 8 | ||||
| -rw-r--r-- | src/routes/(app)/thread/[id]/+page.svelte | 1 |
5 files changed, 61 insertions, 66 deletions
diff --git a/src/components/Event.svelte b/src/components/Event.svelte index 6690ecde..aa8d1ac8 100644 --- a/src/components/Event.svelte +++ b/src/components/Event.svelte @@ -29,48 +29,55 @@ }; </script> -<div class="space-y-2 dark:border-primary py-8" class:border-b-8={!last}> - <div class="flex"> - <a href={`/${pubkey}/notes`} class="contents"> - <div class="flex gap-2 items-center"> - <Avatar user={author} size={16} disabled={true} /> - <div> - <div> - <span class="font-bold">{author.display}</span> - <span class="text-secondary">@{author.username}</span> - <span class="text-secondary">• {ago(created_at)}</span> - </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> +{#snippet heading()} + <div class="flex gap-2 items-center"> + <Avatar user={author} size={16} disabled={true} /> + <div> + <div> + <span class="font-bold">{author.displayName}</span> + <span class="text-secondary">@{author.name}</span> + <span class="text-secondary">• {ago(created_at)}</span> </div> - </a> + {#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> </div> +{/snippet} - <a href={`/e/${id}`} class="contents"> - <div class="text-2xl space-y-2 break-words"> - {#each parts as { type, value }, i} - {#if type === "text"} - {value} - {:else if type === "link"} - <Media {value} {minimal} /> - {:else if type.match(/^nostr:np(rofile|ub)$/)} - <a href={`/${value.pubkey}`} class="font-bold" - >@{names[value.pubkey]}</a - > - {/if} - {/each} - </div> - </a> -</div> +<button + onclick={() => goto(`/e/${id}`)} + class="space-y-2 dark:border-primary py-8 w-full text-left" + class:border-b={!last} +> + {#if minimal} + {@render heading()} + {:else} + <a href={`/${pubkey}/notes`} class="contents"> + {@render heading()} + </a> + {/if} + + <div class="text-2xl space-y-2 break-words"> + {#each parts as { type, value }, i} + {#if type === "text"} + {value} + {:else if type === "link"} + <Media {value} {minimal} /> + {:else if type.match(/^nostr:np(rofile|ub)$/)} + <a href={`/${value.pubkey}`} class="font-bold">@{names[value.pubkey]}</a + > + {/if} + {/each} + </div> +</button> {#if zaps?.length} <div class="flex flex-wrap gap-2"> diff --git a/src/components/Media.svelte b/src/components/Media.svelte index c2a79a2b..bd681f6f 100644 --- a/src/components/Media.svelte +++ b/src/components/Media.svelte @@ -9,19 +9,17 @@ let { value, minimal } = $props(); </script> -<div class="pt-2"> - {#if !!isImage(value.url)} - <img src={value.url} alt={""} class:w-48={minimal} /> - {:else if isVideo(value.url)} - <!-- svelte-ignore a11y-media-has-caption --> - <video src={value.url} controls /> - {:else if isAudio(value.url)} - <audio src={value.url} controls> - <a href={value.url}>{value.url.replace(/https?:\/\/(www\.)?/, "")}</a> - </audio> - {:else} - <a href={value.url} class="underline"> - link - </a> - {/if} -</div> +{#if !!isImage(value.url)} + <img src={value.url} alt={""} class="py-4" /> +{:else if isVideo(value.url)} + <!-- svelte-ignore a11y-media-has-caption --> + <video src={value.url} controls class="py-4" /> +{:else if isAudio(value.url)} + <audio src={value.url} controls> + <a href={value.url}>{value.url.replace(/https?:\/\/(www\.)?/, "")}</a> + </audio> +{:else} + <a href={value.url} class="underline"> + {value.url.substr(0, 24)}{value.url.length > 24 ? "..." : ""} + </a> +{/if} diff --git a/src/routes/(app)/[username]/(profile)/+layout.server.ts b/src/routes/(app)/[username]/(profile)/+layout.server.ts index d714ce76..70e7ebdb 100644 --- a/src/routes/(app)/[username]/(profile)/+layout.server.ts +++ b/src/routes/(app)/[username]/(profile)/+layout.server.ts @@ -14,8 +14,5 @@ export async function load({ depends, parent }) { () => [], ); - // const follows = []; - // const followers = []; - return { follows, followers, followList, rate: rates[subject.currency] }; } diff --git a/src/routes/(app)/e/[id]/+page.server.ts b/src/routes/(app)/e/[id]/+page.server.ts index ad692893..2a62dba0 100644 --- a/src/routes/(app)/e/[id]/+page.server.ts +++ b/src/routes/(app)/e/[id]/+page.server.ts @@ -3,13 +3,7 @@ import { error } from "@sveltejs/kit"; export async function load({ params }) { try { - const event = await get(`/event/${params.id}`); - const { parts, names } = await post("/parseEvent", { event }); - event.parts = parts; - event.names = names; - event.author = await get(`/users/${event.pubkey}`); - event.zaps = await get(`/zaps/${params.id}`); - + const event = await get(`/event/${params.id}/full`); return { event }; } catch (e) { console.log(e); diff --git a/src/routes/(app)/thread/[id]/+page.svelte b/src/routes/(app)/thread/[id]/+page.svelte index 40eaec83..932b6dfd 100644 --- a/src/routes/(app)/thread/[id]/+page.svelte +++ b/src/routes/(app)/thread/[id]/+page.svelte @@ -3,7 +3,6 @@ let { data } = $props(); let { thread } = $derived(data); - console.log(thread); </script> <div class="container px-4 max-w-xl mx-auto space-y-5"> |