feat: zap all on pubkey list

packages/app/src/Element/AsyncButton.tsx

@@ -12,6 +12,7 @@ export default function AsyncButton(props: AsyncButtonProps) {
   const [loading, setLoading] = useState<boolean>(false);
 
   async function handle(e: React.MouseEvent) {
+    e.stopPropagation();
     if (loading || props.disabled) return;
     setLoading(true);
     try {

packages/app/src/Element/FollowListBase.tsx

@@ -10,12 +10,21 @@ import messages from "./messages";
 
 export interface FollowListBaseProps {
   pubkeys: HexKey[];
-  title?: ReactNode | string;
+  title?: ReactNode;
   showFollowAll?: boolean;
   showAbout?: boolean;
   className?: string;
+  actions?: ReactNode;
 }
-export default function FollowListBase({ pubkeys, title, showFollowAll, showAbout, className }: FollowListBaseProps) {
+
+export default function FollowListBase({
+  pubkeys,
+  title,
+  showFollowAll,
+  showAbout,
+  className,
+  actions,
+}: FollowListBaseProps) {
   const publisher = useEventPublisher();
   const { follows, relays } = useLogin();
 
@@ -31,6 +40,7 @@ export default function FollowListBase({ pubkeys, title, showFollowAll, showAbou
       {(showFollowAll ?? true) && (
         <div className="flex mt10 mb10">
           <div className="f-grow bold">{title}</div>
+          {actions}
           <button className="transparent" type="button" onClick={() => followAll()}>
             <FormattedMessage {...messages.FollowAll} />
           </button>

packages/app/src/Element/PubkeyList.tsx

@@ -1,8 +1,84 @@
 import { RawEvent } from "@snort/nostr";
-import { dedupe } from "Util";
-import FollowListBase from "./FollowListBase";
+import { FormattedMessage, FormattedNumber } from "react-intl";
+
+import { dedupe, hexToBech32, unixNow } from "Util";
+import FollowListBase from "Element/FollowListBase";
+import AsyncButton from "Element/AsyncButton";
+import { useWallet } from "Wallet";
+import { Toastore } from "Toaster";
+import { getDisplayName } from "Element/ProfileImage";
+import { UserCache } from "Cache";
+import useLogin from "Hooks/useLogin";
+import { LNURL } from "LNURL";
+import useEventPublisher from "Feed/EventPublisher";
+import { WalletInvoiceState } from "Wallet";
 
 export default function PubkeyList({ ev, className }: { ev: RawEvent; className?: string }) {
+  const wallet = useWallet();
+  const login = useLogin();
+  const publisher = useEventPublisher();
   const ids = dedupe(ev.tags.filter(a => a[0] === "p").map(a => a[1]));
-  return <FollowListBase pubkeys={ids} showAbout={true} className={className} />;
+
+  async function zapAll() {
+    for (const pk of ids) {
+      try {
+        const profile = await UserCache.get(pk);
+        const amtSend = login.preferences.defaultZapAmount;
+        const lnurl = profile?.lud16 || profile?.lud06;
+        if (lnurl) {
+          const svc = new LNURL(lnurl);
+          await svc.load();
+
+          const zap = await publisher?.zap(
+            amtSend * 1000,
+            pk,
+            Object.keys(login.relays.item),
+            undefined,
+            `Zap from ${hexToBech32("note", ev.id)}`
+          );
+          const invoice = await svc.getInvoice(amtSend, undefined, zap);
+          if (invoice.pr) {
+            const rsp = await wallet.wallet?.payInvoice(invoice.pr);
+            if (rsp?.state === WalletInvoiceState.Paid) {
+              Toastore.push({
+                element: (
+                  <FormattedMessage
+                    defaultMessage="Sent {n} sats to {name}"
+                    values={{
+                      n: amtSend,
+                      name: getDisplayName(profile, pk),
+                    }}
+                  />
+                ),
+                icon: "zap",
+              });
+            }
+          }
+        }
+      } catch (e) {
+        console.debug("Failed to zap", pk, e);
+      }
+    }
+  }
+
+  return (
+    <FollowListBase
+      pubkeys={ids}
+      showAbout={true}
+      className={className}
+      title={ev.tags.find(a => a[0] === "d")?.[1]}
+      actions={
+        <>
+          <AsyncButton className="mr5 transparent" onClick={() => zapAll()}>
+            <FormattedMessage
+              defaultMessage="Zap All {n} sats"
+              values={{
+                n: <FormattedNumber value={login.preferences.defaultZapAmount * ids.length} />,
+              }}
+            />
+          </AsyncButton>
+        </>
+      }
+    />
+  );
 }