<script lang="ts">
	import { page } from '$app/stores';
	import { goto } from '$app/navigation';
	import { getContext, onMount } from 'svelte';
	import { QuestService } from '$lib/pb/all.pb';
	import { withToken } from '$lib/pb/pbutil';
	import { auth } from '$lib/stores';
	import ErrorModal from '$lib/components/ErrorModal.svelte';

	type Status = 'available' | 'partial' | 'full';

	const { open } = getContext('simple-modal');

	let id = $page.params.id;
	let input = 'Loading...';

	let queried = false;
	onMount(() => {
		auth.subscribe((data) => {
			if (queried) return;
			if (!data.loggedIn()) return;
			queried = true;

			QuestService.QuestionInput({ id }, withToken(data.token))
				.then((inp) => {
					input = inp.input;
				})
				.catch((err) => {
					open(ErrorModal, {
						title: 'Could not load',
						reason: err.message || 'Something went wrong',
						btn: {
							title: 'Go to questions',
							do: () => {
								goto('/dashboard/questions');
							}
						}
					});
				});
		});
	});

	let value = '';

	const submit = () => {
		if (value == '') {
			open(ErrorModal, { title: 'Could not Submit', reason: 'Please provide a value to submit' });
		}
	};
</script>

<pre class="font-mono text-sm">{input}</pre>
