Improve path-based event loading by d tag

src/lib/Article.svelte

@@ -6,26 +6,27 @@
   import showdown from 'showdown';
   import { onMount } from 'svelte';
   import { BookOutline } from 'flowbite-svelte-icons';
-  import { alexandriaKinds } from './stores';
+  import { zettelKinds } from './consts';
 
-  export let event: NDKEvent | null | undefined;
+  export let index: NDKEvent | null | undefined;
 
-  async function getEvents(index?: NDKEvent | null | undefined): Promise<IterableIterator<NDKEvent>> {
+  $: activeHash = $page.url.hash;
+
+  const getEvents = async (index?: NDKEvent | null | undefined): Promise<Set<NDKEvent>> => {
     if (index == null) {
       // TODO: Add error handling.
     }
 
-    const eventSet = await $ndk.fetchEvents({
-      kinds: $alexandriaKinds,
-      ids: index!.getMatchingTags('e').map((value) => value[1]),
+    const eventIds = index!.getMatchingTags('e').map((value) => value[1]);
+    const events = await $ndk.fetchEvents({
+      // @ts-ignore
+      kinds: zettelKinds,
+      ids: eventIds,
     });
-    
-    return eventSet.values();
-  }
 
-  $: eventPromises = getEvents(event);
-  
-  $: activeHash = $page.url.hash;
+    console.debug(`Fetched ${events.size} events from ${eventIds.length} references.`);
+    return events;
+  };
 
   function normalizeHashPath(str: string): string {
     return str
@@ -100,7 +101,7 @@
   const converter = new showdown.Converter();
 </script>
 
-{#await eventPromises}
+{#await getEvents(index)}
   <Sidebar class='sidebar-leather fixed top-20 left-0 px-4 w-60'>
     <SidebarWrapper>
       <Skeleton/>

src/lib/components/Navigation.svelte

@@ -10,7 +10,7 @@
 
 <Navbar class={`Navbar navbar-leather ${className}`}>
   <div class='flex flex-grow justify-between'>
-    <NavBrand href='./'>
+    <NavBrand href='/'>
       <h1 class='font-serif'>Alexandria</h1>
     </NavBrand>
   </div>

src/lib/consts.ts

@@ -1,6 +1,6 @@
 export const wikiKind = 30818;
 export const indexKind = 30040;
-export const zettelKind = 30041;
+export const zettelKinds = [ 1, 30024, 30041, 30818];
 export const standardRelays = [ "wss://thecitadel.nostr1.com" ];
 
 export enum FeedType {

src/routes/+layout.svelte

@@ -11,7 +11,7 @@
   });
 </script>
 
-<div class={'leather h-full w-full flex flex-col items-center'}>
+<div class={'leather min-h-full w-full flex flex-col items-center'}>
   <Navigation class='sticky top-0' />
   <slot />
 </div>

src/routes/d/[tag]/+page.svelte

@@ -1,12 +1,20 @@
 <script lang="ts">
 	import Article from '$lib/Article.svelte';
+  import { ndk } from '$lib/ndk';
+  import { TextPlaceholder } from 'flowbite-svelte';
   import type { PageData } from './$types';
 
   export let data: PageData;
 
-  $: ({ event } = data);
+  const getIndexEvent = (d: string) => {
+    return $ndk.fetchEvent({ '#d': [d] });
+  };
 </script>
 
 <main>
-	<Article {event} />
+  {#await getIndexEvent(data.event.d)}
+    <TextPlaceholder size='xxl' />
+  {:then index}
+    <Article {index} />
+  {/await}
 </main>

src/routes/d/[tag]/+page.ts

@@ -1,32 +1,11 @@
-import { getNdkInstance } from "$lib/ndk";
-import type { NDKEvent, NDKKind } from "@nostr-dev-kit/ndk";
-import { error } from "@sveltejs/kit";
-import type { PageLoad } from "./$types";
-
-// 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;
+import type { PageLoad } from './$types';
 
 export const load: PageLoad = async ({ params }) => {
-  const ndk = getNdkInstance();
   const { tag } = params;
 
-  let events: Set<NDKEvent> = new Set();
-  let event: NDKEvent | null | undefined;
-
-  try {
-    events = await ndk.fetchEvents({
-      kinds: [30040 as NDKKind],
-      '#d': [tag],
-    });
-    event = events.values().next().value;
-  } catch (err) {
-    console.error(err);
-  }
-
-  if (events.size === 0) {
-    error(404, 'No events found with the given d tag.');
-  }
-
-  return { event };
+  return {
+    event: {
+      d: tag,
+    }
+  };
 };