wip: zap

src/shared/composer/composer.tsx

@@ -57,7 +57,7 @@ export function Composer() {
   });
 
   const upload = useImageUploader();
-  const publish = usePublish();
+  const { publish } = usePublish();
 
   const uploadImage = async (file?: string) => {
     const image = await upload(file);

src/shared/editProfileModal.tsx

@@ -17,7 +17,6 @@ import { usePublish } from '@utils/hooks/usePublish';
 
 export function EditProfileModal() {
   const queryClient = useQueryClient();
-  const publish = usePublish();
 
   const [isOpen, setIsOpen] = useState(false);
   const [loading, setLoading] = useState(false);
@@ -25,6 +24,7 @@ export function EditProfileModal() {
   const [banner, setBanner] = useState('');
   const [nip05, setNIP05] = useState({ verified: false, text: '' });
 
+  const { publish } = usePublish();
   const { account } = useAccount();
   const {
     register,

src/shared/notes/actions.tsx

@@ -28,7 +28,7 @@ export function NoteActions({
           <NoteReply id={id} pubkey={pubkey} />
           <NoteReaction id={id} pubkey={pubkey} />
           <NoteRepost id={id} pubkey={pubkey} />
-          <NoteZap />
+          <NoteZap id={id} />
         </div>
         {!noOpenThread && (
           <>

src/shared/notes/actions/reaction.tsx

@@ -32,7 +32,7 @@ export function NoteReaction({ id, pubkey }: { id: string; pubkey: string }) {
   const [open, setOpen] = useState(false);
   const [reaction, setReaction] = useState<string | null>(null);
 
-  const publish = usePublish();
+  const { publish } = usePublish();
 
   const getReactionImage = (content: string) => {
     const reaction: { img: string } = REACTIONS.find((el) => el.content === content);

src/shared/notes/actions/repost.tsx

@@ -7,7 +7,7 @@ import { FULL_RELAYS } from '@stores/constants';
 import { usePublish } from '@utils/hooks/usePublish';
 
 export function NoteRepost({ id, pubkey }: { id: string; pubkey: string }) {
-  const publish = usePublish();
+  const { publish } = usePublish();
 
   const submit = async () => {
     const tags = [

src/shared/notes/actions/zap.tsx

@@ -1,13 +1,26 @@
+import { NostrEvent } from '@nostr-dev-kit/ndk';
 import * as Tooltip from '@radix-ui/react-tooltip';
 
 import { ZapIcon } from '@shared/icons';
 
-export function NoteZap() {
+import { useEvent } from '@utils/hooks/useEvent';
+import { usePublish } from '@utils/hooks/usePublish';
+
+export function NoteZap({ id }: { id: string }) {
+  const { createZap } = usePublish();
+  const { data: event } = useEvent(id);
+
+  const submit = async () => {
+    const res = await createZap(event as NostrEvent, 21000);
+    console.log(res);
+  };
+
   return (
     <Tooltip.Root delayDuration={150}>
       <Tooltip.Trigger asChild>
         <button
           type="button"
+          onClick={() => submit()}
           className="group inline-flex h-7 w-7 items-center justify-center"
         >
           <ZapIcon className="h-5 w-5 text-zinc-300 group-hover:text-orange-400" />

src/shared/notes/replies/form.tsx

@@ -10,9 +10,9 @@ import { usePublish } from '@utils/hooks/usePublish';
 import { displayNpub } from '@utils/shortenKey';
 
 export function NoteReplyForm({ id, pubkey }: { id: string; pubkey: string }) {
-  const publish = usePublish();
-
+  const { publish } = usePublish();
   const { status, user } = useProfile(pubkey);
+
   const [value, setValue] = useState('');
 
   const submit = () => {