feat: support sending only to current relays

src/components/NoteStats/LikeButton.tsx

@@ -6,8 +6,8 @@ import client from '@/services/client.service'
 import { Heart, Loader } from 'lucide-react'
 import { Event } from 'nostr-tools'
 import { useEffect, useMemo, useState } from 'react'
-import { formatCount } from './utils'
 import { useTranslation } from 'react-i18next'
+import { formatCount } from './utils'
 
 export default function LikeButton({
   event,
@@ -56,7 +56,7 @@ export default function LikeButton({
 
         const targetRelayList = await client.fetchRelayList(event.pubkey)
         const reaction = createReactionDraftEvent(event)
-        await publish(reaction, targetRelayList.read.slice(0, 3))
+        await publish(reaction, { additionalRelayUrls: targetRelayList.read.slice(0, 3) })
         markNoteAsLiked(event.id)
       } catch (error) {
         console.error('like failed', error)

src/components/NoteStats/RepostButton.tsx

@@ -64,7 +64,7 @@ export default function RepostButton({
 
         const targetRelayList = await client.fetchRelayList(event.pubkey)
         const repost = createRepostDraftEvent(event)
-        await publish(repost, targetRelayList.read.slice(0, 5))
+        await publish(repost, { additionalRelayUrls: targetRelayList.read.slice(0, 5) })
         markNoteAsReposted(event.id)
       } catch (error) {
         console.error('repost failed', error)

src/components/PostEditor/NormalPostContent.tsx

@@ -1,18 +1,18 @@
 import { Button } from '@/components/ui/button'
-import { Label } from '@/components/ui/label'
-import { Switch } from '@/components/ui/switch'
-import { StorageKey } from '@/constants'
 import { useToast } from '@/hooks/use-toast'
 import { createCommentDraftEvent, createShortTextNoteDraftEvent } from '@/lib/draft-event'
+import { useFeed } from '@/providers/FeedProvider.tsx'
 import { useNostr } from '@/providers/NostrProvider'
 import client from '@/services/client.service'
 import { ChevronDown, ImageUp, LoaderCircle } from 'lucide-react'
 import { Event, kinds } from 'nostr-tools'
-import { useEffect, useState } from 'react'
+import { useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import TextareaWithMentions from '../TextareaWithMentions.tsx'
 import Mentions from './Mentions'
+import PostOptions from './PostOptions.tsx'
 import Preview from './Preview'
+import { TPostOptions } from './types.ts'
 import Uploader from './Uploader'
 
 export default function NormalPostContent({
@@ -27,18 +27,15 @@ export default function NormalPostContent({
   const { t } = useTranslation()
   const { toast } = useToast()
   const { publish, checkLogin } = useNostr()
+  const { relayUrls } = useFeed()
   const [content, setContent] = useState(defaultContent)
   const [pictureInfos, setPictureInfos] = useState<{ url: string; tags: string[][] }[]>([])
   const [posting, setPosting] = useState(false)
   const [showMoreOptions, setShowMoreOptions] = useState(false)
-  const [addClientTag, setAddClientTag] = useState(false)
+  const [postOptions, setPostOptions] = useState<TPostOptions>({})
   const [uploadingPicture, setUploadingPicture] = useState(false)
   const canPost = !!content && !posting
 
-  useEffect(() => {
-    setAddClientTag(window.localStorage.getItem(StorageKey.ADD_CLIENT_TAG) === 'true')
-  }, [])
-
   const post = async (e: React.MouseEvent) => {
     e.stopPropagation()
     checkLogin(async () => {
@@ -54,14 +51,26 @@ export default function NormalPostContent({
           const relayList = await client.fetchRelayList(parentEvent.pubkey)
           additionalRelayUrls.push(...relayList.read.slice(0, 5))
         }
+        let protectedEvent = false
+        if (postOptions.sendOnlyToCurrentRelays) {
+          const relayInfos = await client.fetchRelayInfos(relayUrls)
+          protectedEvent = relayInfos.every((info) => info?.supported_nips?.includes(70))
+        }
         const draftEvent =
           parentEvent && parentEvent.kind !== kinds.ShortTextNote
-            ? await createCommentDraftEvent(content, parentEvent, pictureInfos, { addClientTag })
+            ? await createCommentDraftEvent(content, parentEvent, pictureInfos, {
+                addClientTag: postOptions.addClientTag,
+                protectedEvent
+              })
             : await createShortTextNoteDraftEvent(content, pictureInfos, {
                 parentEvent,
-                addClientTag
+                addClientTag: postOptions.addClientTag,
+                protectedEvent
               })
-        await publish(draftEvent, additionalRelayUrls)
+        await publish(draftEvent, {
+          additionalRelayUrls,
+          specifiedRelayUrls: postOptions.sendOnlyToCurrentRelays ? relayUrls : undefined
+        })
         setContent('')
         close()
       } catch (error) {
@@ -92,11 +101,6 @@ export default function NormalPostContent({
     })
   }
 
-  const onAddClientTagChange = (checked: boolean) => {
-    setAddClientTag(checked)
-    window.localStorage.setItem(StorageKey.ADD_CLIENT_TAG, checked.toString())
-  }
-
   return (
     <div className="space-y-4">
       <TextareaWithMentions
@@ -150,21 +154,11 @@ export default function NormalPostContent({
           </div>
         </div>
       </div>
-      {showMoreOptions && (
-        <div className="space-y-2">
-          <div className="flex items-center space-x-2">
-            <Label htmlFor="add-client-tag">{t('Add client tag')}</Label>
-            <Switch
-              id="add-client-tag"
-              checked={addClientTag}
-              onCheckedChange={onAddClientTagChange}
-            />
-          </div>
-          <div className="text-muted-foreground text-xs">
-            {t('Show others this was sent via Jumble')}
-          </div>
-        </div>
-      )}
+      <PostOptions
+        show={showMoreOptions}
+        postOptions={postOptions}
+        setPostOptions={setPostOptions}
+      />
       <div className="flex gap-2 items-center justify-around sm:hidden">
         <Button
           className="w-full"

src/components/PostEditor/PicturePostContent.tsx

@@ -1,34 +1,32 @@
 import { Button } from '@/components/ui/button'
-import { Label } from '@/components/ui/label'
-import { Switch } from '@/components/ui/switch'
-import { StorageKey } from '@/constants'
 import { useToast } from '@/hooks/use-toast'
 import { createPictureNoteDraftEvent } from '@/lib/draft-event'
 import { cn } from '@/lib/utils'
+import { useFeed } from '@/providers/FeedProvider.tsx'
 import { useNostr } from '@/providers/NostrProvider'
+import client from '@/services/client.service'
 import { ChevronDown, Loader, LoaderCircle, Plus, X } from 'lucide-react'
-import { Dispatch, SetStateAction, useEffect, useState } from 'react'
+import { Dispatch, SetStateAction, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import Image from '../Image'
 import TextareaWithMentions from '../TextareaWithMentions.tsx'
 import Mentions from './Mentions'
+import PostOptions from './PostOptions.tsx'
+import { TPostOptions } from './types.ts'
 import Uploader from './Uploader'
 
 export default function PicturePostContent({ close }: { close: () => void }) {
   const { t } = useTranslation()
   const { toast } = useToast()
   const { publish, checkLogin } = useNostr()
+  const { relayUrls } = useFeed()
   const [content, setContent] = useState('')
   const [pictureInfos, setPictureInfos] = useState<{ url: string; tags: string[][] }[]>([])
   const [posting, setPosting] = useState(false)
   const [showMoreOptions, setShowMoreOptions] = useState(false)
-  const [addClientTag, setAddClientTag] = useState(false)
+  const [postOptions, setPostOptions] = useState<TPostOptions>({})
   const canPost = !!content && !posting && pictureInfos.length > 0
 
-  useEffect(() => {
-    setAddClientTag(window.localStorage.getItem(StorageKey.ADD_CLIENT_TAG) === 'true')
-  }, [])
-
   const post = async (e: React.MouseEvent) => {
     e.stopPropagation()
     checkLogin(async () => {
@@ -42,10 +40,18 @@ export default function PicturePostContent({ close }: { close: () => void }) {
         if (!pictureInfos.length) {
           throw new Error(t('Picture note requires images'))
         }
+        let protectedEvent = false
+        if (postOptions.sendOnlyToCurrentRelays) {
+          const relayInfos = await client.fetchRelayInfos(relayUrls)
+          protectedEvent = relayInfos.every((info) => info?.supported_nips?.includes(70))
+        }
         const draftEvent = await createPictureNoteDraftEvent(content, pictureInfos, {
-          addClientTag
+          addClientTag: postOptions.addClientTag,
+          protectedEvent
+        })
+        await publish(draftEvent, {
+          specifiedRelayUrls: postOptions.sendOnlyToCurrentRelays ? relayUrls : undefined
         })
-        await publish(draftEvent)
         setContent('')
         close()
       } catch (error) {
@@ -76,11 +82,6 @@ export default function PicturePostContent({ close }: { close: () => void }) {
     })
   }
 
-  const onAddClientTagChange = (checked: boolean) => {
-    setAddClientTag(checked)
-    window.localStorage.setItem(StorageKey.ADD_CLIENT_TAG, checked.toString())
-  }
-
   return (
     <div className="space-y-4">
       <div className="text-xs text-muted-foreground">
@@ -121,21 +122,11 @@ export default function PicturePostContent({ close }: { close: () => void }) {
           </div>
         </div>
       </div>
-      {showMoreOptions && (
-        <div className="space-y-2">
-          <div className="flex items-center space-x-2">
-            <Label htmlFor="add-client-tag">{t('Add client tag')}</Label>
-            <Switch
-              id="add-client-tag"
-              checked={addClientTag}
-              onCheckedChange={onAddClientTagChange}
-            />
-          </div>
-          <div className="text-muted-foreground text-xs">
-            {t('Show others this was sent via Jumble')}
-          </div>
-        </div>
-      )}
+      <PostOptions
+        show={showMoreOptions}
+        postOptions={postOptions}
+        setPostOptions={setPostOptions}
+      />
       <div className="flex gap-2 items-center justify-around sm:hidden">
         <Button
           className="w-full"

src/components/PostEditor/PostOptions.tsx

@@ -0,0 +1,82 @@
+import { Label } from '@/components/ui/label'
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'
+import { Switch } from '@/components/ui/switch'
+import { StorageKey } from '@/constants'
+import { simplifyUrl } from '@/lib/url'
+import { useFeed } from '@/providers/FeedProvider'
+import { Info } from 'lucide-react'
+import { Dispatch, SetStateAction, useEffect } from 'react'
+import { useTranslation } from 'react-i18next'
+import { TPostOptions } from './types'
+
+export default function PostOptions({
+  show,
+  postOptions,
+  setPostOptions
+}: {
+  show: boolean
+  postOptions: TPostOptions
+  setPostOptions: Dispatch<SetStateAction<TPostOptions>>
+}) {
+  const { t } = useTranslation()
+  const { relayUrls } = useFeed()
+
+  useEffect(() => {
+    setPostOptions({
+      addClientTag: window.localStorage.getItem(StorageKey.ADD_CLIENT_TAG) === 'true',
+      sendOnlyToCurrentRelays: false
+    })
+  }, [])
+
+  if (!show) return null
+
+  const onAddClientTagChange = (checked: boolean) => {
+    setPostOptions((prev) => ({ ...prev, addClientTag: checked }))
+    window.localStorage.setItem(StorageKey.ADD_CLIENT_TAG, checked.toString())
+  }
+
+  return (
+    <div className="space-y-2">
+      <div className="flex items-center space-x-2">
+        <Label htmlFor="add-client-tag">{t('Add client tag')}</Label>
+        <Switch
+          id="add-client-tag"
+          checked={postOptions.addClientTag}
+          onCheckedChange={onAddClientTagChange}
+        />
+      </div>
+      <div className="text-muted-foreground text-xs">
+        {t('Show others this was sent via Jumble')}
+      </div>
+      <div className="flex items-center gap-2">
+        <div className="flex items-center gap-1">
+          <Label htmlFor="send-only-to-current-relays" className="truncate">
+            {relayUrls.length === 1
+              ? t('Send only to r', { r: simplifyUrl(relayUrls[0]) })
+              : t('Send only to current relays')}
+          </Label>
+          {relayUrls.length > 1 && (
+            <Popover>
+              <PopoverTrigger>
+                <Info size={14} />
+              </PopoverTrigger>
+              <PopoverContent className="w-fit text-sm">
+                {relayUrls.map((url) => (
+                  <div key={url}>{simplifyUrl(url)}</div>
+                ))}
+              </PopoverContent>
+            </Popover>
+          )}
+        </div>
+        <Switch
+          className="shrink-0"
+          id="send-only-to-current-relays"
+          checked={postOptions.sendOnlyToCurrentRelays}
+          onCheckedChange={(checked) =>
+            setPostOptions((prev) => ({ ...prev, sendOnlyToCurrentRelays: checked }))
+          }
+        />
+      </div>
+    </div>
+  )
+}

src/components/PostEditor/types.ts

@@ -0,0 +1,4 @@
+export type TPostOptions = {
+  addClientTag?: boolean
+  sendOnlyToCurrentRelays?: boolean
+}