diff --git a/packages/react-app/src/components/Navbar/Wallet.jsx b/packages/react-app/src/components/Navbar/Wallet.jsx
index aa3f211..898e162 100644
--- a/packages/react-app/src/components/Navbar/Wallet.jsx
+++ b/packages/react-app/src/components/Navbar/Wallet.jsx
@@ -1,24 +1,379 @@
-import React, { useContext } from 'react'
+/* eslint-disable max-lines */
+/* eslint-disable max-lines-per-function */
+import React, { useContext,useEffect,useState } from 'react'
+import { KeyOutlined, QrcodeOutlined, SendOutlined, WalletOutlined } from '@ant-design/icons'
+import { Button, Modal, Spin, Tooltip, Typography } from 'antd'
+import { ethers } from 'ethers'
+import QR from 'qrcode.react'
+import AddressInput from '../../components/AddressInput'
+import Address from '../../components/common/Address.jsx'
+import EtherInput from '../../components/EtherInput'
+import Balance from '../../components/Navbar/Balance.jsx'
import { NetworkContext } from '../../contexts/NetworkContext'
+import { Transactor } from '../../helpers'
import { StyledButton } from '../common/StyledButton'
import InfoText from './InfoText'
-const Wallet = ({ isPledged }) => {
- const { address, connectToWallet } = useContext(NetworkContext)
+const { Text, Paragraph } = Typography
+
+/**
+ ~ What it does? ~
+ Displays a wallet where you can specify address and send USD/ETH, with options to
+ scan address, to convert between USD and ETH, to see and generate private keys,
+ to send, receive and extract the burner wallet
+ ~ How can I use? ~
+
+ ~ Features ~
+ - Provide provider={userProvider} to display a wallet
+ - Provide address={address} if you want to specify address, otherwise
+ your default address will be used
+ - Provide ensProvider={mainnetProvider} and your address will be replaced by ENS name
+ (ex. "0xa870" => "user.eth") or you can enter directly ENS name instead of address
+ - Provide price={price} of ether and easily convert between USD and ETH
+ - Provide color to specify the color of wallet icon
+**/
+
+export default function Wallet(props, isPledged) {
+ const [signerAddress, setSignerAddress] = useState()
+ const { address, connectToWallet, web3Modal, disconnectWallet } = useContext(NetworkContext)
+
+ useEffect(() => {
+ async function getAddress() {
+ if (props.signer) {
+ const newAddress = await props.signer.getAddress()
+
+ setSignerAddress(newAddress)
+ }
+ }
+
+ getAddress()
+ }, [props.signer])
+
+ const selectedAddress = props.address || signerAddress
+
+ const [open, setOpen] = useState()
+ const [qr, setQr] = useState()
+ const [amount, setAmount] = useState()
+ const [toAddress, setToAddress] = useState()
+ const [pk, setPK] = useState()
+
+ const providerSend = props.provider ? (
+
+ {
+ setOpen(!open)
+ }}
+ rotate={-90}
+ style={{
+ padding: props.padding ? props.padding : 7,
+ color: props.color ? props.color : '',
+ cursor: 'pointer',
+ fontSize: props.size ? props.size : 28,
+ verticalAlign: 'middle',
+
+ }}
+ />
+
+ ) : (
+ ''
+ )
+
+ let display
+ let receiveButton
+ let privateKeyButton
+
+ if (qr) {
+ display = (
+
+
+ {selectedAddress}
+
+
+
+ )
+ receiveButton = (
+
+ )
+ privateKeyButton = (
+
+ )
+ } else if (pk) {
+ const pk = localStorage.getItem('metaPrivateKey')
+ const wallet = new ethers.Wallet(pk)
+
+ if (wallet.address !== selectedAddress)
+ display = (
+
+ *injected account*, private key unknown
+
+ )
+ else {
+ const extraPkDisplayAdded = {}
+ const extraPkDisplay = []
+
+ extraPkDisplayAdded[wallet.address] = true
+ extraPkDisplay.push(
+ ,
+ )
+
+ for (const key in localStorage)
+ if (key.indexOf('metaPrivateKey_backup') >= 0) {
+ console.log(key)
+
+ const pastpk = localStorage.getItem(key)
+ const pastwallet = new ethers.Wallet(pastpk)
+
+ if (!extraPkDisplayAdded[pastwallet.address] /* && selectedAddress!=pastwallet.address */) {
+ extraPkDisplayAdded[pastwallet.address] = true
+ extraPkDisplay.push(
+ ,
+ )
+ }
+ }
+
+
+ display = (
+
+
Private Key:
+
+
+ {pk}
+
+
+
+
+
+ Point your camera phone at qr code to open in
+
+ burner wallet
+
+ :
+
+
+
+
+ {`https://xdai.io/${pk}`}
+
+
+ {extraPkDisplay ? (
+
+
Known Private Keys:
+ {extraPkDisplay}
+
+
+ ) : (
+ ''
+ )}
+
+ )
+ }
+
+ receiveButton = (
+
+ )
+ privateKeyButton = (
+
+ )
+ } else {
+ const inputStyle = {
+ padding: 10,
+ }
+
+ display = (
+
+
+
+ {
+ setAmount(value)
+ }}
+ />
+
+
+ )
+ receiveButton = (
+
+ )
+ privateKeyButton = (
+
+ )
+ }
+
+
+
return (
+
<>
- {!address ? (
- connectToWallet()}>
- Connect
-
- ) : (
-
- )}
+
+
+
+
+
+
+{providerSend}{address && }
+
+
+ {selectedAddress ? : }
+
+
+
+
+ }
+ onOk={() => {
+ setQr()
+ setPK()
+ setOpen(!open)
+ }}
+ onCancel={() => {
+ setQr()
+ setPK()
+ setOpen(!open)
+ }}
+ footer={[
+ privateKeyButton,
+ receiveButton,
+ ,
+ ]}
+ >
+ {display}
+
+
+
+
>
)
}
-
-export default Wallet
diff --git a/packages/react-app/src/components/Navbar/index.jsx b/packages/react-app/src/components/Navbar/index.jsx
index 96adf99..9685359 100644
--- a/packages/react-app/src/components/Navbar/index.jsx
+++ b/packages/react-app/src/components/Navbar/index.jsx
@@ -1,5 +1,6 @@
import { useContext, useEffect, useState } from 'react'
import { useHistory } from 'react-router-dom'
+import { PropertySafetyFilled } from '@ant-design/icons'
import { Col, Menu, Row } from 'antd'
import styled from 'styled-components'
@@ -24,7 +25,7 @@ const Index = ({ navbarRef, NETWORKCHECK }) => {
const router = useHistory()
const [path, setPath] = useState(router.pathname)
const { isPledged } = useContext(WalletContext)
- const { disconnectWallet, userSigner } = useContext(NetworkContext)
+ const { disconnectWallet, userSigner, mainnetProvider, address, connectToWallet, web3Modal, injectedProvider } = useContext(NetworkContext)
useEffect(() => {
setPath(router.pathname)
@@ -34,6 +35,8 @@ const Index = ({ navbarRef, NETWORKCHECK }) => {
router.push(url)
}
+
+
return (
@@ -60,14 +63,21 @@ const Index = ({ navbarRef, NETWORKCHECK }) => {
-
-
+
+
{userSigner && (
-
- Logout
-
+ {injectedProvider ? (
+ disconnectWallet()} style={{ marginTop: 1.6 }}>
+ Logout
+
+ ) : (
+ connectToWallet()}>
+ Connect
+
+ )}
+
)}
@@ -80,3 +90,4 @@ const Index = ({ navbarRef, NETWORKCHECK }) => {
}
export default Index
+
diff --git a/packages/react-app/src/contexts/NetworkContext.js b/packages/react-app/src/contexts/NetworkContext.js
index 8865359..50ae39d 100644
--- a/packages/react-app/src/contexts/NetworkContext.js
+++ b/packages/react-app/src/contexts/NetworkContext.js
@@ -7,7 +7,7 @@ import { useStaticJsonRPC } from '../hooks'
const { ethers } = require('ethers')
-const USE_BURNER_WALLET = false
+const USE_BURNER_WALLET = true
const providers = [
'https://eth-mainnet.gateway.pokt.network/v1/lb/611156b4a585a20035148406',
@@ -58,7 +58,7 @@ export const NetworkContextProvider = ({ children }) => {
if (injectedProvider && injectedProvider.provider && typeof injectedProvider.provider.disconnect === 'function')
await injectedProvider.provider.disconnect()
-
+ await localProvider
setTimeout(() => {
window.location.reload()