Make page viewer route prerenderable

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

@@ -1,12 +0,0 @@
-<script lang="ts">
-	import Article from '$lib/components/Article.svelte';
-	import type { PageData } from './$types';
-
-	export let data: PageData;
-
-	let { event } = data;
-</script>
-
-<main>
-	<Article index={event} />
-</main>

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

@@ -1,26 +0,0 @@
-import { getNdkInstance, ndk } from '$lib/ndk';
-import type { NDKEvent } from '@nostr-dev-kit/ndk';
-import { error } from '@sveltejs/kit';
-
-// MichaelJ - 23 July 2024 - Disable server-side rendering so that the load function can use the
-// browser's local storage to retrieve saved relays and the cache adapter for the NDK instance.
-export const ssr = false;
-
-export const load = async ({ params }) => {
-  const ndk = getNdkInstance();
-  const { id } = params;
-
-  let event: NDKEvent | null | undefined;
-
-  try {
-    event = await ndk.fetchEvent(id);
-  } catch (err) {
-    console.error(err);
-  }
-
-  if (!event) {
-    error(404, 'No event found with the given ID.');
-  }
-
-  return { event };
-};

src/routes/article/+page.svelte

@@ -0,0 +1,26 @@
+<script lang="ts">
+  import { page } from '$app/stores';
+  import Article from '$lib/components/Article.svelte';
+  import { ndk } from '$lib/ndk';
+  import type { NDKEvent } from '@nostr-dev-kit/ndk';
+
+  const id = $page.url.searchParams.get('id');
+  let event: NDKEvent | null | undefined;
+
+  if (!id) {
+    // TODO: Redirect to 400 page.
+  }
+
+  $ndk.fetchEvent(id!)
+    .then(ev => {
+      event = ev;
+    })
+    .catch(err => {
+      console.error(err);
+      // TODO: Redirect to 404 page.
+    });
+</script>
+
+<main>
+	<Article index={event} />
+</main>