diff --git a/src/components/modals/budget-modal.tsx b/src/components/modals/budget-modal.tsx index fa72abc..ead246f 100644 --- a/src/components/modals/budget-modal.tsx +++ b/src/components/modals/budget-modal.tsx @@ -1,7 +1,7 @@ "use client" import { useCallback, useEffect, useRef, useState } from "react" -import { Zap, Copy, Check, Loader2, ArrowLeft, History, Key, RefreshCw, ArrowUpRight, Clock } from "lucide-react" +import { Zap, Copy, Check, Loader2, ArrowLeft, History, Key, RefreshCw, ArrowUpRight, Clock, ArrowDownLeft } from "lucide-react" import { QRCodeSVG } from "qrcode.react" import { Dialog, @@ -13,18 +13,85 @@ import { import { Button } from "@/components/ui/button" import { useModalStore } from "@/stores/modal-store" import { useUserStore } from "@/stores/user-store" -import { isSphinx, hasWebLN, payInvoice, payL402, topUpLsat, fetchTransactionHistory, pollPaymentStatus, fetchBuyLsatChallenge, savePendingLsat, getPendingLsat, clearPendingLsat, topUpStatus, TransactionRow, PendingLsatChallenge } from "@/lib/sphinx" +import { isSphinx, hasWebLN, payInvoice, payL402, topUpLsat, fetchTransactionHistory, pollPaymentStatus, fetchBuyLsatChallenge, savePendingLsat, getPendingLsat, clearPendingLsat, topUpStatus, withdraw, TransactionRow, PendingLsatChallenge } from "@/lib/sphinx" import { getActionDisplayLabel, getActionBadgeColor, isViewGrantRow } from "@/lib/transaction-display" import { isMocksEnabled, MOCK_TRANSACTIONS } from "@/lib/mock-data" import { cookieStorage } from "@/lib/cookie-storage" import { api } from "@/lib/api" -import { decodeInvoiceExpiry } from "@/lib/invoice-utils" +import { decodeInvoiceExpiry, decodeInvoiceAmountSats } from "@/lib/invoice-utils" import { formatCountdown } from "@/lib/format-countdown" import { useInvoiceCountdown } from "@/hooks/use-invoice-countdown" -type Step = "balance" | "first-purchase" | "first-invoice" | "amount" | "invoice" | "success" | "history" | "manage-token" | "restore" +type Step = "balance" | "first-purchase" | "first-invoice" | "amount" | "invoice" | "success" | "history" | "manage-token" | "restore" | "withdraw" const PRESET_AMOUNTS = [50, 100, 500, 1000] +const MINIMUM_WITHDRAWAL_SATS = 100 + +function WithdrawStep({ + invoice, + onInvoiceChange, + error, + loading, + onConfirm, +}: { + invoice: string + onInvoiceChange: (val: string) => void + error: string + loading: boolean + onConfirm: () => void +}) { + const decodedAmountSats = invoice.trim() ? decodeInvoiceAmountSats(invoice) : null + const withdrawExpiresAt = invoice.trim() ? decodeInvoiceExpiry(invoice) : null + const { secondsLeft, expired } = useInvoiceCountdown(withdrawExpiresAt) + + return ( + <> +