From 4a55a5ea9c524274e5c8ac8a360745b8535c9167 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Th=C3=A9o?= <43091603+glazk0@users.noreply.github.com>
Date: Mon, 18 Sep 2023 12:46:33 +0200
Subject: [PATCH] fix: fixed most issues

---
 src/lib/components/Chapter.svelte             |  2 +-
 src/routes/dashboard/chapters/+page.svelte    | 14 ++++-
 .../chapters/[chapterId]/+page.svelte         | 16 -----
 .../puzzle/[puzzleId]/+page.svelte            | 63 ++++++++++++-------
 src/routes/dashboard/settings/+page.svelte    |  8 ++-
 5 files changed, 60 insertions(+), 43 deletions(-)

diff --git a/src/lib/components/Chapter.svelte b/src/lib/components/Chapter.svelte
index 2f3e839..f285767 100644
--- a/src/lib/components/Chapter.svelte
+++ b/src/lib/components/Chapter.svelte
@@ -12,7 +12,7 @@
 		'font-code group relative flex h-full w-full rounded-md bg-primary-700 transition-colors duration-150 ',
 		{
 			'hover:bg-primary-600': chapter.show,
-			'opacity-50': !chapter.show,
+			'opacity-50': !chapter.show
 		}
 	)}
 >
diff --git a/src/routes/dashboard/chapters/+page.svelte b/src/routes/dashboard/chapters/+page.svelte
index d3f4958..899edf2 100644
--- a/src/routes/dashboard/chapters/+page.svelte
+++ b/src/routes/dashboard/chapters/+page.svelte
@@ -1,9 +1,20 @@
 <script lang="ts">
+	import type { PageData } from './$types';
+
+	import type { Chapter as IChapter } from '$lib/types';
+
 	import Chapter from '$lib/components/Chapter.svelte';
 
-	export let data;
+	export let data: PageData;
 
 	$: chapters = data.chapters;
+
+	const toBeContinued: IChapter = {
+		id: Math.random() * 999,
+		name: 'To be continued ...',
+		puzzles: [],
+		show: false
+	};
 </script>
 
 <section class="flex w-full flex-col space-y-6">
