diff --git a/apps/pay/pages/index.tsx b/apps/pay/pages/index.tsx index 72aa16c44a0..4b8b866f917 100644 --- a/apps/pay/pages/index.tsx +++ b/apps/pay/pages/index.tsx @@ -1,4 +1,4 @@ -import React from "react" +import React, { useState } from "react" import Card from "react-bootstrap/Card" import Col from "react-bootstrap/Col" import Container from "react-bootstrap/Container" @@ -45,8 +45,61 @@ function Home() { ) } + const [nfcMessage, setNfcMessage] = useState("") + + const checkForLnurl = (text) => { + return text.toLowerCase().includes("lnurl") + } + + const decodeNDEFRecord = (record) => { + // Ensure that the record's data is an instance of ArrayBuffer + if (record.data instanceof ArrayBuffer) { + const decoder = new TextDecoder(record.encoding || "utf-8") + return decoder.decode(record.data) + } else { + // If it's not an ArrayBuffer, it might be a DataView or another typed array. + // In that case, we can create a new Uint8Array from the buffer of the DataView. + const decoder = new TextDecoder(record.encoding || "utf-8") + return decoder.decode(new Uint8Array(record.data.buffer)) + } + } + + const handleNFCScan = () => { + if ("NDEFReader" in window) { + const ndef = new NDEFReader() + ndef + .scan() + .then(() => { + console.log("NFC scan started successfully.") + + ndef.onreading = (event) => { + console.log("NFC tag read.") + const record = event.message.records[0] + const text = decodeNDEFRecord(record) + + if (checkForLnurl(text)) { + setNfcMessage(text) + // Handle your "lnurl" logic here... + } + } + + ndef.onreadingerror = () => { + console.log("Cannot read data from the NFC tag. Try another one?") + } + }) + .catch((error) => { + console.log(`Error! Scan failed to start: ${error}.`) + }) + } else { + console.log("NFC is not supported") + } + } + return ( + + {nfcMessage &&
LNURL: {nfcMessage}
} +
@@ -68,8 +121,8 @@ function Home() { {error ? "Unavailable" : loading - ? "Loading..." - : data.globals.nodesIds[0]} + ? "Loading..." + : data.globals.nodesIds[0]}