From 8f51db5a4976d793264aedccae7c98b84699a069 Mon Sep 17 00:00:00 2001
From: Chad Curtis <chad@chadwick.site>
Date: Mon, 14 Jul 2025 02:01:30 +0000
Subject: [PATCH] nwc icon change + context fix

---
 CONTEXT.md                     | 18 ++++++++++++++++--
 src/components/WalletModal.tsx |  6 +++---
 2 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/CONTEXT.md b/CONTEXT.md
index b7d4b5c..a53f4cf 100644
--- a/CONTEXT.md
+++ b/CONTEXT.md
@@ -673,10 +673,24 @@ import { NWCProvider } from '@/contexts/NWCContext';
 </NostrProvider>
 ```
 
+#### useZaps Hook API
+
+**The `useZaps` hook accepts flexible input types - DO NOT create duplicate hooks:**
+
+```tsx
+// Single event
+const { zap, totalSats, isLoading } = useZaps(event, webln, activeNWC, onSuccess);
+
+// Multiple events (for bulk fetching zap data)
+const { zapData, isLoading } = useZaps(eventArray, webln, activeNWC);
+
+// Disable fetching
+const { zap } = useZaps([], webln, activeNWC, onSuccess);
+```
+
 ```tsx
 // Use unified wallet detection and zap components
 const { webln, activeNWC, preferredMethod } = useWallet();
-const { zap } = useZaps(target, webln, activeNWC, onSuccess);
 
 // Pre-built components available
 import { ZapButton } from '@/components/ZapButton';
@@ -691,10 +705,10 @@ if (!author.metadata?.lud16 && !author.metadata?.lud06) {
 
 **Critical patterns:**
 - **Include NWCProvider** in the provider tree before using any zap functionality
+- **Use existing `useZaps` hook** - it handles both single events and arrays
 - Detect WebLN only when needed (dialog open)
 - Show payment method indicator to users
 - Handle errors gracefully with specific messaging
-- Use `useZaps` hook for payment logic
 
 ## App Configuration
 
diff --git a/src/components/WalletModal.tsx b/src/components/WalletModal.tsx
index ecc46b3..9485d5e 100644
--- a/src/components/WalletModal.tsx
+++ b/src/components/WalletModal.tsx
@@ -1,5 +1,5 @@
 import { useState } from 'react';
-import { Wallet, Plus, Trash2, Zap, Globe, Settings, CheckCircle } from 'lucide-react';
+import { Wallet, Plus, Trash2, Zap, Globe, WalletMinimal, CheckCircle } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import {
   Dialog,
@@ -128,7 +128,7 @@ export function WalletModal({ children, className }: WalletModalProps) {
               {/* NWC */}
               <div className="flex items-center justify-between p-3 border rounded-lg">
                 <div className="flex items-center gap-3">
-                  <Settings className="h-4 w-4 text-muted-foreground" />
+                  <WalletMinimal className="h-4 w-4 text-muted-foreground" />
                   <div>
                     <p className="text-sm font-medium">Nostr Wallet Connect</p>
                     <p className="text-xs text-muted-foreground">
@@ -215,7 +215,7 @@ export function WalletModal({ children, className }: WalletModalProps) {
                   return (
                     <div key={connection.connectionString} className={`flex items-center justify-between p-3 border rounded-lg ${isActive ? 'ring-2 ring-primary' : ''}`}>
                       <div className="flex items-center gap-3">
-                        <Settings className="h-4 w-4 text-muted-foreground" />
+                        <WalletMinimal className="h-4 w-4 text-muted-foreground" />
                         <div>
                           <p className="text-sm font-medium">
                             {connection.alias || info?.alias || 'Lightning Wallet'}