@@ -19,4 +30,5 @@
 	{#each chapters as chapter}
 		<Chapter {chapter} />
 	{/each}
+	<Chapter chapter={toBeContinued} />
 </section>
diff --git a/src/routes/dashboard/chapters/[chapterId]/+page.svelte b/src/routes/dashboard/chapters/[chapterId]/+page.svelte
index d36dcae..90c3d32 100644
--- a/src/routes/dashboard/chapters/[chapterId]/+page.svelte
+++ b/src/routes/dashboard/chapters/[chapterId]/+page.svelte
@@ -3,22 +3,9 @@
 
 	import Puzzle from '$lib/components/Puzzle.svelte';
 
-	import type { Puzzle as IPuzzle } from '$lib/types';
-
 	export let data: PageData;
 
 	data.chapter.puzzles = data.chapter.puzzles.sort((a, b) => a.scoreMax - b.scoreMax);
-
-	const toBeContinued: IPuzzle = {
-		id: 0,
-		name: 'To be continued...',
-		content: 'Maybe you will find the One Piece one day...',
-		scoreMax: 999,
-		show: false,
-		tags: [],
-		tries: 0,
-		score: 0
-	};
 </script>
 
 <section class="flex w-full flex-col space-y-6">
@@ -32,9 +19,6 @@
 			{#each data.chapter.puzzles as puzzle}
 				<Puzzle {puzzle} />
 			{/each}
-			{#if data.chapter.puzzles.length > 1}
-				<Puzzle puzzle={toBeContinued} />
-			{/if}
 		</ul>
 	</div>
 </section>
diff --git a/src/routes/dashboard/chapters/[chapterId]/puzzle/[puzzleId]/+page.svelte b/src/routes/dashboard/chapters/[chapterId]/puzzle/[puzzleId]/+page.svelte
index 170c2f2..54684de 100644
--- a/src/routes/dashboard/chapters/[chapterId]/puzzle/[puzzleId]/+page.svelte
+++ b/src/routes/dashboard/chapters/[chapterId]/puzzle/[puzzleId]/+page.svelte
@@ -14,20 +14,7 @@
 
 	export let data: PageData;
 
-	const { puzzle } = data;
-
-	let completed = false;
-
-	function toast(title: string, description: string) {
-		addToast({
-			data: {
-				title,
-				description
-			},
-			closeDelay: 2500
-		});
-	}
-
+	$: puzzle = data.puzzle;
 	$: chapterId = $page.params.chapterId;
 
 	const renderer = new marked.Renderer();
@@ -63,14 +50,20 @@
 	<div class="h-screen w-full overflow-y-auto break-all font-fira text-xs sm:text-base">
 		{@html marked(puzzle.content, options)}
 	</div>
-	{#if !puzzle.score && !completed}
+	{#if !puzzle.score}
 		<form
 			class="flex w-full flex-col items-end justify-between gap-2 sm:flex-row"
 			method="POST"
 			enctype="multipart/form-data"
-			use:enhance={async ({ formElement, formData, action, cancel, submitter }) => {
+			use:enhance={async ({ formData, cancel }) => {
 				if (formData.get('answer') === '') {
-					toast('Erreur', 'Vous devez entrer une réponse !');
+					addToast({
+						data: {
+							title: 'Réponse vide',
+							description: 'Vous devez entrer une réponse'
+						},
+						closeDelay: 5000
+					});
 					return cancel();
 				}
 
@@ -86,21 +79,43 @@
 					const data = res.ok || res.status === 406 ? await res.json() : null;
 
 					if (data && data.score) {
-						completed = true;
-						toast('Bonne réponse', 'Vous avez trouvé la bonne réponse!');
+						addToast({
+							data: {
+								title: 'Bravo !',
+								description: `Vous avez trouvé la bonne réponse en ${data.tries} tentative${
+									data.tries > 1 ? 's' : ''
+								} !`
+							}
+						});
 					} else if (data && data.tries)
-						toast('Mauvaise réponse', `Vous avez effectué ${data.tries} tentative(s)`);
+						addToast({
+							data: {
+								title: 'Mauvaise réponse',
+								description: `Vous avez effectué ${data.tries} tentative${
+									data.tries > 1 ? 's' : ''
+								} !`
+							}
+						});
 					else if (res.ok && data?.success)
-						toast('Bonne réponse', 'Vous avez trouvé la bonne réponse!');
+						addToast({
+							data: {
+								title: 'Bravo !',
+								description: `Vous avez trouvé la bonne réponse !`
+							}
+						});
 					else if (res.status === 423)
-						toast('Mauvaise réponse', "Ce n'est pas la bonne réponse, réessayez!");
+						addToast({
+							data: {
+								title: 'Puzzle désactivé',
+								description: `Ce puzzle est désactivé pour le moment.`
+							}
+						});
 				}
 
 				return async ({ result }) => {
 					if (result.type === 'redirect') {
 						goto(result.location, {
-							invalidateAll: true,
-							replaceState: true
+							invalidateAll: true
 						});
 					}
 				};
diff --git a/src/routes/dashboard/settings/+page.svelte b/src/routes/dashboard/settings/+page.svelte
index 7beb80e..23d1bbc 100644
--- a/src/routes/dashboard/settings/+page.svelte
+++ b/src/routes/dashboard/settings/+page.svelte
@@ -18,7 +18,13 @@
 
 <form class="flex flex-col gap-4" method="POST" use:enhance>
 	<label for="email">Email</label>
-	<Input name="email" type="email" placeholder="philipzcwbarlow@peerat.dev" value={user?.email} />
+	<Input
+		name="email"
+		type="email"
+		placeholder="philipzcwbarlow@peerat.dev"
+		value={user?.email}
+		disabled
+	/>
 
 	<label for="firstname">Prénom</label>
 	<Input name="firstname" type="text" placeholder="Philip" value={user?.firstname} />