2023-01-02 13:40:42 +00:00
|
|
|
|
import "./Invoice.css";
|
|
|
|
|
import { decode as invoiceDecode } from "light-bolt11-decoder";
|
|
|
|
|
import { useMemo } from "react";
|
|
|
|
|
|
|
|
|
|
export default function Invoice(props) {
|
|
|
|
|
const invoice = props.invoice;
|
|
|
|
|
|
|
|
|
|
const info = useMemo(() => {
|
2023-01-04 20:09:35 +00:00
|
|
|
|
try {
|
|
|
|
|
let parsed = invoiceDecode(invoice);
|
2023-01-02 13:40:42 +00:00
|
|
|
|
|
2023-01-04 20:09:35 +00:00
|
|
|
|
let amount = parseInt(parsed.sections.find(a => a.name === "amount")?.value);
|
|
|
|
|
return {
|
|
|
|
|
amount: !isNaN(amount) ? (amount / 1000) : null
|
|
|
|
|
}
|
|
|
|
|
} catch (e) {
|
|
|
|
|
console.error(e);
|
2023-01-02 13:40:42 +00:00
|
|
|
|
}
|
|
|
|
|
}, [invoice]);
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<div className="invoice flex">
|
|
|
|
|
<div className="f-grow">
|
|
|
|
|
⚡️ Invoice for {info?.amount?.toLocaleString()} sats
|
|
|
|
|
</div>
|
|
|
|
|
<div className="btn" onClick={() => window.open(`lightning:${invoice}`)}>Pay</div>
|
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
}
|