Using LNURLTip to show the QR

This commit is contained in:
Ivan 2023-01-12 00:07:48 -06:00
parent 6d3614d953
commit 17a6a5ba23
No known key found for this signature in database
GPG Key ID: 600CE24100F54574
2 changed files with 11 additions and 17 deletions

View File

@ -3,11 +3,11 @@ import { useState } from "react";
import { decode as invoiceDecode } from "light-bolt11-decoder";
import { useMemo } from "react";
import NoteTime from "./NoteTime";
import QrCode from "./QrCode";
import LNURLTip from "./LNURLTip";
export default function Invoice(props) {
const invoice = props.invoice;
const [showLnQr, setShowLnQr] = useState(false);
const [showInvoice, setShowInvoice] = useState(false);
const info = useMemo(() => {
try {
@ -37,37 +37,30 @@ export default function Invoice(props) {
<>
<h4> Invoice for {info?.amount?.toLocaleString()} sats</h4>
<p>{info?.description}</p>
{ showLnQr ? <p><QrCode data={invoice} link={"lightning:${invoice}"} /></p> : null }
{showInvoice && <LNURLTip lnInvoice={invoice} show={true} /> }
</>
)
} else {
return (
<>
<h4> Invoice for {info?.amount?.toLocaleString()} sats</h4>
{ showLnQr ? <p><QrCode data={invoice} link={"lightning:${invoice}"} /></p> : null }
{showInvoice && <LNURLTip lnInvoice={invoice} show={true} /> }
</>
)
}
}
function pay(){
return (
<>
{ showLnQr ? <div className="btn" onClick={() => window.open(`lightning:${invoice}`)}>Pay</div> :
<div className="btn" onClick={(e) => setShowLnQr(true)}>Pay</div> }
</>
)
}
return (
<>
<div className="note-invoice flex">
<div className="f-grow flex f-col">
{header()}
{info?.expire ? <small>{info?.expired ? "Expired" : "Expires"} <NoteTime from={info.expire * 1000} /></small> : null}
</div>
{info?.expired ? <div className="btn">Expired</div> : pay() }
{info?.expired ? <div className="btn">Expired</div> : <div className="btn" onClick={(e) => setShowInvoice(true)}>Pay</div> }
</div>
</>
)
}

View File

@ -8,6 +8,7 @@ export default function LNURLTip(props) {
const onClose = props.onClose || (() => { });
const service = props.svc;
const show = props.show || false;
const lnInvoice = props.lnInvoice
const amounts = [50, 100, 500, 1_000, 5_000, 10_000];
const [payService, setPayService] = useState("");
const [amount, setAmount] = useState(0);
@ -18,7 +19,7 @@ export default function LNURLTip(props) {
const [success, setSuccess] = useState(null);
useEffect(() => {
if (show) {
if (show && !lnInvoice) {
loadService()
.then(a => setPayService(a))
.catch(() => setError("Failed to load LNURL service"));
@ -164,7 +165,7 @@ export default function LNURLTip(props) {
function payInvoice() {
if(success) return null;
const pr = invoice.pr;
const pr = lnInvoice ? lnInvoice : invoice.pr;
return (
<>
<div className="invoice">