<script>
	import { _ } from "svelte-i18n";
	export let donor;
</script>

{#if !donor || donor.firstname == 0}
	<span
		class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800 border border-current"
		>{$_('anonymer_sponsor')}</span
	>
{:else}
	<div class="flex items-center">
		<a
			href="../donors/{donor.id}"
			class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800 border border-current"
			>{donor.firstname}
			{#if donor.middlename}{donor.middlename}{/if}
			{donor.lastname}</a
		>
	</div>
{/if}
