<script lang="ts">
	import { onMount } from 'svelte';
	import { getForms } from '../../../lib/api';
	import type { Form } from '../../../lib/types';

	let forms: any;

	onMount(async () => {
		forms = await getForms();
	});
</script>

<div class="container">
	<a href="/create" class="button">Create a New Form</a>
	<ul class="forms-list">
		{#each forms as form}
			<li>
				<a href={`/form/${form.id}`}>{form.name}</a>
			</li>
		{/each}
	</ul>
</div>
