+
+
+ {/* Render Add Wallet as a separate Drawer for mobile */}
+
+
+
+ Connect NWC Wallet
+
+ Enter your connection string from a compatible wallet.
+
+
+
+
+
+
+
+
+ >
+ );
+ }
+
+ return (
+ <>
+
+ {addWalletDialog}
+ >
+ );
+}
\ No newline at end of file
diff --git a/src/components/ZapButton.tsx b/src/components/ZapButton.tsx
new file mode 100644
index 0000000..bb3bbd8
--- /dev/null
+++ b/src/components/ZapButton.tsx
@@ -0,0 +1,58 @@
+import { ZapDialog } from '@/components/ZapDialog';
+import { useZaps } from '@/hooks/useZaps';
+import { useWallet } from '@/hooks/useWallet';
+import { useCurrentUser } from '@/hooks/useCurrentUser';
+import { useAuthor } from '@/hooks/useAuthor';
+import { Zap } from 'lucide-react';
+import type { Event } from 'nostr-tools';
+
+interface ZapButtonProps {
+ target: Event;
+ className?: string;
+ showCount?: boolean;
+ zapData?: { count: number; totalSats: number; isLoading?: boolean };
+}
+
+export function ZapButton({
+ target,
+ className = "text-xs ml-1",
+ showCount = true,
+ zapData: externalZapData
+}: ZapButtonProps) {
+ const { user } = useCurrentUser();
+ const { data: author } = useAuthor(target?.pubkey || '');
+ const { webln, activeNWC } = useWallet();
+
+ // Only fetch data if not provided externally
+ const { totalSats: fetchedTotalSats, isLoading } = useZaps(
+ externalZapData ? [] : target ?? [], // Empty array prevents fetching if external data provided
+ webln,
+ activeNWC
+ );
+
+ // Don't show zap button if user is not logged in, is the author, or author has no lightning address
+ if (!user || !target || user.pubkey === target.pubkey || (!author?.metadata?.lud16 && !author?.metadata?.lud06)) {
+ return null;
+ }
+
+ // Use external data if provided, otherwise use fetched data
+ const totalSats = externalZapData?.totalSats ?? fetchedTotalSats;
+ const showLoading = externalZapData?.isLoading || isLoading;
+
+ return (
+
+