src/routes/events/groups/+page.svelte


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43

<script lang="ts">
	import type { Group as GroupType } from '$lib/Database/SB/groups';
	import Message from '$lib/Loading/Message.svelte';
	import root from '$lib/Utility/root';
	import { onMount } from 'svelte';
	import Group from '$lib/Events/Group.svelte';

	let groupsResponse: Promise<Response>;

	onMount(async () => {
		groupsResponse = fetch(root('/api/events/groups'));
	});

	const asGroup = (group: any) => group as GroupType;
</script>

{#await groupsResponse}
	<Message message="Loading groups ..." />
{:then groups}
	{#if groups}
		{#await groups.json()}
			<Message message="Parsing groups ..." />
		{:then json}
			{#each json as rawGroup, i}
				{@const group = asGroup(rawGroup)}

				<a href={root(`/events/group/${group.anilist_username}`)}>
					<Group {group} />
				</a>

				{#if i < json.length - 1}
					<p />
				{/if}
			{/each}
		{:catch}
			<Message message="" loader="ripple" slot withReload>Error parsing groups.</Message>
		{/await}
	{:else}
		<Message message="Parsing groups ..." />
	{/if}
{:catch}
	<Message message="" loader="ripple" slot withReload>Error loading groups.</Message>
{/await}