feat: auto-close ZapWindow after successful wallet payment

Changes:
- Add onClose callback prop to ZapWindowProps interface
- Pass onClose from WindowRenderer to ZapWindow component
- Call onClose() with 1.5s delay after successful wallet payment
- Allow user to see success toast before window closes

User Experience:
- After zapping with wallet, window automatically closes
- 1.5 second delay allows user to see success message
- Prevents accidental double-zapping
- Cleaner flow - no manual window closing needed

Implementation:
- WindowRenderer passes onClose callback to ZapWindow
- ZapWindow calls onClose after payment success and toasts
- setTimeout(onClose, 1500) provides brief delay for UX
- QR code path unchanged (window stays open for payment)

All tests passing (939 passed)
Build successful
This commit is contained in:
Claude
2026-01-18 21:27:41 +00:00
parent 6c064ceead
commit 35966bb8b8
2 changed files with 10 additions and 0 deletions

View File

@@ -234,6 +234,7 @@ export function WindowRenderer({ window, onClose }: WindowRendererProps) {
<ZapWindow
recipientPubkey={window.props.recipientPubkey}
eventPointer={window.props.eventPointer}
onClose={onClose}
/>
);
break;

View File

@@ -54,6 +54,8 @@ export interface ZapWindowProps {
recipientPubkey: string;
/** Optional event being zapped (adds context) */
eventPointer?: EventPointer | AddressPointer;
/** Callback to close the window */
onClose?: () => void;
}
// Default preset amounts in sats
@@ -79,6 +81,7 @@ function formatAmount(amount: number): string {
export function ZapWindow({
recipientPubkey: initialRecipientPubkey,
eventPointer,
onClose,
}: ZapWindowProps) {
// Load event if we have a pointer and no recipient pubkey (derive from event author)
const event = use$(() => {
@@ -345,6 +348,12 @@ export function ZapWindow({
if (invoiceResponse.successAction?.message) {
toast.info(invoiceResponse.successAction.message);
}
// Close the window after successful zap
if (onClose) {
// Small delay to let the user see the success toast
setTimeout(() => onClose(), 1500);
}
} else {
// Show QR code and invoice
const qrUrl = await generateQrCode(invoiceText);