flo-bit.dev
your personal website on atproto - mirror
blento.app
1<script lang="ts">
2 import type { Item } from '$lib/types';
3 import type { SettingsComponentProps } from '../../types';
4 import type { AppBskyActorDefs } from '@atcute/bluesky';
5 import HandleInput from '$lib/atproto/UI/HandleInput.svelte';
6
7 let { item = $bindable<Item>() }: SettingsComponentProps = $props();
8
9 let handleValue = $state('');
10 let inputRef: HTMLInputElement | null = $state(null);
11
12 function addFriend(actor: AppBskyActorDefs.ProfileViewBasic) {
13 if (!item.cardData.friends) item.cardData.friends = [];
14 if (item.cardData.friends.includes(actor.did)) return;
15 item.cardData.friends = [...item.cardData.friends, actor.did];
16 requestAnimationFrame(() => {
17 handleValue = '';
18 if (inputRef) inputRef.value = '';
19 });
20 }
21</script>
22
23<HandleInput bind:value={handleValue} onselected={addFriend} bind:ref={inputRef} />