feat: move routes to slugs

web/src/routes/tools/[id]/+page.ts

@@ -1,11 +0,0 @@
-import { PAGES } from "$lib/registry";
-
-export const prerender = true;
-
-export function entries() {
-	return PAGES.map((page) => ({ id: page.slug }));
-}
-
-export function load({ params }: { params: { id: string } }) {
-	return { id: params.id };
-}

web/src/routes/tools/[slug]/+page.svelte

@@ -6,11 +6,11 @@
 	import { SlidersHorizontal as ToolIcon } from "@lucide/svelte";
 
 	interface Props {
-		data: { id: string };
+		data: { slug: string };
 	}
 	let { data }: Props = $props();
 
-	const page = $derived(getPageBySlug(data.id));
+	const page = $derived(getPageBySlug(data.slug));
 	const tool = $derived(page ? getTool(page.steps[0].id) : undefined);
 </script>
 
@@ -23,7 +23,7 @@
 	<div class="notfound">
 		<EmptyState
 			title={t("errors.notFound")}
-			description={t("errors.toolUnknown", { id: data.id })}
+			description={t("errors.pageUnknown", { slug: data.slug })}
 			icon={ToolIcon}
 		/>
 	</div>

web/src/routes/tools/[slug]/+page.ts

@@ -0,0 +1,11 @@
+import { PAGES } from "$lib/registry";
+
+export const prerender = true;
+
+export function entries() {
+	return PAGES.map((page) => ({ slug: page.slug }));
+}
+
+export function load({ params }: { params: { slug: string } }) {
+	return { slug: params.slug };
+}