your personal website on atproto - mirror
blento.app
1<script lang="ts">
2 import { getAdditionalUserData, getDidContext, getHandleContext } from '$lib/website/context';
3 import { onMount } from 'svelte';
4 import { CardDefinitionsByType } from '..';
5 import type { ContentComponentProps } from '../types';
6 import BlogEntry from './BlogEntry.svelte';
7
8 let { item }: ContentComponentProps = $props();
9
10 const data = getAdditionalUserData();
11 // svelte-ignore state_referenced_locally
12 let feed = $state(data[item.cardType] as any);
13
14 let did = getDidContext();
15 let handle = getHandleContext();
16
17 onMount(async () => {
18 if (!feed) {
19 feed = (await CardDefinitionsByType[item.cardType]?.loadData?.([item], {
20 did,
21 handle
22 })) as any;
23
24 data[item.cardType] = feed;
25 }
26 });
27</script>
28
29<div class="flex h-full flex-col gap-10 overflow-y-scroll p-8">
30 {#each feed ?? [] as document (document.uri)}
31 <BlogEntry
32 title={document.value.title}
33 description={document.value.description}
34 date={document.value.publishedAt}
35 href={document.value.href}
36 />
37 {/each}
38</div>