Adds QR code

This commit is contained in:
Ivan 2023-01-09 16:26:41 -06:00
parent 643d35531b
commit 6d3614d953
No known key found for this signature in database
GPG Key ID: 600CE24100F54574

View File

@ -1,15 +1,18 @@
import "./Invoice.css";
import { useState } from "react";
import { decode as invoiceDecode } from "light-bolt11-decoder";
import { useMemo } from "react";
import NoteTime from "./NoteTime";
import QrCode from "./QrCode";
export default function Invoice(props) {
const invoice = props.invoice;
const [showLnQr, setShowLnQr] = useState(false);
const info = useMemo(() => {
try {
let parsed = invoiceDecode(invoice);
let amount = parseInt(parsed.sections.find(a => a.name === "amount")?.value);
let timestamp = parseInt(parsed.sections.find(a => a.name === "timestamp")?.value);
let expire = parseInt(parsed.sections.find(a => a.name === "expiry")?.value);
@ -34,15 +37,28 @@ 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 }
</>
)
} else {
return (
<>
<h4> Invoice for {info?.amount?.toLocaleString()} sats</h4>
{ showLnQr ? <p><QrCode data={invoice} link={"lightning:${invoice}"} /></p> : null }
</>
)
}
}
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">
@ -51,8 +67,7 @@ export default function Invoice(props) {
{info?.expire ? <small>{info?.expired ? "Expired" : "Expires"} <NoteTime from={info.expire * 1000} /></small> : null}
</div>
{info?.expired ? <div className="btn">Expired</div> :
<div className="btn" onClick={() => window.open(`lightning:${invoice}`)}>Pay</div>}
{info?.expired ? <div className="btn">Expired</div> : pay() }
</div>
)
}