feat: add leaderboard

src/routes/+page.svelte

@@ -22,8 +22,6 @@
 		{/if}
 	</div>
 
-	<span class="login"> </span>
-
 	<form action="/game" method="GET">
 		<label>
 			difficulté: <select name="mode">
@@ -42,6 +40,8 @@
 
 		<input type="submit" value="LANCER LA PARTIE" />
 	</form>
+
+	<h2><a href="/leaderboard">Leaderboard</a></h2>
 </div>
 
 <style>

src/routes/leaderboard/+page.server.ts

@@ -0,0 +1,17 @@
+import { error } from "@sveltejs/kit";
+import type { PageServerLoad } from "./$types";
+
+export const load: PageServerLoad = async ({ platform }) => {
+	const db = platform?.env?.TCL_GUESSR_D1 ?? null;
+	if (db === null) error(500, "could not access d1");
+
+	const statement = db.prepare(
+		"SELECT game.id, game.mode, game.total_score, user.name FROM game INNER JOIN user ON user.id = game.user_id WHERE game.mode = ? ORDER BY game.total_score DESC, game.time ASC LIMIT 20",
+	);
+
+	const { results: easy } = await statement.bind("easy").all();
+	const { results: hard } = await statement.bind("hard").all();
+	const { results: miguel } = await statement.bind("extreme demon ultra miguel").all();
+
+	return { easy, hard, miguel };
+};

src/routes/leaderboard/+page.svelte

@@ -0,0 +1,56 @@
+<script lang="ts">
+	import type { PageData } from "./$types";
+
+	interface Props {
+		data: PageData;
+	}
+
+	const props: Props = $props();
+</script>
+
+<h1>LEADEBOARD !!!!!</h1>
+
+<h2>EXTREME DEMON ULTRA MIGUEL DE LA MORT QUI TUE</h2>
+
+{#if props.data.miguel.length !== 0}
+	<ul>
+		{#each props.data.miguel as game}
+			<li>
+				<b>{game.total_score}</b> points by {game.name} ({game.mode}) -
+				<a href="/results?gameId={game.id}">Details</a>
+			</li>
+		{/each}
+	</ul>
+{:else}
+	<span>No scores yet :(</span>
+{/if}
+
+<h2>Difficile</h2>
+
+{#if props.data.hard.length !== 0}
+	<ul>
+		{#each props.data.hard as game}
+			<li>
+				<b>{game.total_score}</b> points by {game.name} ({game.mode}) -
+				<a href="/results?gameId={game.id}">Details</a>
+			</li>
+		{/each}
+	</ul>
+{:else}
+	<span>No scores yet :(</span>
+{/if}
+
+<h2>Facile</h2>
+
+{#if props.data.easy.length !== 0}
+	<ul>
+		{#each props.data.easy as game}
+			<li>
+				<b>{game.total_score}</b> points by {game.name} ({game.mode}) -
+				<a href="/results?gameId={game.id}">Details</a>
+			</li>
+		{/each}
+	</ul>
+{:else}
+	<span>No scores yet :(</span>
+{/if}