your personal website on atproto - mirror
blento.app
1import type { CardDefinition } from '../../types';
2import PhotoGalleryCard from './PhotoGalleryCard.svelte';
3import CreateGrainGalleryCardModal from './CreateGrainGalleryCardModal.svelte';
4import { parseGrainGalleryUrl, loadGrainGalleryData } from './helpers';
5
6export { parseGrainGalleryUrl, loadGrainGalleryData };
7
8const cardType = 'grain-gallery';
9
10export const PhotoGalleryCardDefinition = {
11 type: cardType,
12 contentComponent: PhotoGalleryCard,
13 creationModalComponent: CreateGrainGalleryCardModal,
14 createNew: (card) => {
15 card.cardData = {};
16 card.w = 4;
17 card.mobileW = 8;
18 card.h = 3;
19 card.mobileH = 6;
20 },
21
22 onUrlHandler: (url, item) => {
23 const parsed = parseGrainGalleryUrl(url);
24 if (!parsed) return null;
25
26 // Store with handle — loadData will resolve to DID
27 item.cardData.galleryUri = `at://${parsed.handle}/social.grain.gallery/${parsed.rkey}`;
28
29 item.w = 4;
30 item.mobileW = 8;
31 item.h = 3;
32 item.mobileH = 6;
33
34 return item;
35 },
36
37 urlHandlerPriority: 2,
38
39 loadData: async (items) => loadGrainGalleryData(items),
40
41 canHaveLabel: true,
42
43 name: 'Grain Gallery',
44 keywords: ['grain', 'gallery', 'album', 'photos', 'slideshow', 'images', 'carousel'],
45 groups: ['Media'],
46 minW: 4,
47 icon: `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" class="size-4"><path stroke-linecap="round" stroke-linejoin="round" d="m2.25 15.75 5.159-5.159a2.25 2.25 0 0 1 3.182 0l5.159 5.159m-1.5-1.5 1.409-1.409a2.25 2.25 0 0 1 3.182 0l2.909 2.909M3.75 21h16.5A2.25 2.25 0 0 0 22.5 18.75V5.25A2.25 2.25 0 0 0 20.25 3H3.75A2.25 2.25 0 0 0 1.5 5.25v13.5A2.25 2.25 0 0 0 3.75 21ZM16.5 8.25a1.125 1.125 0 1 1-2.25 0 1.125 1.125 0 0 1 2.25 0Z" /></svg>`
48} as CardDefinition & { type: typeof cardType };