your personal website on atproto - mirror
blento.app
1import type { CardDefinition } from '../types';
2import type { Did } from '@atcute/lexicons';
3import { getBlentoOrBskyProfile } from '$lib/atproto/methods';
4import FriendsCard from './FriendsCard.svelte';
5import FriendsCardSettings from './FriendsCardSettings.svelte';
6
7export type FriendsProfile = Awaited<ReturnType<typeof getBlentoOrBskyProfile>>;
8
9export const FriendsCardDefinition = {
10 type: 'friends',
11 contentComponent: FriendsCard,
12 settingsComponent: FriendsCardSettings,
13 createNew: (card) => {
14 card.w = 4;
15 card.h = 2;
16 card.mobileW = 8;
17 card.mobileH = 4;
18 card.cardData.friends = [];
19 },
20 loadData: async (items) => {
21 const allDids = new Set<Did>();
22 for (const item of items) {
23 for (const did of item.cardData.friends ?? []) {
24 allDids.add(did as Did);
25 }
26 }
27 if (allDids.size === 0) return [];
28
29 const profiles = await Promise.all(
30 Array.from(allDids).map((did) =>
31 getBlentoOrBskyProfile({ did }).catch(() => undefined)
32 )
33 );
34 return profiles.filter((p) => p && p.handle !== 'handle.invalid');
35 },
36 allowSetColor: true,
37 defaultColor: 'base',
38 minW: 2,
39 minH: 2,
40 name: 'Friends',
41 groups: ['Social'],
42 keywords: ['friends', 'avatars', 'people', 'community', 'blentos'],
43 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="M15 19.128a9.38 9.38 0 0 0 2.625.372 9.337 9.337 0 0 0 4.121-.952 4.125 4.125 0 0 0-7.533-2.493M15 19.128v-.003c0-1.113-.285-2.16-.786-3.07M15 19.128v.106A12.318 12.318 0 0 1 8.624 21c-2.331 0-4.512-.645-6.374-1.766l-.001-.109a6.375 6.375 0 0 1 11.964-3.07M12 6.375a3.375 3.375 0 1 1-6.75 0 3.375 3.375 0 0 1 6.75 0Zm8.25 2.25a2.625 2.625 0 1 1-5.25 0 2.625 2.625 0 0 1 5.25 0Z" /></svg>`
44} as CardDefinition & { type: 'friends' };