ryanml
4 years ago
parent
f1403f4849
commit
1739ed9710
@ -0,0 +1,399 @@ |
|||||||
|
import { TRANSACTION_STATUSES } from '../../../shared/constants/transaction'; |
||||||
|
import * as actionConstants from '../../store/actionConstants'; |
||||||
|
import reduceMetamask, { |
||||||
|
getBlockGasLimit, |
||||||
|
getConversionRate, |
||||||
|
getNativeCurrency, |
||||||
|
getSendHexDataFeatureFlagState, |
||||||
|
getSendToAccounts, |
||||||
|
getUnapprovedTxs, |
||||||
|
} from './metamask'; |
||||||
|
|
||||||
|
describe('MetaMask Reducers', () => { |
||||||
|
const mockState = { |
||||||
|
metamask: reduceMetamask( |
||||||
|
{ |
||||||
|
isInitialized: true, |
||||||
|
isUnlocked: true, |
||||||
|
featureFlags: { sendHexData: true }, |
||||||
|
identities: { |
||||||
|
'0xfdea65c8e26263f6d9a1b5de9555d2931a33b825': { |
||||||
|
address: '0xfdea65c8e26263f6d9a1b5de9555d2931a33b825', |
||||||
|
name: 'Send Account 1', |
||||||
|
}, |
||||||
|
'0xc5b8dbac4c1d3f152cdeb400e2313f309c410acb': { |
||||||
|
address: '0xc5b8dbac4c1d3f152cdeb400e2313f309c410acb', |
||||||
|
name: 'Send Account 2', |
||||||
|
}, |
||||||
|
'0x2f8d4a878cfa04a6e60d46362f5644deab66572d': { |
||||||
|
address: '0x2f8d4a878cfa04a6e60d46362f5644deab66572d', |
||||||
|
name: 'Send Account 3', |
||||||
|
}, |
||||||
|
'0xd85a4b6a394794842887b8284293d69163007bbb': { |
||||||
|
address: '0xd85a4b6a394794842887b8284293d69163007bbb', |
||||||
|
name: 'Send Account 4', |
||||||
|
}, |
||||||
|
}, |
||||||
|
cachedBalances: {}, |
||||||
|
currentBlockGasLimit: '0x4c1878', |
||||||
|
conversionRate: 1200.88200327, |
||||||
|
nativeCurrency: 'ETH', |
||||||
|
network: '3', |
||||||
|
provider: { |
||||||
|
type: 'testnet', |
||||||
|
chainId: '0x3', |
||||||
|
}, |
||||||
|
accounts: { |
||||||
|
'0xfdea65c8e26263f6d9a1b5de9555d2931a33b825': { |
||||||
|
code: '0x', |
||||||
|
balance: '0x47c9d71831c76efe', |
||||||
|
nonce: '0x1b', |
||||||
|
address: '0xfdea65c8e26263f6d9a1b5de9555d2931a33b825', |
||||||
|
}, |
||||||
|
'0xc5b8dbac4c1d3f152cdeb400e2313f309c410acb': { |
||||||
|
code: '0x', |
||||||
|
balance: '0x37452b1315889f80', |
||||||
|
nonce: '0xa', |
||||||
|
address: '0xc5b8dbac4c1d3f152cdeb400e2313f309c410acb', |
||||||
|
}, |
||||||
|
'0x2f8d4a878cfa04a6e60d46362f5644deab66572d': { |
||||||
|
code: '0x', |
||||||
|
balance: '0x30c9d71831c76efe', |
||||||
|
nonce: '0x1c', |
||||||
|
address: '0x2f8d4a878cfa04a6e60d46362f5644deab66572d', |
||||||
|
}, |
||||||
|
'0xd85a4b6a394794842887b8284293d69163007bbb': { |
||||||
|
code: '0x', |
||||||
|
balance: '0x0', |
||||||
|
nonce: '0x0', |
||||||
|
address: '0xd85a4b6a394794842887b8284293d69163007bbb', |
||||||
|
}, |
||||||
|
}, |
||||||
|
addressBook: { |
||||||
|
'0x3': { |
||||||
|
'0x06195827297c7a80a443b6894d3bdb8824b43896': { |
||||||
|
address: '0x06195827297c7a80a443b6894d3bdb8824b43896', |
||||||
|
name: 'Address Book Account 1', |
||||||
|
chainId: '0x3', |
||||||
|
}, |
||||||
|
}, |
||||||
|
}, |
||||||
|
unapprovedTxs: { |
||||||
|
4768706228115573: { |
||||||
|
id: 4768706228115573, |
||||||
|
time: 1487363153561, |
||||||
|
status: TRANSACTION_STATUSES.UNAPPROVED, |
||||||
|
gasMultiplier: 1, |
||||||
|
metamaskNetworkId: '3', |
||||||
|
txParams: { |
||||||
|
from: '0xc5b8dbac4c1d3f152cdeb400e2313f309c410acb', |
||||||
|
to: '0x18a3462427bcc9133bb46e88bcbe39cd7ef0e761', |
||||||
|
value: '0xde0b6b3a7640000', |
||||||
|
metamaskId: 4768706228115573, |
||||||
|
metamaskNetworkId: '3', |
||||||
|
gas: '0x5209', |
||||||
|
}, |
||||||
|
txFee: '17e0186e60800', |
||||||
|
txValue: 'de0b6b3a7640000', |
||||||
|
maxCost: 'de234b52e4a0800', |
||||||
|
gasPrice: '4a817c800', |
||||||
|
}, |
||||||
|
}, |
||||||
|
}, |
||||||
|
{}, |
||||||
|
), |
||||||
|
}; |
||||||
|
it('init state', () => { |
||||||
|
const initState = reduceMetamask(undefined, {}); |
||||||
|
|
||||||
|
expect.anything(initState); |
||||||
|
}); |
||||||
|
|
||||||
|
it('locks MetaMask', () => { |
||||||
|
const unlockMetaMaskState = { |
||||||
|
isUnlocked: true, |
||||||
|
selectedAddress: 'test address', |
||||||
|
}; |
||||||
|
const lockMetaMask = reduceMetamask(unlockMetaMaskState, { |
||||||
|
type: actionConstants.LOCK_METAMASK, |
||||||
|
}); |
||||||
|
|
||||||
|
expect(lockMetaMask.isUnlocked).toStrictEqual(false); |
||||||
|
}); |
||||||
|
|
||||||
|
it('sets rpc target', () => { |
||||||
|
const state = reduceMetamask( |
||||||
|
{}, |
||||||
|
{ |
||||||
|
type: actionConstants.SET_RPC_TARGET, |
||||||
|
value: 'https://custom.rpc', |
||||||
|
}, |
||||||
|
); |
||||||
|
|
||||||
|
expect(state.provider.rpcUrl).toStrictEqual('https://custom.rpc'); |
||||||
|
}); |
||||||
|
|
||||||
|
it('sets provider type', () => { |
||||||
|
const state = reduceMetamask( |
||||||
|
{}, |
||||||
|
{ |
||||||
|
type: actionConstants.SET_PROVIDER_TYPE, |
||||||
|
value: 'provider type', |
||||||
|
}, |
||||||
|
); |
||||||
|
|
||||||
|
expect(state.provider.type).toStrictEqual('provider type'); |
||||||
|
}); |
||||||
|
|
||||||
|
it('shows account detail', () => { |
||||||
|
const state = reduceMetamask( |
||||||
|
{}, |
||||||
|
{ |
||||||
|
type: actionConstants.SHOW_ACCOUNT_DETAIL, |
||||||
|
}, |
||||||
|
); |
||||||
|
|
||||||
|
expect(state.isUnlocked).toStrictEqual(true); |
||||||
|
expect(state.isInitialized).toStrictEqual(true); |
||||||
|
}); |
||||||
|
|
||||||
|
it('sets account label', () => { |
||||||
|
const state = reduceMetamask( |
||||||
|
{}, |
||||||
|
{ |
||||||
|
type: actionConstants.SET_ACCOUNT_LABEL, |
||||||
|
value: { |
||||||
|
account: 'test account', |
||||||
|
label: 'test label', |
||||||
|
}, |
||||||
|
}, |
||||||
|
); |
||||||
|
|
||||||
|
expect(state.identities).toStrictEqual({ |
||||||
|
'test account': { name: 'test label' }, |
||||||
|
}); |
||||||
|
}); |
||||||
|
|
||||||
|
it('updates tokens', () => { |
||||||
|
const newTokens = { |
||||||
|
address: '0x617b3f8050a0bd94b6b1da02b4384ee5b4df13f4', |
||||||
|
decimals: 18, |
||||||
|
symbol: 'META', |
||||||
|
}; |
||||||
|
|
||||||
|
const state = reduceMetamask( |
||||||
|
{}, |
||||||
|
{ |
||||||
|
type: actionConstants.UPDATE_TOKENS, |
||||||
|
newTokens, |
||||||
|
}, |
||||||
|
); |
||||||
|
|
||||||
|
expect(state.tokens).toStrictEqual(newTokens); |
||||||
|
}); |
||||||
|
|
||||||
|
it('toggles account menu', () => { |
||||||
|
const state = reduceMetamask( |
||||||
|
{}, |
||||||
|
{ |
||||||
|
type: actionConstants.TOGGLE_ACCOUNT_MENU, |
||||||
|
}, |
||||||
|
); |
||||||
|
|
||||||
|
expect(state.isAccountMenuOpen).toStrictEqual(true); |
||||||
|
}); |
||||||
|
|
||||||
|
it('updates value of tx by id', () => { |
||||||
|
const oldState = { |
||||||
|
currentNetworkTxList: [ |
||||||
|
{ |
||||||
|
id: 1, |
||||||
|
txParams: 'foo', |
||||||
|
}, |
||||||
|
], |
||||||
|
}; |
||||||
|
|
||||||
|
const state = reduceMetamask(oldState, { |
||||||
|
type: actionConstants.UPDATE_TRANSACTION_PARAMS, |
||||||
|
id: 1, |
||||||
|
value: 'bar', |
||||||
|
}); |
||||||
|
|
||||||
|
expect(state.currentNetworkTxList[0].txParams).toStrictEqual('bar'); |
||||||
|
}); |
||||||
|
|
||||||
|
it('sets blockies', () => { |
||||||
|
const state = reduceMetamask( |
||||||
|
{}, |
||||||
|
{ |
||||||
|
type: actionConstants.SET_USE_BLOCKIE, |
||||||
|
value: true, |
||||||
|
}, |
||||||
|
); |
||||||
|
|
||||||
|
expect(state.useBlockie).toStrictEqual(true); |
||||||
|
}); |
||||||
|
|
||||||
|
it('updates an arbitrary feature flag', () => { |
||||||
|
const state = reduceMetamask( |
||||||
|
{}, |
||||||
|
{ |
||||||
|
type: actionConstants.UPDATE_FEATURE_FLAGS, |
||||||
|
value: { |
||||||
|
foo: true, |
||||||
|
}, |
||||||
|
}, |
||||||
|
); |
||||||
|
|
||||||
|
expect(state.featureFlags.foo).toStrictEqual(true); |
||||||
|
}); |
||||||
|
|
||||||
|
it('close welcome screen', () => { |
||||||
|
const state = reduceMetamask( |
||||||
|
{}, |
||||||
|
{ |
||||||
|
type: actionConstants.CLOSE_WELCOME_SCREEN, |
||||||
|
}, |
||||||
|
); |
||||||
|
|
||||||
|
expect(state.welcomeScreenSeen).toStrictEqual(true); |
||||||
|
}); |
||||||
|
|
||||||
|
it('sets current locale', () => { |
||||||
|
const state = reduceMetamask( |
||||||
|
{}, |
||||||
|
{ |
||||||
|
type: actionConstants.SET_CURRENT_LOCALE, |
||||||
|
value: { locale: 'ge' }, |
||||||
|
}, |
||||||
|
); |
||||||
|
|
||||||
|
expect(state.currentLocale).toStrictEqual('ge'); |
||||||
|
}); |
||||||
|
|
||||||
|
it('sets pending tokens', () => { |
||||||
|
const payload = { |
||||||
|
address: '0x617b3f8050a0bd94b6b1da02b4384ee5b4df13f4', |
||||||
|
decimals: 18, |
||||||
|
symbol: 'META', |
||||||
|
}; |
||||||
|
|
||||||
|
const pendingTokensState = reduceMetamask( |
||||||
|
{}, |
||||||
|
{ |
||||||
|
type: actionConstants.SET_PENDING_TOKENS, |
||||||
|
payload, |
||||||
|
}, |
||||||
|
); |
||||||
|
|
||||||
|
expect(pendingTokensState.pendingTokens).toStrictEqual(payload); |
||||||
|
}); |
||||||
|
|
||||||
|
it('clears pending tokens', () => { |
||||||
|
const payload = { |
||||||
|
address: '0x617b3f8050a0bd94b6b1da02b4384ee5b4df13f4', |
||||||
|
decimals: 18, |
||||||
|
symbol: 'META', |
||||||
|
}; |
||||||
|
|
||||||
|
const pendingTokensState = { |
||||||
|
pendingTokens: payload, |
||||||
|
}; |
||||||
|
|
||||||
|
const state = reduceMetamask(pendingTokensState, { |
||||||
|
type: actionConstants.CLEAR_PENDING_TOKENS, |
||||||
|
}); |
||||||
|
|
||||||
|
expect(state.pendingTokens).toStrictEqual({}); |
||||||
|
}); |
||||||
|
|
||||||
|
describe('metamask state selectors', () => { |
||||||
|
describe('getBlockGasLimit', () => { |
||||||
|
it('should return the current block gas limit', () => { |
||||||
|
expect(getBlockGasLimit(mockState)).toStrictEqual('0x4c1878'); |
||||||
|
}); |
||||||
|
}); |
||||||
|
|
||||||
|
describe('getConversionRate()', () => { |
||||||
|
it('should return the eth conversion rate', () => { |
||||||
|
expect(getConversionRate(mockState)).toStrictEqual(1200.88200327); |
||||||
|
}); |
||||||
|
}); |
||||||
|
|
||||||
|
describe('getNativeCurrency()', () => { |
||||||
|
it('should return the ticker symbol of the selected network', () => { |
||||||
|
expect(getNativeCurrency(mockState)).toStrictEqual('ETH'); |
||||||
|
}); |
||||||
|
}); |
||||||
|
|
||||||
|
describe('getSendHexDataFeatureFlagState()', () => { |
||||||
|
it('should return the sendHexData feature flag state', () => { |
||||||
|
expect(getSendHexDataFeatureFlagState(mockState)).toStrictEqual(true); |
||||||
|
}); |
||||||
|
}); |
||||||
|
|
||||||
|
describe('getSendToAccounts()', () => { |
||||||
|
it('should return an array including all the users accounts and the address book', () => { |
||||||
|
expect(getSendToAccounts(mockState)).toStrictEqual([ |
||||||
|
{ |
||||||
|
code: '0x', |
||||||
|
balance: '0x47c9d71831c76efe', |
||||||
|
nonce: '0x1b', |
||||||
|
address: '0xfdea65c8e26263f6d9a1b5de9555d2931a33b825', |
||||||
|
name: 'Send Account 1', |
||||||
|
}, |
||||||
|
{ |
||||||
|
code: '0x', |
||||||
|
balance: '0x37452b1315889f80', |
||||||
|
nonce: '0xa', |
||||||
|
address: '0xc5b8dbac4c1d3f152cdeb400e2313f309c410acb', |
||||||
|
name: 'Send Account 2', |
||||||
|
}, |
||||||
|
{ |
||||||
|
code: '0x', |
||||||
|
balance: '0x30c9d71831c76efe', |
||||||
|
nonce: '0x1c', |
||||||
|
address: '0x2f8d4a878cfa04a6e60d46362f5644deab66572d', |
||||||
|
name: 'Send Account 3', |
||||||
|
}, |
||||||
|
{ |
||||||
|
code: '0x', |
||||||
|
balance: '0x0', |
||||||
|
nonce: '0x0', |
||||||
|
address: '0xd85a4b6a394794842887b8284293d69163007bbb', |
||||||
|
name: 'Send Account 4', |
||||||
|
}, |
||||||
|
{ |
||||||
|
address: '0x06195827297c7a80a443b6894d3bdb8824b43896', |
||||||
|
name: 'Address Book Account 1', |
||||||
|
chainId: '0x3', |
||||||
|
}, |
||||||
|
]); |
||||||
|
}); |
||||||
|
}); |
||||||
|
|
||||||
|
it('should return the unapproved txs', () => { |
||||||
|
expect(getUnapprovedTxs(mockState)).toStrictEqual({ |
||||||
|
4768706228115573: { |
||||||
|
id: 4768706228115573, |
||||||
|
time: 1487363153561, |
||||||
|
status: TRANSACTION_STATUSES.UNAPPROVED, |
||||||
|
gasMultiplier: 1, |
||||||
|
metamaskNetworkId: '3', |
||||||
|
txParams: { |
||||||
|
from: '0xc5b8dbac4c1d3f152cdeb400e2313f309c410acb', |
||||||
|
to: '0x18a3462427bcc9133bb46e88bcbe39cd7ef0e761', |
||||||
|
value: '0xde0b6b3a7640000', |
||||||
|
metamaskId: 4768706228115573, |
||||||
|
metamaskNetworkId: '3', |
||||||
|
gas: '0x5209', |
||||||
|
}, |
||||||
|
txFee: '17e0186e60800', |
||||||
|
txValue: 'de0b6b3a7640000', |
||||||
|
maxCost: 'de234b52e4a0800', |
||||||
|
gasPrice: '4a817c800', |
||||||
|
}, |
||||||
|
}); |
||||||
|
}); |
||||||
|
}); |
||||||
|
}); |
||||||
@ -0,0 +1,382 @@ |
|||||||
|
import log from 'loglevel'; |
||||||
|
import { estimateGas } from '../../store/actions'; |
||||||
|
import { setCustomGasLimit } from '../gas/gas.duck'; |
||||||
|
import { |
||||||
|
estimateGasForSend, |
||||||
|
calcTokenBalance, |
||||||
|
} from '../../pages/send/send.utils'; |
||||||
|
|
||||||
|
// Actions
|
||||||
|
const OPEN_TO_DROPDOWN = 'metamask/send/OPEN_TO_DROPDOWN'; |
||||||
|
const CLOSE_TO_DROPDOWN = 'metamask/send/CLOSE_TO_DROPDOWN'; |
||||||
|
const UPDATE_SEND_ERRORS = 'metamask/send/UPDATE_SEND_ERRORS'; |
||||||
|
const RESET_SEND_STATE = 'metamask/send/RESET_SEND_STATE'; |
||||||
|
const SHOW_GAS_BUTTON_GROUP = 'metamask/send/SHOW_GAS_BUTTON_GROUP'; |
||||||
|
const HIDE_GAS_BUTTON_GROUP = 'metamask/send/HIDE_GAS_BUTTON_GROUP'; |
||||||
|
const UPDATE_GAS_LIMIT = 'UPDATE_GAS_LIMIT'; |
||||||
|
const UPDATE_GAS_PRICE = 'UPDATE_GAS_PRICE'; |
||||||
|
const UPDATE_GAS_TOTAL = 'UPDATE_GAS_TOTAL'; |
||||||
|
const UPDATE_SEND_HEX_DATA = 'UPDATE_SEND_HEX_DATA'; |
||||||
|
const UPDATE_SEND_TOKEN_BALANCE = 'UPDATE_SEND_TOKEN_BALANCE'; |
||||||
|
const UPDATE_SEND_TO = 'UPDATE_SEND_TO'; |
||||||
|
const UPDATE_SEND_AMOUNT = 'UPDATE_SEND_AMOUNT'; |
||||||
|
const UPDATE_MAX_MODE = 'UPDATE_MAX_MODE'; |
||||||
|
const UPDATE_SEND = 'UPDATE_SEND'; |
||||||
|
const UPDATE_SEND_TOKEN = 'UPDATE_SEND_TOKEN'; |
||||||
|
const CLEAR_SEND = 'CLEAR_SEND'; |
||||||
|
const GAS_LOADING_STARTED = 'GAS_LOADING_STARTED'; |
||||||
|
const GAS_LOADING_FINISHED = 'GAS_LOADING_FINISHED'; |
||||||
|
const UPDATE_SEND_ENS_RESOLUTION = 'UPDATE_SEND_ENS_RESOLUTION'; |
||||||
|
const UPDATE_SEND_ENS_RESOLUTION_ERROR = 'UPDATE_SEND_ENS_RESOLUTION_ERROR'; |
||||||
|
|
||||||
|
const initState = { |
||||||
|
toDropdownOpen: false, |
||||||
|
gasButtonGroupShown: true, |
||||||
|
errors: {}, |
||||||
|
gasLimit: null, |
||||||
|
gasPrice: null, |
||||||
|
gasTotal: null, |
||||||
|
tokenBalance: '0x0', |
||||||
|
from: '', |
||||||
|
to: '', |
||||||
|
amount: '0', |
||||||
|
memo: '', |
||||||
|
maxModeOn: false, |
||||||
|
editingTransactionId: null, |
||||||
|
toNickname: '', |
||||||
|
ensResolution: null, |
||||||
|
ensResolutionError: '', |
||||||
|
gasIsLoading: false, |
||||||
|
}; |
||||||
|
|
||||||
|
// Reducer
|
||||||
|
export default function reducer(state = initState, action) { |
||||||
|
switch (action.type) { |
||||||
|
case OPEN_TO_DROPDOWN: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
toDropdownOpen: true, |
||||||
|
}; |
||||||
|
case CLOSE_TO_DROPDOWN: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
toDropdownOpen: false, |
||||||
|
}; |
||||||
|
case UPDATE_SEND_ERRORS: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
errors: { |
||||||
|
...state.errors, |
||||||
|
...action.value, |
||||||
|
}, |
||||||
|
}; |
||||||
|
case SHOW_GAS_BUTTON_GROUP: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
gasButtonGroupShown: true, |
||||||
|
}; |
||||||
|
case HIDE_GAS_BUTTON_GROUP: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
gasButtonGroupShown: false, |
||||||
|
}; |
||||||
|
case UPDATE_GAS_LIMIT: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
gasLimit: action.value, |
||||||
|
}; |
||||||
|
case UPDATE_GAS_PRICE: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
gasPrice: action.value, |
||||||
|
}; |
||||||
|
case RESET_SEND_STATE: |
||||||
|
return { ...initState }; |
||||||
|
case UPDATE_GAS_TOTAL: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
gasTotal: action.value, |
||||||
|
}; |
||||||
|
case UPDATE_SEND_TOKEN_BALANCE: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
tokenBalance: action.value, |
||||||
|
}; |
||||||
|
case UPDATE_SEND_HEX_DATA: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
data: action.value, |
||||||
|
}; |
||||||
|
case UPDATE_SEND_TO: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
to: action.value.to, |
||||||
|
toNickname: action.value.nickname, |
||||||
|
}; |
||||||
|
case UPDATE_SEND_AMOUNT: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
amount: action.value, |
||||||
|
}; |
||||||
|
case UPDATE_MAX_MODE: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
maxModeOn: action.value, |
||||||
|
}; |
||||||
|
case UPDATE_SEND: |
||||||
|
return Object.assign(state, action.value); |
||||||
|
case UPDATE_SEND_TOKEN: { |
||||||
|
const newSend = { |
||||||
|
...state, |
||||||
|
token: action.value, |
||||||
|
}; |
||||||
|
// erase token-related state when switching back to native currency
|
||||||
|
if (newSend.editingTransactionId && !newSend.token) { |
||||||
|
const unapprovedTx = |
||||||
|
newSend?.unapprovedTxs?.[newSend.editingTransactionId] || {}; |
||||||
|
const txParams = unapprovedTx.txParams || {}; |
||||||
|
Object.assign(newSend, { |
||||||
|
tokenBalance: null, |
||||||
|
balance: '0', |
||||||
|
from: unapprovedTx.from || '', |
||||||
|
unapprovedTxs: { |
||||||
|
...newSend.unapprovedTxs, |
||||||
|
[newSend.editingTransactionId]: { |
||||||
|
...unapprovedTx, |
||||||
|
txParams: { |
||||||
|
...txParams, |
||||||
|
data: '', |
||||||
|
}, |
||||||
|
}, |
||||||
|
}, |
||||||
|
}); |
||||||
|
} |
||||||
|
return Object.assign(state, newSend); |
||||||
|
} |
||||||
|
case UPDATE_SEND_ENS_RESOLUTION: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
ensResolution: action.payload, |
||||||
|
ensResolutionError: '', |
||||||
|
}; |
||||||
|
case UPDATE_SEND_ENS_RESOLUTION_ERROR: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
ensResolution: null, |
||||||
|
ensResolutionError: action.payload, |
||||||
|
}; |
||||||
|
case CLEAR_SEND: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
gasLimit: null, |
||||||
|
gasPrice: null, |
||||||
|
gasTotal: null, |
||||||
|
tokenBalance: null, |
||||||
|
from: '', |
||||||
|
to: '', |
||||||
|
amount: '0x0', |
||||||
|
memo: '', |
||||||
|
errors: {}, |
||||||
|
maxModeOn: false, |
||||||
|
editingTransactionId: null, |
||||||
|
toNickname: '', |
||||||
|
}; |
||||||
|
case GAS_LOADING_STARTED: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
gasIsLoading: true, |
||||||
|
}; |
||||||
|
|
||||||
|
case GAS_LOADING_FINISHED: |
||||||
|
return { |
||||||
|
...state, |
||||||
|
gasIsLoading: false, |
||||||
|
}; |
||||||
|
default: |
||||||
|
return state; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
// Action Creators
|
||||||
|
export function openToDropdown() { |
||||||
|
return { type: OPEN_TO_DROPDOWN }; |
||||||
|
} |
||||||
|
|
||||||
|
export function closeToDropdown() { |
||||||
|
return { type: CLOSE_TO_DROPDOWN }; |
||||||
|
} |
||||||
|
|
||||||
|
export function showGasButtonGroup() { |
||||||
|
return { type: SHOW_GAS_BUTTON_GROUP }; |
||||||
|
} |
||||||
|
|
||||||
|
export function hideGasButtonGroup() { |
||||||
|
return { type: HIDE_GAS_BUTTON_GROUP }; |
||||||
|
} |
||||||
|
|
||||||
|
export function updateSendErrors(errorObject) { |
||||||
|
return { |
||||||
|
type: UPDATE_SEND_ERRORS, |
||||||
|
value: errorObject, |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
export function resetSendState() { |
||||||
|
return { type: RESET_SEND_STATE }; |
||||||
|
} |
||||||
|
|
||||||
|
export function setGasLimit(gasLimit) { |
||||||
|
return { |
||||||
|
type: UPDATE_GAS_LIMIT, |
||||||
|
value: gasLimit, |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
export function setGasPrice(gasPrice) { |
||||||
|
return { |
||||||
|
type: UPDATE_GAS_PRICE, |
||||||
|
value: gasPrice, |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
export function setGasTotal(gasTotal) { |
||||||
|
return { |
||||||
|
type: UPDATE_GAS_TOTAL, |
||||||
|
value: gasTotal, |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
export function updateGasData({ |
||||||
|
gasPrice, |
||||||
|
blockGasLimit, |
||||||
|
selectedAddress, |
||||||
|
sendToken, |
||||||
|
to, |
||||||
|
value, |
||||||
|
data, |
||||||
|
}) { |
||||||
|
return (dispatch) => { |
||||||
|
dispatch(gasLoadingStarted()); |
||||||
|
return estimateGasForSend({ |
||||||
|
estimateGasMethod: estimateGas, |
||||||
|
blockGasLimit, |
||||||
|
selectedAddress, |
||||||
|
sendToken, |
||||||
|
to, |
||||||
|
value, |
||||||
|
estimateGasPrice: gasPrice, |
||||||
|
data, |
||||||
|
}) |
||||||
|
.then((gas) => { |
||||||
|
dispatch(setGasLimit(gas)); |
||||||
|
dispatch(setCustomGasLimit(gas)); |
||||||
|
dispatch(updateSendErrors({ gasLoadingError: null })); |
||||||
|
dispatch(gasLoadingFinished()); |
||||||
|
}) |
||||||
|
.catch((err) => { |
||||||
|
log.error(err); |
||||||
|
dispatch(updateSendErrors({ gasLoadingError: 'gasLoadingError' })); |
||||||
|
dispatch(gasLoadingFinished()); |
||||||
|
}); |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
export function gasLoadingStarted() { |
||||||
|
return { |
||||||
|
type: GAS_LOADING_STARTED, |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
export function gasLoadingFinished() { |
||||||
|
return { |
||||||
|
type: GAS_LOADING_FINISHED, |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
export function updateSendTokenBalance({ sendToken, tokenContract, address }) { |
||||||
|
return (dispatch) => { |
||||||
|
const tokenBalancePromise = tokenContract |
||||||
|
? tokenContract.balanceOf(address) |
||||||
|
: Promise.resolve(); |
||||||
|
return tokenBalancePromise |
||||||
|
.then((usersToken) => { |
||||||
|
if (usersToken) { |
||||||
|
const newTokenBalance = calcTokenBalance({ sendToken, usersToken }); |
||||||
|
dispatch(setSendTokenBalance(newTokenBalance)); |
||||||
|
} |
||||||
|
}) |
||||||
|
.catch((err) => { |
||||||
|
log.error(err); |
||||||
|
updateSendErrors({ tokenBalance: 'tokenBalanceError' }); |
||||||
|
}); |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
export function setSendTokenBalance(tokenBalance) { |
||||||
|
return { |
||||||
|
type: UPDATE_SEND_TOKEN_BALANCE, |
||||||
|
value: tokenBalance, |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
export function updateSendHexData(value) { |
||||||
|
return { |
||||||
|
type: UPDATE_SEND_HEX_DATA, |
||||||
|
value, |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
export function updateSendTo(to, nickname = '') { |
||||||
|
return { |
||||||
|
type: UPDATE_SEND_TO, |
||||||
|
value: { to, nickname }, |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
export function updateSendAmount(amount) { |
||||||
|
return { |
||||||
|
type: UPDATE_SEND_AMOUNT, |
||||||
|
value: amount, |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
export function setMaxModeTo(bool) { |
||||||
|
return { |
||||||
|
type: UPDATE_MAX_MODE, |
||||||
|
value: bool, |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
export function updateSend(newSend) { |
||||||
|
return { |
||||||
|
type: UPDATE_SEND, |
||||||
|
value: newSend, |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
export function updateSendToken(token) { |
||||||
|
return { |
||||||
|
type: UPDATE_SEND_TOKEN, |
||||||
|
value: token, |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
export function clearSend() { |
||||||
|
return { |
||||||
|
type: CLEAR_SEND, |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
export function updateSendEnsResolution(ensResolution) { |
||||||
|
return { |
||||||
|
type: UPDATE_SEND_ENS_RESOLUTION, |
||||||
|
payload: ensResolution, |
||||||
|
}; |
||||||
|
} |
||||||
|
|
||||||
|
export function updateSendEnsResolutionError(errorMessage) { |
||||||
|
return { |
||||||
|
type: UPDATE_SEND_ENS_RESOLUTION_ERROR, |
||||||
|
payload: errorMessage, |
||||||
|
}; |
||||||
|
} |
||||||
@ -1,9 +0,0 @@ |
|||||||
// Jest Snapshot v1, https://goo.gl/fbAQLP |
|
||||||
|
|
||||||
exports[`IntroPopup renders the component with initial props 1`] = ` |
|
||||||
<div> |
|
||||||
<div |
|
||||||
class="intro-popup" |
|
||||||
/> |
|
||||||
</div> |
|
||||||
`; |
|
||||||
@ -1 +0,0 @@ |
|||||||
export { default } from './intro-popup'; |
|
||||||
@ -1,71 +0,0 @@ |
|||||||
.intro-popup { |
|
||||||
&__liquidity-sources-label { |
|
||||||
@include H7; |
|
||||||
|
|
||||||
font-weight: bold; |
|
||||||
margin-bottom: 6px; |
|
||||||
color: $Black-100; |
|
||||||
|
|
||||||
@media screen and (min-width: 576px) { |
|
||||||
@include H6; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
&__learn-more-header { |
|
||||||
@include H4; |
|
||||||
|
|
||||||
font-weight: bold; |
|
||||||
margin-bottom: 12px; |
|
||||||
margin-top: 16px; |
|
||||||
} |
|
||||||
|
|
||||||
&__learn-more-link { |
|
||||||
@include H6; |
|
||||||
|
|
||||||
color: $Blue-500; |
|
||||||
margin-bottom: 8px; |
|
||||||
cursor: pointer; |
|
||||||
} |
|
||||||
|
|
||||||
&__content { |
|
||||||
margin-left: 24px; |
|
||||||
|
|
||||||
> img { |
|
||||||
width: 96%; |
|
||||||
margin-left: -9px; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
&__footer { |
|
||||||
border-top: none; |
|
||||||
} |
|
||||||
|
|
||||||
&__button { |
|
||||||
border-radius: 100px; |
|
||||||
height: 44px; |
|
||||||
} |
|
||||||
|
|
||||||
&__source-logo-container { |
|
||||||
width: 276px; |
|
||||||
display: flex; |
|
||||||
justify-content: center; |
|
||||||
align-items: center; |
|
||||||
padding: 20px 16px; |
|
||||||
background: $Grey-000; |
|
||||||
border-radius: 8px; |
|
||||||
|
|
||||||
@media screen and (min-width: 576px) { |
|
||||||
width: 412px; |
|
||||||
|
|
||||||
img { |
|
||||||
width: 364px; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
&__popover { |
|
||||||
@media screen and (min-width: 576px) { |
|
||||||
width: 460px; |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
@ -1,108 +0,0 @@ |
|||||||
import React, { useContext } from 'react'; |
|
||||||
import { useDispatch, useSelector } from 'react-redux'; |
|
||||||
import { useHistory } from 'react-router-dom'; |
|
||||||
import PropTypes from 'prop-types'; |
|
||||||
import { setSwapsFromToken } from '../../../ducks/swaps/swaps'; |
|
||||||
import { I18nContext } from '../../../contexts/i18n'; |
|
||||||
import { BUILD_QUOTE_ROUTE } from '../../../helpers/constants/routes'; |
|
||||||
import { useNewMetricEvent } from '../../../hooks/useMetricEvent'; |
|
||||||
import { getSwapsDefaultToken } from '../../../selectors'; |
|
||||||
import Button from '../../../components/ui/button'; |
|
||||||
import Popover from '../../../components/ui/popover'; |
|
||||||
|
|
||||||
export default function IntroPopup({ onClose }) { |
|
||||||
const dispatch = useDispatch(useDispatch); |
|
||||||
const history = useHistory(); |
|
||||||
const t = useContext(I18nContext); |
|
||||||
|
|
||||||
const swapsDefaultToken = useSelector(getSwapsDefaultToken); |
|
||||||
const enteredSwapsEvent = useNewMetricEvent({ |
|
||||||
event: 'Swaps Opened', |
|
||||||
properties: { |
|
||||||
source: 'Intro popup', |
|
||||||
active_currency: swapsDefaultToken.symbol, |
|
||||||
}, |
|
||||||
category: 'swaps', |
|
||||||
}); |
|
||||||
const blogPostVisitedEvent = useNewMetricEvent({ |
|
||||||
event: 'Blog Post Visited ', |
|
||||||
category: 'swaps', |
|
||||||
}); |
|
||||||
const contractAuditVisitedEvent = useNewMetricEvent({ |
|
||||||
event: 'Contract Audit Visited', |
|
||||||
category: 'swaps', |
|
||||||
}); |
|
||||||
const productOverviewDismissedEvent = useNewMetricEvent({ |
|
||||||
event: 'Product Overview Dismissed', |
|
||||||
category: 'swaps', |
|
||||||
}); |
|
||||||
|
|
||||||
return ( |
|
||||||
<div className="intro-popup"> |
|
||||||
<Popover |
|
||||||
className="intro-popup__popover" |
|
||||||
title={t('swapIntroPopupTitle')} |
|
||||||
subtitle={t('swapIntroPopupSubTitle')} |
|
||||||
onClose={() => { |
|
||||||
productOverviewDismissedEvent(); |
|
||||||
onClose(); |
|
||||||
}} |
|
||||||
footerClassName="intro-popup__footer" |
|
||||||
footer={ |
|
||||||
<Button |
|
||||||
type="confirm" |
|
||||||
className="intro-popup__button" |
|
||||||
onClick={() => { |
|
||||||
onClose(); |
|
||||||
enteredSwapsEvent(); |
|
||||||
dispatch(setSwapsFromToken(swapsDefaultToken)); |
|
||||||
history.push(BUILD_QUOTE_ROUTE); |
|
||||||
}} |
|
||||||
> |
|
||||||
{t('swapStartSwapping')} |
|
||||||
</Button> |
|
||||||
} |
|
||||||
> |
|
||||||
<div className="intro-popup__content"> |
|
||||||
<div className="intro-popup__liquidity-sources-label"> |
|
||||||
{t('swapIntroLiquiditySourcesLabel')} |
|
||||||
</div> |
|
||||||
<div className="intro-popup__source-logo-container"> |
|
||||||
<img src="images/source-logos-all.svg" alt="" /> |
|
||||||
</div> |
|
||||||
<div className="intro-popup__learn-more-header"> |
|
||||||
{t('swapIntroLearnMoreHeader')} |
|
||||||
</div> |
|
||||||
<div |
|
||||||
className="intro-popup__learn-more-link" |
|
||||||
onClick={() => { |
|
||||||
global.platform.openTab({ |
|
||||||
url: |
|
||||||
'https://medium.com/metamask/introducing-metamask-swaps-84318c643785', |
|
||||||
}); |
|
||||||
blogPostVisitedEvent(); |
|
||||||
}} |
|
||||||
> |
|
||||||
{t('swapIntroLearnMoreLink')} |
|
||||||
</div> |
|
||||||
<div |
|
||||||
className="intro-popup__learn-more-link" |
|
||||||
onClick={() => { |
|
||||||
global.platform.openTab({ |
|
||||||
url: |
|
||||||
'https://diligence.consensys.net/audits/private/lsjipyllnw2/', |
|
||||||
}); |
|
||||||
contractAuditVisitedEvent(); |
|
||||||
}} |
|
||||||
> |
|
||||||
{t('swapLearnMoreContractsAuditReview')} |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
</Popover> |
|
||||||
</div> |
|
||||||
); |
|
||||||
} |
|
||||||
|
|
||||||
IntroPopup.propTypes = { |
|
||||||
onClose: PropTypes.func.isRequired, |
|
||||||
}; |
|
||||||
@ -1,24 +0,0 @@ |
|||||||
import React from 'react'; |
|
||||||
import configureMockStore from 'redux-mock-store'; |
|
||||||
|
|
||||||
import { |
|
||||||
renderWithProvider, |
|
||||||
createSwapsMockStore, |
|
||||||
} from '../../../../test/jest'; |
|
||||||
import IntroPopup from '.'; |
|
||||||
|
|
||||||
const createProps = (customProps = {}) => { |
|
||||||
return { |
|
||||||
onClose: jest.fn(), |
|
||||||
...customProps, |
|
||||||
}; |
|
||||||
}; |
|
||||||
|
|
||||||
describe('IntroPopup', () => { |
|
||||||
it('renders the component with initial props', () => { |
|
||||||
const store = configureMockStore()(createSwapsMockStore()); |
|
||||||
const props = createProps(); |
|
||||||
const { container } = renderWithProvider(<IntroPopup {...props} />, store); |
|
||||||
expect(container).toMatchSnapshot(); |
|
||||||
}); |
|
||||||
}); |
|
||||||
Loading…
Reference in new issue