<script>
	import PDFView from './PDFView.svelte';
	import ArticleStatus from './ArticleStatus.svelte';
	import ArticleOperations from './ArticleOperations.svelte';

	let current_id = 0; 
	
	const updateInterface = (async () => {
		let url = '';
		if (current_id == 0) {
			url = '/api/article/first';
		} else {
			url = '/api/article/' + current_id + '/next';
		}
		const response = await fetch(url)
		const data = await response.json()
		current_id = data.id;
		let article_url = '/api/article/' + current_id + '/get';
		const article_response = await fetch(article_url);
		const article_data = await article_response.json();
		return article_data;
	})()
	
	
</script>

{#await updateInterface}
...
{:then article_data}
	<div class="flex w-full h-screen gap-5 p-5">
		<div class="w-3/5"><PDFView article_data={article_data}/></div>
		<div class="divider divider-horizontal"></div> 
		<div class="w-2/5">
			<ArticleStatus article_data={article_data}/>
			<div class="divider divider-vertical"></div> 
			<ArticleOperations article_data={article_data}/>
		</div>
	</div>
{/await}
