Merge pull request #7 from threenine/develop

Strip out NDK

Author: garywoodfine

.junie/guidelines.md

@@ -22,7 +22,7 @@
 * vue
 * Typescript
 * nostr-tools
-* NDK
+
 
 # Unit Test
 * vitest

nuxt.config.ts

@@ -7,9 +7,4 @@ export default defineNuxtConfig({
     '@nuxt/ui',
   ],
   compatibilityDate: '2025-08-19',
-  vite: {
-    optimizeDeps: {
-      include: ['tseep'],
-    },
-  },
 })

package.json

@@ -34,8 +34,8 @@
     "test:types": "vue-tsc --noEmit && cd playground && vue-tsc --noEmit"
   },
   "dependencies": {
-    "@nostr-dev-kit/ndk": "^2.18.1",
-    "defu": "^6.1.4"
+    "defu": "^6.1.4",
+    "nostr-tools": "^2.19.4"
   },
   "devDependencies": {
     "@nuxt/devtools": "^2.6.2",

src/module.ts

@@ -1,4 +1,4 @@
-import { defineNuxtModule, addPlugin, addComponent, addImports, createResolver } from '@nuxt/kit'
+import { addComponent, addImports, addPlugin, createResolver, defineNuxtModule } from '@nuxt/kit'
 import { defu } from 'defu'
 
 // Module options TypeScript interface definition
@@ -15,27 +15,27 @@ export default defineNuxtModule<ModuleOptions>({
   },
   // Default configuration options of the Nuxt module
   defaults: {
-    relays: ['wss://relay.damus.io', 'wss://purplepag.es/'],
+    relays: ['wss://relay.threenine.services'],
     tagStrategy: 'path',
     tagPrefix: 'comment:',
   },
   setup(options, nuxt) {
     const resolver = createResolver(import.meta.url)
 
-    // Configure Vite to handle tseep and @nostr-dev-kit/ndk properly
+    // Configure Vite to handle tseep and nostr-tools properly
     nuxt.hook('vite:extendConfig', (config) => {
       // Ensure optimizeDeps exist
       config.optimizeDeps = config.optimizeDeps || {}
       config.optimizeDeps.include = config.optimizeDeps.include || []
 
       // Pre-bundle these packages for better ESM/CJS interop
-      config.optimizeDeps.include.push('tseep', '@nostr-dev-kit/ndk', 'nostr-tools', 'defu')
+      config.optimizeDeps.include.push('tseep', 'nostr-tools', 'defu')
 
       // For SSR, don't externalize these packages
       config.ssr = config.ssr || {}
 
       // Handle the noExternal property correctly based on its current type
-      const packagesToInclude = ['tseep', '@nostr-dev-kit/ndk', 'nostr-tools', 'defu']
+      const packagesToInclude = ['tseep', 'nostr-tools', 'defu']
 
       if (!config.ssr.noExternal) {
         config.ssr.noExternal = packagesToInclude
@@ -57,12 +57,12 @@ export default defineNuxtModule<ModuleOptions>({
     nuxt.hook('nitro:config', (nitroConfig) => {
       nitroConfig.externals = nitroConfig.externals || {}
       nitroConfig.externals.inline = nitroConfig.externals.inline || []
-      nitroConfig.externals.inline.push('tseep', '@nostr-dev-kit/ndk', 'nostr-tools', 'defu')
+      nitroConfig.externals.inline.push('tseep', 'nostr-tools', 'defu')
     })
 
     // Build transpilation (you already had this)
     nuxt.options.build.transpile = nuxt.options.build.transpile || []
-    nuxt.options.build.transpile.push('tseep', '@nostr-dev-kit/ndk', 'nostr-tools', 'defu')
+    nuxt.options.build.transpile.push('tseep', 'nostr-tools', 'defu')
 
     // Expose runtime config to plugin
     nuxt.options.runtimeConfig.public.nuxstrComments = defu(nuxt.options.runtimeConfig.public.nuxstrComments || {}, options)

src/runtime/classes/NostrManager.ts

@@ -0,0 +1,50 @@
+import type { Event as NToolEvent, Filter } from 'nostr-tools'
+import { SimplePool, verifyEvent } from 'nostr-tools'
+
+export class NostrManager {
+  private static instance: NostrManager
+  private pool: SimplePool
+  private relays: string[]
+
+  private constructor(relays: string[]) {
+    this.pool = new SimplePool()
+    this.relays = relays
+  }
+
+  public static getInstance(relays: string[]): NostrManager {
+    if (!NostrManager.instance) {
+      NostrManager.instance = new NostrManager(relays)
+    }
+    else {
+      // Add any new relays to the existing set
+      relays.forEach((relay) => {
+        if (!NostrManager.instance.relays.includes(relay)) {
+          NostrManager.instance.relays.push(relay)
+        }
+      })
+    }
+    return NostrManager.instance
+  }
+
+  public subscribe(filter: Filter, onEvent: (event: NToolEvent) => void) {
+    return this.pool.subscribeMany(this.relays, filter, {
+      onevent(event) {
+        if (verifyEvent(event)) {
+          onEvent(event)
+        }
+      },
+    })
+  }
+
+  public async publish(event: NToolEvent): Promise<void> {
+    await this.pool.publish(this.relays, event)
+  }
+
+  public async getEvent(filter: Filter): Promise<NToolEvent | null> {
+    return await this.pool.get(this.relays, filter)
+  }
+
+  public async close() {
+    this.pool.close(this.relays)
+  }
+}

src/runtime/components/CommentAuthor.vue

@@ -1,25 +1,30 @@
 <script setup lang="ts">
+import type { Profile } from '../types'
+
 const props = defineProps<{
-  profile: Profile
+  profile?: Profile
   createdAt: number
 }>()
 </script>
 
 <template>
-  <div class="flex items-center gap-3">
+  <div
+    v-if="props.profile"
+    class="flex items-center gap-3"
+  >
     <div
       v-if="props.profile.image"
       class="flex-shrink-0"
     >
       <img
         :src="props.profile.image"
-        :alt="props.profile.name || props.profile.display_name || 'User avatar'"
+        :alt="props.profile.display_name || 'User avatar'"
         class="w-6 h-6 rounded-full object-cover"
       >
     </div>
     <div class="flex-1 min-w-0 mb-3 ">
       <div class="flex gap-6 items-center">
-        <span class="text-sm mr-6">{{ props.profile.display_name || props.profile.name || `${props.profile.pubkey.slice(0, 8)}…` }}</span>
+        <span class="text-sm mr-6">{{ props.profile.display_name || `${props.profile.pubkey.slice(0, 8)}…` }}</span>
         <span class="text-xs text-muted-foreground ml-3">&nbsp;&nbsp;</span>
         <span class="text-xs text-primary ml-3">{{ new Date(props.createdAt * 1000).toLocaleString() }}</span>
       </div>

src/runtime/components/ReplyView.vue

@@ -1,4 +1,6 @@
 <script setup lang="ts">
+import type { Comment } from '../types'
+
 const props = defineProps<{ replies: Comment[] }>()
 </script>
 

src/runtime/composables/useComments.ts

@@ -1,11 +1,14 @@
 import { computed, type Ref, ref, type UnwrapRef } from 'vue'
 import { useRequestURL, useRoute, useRuntimeConfig } from '#imports'
 import useNuxstr from './useNuxstr'
-import { NDKEvent, type NDKFilter, NDKKind, type NDKSignedEvent, type NDKSubscription } from '@nostr-dev-kit/ndk'
-import type { Comment } from '~/src/runtime/types'
+import { useNostr } from './useNostr'
+import type { Event, Filter } from 'nostr-tools'
+
+import type { Comment } from '../types'
 
 function useComments(customContentId?: string) {
-  const { ndk, connect, isLoggedIn, mapComment, pubkey, fetchProfile } = useNuxstr()
+  const { isLoggedIn, pubkey, fetchProfile } = useNuxstr()
+  const { subscribe } = useNostr()
   const route = useRoute()
 
   const config = useRuntimeConfig()
@@ -34,56 +37,65 @@ function useComments(customContentId?: string) {
   }
 
   function siteUrl(): string {
-    const url: URL = useRequestURL()
-    return `${url.protocol}//${url.host}`
+    if (import.meta.server) {
+      const url: URL = useRequestURL()
+      return `${url.protocol}//${url.host}`
+    }
+    return window.location.origin
   }
 
   function fullUrl(path: string): string {
     return `${siteUrl()}${path}`
   }
 
   async function subscribeComments() {
-    await connect()
-    const filter: NDKFilter = {
-      kinds: [NDKKind.GenericReply],
+    const filter: Filter = {
+      kinds: [1111], // NDKKind.GenericReply is 22
       ['#t']: [tagValue()],
       limit: 100,
-      ['#k']: ['web'],
-      ['#A']: [fullUrl(contentId.value)],
     }
-    const sub: NDKSubscription = ndk.subscribe(filter)
-    sub.on('event', async (event: NDKSignedEvent) => {
-      const comment: Comment = mapComment(event)
+
+    subscribe(filter, async (event: Event) => {
+      if (commentsData.value.some(c => c.id === event.id)) return
+      const comment: Comment = {
+        id: event.id,
+        pubkey: event.pubkey,
+        created_at: event.created_at,
+        content: event.content,
+        profile: undefined,
+      }
       comment.profile = await fetchProfile(event.pubkey)
       commentsData.value.push(comment)
     })
   }
 
   async function postComment(comment: string) {
-    await connect()
-    const ndkEvent: NDKEvent = await createCommentEvent(comment)
-    return await ndkEvent.publish().then(() => true).catch((err: unknown) => {
+    const { publish } = useNostr()
+    try {
+      const event = await createCommentEvent(comment)
+      const signedEvent = await window.nostr.signEvent(event)
+      await publish(signedEvent)
+      return true
+    }
+    catch (err: unknown) {
       error.value = (err as Error)?.message || String(err)
       return false
-    })
+    }
   }
 
   /// Create a new comment event as defined in NIP 22
-  async function createCommentEvent(comment: string): Promise<NDKEvent> {
-    const event: NDKEvent = new NDKEvent(ndk)
-    event.kind = NDKKind.GenericReply
-    event.content = comment
-    event.tags = [
-      ['A', fullUrl(contentId.value)],
-      ['a', fullUrl(contentId.value)],
-      ['I', fullUrl(contentId.value)], //
-      ['i', fullUrl(contentId.value)],
-      ['t', tagValue()],
-      ['k', 'web'], // Defined NIP 73
-      ['K', 'web'], // Defined NIP 73,
-      ['p', pubkey ?? ''],
-    ]
-    return event
+  async function createCommentEvent(comment: string) {
+    return {
+      kind: 1111, // GenericReply
+      created_at: Math.floor(Date.now() / 1000),
+      content: comment,
+      tags: [
+        ['A', fullUrl(contentId.value)],
+        ['t', tagValue()],
+        ['k', 'web'],
+        ['p', pubkey ?? ''],
+      ],
+    }
   }
 
   return { loading, error, comments, isLoggedIn, subscribeComments, postComment }

src/runtime/composables/useNostr.ts

@@ -0,0 +1,33 @@
+import { useRuntimeConfig } from '#imports'
+import type { Filter, Event } from 'nostr-tools'
+import { NostrManager } from '../classes/NostrManager'
+
+export const useNostr = (relays?: string[]) => {
+  const config = useRuntimeConfig()
+  const opts = (config.public?.nuxstrComments || {}) as {
+    relays?: string[]
+  }
+
+  const effectiveRelays = relays || opts.relays || []
+  const nostrManager = NostrManager.getInstance(effectiveRelays)
+
+  const subscribe = (filter: Filter, onEvent: (event: Event) => void) => {
+    return nostrManager.subscribe(filter, onEvent)
+  }
+
+  const publish = (event: Event) => {
+    console.log('publishing Comment', event)
+    return nostrManager.publish(event)
+  }
+
+  const getEvent = (filter: Filter) => {
+    return nostrManager.getEvent(filter)
+  }
+
+  return {
+    nostrManager,
+    subscribe,
+    publish,
+    getEvent,
+  }
+}