Refactor AdventureCard component and add new adventure page

src/routes/adventure/[id]/+page.server.ts

@@ -0,0 +1,32 @@
+import { redirect } from "@sveltejs/kit";
+import type { PageServerLoad } from "./$types";
+import { db } from "$lib/db/db.server";
+import { and, eq } from "drizzle-orm";
+import { adventureTable } from "$lib/db/schema";
+
+export const load = (async (event) => {
+  if (!event.locals.user) {
+    return redirect(302, "/login");
+  }
+
+  let adventureUserId = await db
+    .select({ userId: adventureTable.userId })
+    .from(adventureTable)
+    .where(eq(adventureTable.id, Number(event.params.id)))
+    .limit(1)
+    .execute();
+
+  console.log(adventureUserId);
+
+  if (
+    adventureUserId &&
+    adventureUserId[0]?.userId !== event.locals.user.id &&
+    adventureUserId !== null
+  ) {
+    return redirect(302, "/log");
+  }
+
+  let adventure = await event.fetch(`/api/adventure?id=${event.params.id}`);
+
+  return { adventure: await adventure.json() };
+}) satisfies PageServerLoad;

src/routes/adventure/[id]/+page.svelte

@@ -0,0 +1,27 @@
+<script lang="ts">
+  import type { Adventure } from "$lib/utils/types";
+  import { onMount } from "svelte";
+  import type { PageData } from "./$types";
+  import { goto } from "$app/navigation";
+
+  export let data: PageData;
+
+  let adventure: Adventure;
+
+  onMount(() => {
+    if (data.adventure.adventure) {
+      adventure = data.adventure.adventure[0];
+    } else {
+      goto("/404");
+    }
+  });
+</script>
+
+{#if !adventure}
+  <div class="flex justify-center items-center w-full mt-16">
+    <span class="loading loading-spinner w-24 h-24"></span>
+  </div>
+{:else}
+  <h1 class="text-center font-extrabold text-4xl">{adventure.name}</h1>
+  <p>{adventure.location}</p>
+{/if}