refactor publish event

src/shared/notes/actions/reaction.tsx

@@ -1,8 +1,7 @@
-import { NDKEvent, NDKKind } from '@nostr-dev-kit/ndk';
+import { NDKEvent } from '@nostr-dev-kit/ndk';
 import * as Popover from '@radix-ui/react-popover';
 import { useState } from 'react';
-
-import { useNDK } from '@libs/ndk/provider';
+import { toast } from 'sonner';
 
 import { ReactionIcon } from '@shared/icons';
 
@@ -29,9 +28,7 @@ const REACTIONS = [
   },
 ];
 
-export function NoteReaction({ id, pubkey }: { id: string; pubkey: string }) {
-  const { ndk } = useNDK();
-
+export function NoteReaction({ event }: { event: NDKEvent }) {
   const [open, setOpen] = useState(false);
   const [reaction, setReaction] = useState<string | null>(null);
 
@@ -41,19 +38,14 @@ export function NoteReaction({ id, pubkey }: { id: string; pubkey: string }) {
   };
 
   const react = async (content: string) => {
-    setReaction(content);
+    try {
+      setReaction(content);
 
-    const event = new NDKEvent(ndk);
-    event.content = content;
-    event.kind = NDKKind.Reaction;
-    event.tags = [
-      ['e', id],
-      ['p', pubkey],
-    ];
-
-    const publishedRelays = await event.publish();
-    if (publishedRelays) {
+      // react
+      await event.react(content);
       setOpen(false);
+    } catch (e) {
+      toast.error(e);
     }
   };
 

src/shared/notes/actions/reply.tsx

@@ -1,45 +0,0 @@
-import * as Tooltip from '@radix-ui/react-tooltip';
-import { createSearchParams, useNavigate } from 'react-router-dom';
-
-import { ReplyIcon } from '@shared/icons';
-
-export function NoteReply({
-  id,
-  pubkey,
-  root,
-}: {
-  id: string;
-  pubkey: string;
-  root?: string;
-}) {
-  const navigate = useNavigate();
-
-  return (
-    <Tooltip.Root delayDuration={150}>
-      <Tooltip.Trigger asChild>
-        <button
-          type="button"
-          onClick={() =>
-            navigate({
-              pathname: '/new/',
-              search: createSearchParams({
-                id,
-                pubkey,
-                root,
-              }).toString(),
-            })
-          }
-          className="group inline-flex h-7 w-7 items-center justify-center text-neutral-600 dark:text-neutral-400"
-        >
-          <ReplyIcon className="h-5 w-5 group-hover:text-blue-500" />
-        </button>
-      </Tooltip.Trigger>
-      <Tooltip.Portal>
-        <Tooltip.Content className="-left-10 inline-flex h-7 select-none items-center justify-center rounded-md bg-neutral-200 px-3.5 text-sm text-neutral-900 will-change-[transform,opacity] data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade dark:bg-neutral-800 dark:text-neutral-100">
-          Quick reply
-          <Tooltip.Arrow className="fill-neutral-200 dark:fill-neutral-800" />
-        </Tooltip.Content>
-      </Tooltip.Portal>
-    </Tooltip.Root>
-  );
-}

src/shared/notes/actions/repost.tsx

@@ -1,41 +1,30 @@
-import { NDKEvent, NDKKind } from '@nostr-dev-kit/ndk';
+import { NDKEvent } from '@nostr-dev-kit/ndk';
 import * as AlertDialog from '@radix-ui/react-alert-dialog';
 import * as Tooltip from '@radix-ui/react-tooltip';
 import { useState } from 'react';
 import { toast } from 'sonner';
 import { twMerge } from 'tailwind-merge';
 
-import { useNDK } from '@libs/ndk/provider';
-
 import { LoaderIcon, RepostIcon } from '@shared/icons';
 
-export function NoteRepost({ id, pubkey }: { id: string; pubkey: string }) {
-  const { ndk, relayUrls } = useNDK();
-
+export function NoteRepost({ event }: { event: NDKEvent }) {
   const [open, setOpen] = useState(false);
   const [isLoading, setIsLoading] = useState(false);
   const [isRepost, setIsRepost] = useState(false);
 
   const submit = async () => {
-    setIsLoading(true);
+    try {
+      setIsLoading(true);
 
-    const tags = [
-      ['e', id, relayUrls[0], 'root'],
-      ['p', pubkey],
-    ];
+      // repsot
+      await event.repost(true);
 
-    const event = new NDKEvent(ndk);
-    event.content = '';
-    event.kind = NDKKind.Repost;
-    event.tags = tags;
-
-    const publishedRelays = await event.publish();
-    if (publishedRelays) {
+      // reset state
       setOpen(false);
       setIsRepost(true);
 
-      toast.success(`Broadcasted to ${publishedRelays.size} relays successfully.`);
-    } else {
+      toast.success("You've reposted this post successfully");
+    } catch (e) {
       setIsLoading(false);
       toast.error('Repost failed, try again later');
     }

src/shared/notes/actions/zap.tsx

@@ -1,5 +1,6 @@
 import { webln } from '@getalby/sdk';
 import { SendPaymentResponse } from '@getalby/sdk/dist/types';
+import { NDKEvent } from '@nostr-dev-kit/ndk';
 import * as Dialog from '@radix-ui/react-dialog';
 import { invoke } from '@tauri-apps/api/primitives';
 import { message } from '@tauri-apps/plugin-dialog';
@@ -9,16 +10,13 @@ import CurrencyInput from 'react-currency-input-field';
 
 import { CancelIcon, ZapIcon } from '@shared/icons';
 
-import { useEvent } from '@utils/hooks/useEvent';
-import { useNostr } from '@utils/hooks/useNostr';
 import { useProfile } from '@utils/hooks/useProfile';
 import { sendNativeNotification } from '@utils/notification';
 import { compactNumber } from '@utils/number';
 
-export function NoteZap({ id, pubkey }: { id: string; pubkey: string }) {
-  const { createZap } = useNostr();
-  const { user } = useProfile(pubkey);
-  const { data: event } = useEvent(id);
+export function NoteZap({ event }: { event: NDKEvent }) {
+  const nwc = useRef(null);
+  const { user } = useProfile(event.pubkey);
 
   const [walletConnectURL, setWalletConnectURL] = useState<string>(null);
   const [amount, setAmount] = useState<string>('21');
@@ -28,12 +26,10 @@ export function NoteZap({ id, pubkey }: { id: string; pubkey: string }) {
   const [isCompleted, setIsCompleted] = useState(false);
   const [isLoading, setIsLoading] = useState(false);
 
-  const nwc = useRef(null);
-
   const createZapRequest = async () => {
     try {
       const zapAmount = parseInt(amount) * 1000;
-      const res = await createZap(event, zapAmount, zapMessage);
+      const res = await event.zap(zapAmount, zapMessage);
 
       if (!res)
         return await message('Cannot create zap request', {