mirror of
https://github.com/trezor/trezor-wallet
synced 2024-11-28 03:08:30 +00:00
refactor sendForm.token to sendForm.selectedCurrency
This commit is contained in:
parent
efd2d252ed
commit
1007477bae
@ -35,14 +35,16 @@ import type { Token } from '../reducers/TokensReducer';
|
|||||||
import type { State, FeeLevel } from '../reducers/SendFormReducer';
|
import type { State, FeeLevel } from '../reducers/SendFormReducer';
|
||||||
import type { Account } from '../reducers/AccountsReducer';
|
import type { Account } from '../reducers/AccountsReducer';
|
||||||
|
|
||||||
export type SendFormAction = {
|
export type SendTxAction = {
|
||||||
type: typeof SEND.TX_COMPLETE,
|
type: typeof SEND.TX_COMPLETE,
|
||||||
account: Account,
|
account: Account,
|
||||||
token: string,
|
selectedCurrency: string,
|
||||||
amount: string,
|
amount: string,
|
||||||
txid: string,
|
txid: string,
|
||||||
txData: any,
|
txData: any,
|
||||||
} | {
|
};
|
||||||
|
|
||||||
|
export type SendFormAction = SendTxAction | {
|
||||||
type: typeof SEND.INIT,
|
type: typeof SEND.INIT,
|
||||||
state: State
|
state: State
|
||||||
} | {
|
} | {
|
||||||
@ -152,18 +154,6 @@ export const getFeeLevels = (symbol: string, gasPrice: BigNumber | string, gasLi
|
|||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
||||||
// export const findBalance = (getState: GetState): string => {
|
|
||||||
// const accountState = getState().abstractAccount;
|
|
||||||
// const { token } = getState().sendForm;
|
|
||||||
// const account: ?Account = findAccount(getState().accounts, accountState.index, accountState.deviceState, accountState.network);
|
|
||||||
|
|
||||||
// if (token !== state.network) {
|
|
||||||
// return getState().tokens.find(t => t.ethAddress === account.address && t.symbol === token).balance;
|
|
||||||
// } else {
|
|
||||||
// return account.balance;
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
|
|
||||||
// initialize component
|
// initialize component
|
||||||
export const init = (): ThunkAction => {
|
export const init = (): ThunkAction => {
|
||||||
@ -200,7 +190,7 @@ export const init = (): ThunkAction => {
|
|||||||
...initialState,
|
...initialState,
|
||||||
network: coin.network,
|
network: coin.network,
|
||||||
coinSymbol: coin.symbol,
|
coinSymbol: coin.symbol,
|
||||||
token: coin.symbol,
|
selectedCurrency: coin.symbol,
|
||||||
feeLevels,
|
feeLevels,
|
||||||
selectedFeeLevel: feeLevels.find(f => f.value === 'Normal'),
|
selectedFeeLevel: feeLevels.find(f => f.value === 'Normal'),
|
||||||
recommendedGasPrice: gasPrice.toString(),
|
recommendedGasPrice: gasPrice.toString(),
|
||||||
@ -274,8 +264,8 @@ export const validation = (): ThunkAction => {
|
|||||||
|
|
||||||
let decimalRegExp: RegExp;
|
let decimalRegExp: RegExp;
|
||||||
|
|
||||||
if (state.token !== accountState.network) {
|
if (state.selectedCurrency !== state.coinSymbol) {
|
||||||
const token = getState().tokens.find(t => t.ethAddress === account.address && t.symbol === state.token);
|
const token = findToken(getState().tokens, account.address, state.selectedCurrency, account.deviceState);
|
||||||
if (token) {
|
if (token) {
|
||||||
if (parseInt(token.decimals) > 0) {
|
if (parseInt(token.decimals) > 0) {
|
||||||
//decimalRegExp = new RegExp('^(0|0\\.([0-9]{0,' + token.decimals + '})?|[1-9]+\\.?([0-9]{0,' + token.decimals + '})?|\\.[0-9]{1,' + token.decimals + '})$');
|
//decimalRegExp = new RegExp('^(0|0\\.([0-9]{0,' + token.decimals + '})?|[1-9]+\\.?([0-9]{0,' + token.decimals + '})?|\\.[0-9]{1,' + token.decimals + '})$');
|
||||||
@ -288,7 +278,7 @@ export const validation = (): ThunkAction => {
|
|||||||
if (!state.amount.match(decimalRegExp)) {
|
if (!state.amount.match(decimalRegExp)) {
|
||||||
errors.amount = `Maximum ${ token.decimals} decimals allowed`;
|
errors.amount = `Maximum ${ token.decimals} decimals allowed`;
|
||||||
} else if (new BigNumber(state.total).greaterThan(account.balance)) {
|
} else if (new BigNumber(state.total).greaterThan(account.balance)) {
|
||||||
errors.amount = `Not enough ${ state.coinSymbol.toUpperCase() } to cover transaction fee`;
|
errors.amount = `Not enough ${ state.coinSymbol } to cover transaction fee`;
|
||||||
} else if (new BigNumber(state.amount).greaterThan(token.balance)) {
|
} else if (new BigNumber(state.amount).greaterThan(token.balance)) {
|
||||||
errors.amount = 'Not enough funds';
|
errors.amount = 'Not enough funds';
|
||||||
} else if (new BigNumber(state.amount).lessThanOrEqualTo('0')) {
|
} else if (new BigNumber(state.amount).lessThanOrEqualTo('0')) {
|
||||||
@ -340,7 +330,7 @@ export const validation = (): ThunkAction => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// valid data
|
// valid data
|
||||||
if (state.touched.data && accountState.network === state.token && state.data.length > 0) {
|
if (state.touched.data && state.data.length > 0) {
|
||||||
const re = /^[0-9A-Fa-f]+$/g;
|
const re = /^[0-9A-Fa-f]+$/g;
|
||||||
//const re = /^[0-9A-Fa-f]{6}$/g;
|
//const re = /^[0-9A-Fa-f]{6}$/g;
|
||||||
if (!re.test(state.data)) {
|
if (!re.test(state.data)) {
|
||||||
@ -389,7 +379,7 @@ export const onAmountChange = (amount: string): ThunkAction => {
|
|||||||
|
|
||||||
const accountState: AccountState = getState().abstractAccount;
|
const accountState: AccountState = getState().abstractAccount;
|
||||||
const currentState: State = getState().sendForm;
|
const currentState: State = getState().sendForm;
|
||||||
const isToken: boolean = currentState.token !== currentState.coinSymbol;
|
const isToken: boolean = currentState.selectedCurrency !== currentState.coinSymbol;
|
||||||
const touched = { ...currentState.touched };
|
const touched = { ...currentState.touched };
|
||||||
touched.amount = true;
|
touched.amount = true;
|
||||||
const total: string = calculateTotal(isToken ? '0' : amount, currentState.gasPrice, currentState.gasLimit);
|
const total: string = calculateTotal(isToken ? '0' : amount, currentState.gasPrice, currentState.gasLimit);
|
||||||
@ -428,11 +418,12 @@ export const onCurrencyChange = (currency: any): ThunkAction => {
|
|||||||
let gasLimit: string = '';
|
let gasLimit: string = '';
|
||||||
let amount: string = currentState.amount;
|
let amount: string = currentState.amount;
|
||||||
let total: string;
|
let total: string;
|
||||||
|
console.warn("SEL", currency, currentState.coinSymbol)
|
||||||
if (isToken) {
|
if (isToken) {
|
||||||
gasLimit = coin.defaultGasLimitTokens.toString();
|
gasLimit = coin.defaultGasLimitTokens.toString();
|
||||||
if (currentState.setMax) {
|
if (currentState.setMax) {
|
||||||
const token: ?Token = findToken(getState().tokens, account.address, currency.value, accountState.deviceState);
|
const token: ?Token = findToken(getState().tokens, account.address, currency.value, accountState.deviceState);
|
||||||
|
console.warn("SEL", token, currency.value)
|
||||||
if (!token) return;
|
if (!token) return;
|
||||||
amount = token.balance;
|
amount = token.balance;
|
||||||
}
|
}
|
||||||
@ -451,7 +442,7 @@ export const onCurrencyChange = (currency: any): ThunkAction => {
|
|||||||
|
|
||||||
const state: State = {
|
const state: State = {
|
||||||
...currentState,
|
...currentState,
|
||||||
token: currency.value,
|
selectedCurrency: currency.value,
|
||||||
amount,
|
amount,
|
||||||
total,
|
total,
|
||||||
feeLevels,
|
feeLevels,
|
||||||
@ -473,7 +464,7 @@ export const onSetMax = (): ThunkAction => {
|
|||||||
return (dispatch: Dispatch, getState: GetState): void => {
|
return (dispatch: Dispatch, getState: GetState): void => {
|
||||||
const accountState: AccountState = getState().abstractAccount;
|
const accountState: AccountState = getState().abstractAccount;
|
||||||
const currentState: State = getState().sendForm;
|
const currentState: State = getState().sendForm;
|
||||||
const isToken: boolean = currentState.token !== currentState.coinSymbol;
|
const isToken: boolean = currentState.selectedCurrency !== currentState.coinSymbol;
|
||||||
const touched = { ...currentState.touched };
|
const touched = { ...currentState.touched };
|
||||||
touched.amount = true;
|
touched.amount = true;
|
||||||
|
|
||||||
@ -487,7 +478,7 @@ export const onSetMax = (): ThunkAction => {
|
|||||||
let total: string = currentState.total;
|
let total: string = currentState.total;
|
||||||
if (!currentState.setMax) {
|
if (!currentState.setMax) {
|
||||||
if (isToken) {
|
if (isToken) {
|
||||||
const token: ?Token = findToken(getState().tokens, account.address, currentState.token, accountState.deviceState);
|
const token: ?Token = findToken(getState().tokens, account.address, currentState.selectedCurrency, accountState.deviceState);
|
||||||
if (!token) return;
|
if (!token) return;
|
||||||
amount = token.balance;
|
amount = token.balance;
|
||||||
total = calculateTotal('0', currentState.gasPrice, currentState.gasLimit);
|
total = calculateTotal('0', currentState.gasPrice, currentState.gasLimit);
|
||||||
@ -518,7 +509,7 @@ export const onFeeLevelChange = (feeLevel: FeeLevel): ThunkAction => {
|
|||||||
return (dispatch: Dispatch, getState: GetState): void => {
|
return (dispatch: Dispatch, getState: GetState): void => {
|
||||||
const accountState: AccountState = getState().abstractAccount;
|
const accountState: AccountState = getState().abstractAccount;
|
||||||
const currentState: State = getState().sendForm;
|
const currentState: State = getState().sendForm;
|
||||||
const isToken: boolean = currentState.token !== currentState.coinSymbol;
|
const isToken: boolean = currentState.selectedCurrency !== currentState.coinSymbol;
|
||||||
|
|
||||||
const { config } = getState().localStorage;
|
const { config } = getState().localStorage;
|
||||||
if (!config) return;
|
if (!config) return;
|
||||||
@ -550,7 +541,7 @@ export const onFeeLevelChange = (feeLevel: FeeLevel): ThunkAction => {
|
|||||||
if (!account) return;
|
if (!account) return;
|
||||||
|
|
||||||
if (isToken) {
|
if (isToken) {
|
||||||
const token: ?Token = findToken(getState().tokens, account.address, currentState.token, accountState.deviceState);
|
const token: ?Token = findToken(getState().tokens, account.address, currentState.selectedCurrency, accountState.deviceState);
|
||||||
if (!token) return;
|
if (!token) return;
|
||||||
state.amount = token.balance;
|
state.amount = token.balance;
|
||||||
} else {
|
} else {
|
||||||
@ -571,7 +562,7 @@ export const updateFeeLevels = (): ThunkAction => {
|
|||||||
return (dispatch: Dispatch, getState: GetState): void => {
|
return (dispatch: Dispatch, getState: GetState): void => {
|
||||||
const accountState: AccountState = getState().abstractAccount;
|
const accountState: AccountState = getState().abstractAccount;
|
||||||
const currentState: State = getState().sendForm;
|
const currentState: State = getState().sendForm;
|
||||||
const isToken: boolean = currentState.token !== currentState.coinSymbol;
|
const isToken: boolean = currentState.selectedCurrency !== currentState.coinSymbol;
|
||||||
|
|
||||||
const feeLevels: Array<FeeLevel> = getFeeLevels(currentState.coinSymbol, currentState.recommendedGasPrice, currentState.gasLimit);
|
const feeLevels: Array<FeeLevel> = getFeeLevels(currentState.coinSymbol, currentState.recommendedGasPrice, currentState.gasLimit);
|
||||||
const selectedFeeLevel: ?FeeLevel = feeLevels.find(f => f.value === currentState.selectedFeeLevel.value);
|
const selectedFeeLevel: ?FeeLevel = feeLevels.find(f => f.value === currentState.selectedFeeLevel.value);
|
||||||
@ -590,7 +581,7 @@ export const updateFeeLevels = (): ThunkAction => {
|
|||||||
const account: ?Account = findAccount(getState().accounts, accountState.index, accountState.deviceState, accountState.network);
|
const account: ?Account = findAccount(getState().accounts, accountState.index, accountState.deviceState, accountState.network);
|
||||||
if (!account) return;
|
if (!account) return;
|
||||||
if (isToken) {
|
if (isToken) {
|
||||||
const token: ?Token = findToken(getState().tokens, account.address, state.token, accountState.deviceState);
|
const token: ?Token = findToken(getState().tokens, account.address, state.selectedCurrency, accountState.deviceState);
|
||||||
if (!token) return;
|
if (!token) return;
|
||||||
const tokenBalance: string = token.balance;
|
const tokenBalance: string = token.balance;
|
||||||
state.amount = tokenBalance;
|
state.amount = tokenBalance;
|
||||||
@ -612,7 +603,7 @@ export const onGasPriceChange = (gasPrice: string): ThunkAction => {
|
|||||||
return (dispatch: Dispatch, getState: GetState): void => {
|
return (dispatch: Dispatch, getState: GetState): void => {
|
||||||
const accountState: AccountState = getState().abstractAccount;
|
const accountState: AccountState = getState().abstractAccount;
|
||||||
const currentState: State = getState().sendForm;
|
const currentState: State = getState().sendForm;
|
||||||
const isToken: boolean = currentState.token !== accountState.network;
|
const isToken: boolean = currentState.selectedCurrency !== accountState.network;
|
||||||
|
|
||||||
const touched = { ...currentState.touched };
|
const touched = { ...currentState.touched };
|
||||||
touched.gasPrice = true;
|
touched.gasPrice = true;
|
||||||
@ -636,7 +627,7 @@ export const onGasPriceChange = (gasPrice: string): ThunkAction => {
|
|||||||
const account: ?Account = findAccount(getState().accounts, accountState.index, accountState.deviceState, accountState.network);
|
const account: ?Account = findAccount(getState().accounts, accountState.index, accountState.deviceState, accountState.network);
|
||||||
if (!account) return;
|
if (!account) return;
|
||||||
if (isToken) {
|
if (isToken) {
|
||||||
const token: ?Token = findToken(getState().tokens, account.address, state.token, accountState.deviceState);
|
const token: ?Token = findToken(getState().tokens, account.address, state.selectedCurrency, accountState.deviceState);
|
||||||
if (!token) return;
|
if (!token) return;
|
||||||
const tokenBalance: string = token.balance;
|
const tokenBalance: string = token.balance;
|
||||||
state.amount = tokenBalance;
|
state.amount = tokenBalance;
|
||||||
@ -660,7 +651,7 @@ export const onGasLimitChange = (gasLimit: string): ThunkAction => {
|
|||||||
return (dispatch: Dispatch, getState: GetState): void => {
|
return (dispatch: Dispatch, getState: GetState): void => {
|
||||||
const accountState: AccountState = getState().abstractAccount;
|
const accountState: AccountState = getState().abstractAccount;
|
||||||
const currentState: State = getState().sendForm;
|
const currentState: State = getState().sendForm;
|
||||||
const isToken: boolean = currentState.token !== currentState.coinSymbol;
|
const isToken: boolean = currentState.selectedCurrency !== currentState.coinSymbol;
|
||||||
|
|
||||||
const touched = { ...currentState.touched };
|
const touched = { ...currentState.touched };
|
||||||
touched.gasLimit = true;
|
touched.gasLimit = true;
|
||||||
@ -684,7 +675,7 @@ export const onGasLimitChange = (gasLimit: string): ThunkAction => {
|
|||||||
if (!account) return;
|
if (!account) return;
|
||||||
|
|
||||||
if (isToken) {
|
if (isToken) {
|
||||||
const token: ?Token = findToken(getState().tokens, account.address, state.token, accountState.deviceState);
|
const token: ?Token = findToken(getState().tokens, account.address, state.selectedCurrency, accountState.deviceState);
|
||||||
if (!token) return;
|
if (!token) return;
|
||||||
const tokenBalance: string = token.balance;
|
const tokenBalance: string = token.balance;
|
||||||
state.amount = tokenBalance;
|
state.amount = tokenBalance;
|
||||||
@ -735,7 +726,7 @@ export const onSend = (): AsyncAction => {
|
|||||||
const account: ?Account = findAccount(getState().accounts, accountState.index, accountState.deviceState, accountState.network);
|
const account: ?Account = findAccount(getState().accounts, accountState.index, accountState.deviceState, accountState.network);
|
||||||
if (!account || !web3instance) return;
|
if (!account || !web3instance) return;
|
||||||
|
|
||||||
const isToken: boolean = currentState.token !== currentState.coinSymbol;
|
const isToken: boolean = currentState.selectedCurrency !== currentState.coinSymbol;
|
||||||
const web3 = web3instance.web3;
|
const web3 = web3instance.web3;
|
||||||
|
|
||||||
const address_n = account.addressPath;
|
const address_n = account.addressPath;
|
||||||
@ -744,8 +735,7 @@ export const onSend = (): AsyncAction => {
|
|||||||
let txAmount: string = web3.toHex(web3.toWei(currentState.amount, 'ether'));
|
let txAmount: string = web3.toHex(web3.toWei(currentState.amount, 'ether'));
|
||||||
let txAddress: string = currentState.address;
|
let txAddress: string = currentState.address;
|
||||||
if (isToken) {
|
if (isToken) {
|
||||||
// const t = getState().tokens.find(t => t.ethAddress === account.address && t.symbol === currentState.token);
|
const token: ?Token = findToken(getState().tokens, account.address, currentState.selectedCurrency, accountState.deviceState);
|
||||||
const token: ?Token = findToken(getState().tokens, account.address, currentState.token, accountState.deviceState);
|
|
||||||
if (!token) return;
|
if (!token) return;
|
||||||
|
|
||||||
const contract = web3instance.erc20.at(token.address);
|
const contract = web3instance.erc20.at(token.address);
|
||||||
@ -842,7 +832,7 @@ export const onSend = (): AsyncAction => {
|
|||||||
dispatch({
|
dispatch({
|
||||||
type: SEND.TX_COMPLETE,
|
type: SEND.TX_COMPLETE,
|
||||||
account: account,
|
account: account,
|
||||||
token: currentState.token,
|
selectedCurrency: currentState.selectedCurrency,
|
||||||
amount: currentState.amount,
|
amount: currentState.amount,
|
||||||
txid,
|
txid,
|
||||||
txData,
|
txData,
|
||||||
|
@ -10,7 +10,7 @@ const Confirmation = (props: Props) => {
|
|||||||
address,
|
address,
|
||||||
network,
|
network,
|
||||||
coinSymbol,
|
coinSymbol,
|
||||||
token,
|
selectedCurrency,
|
||||||
total,
|
total,
|
||||||
selectedFeeLevel
|
selectedFeeLevel
|
||||||
} = props.sendForm;
|
} = props.sendForm;
|
||||||
@ -23,7 +23,7 @@ const Confirmation = (props: Props) => {
|
|||||||
</div>
|
</div>
|
||||||
<div className="content">
|
<div className="content">
|
||||||
<label>Send </label>
|
<label>Send </label>
|
||||||
<p>{ `${amount} ${ token }` }</p>
|
<p>{ `${amount} ${ selectedCurrency }` }</p>
|
||||||
<label>To</label>
|
<label>To</label>
|
||||||
<p>{ address }</p>
|
<p>{ address }</p>
|
||||||
<label>Fee</label>
|
<label>Fee</label>
|
||||||
|
@ -10,7 +10,8 @@ const AdvancedForm = (props: Props) => {
|
|||||||
|
|
||||||
const { network } = props.abstractAccount;
|
const { network } = props.abstractAccount;
|
||||||
const {
|
const {
|
||||||
token,
|
coinSymbol,
|
||||||
|
selectedCurrency,
|
||||||
gasPrice,
|
gasPrice,
|
||||||
gasLimit,
|
gasLimit,
|
||||||
data,
|
data,
|
||||||
@ -117,7 +118,8 @@ const AdvancedForm = (props: Props) => {
|
|||||||
<span className="what-is-it"></span>
|
<span className="what-is-it"></span>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</label>
|
</label>
|
||||||
<textarea disabled={ network !== token } value={ network !== token ? '' : data } onChange={ event => onDataChange(event.target.value) }></textarea>
|
<textarea value={ data } onChange={ event => onDataChange(event.target.value) }></textarea>
|
||||||
|
{/* <textarea disabled={ coinSymbol !== selectedCurrency } value={ coinSymbol !== selectedCurrency ? '' : data } onChange={ event => onDataChange(event.target.value) }></textarea> */}
|
||||||
{ errors.data ? (<span className="error">{ errors.data }</span>) : null }
|
{ errors.data ? (<span className="error">{ errors.data }</span>) : null }
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -5,44 +5,45 @@ import React from 'react';
|
|||||||
import ColorHash from 'color-hash';
|
import ColorHash from 'color-hash';
|
||||||
import ScaleText from 'react-scale-text';
|
import ScaleText from 'react-scale-text';
|
||||||
|
|
||||||
|
import { findAccountTokens } from '../../../reducers/TokensReducer';
|
||||||
|
|
||||||
import type { Props as ParentProps } from './index';
|
import type { Props as ParentProps } from './index';
|
||||||
import type { Coin } from '../../../reducers/LocalStorageReducer';
|
import type { Coin } from '../../../reducers/LocalStorageReducer';
|
||||||
import type { Account } from '../../../reducers/AccountsReducer';
|
import type { Account } from '../../../reducers/AccountsReducer';
|
||||||
|
import type { Token } from '../../../reducers/TokensReducer';
|
||||||
|
|
||||||
type Props = ParentProps & {
|
type Props = ParentProps & {
|
||||||
account: Account,
|
account: Account,
|
||||||
selectedCoin: Coin
|
selectedCoin: Coin
|
||||||
// account: any
|
}
|
||||||
|
|
||||||
|
type Style = {
|
||||||
|
+color: string,
|
||||||
|
+background: string,
|
||||||
|
+borderColor: string
|
||||||
}
|
}
|
||||||
|
|
||||||
const PendingTransactions = (props: Props) => {
|
const PendingTransactions = (props: Props) => {
|
||||||
|
|
||||||
|
const account = props.account;
|
||||||
const account = props.account; //props.accounts.find(a => a.deviceState === props.sendForm.deviceState && a.index === props.sendForm.accountIndex && a.network === props.sendForm.network);
|
|
||||||
const pending = props.pending.filter(p => p.network === account.network && p.address === account.address);
|
const pending = props.pending.filter(p => p.network === account.network && p.address === account.address);
|
||||||
|
|
||||||
if (pending.length < 1) return null;
|
if (pending.length < 1) return null;
|
||||||
|
|
||||||
const tokens = props.tokens.filter(t => t.ethAddress === account.address && t.network === account.network);
|
const tokens: Array<Token> = findAccountTokens(props.tokens, account);
|
||||||
|
|
||||||
const bgColor = new ColorHash({lightness: 0.7});
|
const bgColorFactory = new ColorHash({lightness: 0.7});
|
||||||
const textColor = new ColorHash();
|
const textColorFactory = new ColorHash();
|
||||||
|
|
||||||
const pendings = pending.map((tx, i) => {
|
const pendingTxs = pending.map((tx, i) => {
|
||||||
|
|
||||||
let iconColor, symbol, name;
|
let iconColor: Style;
|
||||||
|
let symbol: string;
|
||||||
if (tx.token !== props.selectedCoin.symbol) {
|
let name: string;
|
||||||
const token = tokens.find(t => t.symbol === tx.token);
|
const isSmartContractTx: boolean = tx.currency !== props.selectedCoin.symbol;
|
||||||
if (token) {
|
if (isSmartContractTx) {
|
||||||
iconColor = {
|
const token: ?Token = tokens.find(t => t.symbol === tx.currency);
|
||||||
color: textColor.hex(token.name),
|
if (!token) {
|
||||||
background: bgColor.hex(token.name),
|
|
||||||
borderColor: bgColor.hex(token.name)
|
|
||||||
}
|
|
||||||
symbol = token.symbol.toUpperCase();
|
|
||||||
name = token.name;
|
|
||||||
} else {
|
|
||||||
iconColor = {
|
iconColor = {
|
||||||
color: '#ffffff',
|
color: '#ffffff',
|
||||||
background: '#000000',
|
background: '#000000',
|
||||||
@ -50,12 +51,21 @@ const PendingTransactions = (props: Props) => {
|
|||||||
}
|
}
|
||||||
symbol = "Unknown";
|
symbol = "Unknown";
|
||||||
name = "Unknown";
|
name = "Unknown";
|
||||||
|
} else {
|
||||||
|
const bgColor: string = bgColorFactory.hex(token.name);
|
||||||
|
iconColor = {
|
||||||
|
color: textColorFactory.hex(token.name),
|
||||||
|
background: bgColor,
|
||||||
|
borderColor: bgColor
|
||||||
|
}
|
||||||
|
symbol = token.symbol.toUpperCase();
|
||||||
|
name = token.name;
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
iconColor = {
|
iconColor = {
|
||||||
color: textColor.hex(tx.network),
|
color: textColorFactory.hex(tx.network),
|
||||||
background: bgColor.hex(tx.network),
|
background: bgColorFactory.hex(tx.network),
|
||||||
borderColor: bgColor.hex(tx.network)
|
borderColor: bgColorFactory.hex(tx.network)
|
||||||
}
|
}
|
||||||
symbol = props.selectedCoin.symbol;
|
symbol = props.selectedCoin.symbol;
|
||||||
name = props.selectedCoin.name;
|
name = props.selectedCoin.name;
|
||||||
@ -80,7 +90,7 @@ const PendingTransactions = (props: Props) => {
|
|||||||
return (
|
return (
|
||||||
<div className="pending-transactions">
|
<div className="pending-transactions">
|
||||||
<h2>Pending transactions</h2>
|
<h2>Pending transactions</h2>
|
||||||
{ pendings }
|
{ pendingTxs }
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
@ -8,6 +8,7 @@ import PendingTransactions from './PendingTransactions';
|
|||||||
import { FeeSelectValue, FeeSelectOption } from './FeeSelect';
|
import { FeeSelectValue, FeeSelectOption } from './FeeSelect';
|
||||||
import { Notification } from '../../common/Notification';
|
import { Notification } from '../../common/Notification';
|
||||||
import AbstractAccount from '../account/AbstractAccount';
|
import AbstractAccount from '../account/AbstractAccount';
|
||||||
|
import { findAccountTokens } from '../../../reducers/TokensReducer';
|
||||||
|
|
||||||
import type { Props } from './index';
|
import type { Props } from './index';
|
||||||
import type { AccountState } from '../account/AbstractAccount';
|
import type { AccountState } from '../account/AbstractAccount';
|
||||||
@ -30,7 +31,7 @@ const _render = (props: Props, state: AccountState): React$Element<string> => {
|
|||||||
|
|
||||||
if (!device || !account || !discovery) return <section></section>;
|
if (!device || !account || !discovery) return <section></section>;
|
||||||
|
|
||||||
const addressTokens = props.tokens.filter(t => t.ethAddress === account.address);
|
const tokens = findAccountTokens(props.tokens, account);
|
||||||
const { network } = props.abstractAccount;
|
const { network } = props.abstractAccount;
|
||||||
|
|
||||||
const {
|
const {
|
||||||
@ -38,7 +39,7 @@ const _render = (props: Props, state: AccountState): React$Element<string> => {
|
|||||||
amount,
|
amount,
|
||||||
setMax,
|
setMax,
|
||||||
coinSymbol,
|
coinSymbol,
|
||||||
token,
|
selectedCurrency,
|
||||||
feeLevels,
|
feeLevels,
|
||||||
selectedFeeLevel,
|
selectedFeeLevel,
|
||||||
gasPriceNeedsUpdate,
|
gasPriceNeedsUpdate,
|
||||||
@ -63,10 +64,10 @@ const _render = (props: Props, state: AccountState): React$Element<string> => {
|
|||||||
const selectedCoin = props.abstractAccount.coin;
|
const selectedCoin = props.abstractAccount.coin;
|
||||||
const fiatRate = props.fiat.find(f => f.network === network);
|
const fiatRate = props.fiat.find(f => f.network === network);
|
||||||
|
|
||||||
const tokens = addressTokens.map(t => {
|
const tokensSelectData = tokens.map(t => {
|
||||||
return { value: t.symbol, label: t.symbol };
|
return { value: t.symbol, label: t.symbol };
|
||||||
});
|
});
|
||||||
tokens.unshift({ value: selectedCoin.symbol, label: selectedCoin.symbol });
|
tokensSelectData.unshift({ value: selectedCoin.symbol, label: selectedCoin.symbol });
|
||||||
|
|
||||||
const setMaxClassName: string = setMax ? 'set-max enabled' : 'set-max';
|
const setMaxClassName: string = setMax ? 'set-max enabled' : 'set-max';
|
||||||
|
|
||||||
@ -88,9 +89,9 @@ const _render = (props: Props, state: AccountState): React$Element<string> => {
|
|||||||
|
|
||||||
let buttonDisabled: boolean = Object.keys(errors).length > 0 || total === '0' || amount.length === 0 || address.length === 0 || sending;
|
let buttonDisabled: boolean = Object.keys(errors).length > 0 || total === '0' || amount.length === 0 || address.length === 0 || sending;
|
||||||
let buttonLabel: string = 'Send';
|
let buttonLabel: string = 'Send';
|
||||||
if (network !== token && amount.length > 0 && !errors.amount) {
|
if (coinSymbol !== selectedCurrency && amount.length > 0 && !errors.amount) {
|
||||||
buttonLabel += ` ${amount} ${ token.toUpperCase() }`
|
buttonLabel += ` ${amount} ${ selectedCurrency.toUpperCase() }`
|
||||||
} else if (network === token && total !== '0') {
|
} else if (coinSymbol === selectedCurrency && total !== '0') {
|
||||||
buttonLabel += ` ${total} ${ selectedCoin.symbol }`;
|
buttonLabel += ` ${total} ${ selectedCoin.symbol }`;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -155,10 +156,10 @@ const _render = (props: Props, state: AccountState): React$Element<string> => {
|
|||||||
searchable={ false }
|
searchable={ false }
|
||||||
clearable= { false }
|
clearable= { false }
|
||||||
multi={ false }
|
multi={ false }
|
||||||
value={ token }
|
value={ selectedCurrency }
|
||||||
disabled={ tokens.length < 2 }
|
disabled={ tokensSelectData.length < 2 }
|
||||||
onChange={ onCurrencyChange }
|
onChange={ onCurrencyChange }
|
||||||
options={ tokens } />
|
options={ tokensSelectData } />
|
||||||
</div>
|
</div>
|
||||||
{ errors.amount ? (<span className="error">{ errors.amount }</span>) : null }
|
{ errors.amount ? (<span className="error">{ errors.amount }</span>) : null }
|
||||||
{ warnings.amount ? (<span className="warning">{ warnings.amount }</span>) : null }
|
{ warnings.amount ? (<span className="warning">{ warnings.amount }</span>) : null }
|
||||||
|
@ -18,6 +18,7 @@ import type { TrezorDevice } from '../../../flowtype';
|
|||||||
import type { NetworkToken } from '../../../reducers/LocalStorageReducer';
|
import type { NetworkToken } from '../../../reducers/LocalStorageReducer';
|
||||||
import type { Account } from '../../../reducers/AccountsReducer';
|
import type { Account } from '../../../reducers/AccountsReducer';
|
||||||
import type { Discovery } from '../../../reducers/DiscoveryReducer';
|
import type { Discovery } from '../../../reducers/DiscoveryReducer';
|
||||||
|
import { findAccountTokens } from '../../../reducers/TokensReducer';
|
||||||
|
|
||||||
export default class Summary extends AbstractAccount<Props> {
|
export default class Summary extends AbstractAccount<Props> {
|
||||||
render() {
|
render() {
|
||||||
@ -36,7 +37,7 @@ const _render = (props: Props, state: AccountState): React$Element<string> => {
|
|||||||
if (!device || !account) return <section></section>;
|
if (!device || !account) return <section></section>;
|
||||||
|
|
||||||
const abstractAccount = props.abstractAccount;
|
const abstractAccount = props.abstractAccount;
|
||||||
const tokens = props.tokens.filter(t => t.ethAddress === account.address && t.network === account.network && t.deviceState === abstractAccount.deviceState);
|
const tokens = findAccountTokens(props.tokens, account);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
||||||
|
@ -6,11 +6,12 @@ import * as SEND from '../actions/constants/send';
|
|||||||
import * as WEB3 from '../actions/constants/web3';
|
import * as WEB3 from '../actions/constants/web3';
|
||||||
|
|
||||||
import type { Action } from '../flowtype';
|
import type { Action } from '../flowtype';
|
||||||
|
import type { SendTxAction } from '../actions/SendFormActions';
|
||||||
|
|
||||||
export type PendingTx = {
|
export type PendingTx = {
|
||||||
+id: string;
|
+id: string;
|
||||||
+network: string;
|
+network: string;
|
||||||
+token: string;
|
+currency: string;
|
||||||
+amount: string;
|
+amount: string;
|
||||||
+address: string;
|
+address: string;
|
||||||
}
|
}
|
||||||
@ -19,24 +20,20 @@ export type State = Array<PendingTx>;
|
|||||||
|
|
||||||
const initialState: State = [];
|
const initialState: State = [];
|
||||||
|
|
||||||
const add = (state: State, action: any) => {
|
const add = (state: State, action: SendTxAction): State => {
|
||||||
const newState = [ ...state ];
|
const newState = [ ...state ];
|
||||||
newState.push({
|
newState.push({
|
||||||
id: action.txid,
|
id: action.txid,
|
||||||
network: action.account.network,
|
network: action.account.network,
|
||||||
address: action.account.address,
|
currency: action.selectedCurrency,
|
||||||
token: action.token,
|
|
||||||
amount: action.amount,
|
amount: action.amount,
|
||||||
|
address: action.account.address,
|
||||||
});
|
});
|
||||||
return newState;
|
return newState;
|
||||||
}
|
}
|
||||||
|
|
||||||
const remove = (state: State, action: any) => {
|
const remove = (state: State, id: string): State => {
|
||||||
return state.filter(tx => tx.id !== action.tx.id);
|
return state.filter(tx => tx.id !== id);
|
||||||
}
|
|
||||||
|
|
||||||
const fromStorage = (state: State, action: any) => {
|
|
||||||
return state.filter(tx => tx.id !== action.tx.id);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function pending(state: State = initialState, action: Action): State {
|
export default function pending(state: State = initialState, action: Action): State {
|
||||||
@ -47,7 +44,7 @@ export default function pending(state: State = initialState, action: Action): St
|
|||||||
return add(state, action);
|
return add(state, action);
|
||||||
|
|
||||||
case PENDING.TX_RESOLVED :
|
case PENDING.TX_RESOLVED :
|
||||||
return remove(state, action);
|
return remove(state, action.tx.id);
|
||||||
|
|
||||||
case PENDING.FROM_STORAGE :
|
case PENDING.FROM_STORAGE :
|
||||||
return action.payload;
|
return action.payload;
|
||||||
|
@ -18,7 +18,7 @@ import type {
|
|||||||
export type State = {
|
export type State = {
|
||||||
+network: string;
|
+network: string;
|
||||||
+coinSymbol: string;
|
+coinSymbol: string;
|
||||||
token: string;
|
selectedCurrency: string;
|
||||||
balanceNeedUpdate: boolean;
|
balanceNeedUpdate: boolean;
|
||||||
|
|
||||||
// form fields
|
// form fields
|
||||||
@ -53,7 +53,7 @@ export type FeeLevel = {
|
|||||||
export const initialState: State = {
|
export const initialState: State = {
|
||||||
network: '',
|
network: '',
|
||||||
coinSymbol: '',
|
coinSymbol: '',
|
||||||
token: '',
|
selectedCurrency: '',
|
||||||
|
|
||||||
advanced: false,
|
advanced: false,
|
||||||
untouched: true,
|
untouched: true,
|
||||||
|
@ -5,6 +5,7 @@ import * as CONNECT from '../actions/constants/TrezorConnect';
|
|||||||
import * as TOKEN from '../actions/constants/token';
|
import * as TOKEN from '../actions/constants/token';
|
||||||
|
|
||||||
import type { Action, TrezorDevice } from '../flowtype';
|
import type { Action, TrezorDevice } from '../flowtype';
|
||||||
|
import type { Account } from './AccountsReducer';
|
||||||
|
|
||||||
export type Token = {
|
export type Token = {
|
||||||
loaded: boolean;
|
loaded: boolean;
|
||||||
@ -27,6 +28,10 @@ export const findToken = (state: Array<Token>, address: string, symbol: string,
|
|||||||
return state.find(t => t.ethAddress === address && t.symbol === symbol && t.deviceState === deviceState);
|
return state.find(t => t.ethAddress === address && t.symbol === symbol && t.deviceState === deviceState);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export const findAccountTokens = (state: Array<Token>, account: Account): Array<Token> => {
|
||||||
|
return state.filter(t => t.ethAddress === account.address && t.network === account.network && t.deviceState === account.deviceState);
|
||||||
|
}
|
||||||
|
|
||||||
// const setBalance = (state: State, payload: any): State => {
|
// const setBalance = (state: State, payload: any): State => {
|
||||||
// const newState: Array<Token> = [ ...state ];
|
// const newState: Array<Token> = [ ...state ];
|
||||||
// let index: number = state.findIndex(t => t.address === payload.address && t.ethAddress === payload.ethAddress);
|
// let index: number = state.findIndex(t => t.address === payload.address && t.ethAddress === payload.ethAddress);
|
||||||
|
@ -13,6 +13,7 @@ import * as SEND from '../actions/constants/send';
|
|||||||
import * as WEB3 from '../actions/constants/web3';
|
import * as WEB3 from '../actions/constants/web3';
|
||||||
import * as PENDING from '../actions/constants/pendingTx';
|
import * as PENDING from '../actions/constants/pendingTx';
|
||||||
import { LOCATION_CHANGE } from 'react-router-redux';
|
import { LOCATION_CHANGE } from 'react-router-redux';
|
||||||
|
import { findAccountTokens } from '../reducers/TokensReducer';
|
||||||
|
|
||||||
import type {
|
import type {
|
||||||
Middleware,
|
Middleware,
|
||||||
@ -44,7 +45,7 @@ const findAccounts = (devices: Array<TrezorDevice>, accounts: Array<Account>): A
|
|||||||
|
|
||||||
const findTokens = (accounts: Array<Account>, tokens: Array<Token>): Array<Token> => {
|
const findTokens = (accounts: Array<Account>, tokens: Array<Token>): Array<Token> => {
|
||||||
return accounts.reduce((arr, account) => {
|
return accounts.reduce((arr, account) => {
|
||||||
return arr.concat(tokens.filter(token => token.ethAddress === account.address && token.network === account.network));
|
return arr.concat(findAccountTokens(tokens, account));
|
||||||
}, []);
|
}, []);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user