src/app.d.ts

@@ -10,10 +10,10 @@ declare global {
 			errorId: string;
 		}
 		interface Locals {
-			user: User | null;
+			user?: User;
 		}
 		interface PageData {
-			user: User | null;
+			user?: User;
 		}
 		// interface Platform {}
 	}

src/hooks.server.ts

@@ -9,7 +9,7 @@ export const handle: Handle = async ({ event, resolve }) => {
 	const session = event.cookies.get('session');
 
 	if (!session) {
-		event.locals.user = null;
+		event.locals.user = undefined;
 		return resolve(event);
 	}
 
@@ -20,7 +20,7 @@ export const handle: Handle = async ({ event, resolve }) => {
 	});
 
 	if (!res.ok) {
-		event.locals.user = null;
+		event.locals.user = undefined;
 		event.cookies.delete('session', { path: '/' });
 		return resolve(event);
 	}
@@ -41,7 +41,7 @@ export const handleFetch: HandleFetch = async ({ request, fetch, event: { cookie
 
 	request = new Request(request, {
 		headers: {
-			...request.headers,
+			...Object.fromEntries(request.headers),
 			Authorization: `Bearer ${session}`
 		},
 	});

src/lib/components/copy-code-button.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
-	import { Check, Copy } from 'lucide-svelte';
+	import Check from 'lucide-svelte/icons/check';
+	import Copy from 'lucide-svelte/icons/copy';
 
 	let element: HTMLButtonElement;
 	let copying = false;

src/lib/components/layout/mobile-nav/mobile-nav-link.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { ArrowUpRight } from 'lucide-svelte';
+	import ArrowUpRight from 'lucide-svelte/icons/arrow-up-right';
 	import type { HTMLAnchorAttributes } from 'svelte/elements';
 	import { Drawer } from 'vaul-svelte';
 

src/lib/components/layout/mobile-nav/mobile-nav.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { Menu } from 'lucide-svelte';
+	import Menu from 'lucide-svelte/icons/menu';
 
 	import { navigation } from '$lib/config';
 
@@ -11,9 +11,9 @@
 
 <Drawer.Root>
 	<Drawer.Trigger asChild let:builder aria-label="open mobile menu">
-		<Button class="sm:hidden" builders={[builder]} variant="outline" size="icon"
+		<Button class="sm:hidden" builders={[builder]} variant="outline" size="icon">
-			><Menu class="h-4 w-4" /></Button
+			<Menu class="h-4 w-4" />
-		>
+		</Button>
 	</Drawer.Trigger>
 	<Drawer.Content>
 		<div class="container mx-auto">

src/lib/components/layout/sidenav/sidenav-link.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { ArrowUpRight } from 'lucide-svelte';
+	import ArrowUpRight from 'lucide-svelte/icons/arrow-up-right';
 	import type { HTMLAnchorAttributes } from 'svelte/elements';
 
 	import { cn } from '$lib/utils';

src/routes/(app)/admin/logs/+page.svelte

@@ -18,6 +18,7 @@
 		logged: boolean;
 		type: string;
 		pseudo?: string;
+		createdAt: Date;
 	};
 
 	const stateStore = createStateStore<Log>();
@@ -31,7 +32,10 @@
 			(acc, log) => {
 				const key = log.pseudo || 'Unknown';
 				if (!acc[key]) acc[key] = [];
-				acc[key].unshift(log);
+				acc[key].unshift({
+					...log,
+					createdAt: new Date()
+				});
 				return acc;
 			},
 			{} as Record<string, Log[]>
@@ -104,6 +108,11 @@
 									Pseudo: <span class="font-normal text-foreground">{log.pseudo}</span>
 								</p>
 							{/if}
+							<p class="text-sm font-medium text-muted-foreground">
+								Date:
+								<span class="font-normal text-foreground">
+									{log.createdAt.toLocaleString()}
+								</span>
 						</div>
 					</div>
 				{/each}

src/routes/(app)/chapters/[chapterId]/groups/+page.svelte

@@ -8,10 +8,10 @@
 	import Minus from 'lucide-svelte/icons/minus';
 	import Plus from 'lucide-svelte/icons/plus';
 	import Users from 'lucide-svelte/icons/users';
+	import Loader from 'lucide-svelte/icons/loader-circle';
 
 	import Button from '$lib/components/ui/button/button.svelte';
 	import Input from '$lib/components/ui/input/input.svelte';
-	import { Loader2 } from 'lucide-svelte';
 	import { toast } from 'svelte-sonner';
 
 	export let data: PageData;
@@ -99,7 +99,7 @@
 									<input type="hidden" name="name" value={group.name} />
 									<Button disabled={submitting} variant="destructive" type="submit">
 										{#if submitting}
-											<Loader2 class="mr-2 h-4 w-4 animate-spin" />
+											<Loader class="mr-2 h-4 w-4 animate-spin" />
 										{:else}
 											<Minus class="mr-2 h-4 w-4" />
 										{/if}
@@ -128,7 +128,7 @@
 									<input type="hidden" name="name" value={group.name} />
 									<Button disabled={submitting} variant="outline" type="submit">
 										{#if submitting}
-											<Loader2 class="mr-2 h-4 w-4 animate-spin" />
+											<Loader class="mr-2 h-4 w-4 animate-spin" />
 										{:else}
 											<Plus class="mr-2 h-4 w-4" />
 										{/if}

src/routes/(app)/chapters/[chapterId]/puzzle/[puzzleId]/+page.svelte

@@ -6,7 +6,7 @@
 	import { goto } from '$app/navigation';
 	import { page } from '$app/stores';
 
-	import { Loader2 } from 'lucide-svelte';
+	import Loader from 'lucide-svelte/icons/loader-circle';
 	import { toast } from 'svelte-sonner';
 
 	import CopyCodeInjector from '$lib/components/copy-code-injector.svelte';
@@ -22,12 +22,12 @@
 </script>
 
 <div class="flex h-full w-full flex-col justify-between gap-4">
-	<h1 class="text-xl font-bold">
+	<h2 class="text-xl font-bold">
 		{puzzle.name}
 		<span class="text-lg text-muted-foreground">({puzzle.scoreMax} points)</span>
-	</h1>
+	</h2>
 	<article
-		class="prose-invert prose-a:text-primary prose-a:hover:text-primary/80 prose-pre:rounded h-screen max-w-none overflow-y-auto font-fira"
+		class="prose-invert prose-a:text-primary prose-pre:rounded h-screen max-w-none overflow-y-auto break-normal font-fira"
 	>
 		<CopyCodeInjector>
 			{@html puzzle.content}
@@ -110,7 +110,7 @@
 			</div>
 			<Button type="submit" class="w-full sm:w-44" disabled={submitting}>
 				{#if submitting}
-					<Loader2 class="mr-2 h-4 w-4 animate-spin" />
+					<Loader class="mr-2 h-4 w-4 animate-spin" />
 				{/if}
 				Valider
 			</Button>

tailwind.config.js

@@ -4,7 +4,7 @@ import { fontFamily } from "tailwindcss/defaultTheme";
 const config = {
 	darkMode: ["class"],
 	content: ["./src/**/*.{html,js,svelte,ts}"],
-  safelist: ["dark"],
+	safelist: ["dark"],
 	theme: {
 		container: {
 			center: true,
@@ -67,6 +67,10 @@ const config = {
 			hoverOnlyWhenSupported: true
 		}
 	},
+	plugins: [
+		require('@tailwindcss/typography'),
+		require('@tailwindcss/forms'),
+	],
 };
 
 export default config;