refactor functions to be more dynamic

This commit is contained in:
Uciel 2018-03-24 18:30:01 -04:00
parent 20538d34ed
commit f7c493a727
12 changed files with 132 additions and 100 deletions

@ -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);
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);
})
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.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':
@ -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) => ({
@ -12,3 +13,10 @@ 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) => ({
@ -12,3 +13,8 @@ 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,