<script lang="ts">
	import { followers } from '$lib/AniList/following';
	import RateLimited from '$lib/Error/RateLimited.svelte';
	import InputTemplate from './InputTemplate.svelte';

	let submission = '';
	let randomSeed = 0;
</script>

<!-- svelte-ignore missing-declaration -->
<InputTemplate
	field="Username"
	bind:submission
	event="Random Follower"
	submitText="Generate"
	onSubmit={() => {
		randomSeed = Math.random();

		// eslint-disable-next-line no-undef
		umami.track('Random Follower');
	}}
>
	{#await followers(submission)}
		Loading followers ... 50%
	{:then users}
		{@const user = users[Math.floor(randomSeed * users.length)]}

		<p />

		<a href={`https://anilist.co/user/${user.id}`} target="_blank">
			{user.name}
		</a>
	{:catch}
		<RateLimited type="Followers" list={false} />
	{/await}
</InputTemplate>
