diff --git a/src/element/LNURLTip.css b/src/element/LNURLTip.css
index a3a4e9b6..23e1e4e4 100644
--- a/src/element/LNURLTip.css
+++ b/src/element/LNURLTip.css
@@ -2,7 +2,7 @@
background-color: #222;
padding: 10px;
border-radius: 10px;
- width: 50vw;
+ width: 500px;
text-align: center;
min-height: 10vh;
}
diff --git a/src/element/LNURLTip.js b/src/element/LNURLTip.js
index f27e0af3..df44ed81 100644
--- a/src/element/LNURLTip.js
+++ b/src/element/LNURLTip.js
@@ -11,15 +11,23 @@ export default function LNURLTip(props) {
const amounts = [50, 100, 500, 1_000, 5_000, 10_000];
const [payService, setPayService] = useState("");
const [amount, setAmount] = useState(0);
+ const [customAmount, setCustomAmount] = useState(0);
const [invoice, setInvoice] = useState("");
const [comment, setComment] = useState("");
const [error, setError] = useState("")
+ const selectAmount = (a) => {
+ setError("");
+ setInvoice("");
+ setAmount(a);
+ };
+
async function fetchJson(url) {
let rsp = await fetch(url);
if (rsp.ok) {
let data = await rsp.json();
console.log(data);
+ setError("");
return data;
}
return null;
@@ -48,6 +56,7 @@ export default function LNURLTip(props) {
setError(data.reason);
} else {
setInvoice(data.pr);
+ setError("");
}
} else {
setError("Failed to load invoice");
@@ -57,6 +66,17 @@ export default function LNURLTip(props) {
}
};
+ function custom() {
+ let min = (payService?.minSendable ?? 0) / 1000;
+ let max = (payService?.maxSendable ?? 21_000_000_000) / 1000;
+ return (
+
+
setCustomAmount(e.target.value)} />
+
selectAmount(customAmount)}>Confirm
+
+ );
+ }
+
useEffect(() => {
if (payService && amount > 0) {
loadInvoice();
@@ -83,8 +103,11 @@ export default function LNURLTip(props) {
const metadata = useMemo(() => {
if (payService) {
let meta = JSON.parse(payService.metadata);
+ let desc = meta.find(a => a[0] === "text/plain");
+ let image = meta.find(a => a[0] === "image/png;base64");
return {
- description: meta.find(a => a[0] === "text/plain")[1]
+ description: desc ? desc[1] : null,
+ image: image ? image[1] : null
};
}
return null;
@@ -95,17 +118,21 @@ export default function LNURLTip(props) {
onClose()}>
e.stopPropagation()}>
⚡️ Send sats
-
{service}
-
{metadata?.description}
+
{metadata?.description ?? service}
{payService?.commentAllowed > 0 ?
setComment(e.target.value)} /> : null}
- {serviceAmounts.map(a => setAmount(a)}>
+ {serviceAmounts.map(a => selectAmount(a)}>
{a.toLocaleString()}
)}
+ {payService ?
+ selectAmount(-1)}>
+ Custom
+ : null}
+ {amount === -1 ? custom() : null}
{error ?
{error}
: null}
diff --git a/src/element/Note.js b/src/element/Note.js
index 1429348e..7631cb8e 100644
--- a/src/element/Note.js
+++ b/src/element/Note.js
@@ -22,10 +22,10 @@ export default function Note(props) {
const reactions = props.reactions;
const deletion = props.deletion;
const emojiReactions = reactions?.filter(({ Content }) => Content && Content !== "+" && Content !== "-" && Content !== "❤️")
- .reduce((acc, { Content }) => {
- const amount = acc[Content] || 0
- return {...acc, [Content]: amount + 1 }
- }, {})
+ .reduce((acc, { Content }) => {
+ const amount = acc[Content] || 0
+ return { ...acc, [Content]: amount + 1 }
+ }, {})
const likes = reactions?.filter(({ Content }) => Content === "+" || Content === "❤️").length ?? 0
const dislikes = reactions?.filter(({ Content }) => Content === "-").length ?? 0
const publisher = useEventPublisher();
@@ -47,7 +47,7 @@ export default function Note(props) {
};
function hasReacted(emoji) {
- return reactions?.find(({ PubKey, Content }) => Content === emoji && PubKey === login)
+ return reactions?.find(({ PubKey, Content }) => Content === emoji && PubKey === login)
}
const transformBody = useCallback(() => {
@@ -156,15 +156,15 @@ export default function Note(props) {
{Object.keys(emojiReactions).map((emoji) => {
- return (
- react(emoji)}>
-
- {emoji}
+ return (
+ react(emoji)}>
+
+ {emoji}
+
+
+ {emojiReactions[emoji]}
-
- {emojiReactions[emoji]}
-
- )
+ )
})}
like()}>
diff --git a/src/element/QrCode.js b/src/element/QrCode.js
index 9a6d0ac2..50727b93 100644
--- a/src/element/QrCode.js
+++ b/src/element/QrCode.js
@@ -32,6 +32,8 @@ export default function QrCode(props) {
elm.href = `lightning:${link}`;
elm.click();
}
+ } else {
+ qrRef.current.innerHTML = "";
}
}, [link]);
diff --git a/src/index.css b/src/index.css
index 0647d0e7..3bd5bd0d 100644
--- a/src/index.css
+++ b/src/index.css
@@ -65,7 +65,7 @@ code {
border-radius: 25px;
}
-input[type="text"], input[type="password"], textarea {
+input[type="text"], input[type="password"], input[type="number"], textarea {
padding: 10px;
border-radius: 5px;
border: 0;
@@ -120,6 +120,7 @@ span.pill {
span.pill.active {
background-color: #444;
+ font-weight: bold;
}
span.pill:hover {