move token address validator to separate helper, fetch tokens when visiting safe view

src/logic/tokens/utils/tokenHelpers.js

@@ -1,7 +1,8 @@
 // @flow
 import { List } from 'immutable'
-import logo from '~/assets/icons/icon_etherTokens.svg'
+import { getWeb3 } from '~/logic/wallets/getWeb3'
 import { makeToken, type Token } from '~/logic/tokens/store/model/token'
+import logo from '~/assets/icons/icon_etherTokens.svg'
 
 export const ETH_ADDRESS = '0x000'
 export const isEther = (symbol: string) => symbol === 'ETH'
@@ -31,3 +32,19 @@ export const calculateActiveErc20TokensFrom = (tokens: List<Token>) => {
 
   return activeTokens
 }
+
+export const isAddressAToken = async (tokenAddress: string) => {
+  // SECOND APPROACH:
+  // They both seem to work the same
+  // const tokenContract = await getStandardTokenContract()
+  // try {
+  //   await tokenContract.at(tokenAddress)
+  // } catch {
+  //   return 'Not a token address'
+  // }
+
+  const web3 = getWeb3()
+  const call = await web3.eth.call({ to: tokenAddress, data: web3.utils.sha3('totalSupply()') })
+
+  return call !== '0x'
+}

src/routes/safe/components/Balances/Tokens/screens/AddCustomToken/validators.js

@@ -3,7 +3,7 @@ import { List } from 'immutable'
 import { getWeb3 } from '~/logic/wallets/getWeb3'
 import { type Token } from '~/logic/tokens/store/model/token'
 import { sameAddress } from '~/logic/wallets/ethAddresses'
-// import { getStandardTokenContract } from '~/logic/tokens/store/actions/fetchTokens'
+import { isAddressAToken } from '~/logic/tokens/utils/tokenHelpers'
 
 export const simpleMemoize = (fn: Function) => {
   let lastArg
@@ -28,10 +28,9 @@ export const addressIsTokenContract = simpleMemoize(async (tokenAddress: string)
   //   return 'Not a token address'
   // }
 
-  const web3 = getWeb3()
-  const call = await web3.eth.call({ to: tokenAddress, data: web3.utils.sha3('totalSupply()') })
+  const isToken = await isAddressAToken(tokenAddress)
 
-  if (call === '0x') {
+  if (!isToken) {
     return 'Not a token address'
   }
 })

src/routes/safe/container/actions.js

@@ -3,17 +3,20 @@ import fetchSafe from '~/routes/safe/store/actions/fetchSafe'
 import fetchTokenBalances from '~/routes/safe/store/actions/fetchTokenBalances'
 import createTransaction from '~/routes/safe/store/actions/createTransaction'
 import fetchTransactions from '~/routes/safe/store/actions/fetchTransactions'
+import fetchTokens from '~/logic/tokens/store/actions/fetchTokens'
 
 export type Actions = {
   fetchSafe: typeof fetchSafe,
   fetchTokenBalances: typeof fetchTokenBalances,
   createTransaction: typeof createTransaction,
   fetchTransactions: typeof fetchTransactions,
+  fetchTokens: typeof fetchTokens,
 }
 
 export default {
   fetchSafe,
   fetchTokenBalances,
   createTransaction,
+  fetchTokens,
   fetchTransactions,
 }

src/routes/safe/container/index.jsx

@@ -16,11 +16,13 @@ const TIMEOUT = process.env.NODE_ENV === 'test' ? 1500 : 5000
 class SafeView extends React.Component<Props> {
   componentDidMount() {
     const {
-      fetchSafe, activeTokens, safeUrl, fetchTokenBalances,
+      fetchSafe, activeTokens, safeUrl, fetchTokenBalances, fetchTokens,
     } = this.props
 
     fetchSafe(safeUrl)
     fetchTokenBalances(safeUrl, activeTokens)
+    // fetch tokens there to get symbols for tokens in TXs list
+    fetchTokens()
 
     this.intervalId = setInterval(() => {
       this.checkForUpdates()

src/routes/safe/store/actions/fetchTransactions.js

@@ -11,6 +11,7 @@ import { buildTxServiceUrl, type TxServiceType } from '~/logic/safe/transactions
 import { getOwners } from '~/logic/safe/utils'
 import { EMPTY_DATA } from '~/logic/wallets/ethTransactions'
 import { addTransactions } from './addTransactions'
+import { addressIsTokenContract } from '../../components/Balances/Tokens/screens/AddCustomToken/validators'
 
 type ConfirmationServiceModel = {
   owner: string,
@@ -45,7 +46,8 @@ const buildTransactionFrom = async (safeAddress: string, tx: TxServiceModel, saf
       })
     }),
   )
-
+  const isToken = await addressIsTokenContract(tx.to)
+  console.log(isToken)
   return makeTransaction({
     name,
     nonce: tx.nonce,