frontend: Migrate to Svelte 5

1 files changed, 13 insertions, 13 deletions

diff --git a/frontend/src/lib/reader/PageView.svelte b/frontend/src/lib/reader/PageView.svelte
index 08764b7..81fbb97 100644
--- a/frontend/src/lib/reader/PageView.svelte
+++ b/frontend/src/lib/reader/PageView.svelte
@@ -1,8 +1,8 @@
 <script lang="ts">
 	import { Direction, Layout, type PageFragment } from '$gql/graphql';
-	import { getReaderContext, partition, type Chunk } from '$lib/Reader';
 	import { binds } from '$lib/Shortcuts';
 	import { src } from '$lib/Utils';
+	import { getReaderContext, partition, type Chunk } from './Reader.svelte';
 	import ReaderPage from './ReaderPage.svelte';
 
 	const reader = getReaderContext();
@@ -19,14 +19,14 @@
 	function gotoChunk(to: number) {
 		if (to < 0 || to >= chunks.length) return;
 
-		$reader.page = chunks[to].index;
+		reader.page = chunks[to].index;
 	}
 
 	function pagesAround(around: number) {
 		const peek = (at: number) => {
 			if (at < 0 || at >= chunks.length) return [];
 
-			const pages = [chunks[at].main];
+			const pages: PageFragment[] = [chunks[at].main];
 
 			if (chunks[at].secondary) {
 				pages.push(chunks[at].secondary);
@@ -38,8 +38,8 @@
 		return [...peek(lookup[around] + 1), ...peek(lookup[around] - 1)];
 	}
 
-	const next = () => gotoChunk(lookup[$reader.page] + 1);
-	const prev = () => gotoChunk(lookup[$reader.page] - 1);
+	const next = () => gotoChunk(lookup[reader.page] + 1);
+	const prev = () => gotoChunk(lookup[reader.page] - 1);
 
 	const clickLeft = () => (direction === Direction.LeftToRight ? prev() : next());
 	const clickRight = () => (direction === Direction.RightToLeft ? prev() : next());
@@ -56,8 +56,8 @@
 		}
 	}
 
-	$: [chunks, lookup] = partition($reader.pages, layout);
-	$: layout, ({ main, secondary } = chunks[lookup[$reader.page]]);
+	$: [chunks, lookup] = partition(reader.pages, layout);
+	$: layout, ({ main, secondary } = chunks[lookup[reader.page]]);
 </script>
 
 <svelte:document
@@ -76,16 +76,16 @@
 />
 
 {#if !secondary}
-	<ReaderPage page={main} on:click={clickMain} --justify="center" />
+	<ReaderPage page={main} onclick={clickMain} --justify="center" />
 {:else if direction === Direction.LeftToRight}
-	<ReaderPage page={main} on:click={prev} --justify="flex-end" />
-	<ReaderPage page={secondary} on:click={next} --justify="flex-start" />
+	<ReaderPage page={main} onclick={prev} --justify="flex-end" />
+	<ReaderPage page={secondary} onclick={next} --justify="flex-start" />
 {:else}
-	<ReaderPage page={secondary} on:click={next} --justify="flex-end" />
-	<ReaderPage page={main} on:click={prev} --justify="flex-start" />
+	<ReaderPage page={secondary} onclick={next} --justify="flex-end" />
+	<ReaderPage page={main} onclick={prev} --justify="flex-start" />
 {/if}
 <div class="invisible absolute">
-	{#each pagesAround($reader.page) as page}
+	{#each pagesAround(reader.page) as page}
 		<img src={src(page.image, 'full')} alt="" />
 	{/each}
 </div>