slug validation and added a view page

src/routes/exerciseSplits/+page.svelte

@@ -1,4 +1,14 @@
+<script lang="ts">
+  export let data;
+</script>
+
 <h2>Exercise splits</h2>
 
-<div class="h-px flex flex-col grow overflow-y-auto"></div>
+<div class="h-px flex flex-col grow overflow-y-auto gap-1">
+  {#each data.exerciseSplits as exerciseSplit}
+    <a class="flex p-2 bg-primary rounded-md" href="/exerciseSplits/view/{exerciseSplit._id}">
+      <span class="font-semibold">{exerciseSplit.name}</span>
+    </a>
+  {/each}
+</div>
 <a class="btn btn-accent" href="/exerciseSplits/templates">Create new split</a>

src/routes/exerciseSplits/+page.ts

@@ -1,7 +1,7 @@
 export const load = async ({ fetch }) => {
   const response = await fetch("/api/exerciseSplits");
   if (response.ok) {
-    return { exerciseSplits: (await response.json()) as ExerciseSplit[] };
+    return { exerciseSplits: (await response.json()) as WithSID<ExerciseSplit>[] };
   }
   return { exerciseSplits: [] };
 };

src/routes/exerciseSplits/[mode]/+page.ts

@@ -9,6 +9,8 @@ export const load = ({ url, params }) => {
     // TODO: Load split to edit into stores and return it
   }
 
+  if (params.mode !== "new") error(404, "Not found");
+
   const cloneId = url.searchParams.get("cloneId");
   if (cloneId) {
     // TODO: fetch split to clone from, and return it