saner QR code behavior on popup.
This commit is contained in:
@@ -6,24 +6,10 @@ import QRCode from 'react-qr-code'
|
|||||||
|
|
||||||
function Popup() {
|
function Popup() {
|
||||||
let [pubKey, setPubKey] = useState('')
|
let [pubKey, setPubKey] = useState('')
|
||||||
let [privKey, setPrivKey] = useState('')
|
|
||||||
let keys = useRef([])
|
let keys = useRef([])
|
||||||
let [showQR, setShowQR] = useState('')
|
|
||||||
|
|
||||||
const QrIcon = () => (
|
|
||||||
<svg width="30px" height="30px" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
|
|
||||||
stroke="currentColor" className="w-6 h-6">
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round"
|
|
||||||
d="M3.75 4.875c0-.621.504-1.125 1.125-1.125h4.5c.621 0 1.125.504 1.125 1.125v4.5c0 .621-.504 1.125-1.125 1.125h-4.5A1.125 1.125 0 013.75 9.375v-4.5zM3.75 14.625c0-.621.504-1.125 1.125-1.125h4.5c.621 0 1.125.504 1.125 1.125v4.5c0 .621-.504 1.125-1.125 1.125h-4.5a1.125 1.125 0 01-1.125-1.125v-4.5zM13.5 4.875c0-.621.504-1.125 1.125-1.125h4.5c.621 0 1.125.504 1.125 1.125v4.5c0 .621-.504 1.125-1.125 1.125h-4.5A1.125 1.125 0 0113.5 9.375v-4.5z"/>
|
|
||||||
<path stroke-linecap="round" stroke-linejoin="round"
|
|
||||||
d="M6.75 6.75h.75v.75h-.75v-.75zM6.75 16.5h.75v.75h-.75v-.75zM16.5 6.75h.75v.75h-.75v-.75zM13.5 13.5h.75v.75h-.75v-.75zM13.5 19.5h.75v.75h-.75v-.75zM19.5 13.5h.75v.75h-.75v-.75zM19.5 19.5h.75v.75h-.75v-.75zM16.5 16.5h.75v.75h-.75v-.75z"/>
|
|
||||||
</svg>
|
|
||||||
)
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
browser.storage.local.get(['private_key', 'relays']).then(results => {
|
browser.storage.local.get(['private_key', 'relays']).then(results => {
|
||||||
setPrivKey(results.private_key)
|
|
||||||
|
|
||||||
if (results.private_key) {
|
if (results.private_key) {
|
||||||
let hexKey = getPublicKey(results.private_key)
|
let hexKey = getPublicKey(results.private_key)
|
||||||
let npubKey = nip19.npubEncode(hexKey)
|
let npubKey = nip19.npubEncode(hexKey)
|
||||||
@@ -77,29 +63,21 @@ function Popup() {
|
|||||||
<code>{pubKey}</code>
|
<code>{pubKey}</code>
|
||||||
</pre>
|
</pre>
|
||||||
|
|
||||||
<div style={{float: 'left', marginRight: '30px', marginBottom: '20px'}}>
|
<div
|
||||||
<a onClick={() => setShowQR('pub')}>
|
style={{
|
||||||
<QrIcon></QrIcon> PUB
|
height: 'auto',
|
||||||
</a>
|
margin: '0 auto',
|
||||||
</div>
|
maxWidth: 256,
|
||||||
|
width: '100%'
|
||||||
<div style={{float: 'left', marginRight: '30px', marginBottom: '20px'}}>
|
}}
|
||||||
<a onClick={() => setShowQR('priv')}>
|
>
|
||||||
<QrIcon></QrIcon> PRIV
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{ showQR && (
|
|
||||||
<div id={'qrCodeDiv'} style={{ height: 'auto', margin: '0 auto', maxWidth: 256, width: '100%', marginTop: '50px' }}>
|
|
||||||
{showQR === 'priv' ? (<p>PRIVATE KEY</p>) : (<p>PUBLIC KEY</p>)}
|
|
||||||
<QRCode
|
<QRCode
|
||||||
size={256}
|
size={256}
|
||||||
style={{ height: 'auto', maxWidth: '100%', width: '100%' }}
|
style={{height: 'auto', maxWidth: '100%', width: '100%'}}
|
||||||
value={showQR === 'priv' ? privKey : pubKey}
|
value={pubKey.startsWith('n') ? pubKey.toUpperCase() : pubKey}
|
||||||
viewBox={`0 0 256 256`}
|
viewBox={`0 0 256 256`}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
)}
|
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</>
|
</>
|
||||||
|
|||||||
Reference in New Issue
Block a user