refactor functions to be more dynamic
This commit is contained in:
parent
20538d34ed
commit
f7c493a727
99
src/App.js
99
src/App.js
@ -21,8 +21,8 @@ import { connect } from 'react-redux';
|
||||
import { subscribe } from 'redux-subscriber';
|
||||
// redux actions
|
||||
// import { initializeGlobalWeb3 } from './actions/global-actions';
|
||||
import { uniExchangeContractReady, swtExchangeContractReady } from './actions/exchangeContract-actions';
|
||||
import { uniTokenContractReady, swtTokenContractReady } from './actions/tokenContract-actions';
|
||||
import { uniExchangeContractReady, swtExchangeContractReady, exchangeContractReady } from './actions/exchangeContract-actions';
|
||||
import { uniTokenContractReady, swtTokenContractReady, tokenContractReady } from './actions/tokenContract-actions';
|
||||
import { initializeGlobalWeb3, setWeb3ConnectionStatus, setCurrentMaskAddress, metamaskLocked, metamaskUnlocked, setInteractionState, factoryContractReady, toggleAbout } from './actions/web3-actions';
|
||||
import { setInputBalance, setOutputBalance, setInvariant1, setInvariant2, setMarketEth1, setMarketEth2, setMarketTokens1, setMarketTokens2, setAllowanceApprovalState } from './actions/exchange-actions';
|
||||
// enter d3 & misc. tools
|
||||
@ -74,12 +74,13 @@ class App extends Component {
|
||||
const web3Subscriber = subscribe('web3Store.connected', state => {
|
||||
if(state.web3Store.connected === true && !state.web3Store.metamaskLocked) {
|
||||
console.log('successfully connected to metamask', state.web3Store.currentMaskAddress);
|
||||
setInterval(this.getMarketInfo, 15000);
|
||||
setInterval(this.getAccountInfo, 15000);
|
||||
setInterval(this.getUserAddress, 10000);
|
||||
this.marketInterval = setInterval(this.getMarketInfo, 15000);
|
||||
this.accountInterval = setInterval(this.getAccountInfo, 15000);
|
||||
this.userInterval = setInterval(this.getUserAddress, 500);
|
||||
} else {
|
||||
console.log('web3 not connected, getting user address')
|
||||
setInterval(this.getUserAddress, 500);
|
||||
console.log('this.props.currentMaskAddress', this.props.currentMaskAddress)
|
||||
this.otherUserInterval = setInterval(this.getUserAddress, 500);
|
||||
}
|
||||
})
|
||||
}
|
||||
@ -90,12 +91,14 @@ class App extends Component {
|
||||
// TODO: getInfoFirstTime and getUserAddress are WET af
|
||||
// lets do something about it
|
||||
getInfoFirstTime = () => {
|
||||
localweb3.eth.getAccounts((error, result) => {
|
||||
localweb3.eth.getAccounts(async (error, result) => {
|
||||
if(result.length > 0){
|
||||
this.props.setCurrentMaskAddress(result[0]);
|
||||
this.props.metamaskUnlocked();
|
||||
this.props.setWeb3ConnectionStatus(true)
|
||||
this.getContracts();
|
||||
await this.getContracts();
|
||||
this.getAccountInfo();
|
||||
this.getMarketInfo();
|
||||
} else {
|
||||
this.props.metamaskLocked();
|
||||
this.props.setWeb3ConnectionStatus(false)
|
||||
@ -107,13 +110,15 @@ class App extends Component {
|
||||
getUserAddress = () => {
|
||||
localweb3.eth.getAccounts((error, result) => {
|
||||
if (result.length > 0) {
|
||||
console.log('getUserAddress metamask unlocked')
|
||||
this.props.setCurrentMaskAddress(result[0]);
|
||||
this.props.metamaskUnlocked();
|
||||
this.props.setWeb3ConnectionStatus(true);
|
||||
}
|
||||
else {
|
||||
console.log('getUserAddress metamask Locked ')
|
||||
this.props.setCurrentMaskAddress(undefined);
|
||||
clearInterval(this.marketInterval);
|
||||
clearInterval(this.accountInterval);
|
||||
clearInterval(this.userInterval);
|
||||
this.props.metamaskLocked();
|
||||
this.props.setWeb3ConnectionStatus(false);
|
||||
this.props.setInteractionState('locked');
|
||||
@ -123,62 +128,56 @@ class App extends Component {
|
||||
|
||||
// could possibly use refactoring
|
||||
getContracts = () => {
|
||||
const uniExchangeAddress = this.props.web3Store.exchangeAddresses.UNI;
|
||||
const uniExchangeContract = new localweb3.eth.Contract(exchangeABI, uniExchangeAddress);
|
||||
this.props.uniExchangeContractReady(uniExchangeContract);
|
||||
|
||||
const swapExchangeAddress = this.props.web3Store.exchangeAddresses.SWT;
|
||||
const swapExchangeContract = new localweb3.eth.Contract(exchangeABI, swapExchangeAddress);
|
||||
this.props.swtExchangeContractReady(swapExchangeContract);
|
||||
|
||||
const uniTokenAddress = this.props.web3Store.tokenAddresses.UNI;
|
||||
const uniTokenContract = new localweb3.eth.Contract(tokenABI, uniTokenAddress);
|
||||
this.props.uniTokenContractReady(uniTokenContract);
|
||||
|
||||
const swapTokenAddress = this.props.web3Store.tokenAddresses.SWT;
|
||||
const swapTokenContract = new localweb3.eth.Contract(tokenABI, swapTokenAddress);
|
||||
this.props.swtTokenContractReady(swapTokenContract);
|
||||
|
||||
this.props.web3Store.exchangeAddresses.addresses.map(async exchangeAddress => {
|
||||
// receive the exchange address, create the exchange contract
|
||||
let exchangeContract = await new localweb3.eth.Contract(exchangeABI, exchangeAddress[1]);
|
||||
// send the exchange contract to redux store
|
||||
await this.props.exchangeContractReady(exchangeAddress[0], exchangeContract);
|
||||
})
|
||||
|
||||
this.props.web3Store.tokenAddresses.addresses.map(async tokenAddress => {
|
||||
// receive the token address, create the token contract
|
||||
let tokenContract = await new localweb3.eth.Contract(tokenABI, tokenAddress[1]);
|
||||
// send the token contract to redux store
|
||||
await this.props.tokenContractReady(tokenAddress[0], tokenContract);
|
||||
})
|
||||
|
||||
// happens only once
|
||||
const factoryAddress = this.props.web3Store.factoryAddress;
|
||||
const factoryContract = new localweb3.eth.Contract(factoryABI, factoryAddress);
|
||||
this.props.factoryContractReady(factoryContract);
|
||||
|
||||
this.getAccountInfo();
|
||||
this.getMarketInfo();
|
||||
|
||||
// this.getAccountInfo();
|
||||
// this.getMarketInfo();
|
||||
}
|
||||
|
||||
symbolToTokenAddress = (symbol) => {
|
||||
if(symbol === 'UNI') {
|
||||
return this.props.web3Store.tokenAddresses.UNI;
|
||||
} else if (symbol === 'SWAP') {
|
||||
return this.props.web3Store.tokenAddresses.SWT;
|
||||
let tokenAddresses = this.props.web3Store.tokenAddresses.addresses;
|
||||
for (let i = 0; i < tokenAddresses.length; i++) {
|
||||
if (tokenAddresses[i][0] === symbol) {
|
||||
return tokenAddresses[i][1];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
symbolToTokenContract = (symbol) => {
|
||||
if(symbol === 'UNI') {
|
||||
return this.props.tokenContracts.UNI;
|
||||
} else if(symbol === 'SWAP') {
|
||||
return this.props.tokenContracts.SWT;
|
||||
}
|
||||
return this.props.tokenContracts[symbol]
|
||||
}
|
||||
|
||||
symbolToExchangeAddress = (symbol) => {
|
||||
if(symbol === 'UNI') {
|
||||
return this.props.web3Store.exchangeAddresses.UNI;
|
||||
} else if(symbol === 'SWAP') {
|
||||
return this.props.web3Store.exchangeAddresses.SWT;
|
||||
let exchangeAddresses = this.props.web3Store.exchangeAddresses.addresses;
|
||||
for (let i = 0; i < exchangeAddresses.length; i++) {
|
||||
if (exchangeAddresses[i][0] === symbol) {
|
||||
return exchangeAddresses[i][1];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
symbolToExchangeContract = (symbol) => {
|
||||
if(symbol === 'UNI') {
|
||||
return this.props.exchangeContracts.UNI;
|
||||
} else if(symbol === 'SWAP') {
|
||||
return this.props.exchangeContracts.SWT;
|
||||
}
|
||||
return this.props.exchangeContracts[symbol]
|
||||
}
|
||||
|
||||
|
||||
getMarketInfo = () => {
|
||||
switch (this.props.web3Store.exchangeType) {
|
||||
case 'ETH to Token':
|
||||
@ -292,7 +291,7 @@ class App extends Component {
|
||||
if(type === 'Token to ETH' || type === 'Token to Token') {
|
||||
var token = this.symbolToTokenContract(this.props.exchange.inputToken.value);
|
||||
var exchangeAddress = this.symbolToExchangeAddress(this.props.exchange.inputToken.value);
|
||||
|
||||
|
||||
token.methods.allowance(this.props.web3Store.currentMaskAddress, exchangeAddress).call().then((result, error) => {
|
||||
console.log(this.props.exchange.inputToken.value + ' allowance: ' + result);
|
||||
if(result === '0'){
|
||||
@ -418,7 +417,9 @@ const mapDispatchToProps = (dispatch) => {
|
||||
setMarketTokens2,
|
||||
setAllowanceApprovalState,
|
||||
initializeGlobalWeb3,
|
||||
toggleAbout
|
||||
toggleAbout,
|
||||
exchangeContractReady,
|
||||
tokenContractReady
|
||||
}, dispatch)
|
||||
}
|
||||
|
||||
|
@ -84,9 +84,9 @@ export const setExchangeOutputValue = (outputValue) => ({
|
||||
export const setExchangeRate = (rate) => ({
|
||||
type: SET_EXCHANGE_RATE,
|
||||
rate
|
||||
})
|
||||
});
|
||||
|
||||
export const setExchangeFee = (fee) => ({
|
||||
type: SET_EXCHANGE_FEE,
|
||||
fee
|
||||
})
|
||||
});
|
@ -1,6 +1,7 @@
|
||||
import {
|
||||
UNI_EXCHANGE_CONTRACT_READY,
|
||||
SWT_EXCHANGE_CONTRACT_READY
|
||||
SWT_EXCHANGE_CONTRACT_READY,
|
||||
EXCHANGE_CONTRACT_READY
|
||||
} from '../constants';
|
||||
|
||||
export const uniExchangeContractReady = (contract) => ({
|
||||
@ -11,4 +12,11 @@ export const uniExchangeContractReady = (contract) => ({
|
||||
export const swtExchangeContractReady = (contract) => ({
|
||||
type: SWT_EXCHANGE_CONTRACT_READY,
|
||||
contract
|
||||
});
|
||||
});
|
||||
// definitely needs to be redux thunk
|
||||
export const exchangeContractReady = (symbol, exchangeContract) => ({
|
||||
type: EXCHANGE_CONTRACT_READY,
|
||||
payload: { [symbol]: exchangeContract }
|
||||
});
|
||||
|
||||
|
||||
|
@ -1,7 +0,0 @@
|
||||
import { INITIALIZE_GLOBAL_WEB3 } from '../constants';
|
||||
|
||||
export const initializeGlobalWeb3 = (globalWeb3) => ({
|
||||
type: INITIALIZE_GLOBAL_WEB3,
|
||||
globalWeb3
|
||||
})
|
||||
|
@ -1,6 +1,7 @@
|
||||
import {
|
||||
UNI_TOKEN_CONTRACT_READY,
|
||||
SWT_TOKEN_CONTRACT_READY
|
||||
SWT_TOKEN_CONTRACT_READY,
|
||||
TOKEN_CONTRACT_READY
|
||||
} from '../constants';
|
||||
|
||||
export const uniTokenContractReady = (contract) => ({
|
||||
@ -11,4 +12,9 @@ export const uniTokenContractReady = (contract) => ({
|
||||
export const swtTokenContractReady = (contract) => ({
|
||||
type: SWT_TOKEN_CONTRACT_READY,
|
||||
contract
|
||||
});
|
||||
// again, needs to be redux thunk
|
||||
export const tokenContractReady = (symbol, tokenContract) => ({
|
||||
type: TOKEN_CONTRACT_READY,
|
||||
payload: { [symbol]: tokenContract }
|
||||
});
|
@ -76,8 +76,8 @@ export const setNetworkMessage = (networkMessage) => {
|
||||
|
||||
export const setBlockTimestamp = () => {
|
||||
return async (dispatch, getState) => {
|
||||
const { globalWeb3 } = getState().web3Store
|
||||
await globalWeb3.eth.getBlock('latest', (error, blockInfo) => {
|
||||
const { web3 } = getState().web3Store;
|
||||
await web3.eth.getBlock('latest', (error, blockInfo) => {
|
||||
console.log(blockInfo.timestamp, 'BLOCKTIMESTAMP');
|
||||
dispatch({
|
||||
type: SET_BLOCK_TIMESTAMP,
|
||||
|
@ -6,17 +6,13 @@ import { setWeb3ConnectionStatus, setInteractionState, setNetworkMessage, metama
|
||||
|
||||
class NetworkStatus extends Component {
|
||||
componentDidMount(){
|
||||
const interactionStateSubscriber = subscribe('web3Store.metamaskLocked', state => {
|
||||
if (state.web3Store.metamaskLocked !== true) {
|
||||
console.log('metamask is unlocked')
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
const interactionStateSubscriber = subscribe('web3Store.currentMaskAddress', state => {
|
||||
if (state.web3Store.currentMaskAddress !== undefined) {
|
||||
console.log('METAMASK UNLOCKED FROM NETWORK STATUS')
|
||||
this.checkNetwork();
|
||||
} else {
|
||||
console.log('metamask is locked')
|
||||
}
|
||||
} else { console.log('METAMASK LOCKED FROM NETWORK STATUS') }
|
||||
})
|
||||
// if (this.props.web3Store.web3 !== undefined){
|
||||
// this.checkNetwork();
|
||||
// }
|
||||
}
|
||||
|
||||
checkNetwork = () => {
|
||||
|
@ -1,19 +1,42 @@
|
||||
import React, { Component } from 'react'
|
||||
import Select from 'react-select'
|
||||
import './SelectToken.css'
|
||||
import React, { Component } from 'react';
|
||||
import Select from 'react-select';
|
||||
import './SelectToken.css';
|
||||
import { connect } from 'react-redux';
|
||||
|
||||
class SelectToken extends Component {
|
||||
constructor (props) {
|
||||
super(props)
|
||||
this.state = {
|
||||
selectedOption: this.props.token,
|
||||
tokenList: []
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
let tokenList = this.createTokenList();
|
||||
this.setState({ tokenList })
|
||||
}
|
||||
|
||||
handleChange = (selectedOption) => {
|
||||
this.setState({ selectedOption })
|
||||
this.setState({ selectedOption });
|
||||
this.props.onSelectToken(selectedOption, this.props.type)
|
||||
// console.log(`Selected: ${selectedOption.label}`)
|
||||
}
|
||||
|
||||
createTokenList = () => {
|
||||
let tokens = this.props.web3Store.tokenAddresses.addresses;
|
||||
let tokenList = [ { value: 'ETH', label: 'ETH', clearableValue: false } ];
|
||||
|
||||
for (let i = 0; i < tokens.length; i++) {
|
||||
let entry = { value: '', label: '', clearableValue: false }
|
||||
entry.value = tokens[i][0];
|
||||
entry.label = tokens[i][0];
|
||||
tokenList.push(entry);
|
||||
}
|
||||
|
||||
return tokenList;
|
||||
}
|
||||
|
||||
render () {
|
||||
const { selectedOption } = this.state
|
||||
const value = selectedOption && selectedOption.value
|
||||
@ -24,14 +47,14 @@ class SelectToken extends Component {
|
||||
value={value}
|
||||
onChange={this.handleChange}
|
||||
className="select"
|
||||
options={[
|
||||
{ value: 'ETH', label: 'ETH', clearableValue: false },
|
||||
{ value: 'UNI', label: 'UNI', clearableValue: false },
|
||||
{ value: 'SWAP', label: 'SWAP', clearableValue: false },
|
||||
]}
|
||||
options={this.state.tokenList}
|
||||
/>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default SelectToken;
|
||||
const mapStateToProps = state => ({
|
||||
web3Store: state.web3Store
|
||||
})
|
||||
|
||||
export default connect(mapStateToProps)(SelectToken);
|
||||
|
@ -23,10 +23,12 @@ export const FACTORY_CONTRACT_READY = 'FACTORY_CONTRACT_READY';
|
||||
// token EXCHANGE contract actions, in action creator, reducer, and app
|
||||
export const UNI_EXCHANGE_CONTRACT_READY = 'UNI_EXCHANGE_CONTRACT_READY';
|
||||
export const SWT_EXCHANGE_CONTRACT_READY = 'SWT_EXCHANGE_CONTRACT_READY';
|
||||
export const EXCHANGE_CONTRACT_READY = 'EXCHANGE_CONTRACT_READY';
|
||||
|
||||
// token CONTRACT actions in actions, action creator, reducer
|
||||
export const UNI_TOKEN_CONTRACT_READY = 'UNI_TOKEN_CONTRACT_READY';
|
||||
export const SWT_TOKEN_CONTRACT_READY = 'SWT_TOKEN_CONTRACT_READY';
|
||||
export const TOKEN_CONTRACT_READY = 'TOKEN_CONTRACT_READY';
|
||||
|
||||
// actions for the exchange, all in one place
|
||||
export const SET_INPUT_BALANCE = 'SET_INPUT_BALANCE';
|
||||
|
@ -1,15 +1,18 @@
|
||||
import {
|
||||
UNI_EXCHANGE_CONTRACT_READY,
|
||||
SWT_EXCHANGE_CONTRACT_READY
|
||||
SWT_EXCHANGE_CONTRACT_READY,
|
||||
EXCHANGE_CONTRACT_READY
|
||||
} from '../constants'
|
||||
|
||||
export default (state = {}, action) => {
|
||||
const { contract } = action;
|
||||
const { contract, payload } = action;
|
||||
switch(action.type) {
|
||||
case UNI_EXCHANGE_CONTRACT_READY:
|
||||
return Object.assign({}, state, { UNI: contract });
|
||||
case SWT_EXCHANGE_CONTRACT_READY:
|
||||
return Object.assign({}, state, { SWT: contract });
|
||||
case EXCHANGE_CONTRACT_READY:
|
||||
return Object.assign({}, state, payload )
|
||||
default: return state;
|
||||
}
|
||||
}
|
@ -1,15 +1,18 @@
|
||||
import {
|
||||
UNI_TOKEN_CONTRACT_READY,
|
||||
SWT_TOKEN_CONTRACT_READY
|
||||
SWT_TOKEN_CONTRACT_READY,
|
||||
TOKEN_CONTRACT_READY
|
||||
} from '../constants';
|
||||
|
||||
export default (state = {}, action) => {
|
||||
const { contract } = action;
|
||||
const { contract, payload } = action;
|
||||
switch(action.type) {
|
||||
case UNI_TOKEN_CONTRACT_READY:
|
||||
return Object.assign({}, state, { UNI: contract });
|
||||
case SWT_TOKEN_CONTRACT_READY:
|
||||
return Object.assign({}, state, { SWT: contract });
|
||||
case TOKEN_CONTRACT_READY:
|
||||
return Object.assign({}, state, payload )
|
||||
default: return state;
|
||||
}
|
||||
}
|
@ -3,8 +3,7 @@ export default {
|
||||
web3: {},
|
||||
connected: false,
|
||||
aboutToggle: false,
|
||||
globalWeb3: {},
|
||||
currentMaskAddress: '',
|
||||
currentMaskAddress: undefined,
|
||||
metamaskLocked: true,
|
||||
interaction: '',
|
||||
networkMessage: '',
|
||||
@ -13,22 +12,20 @@ export default {
|
||||
blockTimestamp: '',
|
||||
exchangeType: 'ETH to Token',
|
||||
exchangeAddresses: {
|
||||
UNI: '0xcDc30C3b02c5776495298198377D2Fc0fd6B1F1C',
|
||||
SWT: '0x4632a7Cd732c625dcc48d75E289c209422e1D2B7'
|
||||
addresses: [
|
||||
['UNI','0xcDc30C3b02c5776495298198377D2Fc0fd6B1F1C'],
|
||||
['SWAP','0x4632a7Cd732c625dcc48d75E289c209422e1D2B7']
|
||||
]
|
||||
},
|
||||
tokenAddresses: {
|
||||
UNI: '0x350E5DD084ecF271e8d3531D4324443952F47756',
|
||||
SWT: '0x8B2A87F8243f23C33fb97E23a21Ae8EDB3b71AcA'
|
||||
addresses: [
|
||||
['UNI','0x350E5DD084ecF271e8d3531D4324443952F47756'],
|
||||
['SWAP','0x8B2A87F8243f23C33fb97E23a21Ae8EDB3b71AcA']
|
||||
]
|
||||
}
|
||||
},
|
||||
exchangeContracts: {
|
||||
UNI: '',
|
||||
SWT: ''
|
||||
},
|
||||
tokenContracts: {
|
||||
UNI: '',
|
||||
SWT: ''
|
||||
},
|
||||
exchangeContracts: {},
|
||||
tokenContracts: {},
|
||||
exchange: {
|
||||
inputBalance: 0,
|
||||
outputBalance: 0,
|
||||
|
Loading…
Reference in New Issue
Block a user