Show invoice expire/description
This commit is contained in:
parent
9e162f0014
commit
329afa7be2
@ -2,4 +2,12 @@
|
||||
border-radius: 10px;
|
||||
border: 1px solid #444;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.invoice h2, .invoice h4, .invoice p {
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.invoice small {
|
||||
color: #666;
|
||||
}
|
@ -1,6 +1,7 @@
|
||||
import "./Invoice.css";
|
||||
import { decode as invoiceDecode } from "light-bolt11-decoder";
|
||||
import { useMemo } from "react";
|
||||
import moment from "moment";
|
||||
|
||||
export default function Invoice(props) {
|
||||
const invoice = props.invoice;
|
||||
@ -8,22 +9,51 @@ export default function Invoice(props) {
|
||||
const info = useMemo(() => {
|
||||
try {
|
||||
let parsed = invoiceDecode(invoice);
|
||||
|
||||
console.debug("Parsed invoice: ", parsed);
|
||||
let amount = parseInt(parsed.sections.find(a => a.name === "amount")?.value);
|
||||
return {
|
||||
amount: !isNaN(amount) ? (amount / 1000) : null
|
||||
let timestamp = parseInt(parsed.sections.find(a => a.name === "timestamp")?.value);
|
||||
let expire = parseInt(parsed.sections.find(a => a.name === "expiry")?.value);
|
||||
let description = parsed.sections.find(a => a.name === "description")?.value;
|
||||
let ret = {
|
||||
amount: !isNaN(amount) ? (amount / 1000) : 0,
|
||||
expire: !isNaN(timestamp) && !isNaN(expire) ? timestamp + expire : null,
|
||||
description
|
||||
};
|
||||
if (ret.expire) {
|
||||
ret.expired = ret.expire < (new Date().getTime() / 1000);
|
||||
}
|
||||
console.log(ret);
|
||||
return ret;
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
}
|
||||
}, [invoice]);
|
||||
|
||||
function header() {
|
||||
if (info?.description?.length > 0) {
|
||||
return (
|
||||
<>
|
||||
<h4>⚡️ Invoice for {info?.amount?.toLocaleString()} sats</h4>
|
||||
<p>{info?.description}</p>
|
||||
</>
|
||||
)
|
||||
} else {
|
||||
return (
|
||||
<h4>⚡️ Invoice for {info?.amount?.toLocaleString()} sats</h4>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<div className="invoice flex">
|
||||
<div className="f-grow">
|
||||
⚡️ Invoice for {info?.amount?.toLocaleString()} sats
|
||||
<div className="f-grow flex f-col">
|
||||
{header()}
|
||||
{info?.expire ? <small>{info?.expired ? "Expired" : "Expires"} {moment(info.expire * 1000).fromNow()}</small> : null}
|
||||
</div>
|
||||
<div className="btn" onClick={() => window.open(`lightning:${invoice}`)}>Pay</div>
|
||||
|
||||
{info?.expired ? <div className="btn">Expired</div> :
|
||||
<div className="btn" onClick={() => window.open(`lightning:${invoice}`)}>Pay</div>}
|
||||
</div>
|
||||
)
|
||||
}
|
Loading…
Reference in New Issue
Block a user