your personal website on atproto - mirror
blento.app
1import type { CardDefinition } from '../types';
2import { getRecord, listRecords, parseUri } from '$lib/atproto';
3import PhotoGalleryCard from './PhotoGalleryCard.svelte';
4import type { Did } from '@atcute/lexicons';
5
6interface GalleryItem {
7 value: {
8 gallery: string;
9 item: string;
10 position?: number;
11 };
12}
13
14export const PhotoGalleryCardDefinition = {
15 type: 'photoGallery',
16 contentComponent: PhotoGalleryCard,
17 createNew: (card) => {
18 // random grain.social url for testing
19 card.cardData.galleryUri =
20 'at://did:plc:tas6hj2xjrqben5653v5kohk/social.grain.gallery/3mclhsljs6h2w';
21
22 card.w = 4;
23 card.mobileW = 8;
24 card.h = 3;
25 card.mobileH = 6;
26 },
27 loadData: async (items) => {
28 const itemsData: Record<string, unknown[]> = {};
29
30 const galleryItems: Record<string, GalleryItem[] | undefined> = {
31 'social.grain.gallery.item': undefined
32 };
33
34 for (const item of items) {
35 if (!item.cardData.galleryUri) continue;
36
37 const parsedUri = parseUri(item.cardData.galleryUri);
38
39 if (parsedUri?.collection === 'social.grain.gallery') {
40 const itemCollection = 'social.grain.gallery.item';
41
42 if (!galleryItems[itemCollection]) {
43 galleryItems[itemCollection] = (await listRecords({
44 did: parsedUri.repo as Did,
45 collection: itemCollection
46 })) as unknown as GalleryItem[];
47 }
48
49 const galleryItemsList = galleryItems['social.grain.gallery.item'];
50 if (!galleryItemsList) continue;
51
52 const images = galleryItemsList
53 .filter((i) => i.value.gallery === item.cardData.galleryUri)
54 .map(async (i) => {
55 const itemData = parseUri(i.value.item);
56 if (!itemData) return null;
57 const record = await getRecord({
58 did: itemData.repo as Did,
59 collection: itemData.collection!,
60 rkey: itemData.rkey
61 });
62 return { ...record, value: { ...record.value, ...i.value } };
63 });
64
65 itemsData[item.cardData.galleryUri] = await Promise.all(images);
66 }
67 }
68
69 return itemsData;
70 },
71 minW: 4
72 //sidebarButtonText: 'Photo Gallery'
73} as CardDefinition & { type: 'photoGallery' };