alice.pds.demo.boltless.dev
This repository has no description
1<script lang="ts">
2 import { resolve } from '$app/paths';
3 import RepoCard from '$lib/components/repo/RepoCard.svelte';
4 import EmptyState from '../EmptyState.svelte';
5 import type { StarData } from '../types';
6
7 let { stars }: { stars: StarData[] } = $props();
8</script>
9
10<section>
11 <h2 class="px-2 pb-4 text-base font-medium">Starred</h2>
12 {#if stars.length === 0}
13 <EmptyState message="No stars yet." />
14 {:else}
15 <div class="flex flex-col gap-4">
16 {#each stars as star (star.uri)}
17 {#if star.kind === 'repo'}
18 <RepoCard repo={star.repo} />
19 {:else}
20 <div
21 class="flex items-center gap-2 rounded border border-border bg-surface px-6 py-4 shadow-sm"
22 >
23 <a
24 href={resolve(`/${star.ownerHandle}/strings/${star.rkey}` as '/')}
25 class="truncate font-bold text-fg-strong no-underline hover:underline"
26 >
27 {star.ownerHandle}/{star.rkey}
28 </a>
29 </div>
30 {/if}
31 {/each}
32 </div>
33 {/if}
34</section>