mirror of
https://git.shipoclu.com/moon/plspace.git
synced 2026-08-13 02:42:30 +00:00
32 lines
888 B
Svelte
32 lines
888 B
Svelte
<script lang="ts">
|
|
/** The link preview a server attaches to a status. */
|
|
import type { PreviewCard } from '$lib/api/types'
|
|
|
|
interface Props {
|
|
card: PreviewCard
|
|
}
|
|
|
|
let { card }: Props = $props()
|
|
|
|
const host = $derived.by(() => {
|
|
try {
|
|
return new URL(card.url).hostname.replace(/^www\./, '')
|
|
} catch {
|
|
return card.provider_name ?? ''
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<a class="preview-card" href={card.url} target="_blank" rel="noopener noreferrer" data-card-type={card.type}>
|
|
{#if card.image}
|
|
<img class="preview-card-image" src={card.image} alt="" loading="lazy" decoding="async" />
|
|
{/if}
|
|
<span class="preview-card-body">
|
|
<span class="preview-card-title">{card.title}</span>
|
|
{#if card.description}
|
|
<span class="preview-card-description">{card.description}</span>
|
|
{/if}
|
|
<span class="preview-card-host">{host}</span>
|
|
</span>
|
|
</a>
|