wip
This commit is contained in:
Chi Kei Chan
parent
06bb5a954c
commit
dee4b7b8a7
@ -4,6 +4,7 @@ import PropTypes from 'prop-types';
|
||||
import { CSSTransitionGroup } from "react-transition-group";
|
||||
import classnames from 'classnames';
|
||||
import Fuse from '../../helpers/fuse';
|
||||
import { updateField } from '../../ducks/swap';
|
||||
import Modal from '../Modal';
|
||||
import TokenLogo from '../TokenLogo';
|
||||
import SearchIcon from '../../assets/images/magnifying-glass.svg';
|
||||
@ -40,7 +41,7 @@ class CurrencyInputPanel extends Component {
|
||||
};
|
||||
|
||||
createTokenList = () => {
|
||||
let tokens = this.props.web3.tokenAddresses.addresses;
|
||||
let tokens = this.props.tokenAddresses.addresses;
|
||||
let tokenList = [ { value: 'ETH', label: 'ETH', address: 'ETH', clearableValue: false } ];
|
||||
|
||||
for (let i = 0; i < tokens.length; i++) {
|
||||
@ -140,7 +141,14 @@ class CurrencyInputPanel extends Component {
|
||||
<span className="currency-input-panel__extra-text">{extraText}</span>
|
||||
</div>
|
||||
<div className="currency-input-panel__input-row">
|
||||
<input type="number" className="currency-input-panel__input" placeholder="0.0" />
|
||||
<input
|
||||
type="number"
|
||||
className="currency-input-panel__input"
|
||||
placeholder="0.0"
|
||||
onChange={e => {
|
||||
this.props.updateField('input', e.target.value);
|
||||
}}
|
||||
/>
|
||||
<button
|
||||
className={classnames("currency-input-panel__currency-select", {
|
||||
'currency-input-panel__currency-select--selected': selectedTokenAddress,
|
||||
@ -170,6 +178,10 @@ class CurrencyInputPanel extends Component {
|
||||
|
||||
export default connect(
|
||||
state => ({
|
||||
web3: state.web3,
|
||||
tokenAddresses: state.web3.tokenAddresses,
|
||||
balance: state.web3.balance,
|
||||
}),
|
||||
dispatch => ({
|
||||
updateField: (name, value) => dispatch(updateField({ name, value })),
|
||||
})
|
||||
)(CurrencyInputPanel);
|
||||
|
||||
@ -4,10 +4,12 @@ import web3 from './web3';
|
||||
import exchangeContracts from './exchange-contract';
|
||||
import tokenContracts from './token-contract';
|
||||
import exchange from './exchange';
|
||||
import swap from './swap';
|
||||
|
||||
export default combineReducers({
|
||||
web3,
|
||||
exchangeContracts,
|
||||
tokenContracts,
|
||||
exchange
|
||||
exchange,
|
||||
swap,
|
||||
});
|
||||
|
||||
25
src/ducks/swap.js
Normal file
25
src/ducks/swap.js
Normal file
@ -0,0 +1,25 @@
|
||||
const UPDATE_FIELD = 'app/swap/updateField';
|
||||
|
||||
const initialState = {
|
||||
input: '',
|
||||
inputToken: '',
|
||||
output: '',
|
||||
outputToken: '',
|
||||
};
|
||||
|
||||
export const updateField = ({ name, value }) => ({
|
||||
type: UPDATE_FIELD,
|
||||
payload: { name, value },
|
||||
});
|
||||
|
||||
export default function swapReducer(state = initialState, { type, payload }) {
|
||||
switch (type) {
|
||||
case UPDATE_FIELD:
|
||||
return {
|
||||
...state,
|
||||
[payload.name]: payload.value,
|
||||
};
|
||||
default:
|
||||
return state;
|
||||
}
|
||||
}
|
||||
@ -2,92 +2,31 @@ import Web3 from "web3";
|
||||
|
||||
const INITIALIZE = 'app/web3/initialize';
|
||||
const UPDATE_CURRENT_ADDRESS = 'app/web3/updateCurrentAddress';
|
||||
const UPDATE_BALANCE = 'app/web3/updateBalance';
|
||||
|
||||
// export const setWeb3ConnectionStatus = (connected) => ({
|
||||
// type: SET_WEB3_CONNECTION_STATUS,
|
||||
// connected
|
||||
// })
|
||||
//
|
||||
// export const setCurrentMaskAddress = (currentMaskAddress) => ({
|
||||
// type: SET_CURRENT_MASK_ADDRESS,
|
||||
// currentMaskAddress
|
||||
// });
|
||||
//
|
||||
// export const metamaskLocked = () => ({
|
||||
// type: METAMASK_LOCKED,
|
||||
// metamaskLocked: true
|
||||
// });
|
||||
//
|
||||
// export const metamaskUnlocked = () => ({
|
||||
// type: METAMASK_UNLOCKED,
|
||||
// metamaskLocked: false
|
||||
// });
|
||||
//
|
||||
// export const setInteractionState = (interaction) => ({
|
||||
// type: SET_INTERACTION_STATE,
|
||||
// interaction
|
||||
// })
|
||||
//
|
||||
// export const factoryContractReady = (factoryContract) => ({
|
||||
// type: FACTORY_CONTRACT_READY,
|
||||
// factoryContract
|
||||
// });
|
||||
//
|
||||
// export const setNetworkMessage = (networkMessage) => {
|
||||
// return async (dispatch) => {
|
||||
// let networkName;
|
||||
// switch (networkMessage) {
|
||||
// case "main":
|
||||
// networkName = 'Ethereum Mainet'
|
||||
// break;
|
||||
// case "morden":
|
||||
// networkName = 'Morden testnet'
|
||||
// break;
|
||||
// case "ropsten":
|
||||
// networkName = 'Ropsten testnet'
|
||||
// break;
|
||||
// case "rinkeby":
|
||||
// networkName = 'Rinkeby testnet'
|
||||
// break;
|
||||
// case "kovan":
|
||||
// networkName = 'Kovan testnet'
|
||||
// break;
|
||||
// default:
|
||||
// networkName = 'an unknown network'
|
||||
// }
|
||||
// dispatch ({
|
||||
// type: SET_NETWORK_MESSAGE,
|
||||
// networkMessage: networkName
|
||||
// })
|
||||
// }
|
||||
// };
|
||||
//
|
||||
// export const setBlockTimestamp = () => {
|
||||
// return async (dispatch, getState) => {
|
||||
// const { web3 } = getState().web3Store;
|
||||
// await web3.eth.getBlock('latest', (error, blockInfo) => {
|
||||
// dispatch({
|
||||
// type: SET_BLOCK_TIMESTAMP,
|
||||
// timestamp: blockInfo.timestamp
|
||||
// })
|
||||
// });
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// export const setExchangeType = (exchangeType) => ({
|
||||
// type: SET_EXCHANGE_TYPE,
|
||||
// exchangeType
|
||||
// });
|
||||
//
|
||||
// export const toggleAbout = (toggle) => ({
|
||||
// type: TOGGLE_ABOUT,
|
||||
// aboutToggle: toggle
|
||||
// });
|
||||
//
|
||||
// export const toggleInvest = (toggle) => ({
|
||||
// type: TOGGLE_INVEST,
|
||||
// investToggle: toggle
|
||||
// });
|
||||
const initialState = {
|
||||
web3: {},
|
||||
currentAddress: '',
|
||||
balance: {},
|
||||
exchangeAddresses: {
|
||||
addresses: [
|
||||
['BAT','0x80f5C1beA2Ea4a9C21E4c6D7831ae2Dbce45674d'],
|
||||
['DAI','0x9eb0461bcc20229bE61319372cCA84d782823FCb'],
|
||||
['MKR','0x4c86a3b3cf926de3644f60658071ca604949609f'],
|
||||
['OMG','0x1033f09e293200de63AF16041e83000aFBBfF5c0'],
|
||||
['ZRX','0x42E109452F4055c82a513A527690F2D73251367e']
|
||||
]
|
||||
},
|
||||
tokenAddresses: {
|
||||
addresses: [
|
||||
['BAT','0xDA5B056Cfb861282B4b59d29c9B395bcC238D29B'],
|
||||
['DAI','0x2448eE2641d78CC42D7AD76498917359D961A783'],
|
||||
['MKR','0xf9ba5210f91d0474bd1e1dcdaec4c58e359aad85'],
|
||||
['OMG','0x879884c3C46A24f56089f3bBbe4d5e38dB5788C0'],
|
||||
['ZRX','0xF22e3F33768354c9805d046af3C0926f27741B43']
|
||||
]
|
||||
},
|
||||
};
|
||||
|
||||
export const initialize = () => dispatch => {
|
||||
if (typeof window.web3 !== 'undefined') {
|
||||
@ -119,35 +58,43 @@ export const updateCurrentAddress = () => (dispatch, getState) => {
|
||||
})
|
||||
};
|
||||
|
||||
export const updateBalance = () => (dispatch, getState) => {
|
||||
const { web3: { web3, currentAddress } } = getState();
|
||||
|
||||
export default (state = {}, { type, payload }) => {
|
||||
if (!web3 || !currentAddress) {
|
||||
return;
|
||||
}
|
||||
|
||||
web3.eth.getBalance(currentAddress, (e, data) => {
|
||||
if (e) {
|
||||
return;
|
||||
}
|
||||
|
||||
dispatch({
|
||||
type: UPDATE_BALANCE,
|
||||
payload: {
|
||||
address: 'ETH',
|
||||
balance: data,
|
||||
}
|
||||
})
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
export default (state = initialState, { type, payload }) => {
|
||||
switch (type) {
|
||||
case INITIALIZE:
|
||||
return { ...state, web3: payload };
|
||||
case UPDATE_CURRENT_ADDRESS:
|
||||
return { ...state, currentAddress: payload };
|
||||
// case SET_WEB3_CONNECTION_STATUS:
|
||||
// return Object.assign({}, state, { connected: connected });
|
||||
// case SET_CURRENT_MASK_ADDRESS:
|
||||
// return Object.assign({}, state, { currentMaskAddress: currentMaskAddress });
|
||||
// case METAMASK_LOCKED:
|
||||
// return Object.assign({}, state, { metamaskLocked: metamaskLocked });
|
||||
// case METAMASK_UNLOCKED:
|
||||
// return Object.assign({}, state, { metamaskLocked: metamaskLocked });
|
||||
// case SET_INTERACTION_STATE:
|
||||
// return Object.assign({}, state, { interaction: interaction });
|
||||
// case FACTORY_CONTRACT_READY:
|
||||
// return Object.assign({}, state, { factoryContract: factoryContract});
|
||||
// case SET_NETWORK_MESSAGE:
|
||||
// return Object.assign({}, state, { networkMessage: networkMessage });
|
||||
// case SET_BLOCK_TIMESTAMP:
|
||||
// return Object.assign({}, state, { blockTimestamp: timestamp });
|
||||
// case SET_EXCHANGE_TYPE:
|
||||
// return Object.assign({}, state, { exchangeType: exchangeType });
|
||||
// case TOGGLE_ABOUT:
|
||||
// return Object.assign({}, state, { aboutToggle: aboutToggle })
|
||||
// case TOGGLE_INVEST:
|
||||
// return Object.assign({}, state, { investToggle: investToggle })
|
||||
case UPDATE_BALANCE:
|
||||
return {
|
||||
...state,
|
||||
balance: {
|
||||
...state.balance,
|
||||
[payload.address]: payload.balance,
|
||||
},
|
||||
};
|
||||
default: return state;
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user