From 095d000aca01a747bda9cdee1f53824057be1a94 Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Sat, 3 Feb 2024 09:26:23 -0800
Subject: feat(reader): better errors

---
 src/lib/Error/DotDotDot.svelte | 22 ++++++++++++++++++++++
 src/lib/Error/Notice.svelte    |  2 ++
 src/routes/reader/+page.svelte | 11 +++++++----
 3 files changed, 31 insertions(+), 4 deletions(-)
 create mode 100644 src/lib/Error/DotDotDot.svelte
 create mode 100644 src/lib/Error/Notice.svelte

(limited to 'src')

diff --git a/src/lib/Error/DotDotDot.svelte b/src/lib/Error/DotDotDot.svelte
new file mode 100644
index 00000000..c9c62356
--- /dev/null
+++ b/src/lib/Error/DotDotDot.svelte
@@ -0,0 +1,22 @@
+<script lang="ts">
+	import { onDestroy, onMount } from 'svelte';
+
+	export let max: number | undefined = undefined;
+	export let perMs = 1000;
+	export let start = '';
+
+	let dots = start;
+	let interval: NodeJS.Timeout;
+
+	onMount(() => {
+		interval = setInterval(() => {
+			dots += '.';
+
+			if (max && dots.length > max) dots = '';
+		}, perMs);
+	});
+
+	onDestroy(() => clearInterval(interval));
+</script>
+
+{dots}
diff --git a/src/lib/Error/Notice.svelte b/src/lib/Error/Notice.svelte
new file mode 100644
index 00000000..d4cf96c5
--- /dev/null
+++ b/src/lib/Error/Notice.svelte
@@ -0,0 +1,2 @@
+<b>Notice:</b>
+<slot />
diff --git a/src/routes/reader/+page.svelte b/src/routes/reader/+page.svelte
index d591f0e1..cbdd3916 100644
--- a/src/routes/reader/+page.svelte
+++ b/src/routes/reader/+page.svelte
@@ -1,4 +1,5 @@
 <script>
+	import Notice from '$lib/Error/Notice.svelte';
 	import InputTemplate from '$lib/Tools/InputTemplate.svelte';
 
 	let submission = '';
@@ -8,7 +9,9 @@
 
 <InputTemplate field="MangaDex URL" bind:submission submitText="Read" preserveCase>
 	{#if mangaDexID}
-		{#await fetch(`https://api.mangadex.org/manga/${mangaDexID}/feed?order[chapter]=desc&translatedLanguage[]=en`) then response}
+		{#await fetch(`https://api.mangadex.org/manga/${mangaDexID}/feed?order[chapter]=desc&translatedLanguage[]=en`)}
+			<!--  -->
+		{:then response}
 			{#if response.ok}
 				{#await response.json() then data}
 					{#if data.data}
@@ -34,15 +37,15 @@
 						<p class="opaque">(⌣_⌣”)</p>
 					{/if}
 				{:catch error}
-					{error}
+					<Notice>{error}</Notice>
 				{/await}
 			{:else}
-				Invalid URL
+				<Notice>Failed to fetch data from MangaDex</Notice>
 			{/if}
 		{:catch error}
 			{error}
 		{/await}
 	{:else}
-		Invalid URL
+		<Notice>Invalid URL</Notice>
 	{/if}
 </InputTemplate>
-- 
cgit v1.2.3