<script lang="ts">
	import FollowCard from "../FollowCard.svelte";
	import Section from "$lib/components/ui/Section.svelte";
	import type { PersonData } from "../types";

	interface Props {
		people: PersonData[];
		title: string;
		emptyMessage: string;
	}

	let { people, title, emptyMessage }: Props = $props();
</script>

<Section {title} empty={people.length === 0} {emptyMessage} listClass="flex flex-col gap-8">
	{#each people as person (person.did)}
		<FollowCard {person} />
	{/each}
</Section>
