Add error page when coruse is not found

src/routes/[course]/+error.svelte

@@ -0,0 +1,16 @@
+<script lang="ts">
+	import { page } from '$app/state';
+</script>
+
+<div class="flex flex-col items-center justify-center p-10 text-center font-mono">
+	<h1 class="text-3xl font-bold">Error {page.status}</h1>
+	<p class="mt-2 text-gray-500 dark:text-gray-400">
+		{page.error?.message || 'Something went wrong'}
+	</p>
+	<a
+		href="/"
+		class="mt-4 rounded border px-4 py-2 transition-all hover:bg-gray-100 dark:hover:bg-gray-800"
+	>
+		Go home
+	</a>
+</div>

src/routes/[course]/+page.ts

@@ -1,8 +1,19 @@
+import { error } from '@sveltejs/kit';
 import { getCourseStatistic } from 'liu-tentor-package';
 import type { PageLoad } from './$types';
 
 export const load: PageLoad = async ({ params }) => {
 	const course = params.course;
-	const courseStats = await getCourseStatistic(course);
+	if (!course) {
-	return { courseStats };
+		error(404, 'Course not found');
+	}
+	try {
+		const courseStats = await getCourseStatistic(course);
+		if (!courseStats) {
+			error(404, 'Course not found');
+		}
+		return { courseStats };
+	} catch (e) {
+		error(500, 'Failed to load course');
+	}
 };