activeTokens refactor (again)

src/routes/safe/container/selector.js

@@ -3,7 +3,8 @@ import { List, Map } from 'immutable'
 import { createSelector, createStructuredSelector, type Selector } from 'reselect'
 import {
   safeSelector,
-  safeTokensSelector,
+  safeActiveTokensSelector,
+  safeBalancesSelector,
   type RouterProps,
   type SafeSelectorProps,
 } from '~/routes/safe/store/selectors'
@@ -14,6 +15,7 @@ import { type GlobalState } from '~/store'
 import { sameAddress } from '~/logic/wallets/ethAddresses'
 import { orderedTokenListSelector, tokensSelector } from '~/logic/tokens/store/selectors'
 import { type Token } from '~/logic/tokens/store/model/token'
+import { type TokenBalance } from '~/routes/safe/store/models/tokenBalance'
 import { safeParamAddressSelector } from '../store/selectors'
 import { getEthAsToken } from '~/logic/tokens/utils/tokenHelpers'
 
@@ -65,16 +67,18 @@ const safeEthAsTokenSelector: Selector<GlobalState, RouterProps, ?Token> = creat
 )
 
 const extendedSafeTokensSelector: Selector<GlobalState, RouterProps, List<Token>> = createSelector(
-  safeTokensSelector,
+  safeActiveTokensSelector,
+  safeBalancesSelector,
   tokensSelector,
   safeEthAsTokenSelector,
-  (safeTokens: List<UserToken>, tokensList: Map<string, Token>, ethAsToken: Token) => {
+  (safeTokens: List<string>, balances: List<TokenBalance>, tokensList: Map<string, Token>, ethAsToken: Token) => {
     const extendedTokens = Map().withMutations((map) => {
-      safeTokens.forEach((token: { address: string, balance: string }) => {
+      safeTokens.forEach((tokenAddress: string) => {
-        const baseToken = tokensList.get(token.address)
+        const baseToken = tokensList.get(tokenAddress)
+        const tokenBalance = balances.find(tknBalance => tknBalance.address === tokenAddress) || '0'
 
         if (baseToken) {
-          map.set(token.address, baseToken.set('balance', token.balance))
+          map.set(tokenAddress, baseToken.set('balance', tokenBalance))
         }
       })
 

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

@@ -4,7 +4,7 @@ import { List } from 'immutable'
 import { BigNumber } from 'bignumber.js'
 import { type GlobalState } from '~/store/index'
 import { type Token } from '~/logic/tokens/store/model/token'
-import SafeTokenRecord from '~/routes/safe/store/models/safeToken'
+import TokenBalanceRecord from '~/routes/safe/store/models/tokenBalance'
 import { getStandardTokenContract } from '~/logic/tokens/store/actions/fetchTokens'
 import updateSafe from './updateSafe'
 import { ETH_ADDRESS } from '~/logic/tokens/utils/tokenHelpers'
@@ -38,7 +38,7 @@ const fetchTokenBalances = (safeAddress: string, tokens: List<Token>) => async (
     const withBalances = await Promise.all(
       tokens
         .filter(token => token.address !== ETH_ADDRESS)
-        .map(async token => SafeTokenRecord({
+        .map(async token => TokenBalanceRecord({
           address: token.address,
           balance: await calculateBalanceOf(token.address, safeAddress, token.decimals),
         })),

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

@@ -2,9 +2,7 @@
 import { List } from 'immutable'
 import type { Dispatch as ReduxDispatch, GetState } from 'redux'
 import { type GlobalState } from '~/store'
-import type { SafeToken } from '~/routes/safe/store/models/safeToken'
+import { safeActiveTokensSelector } from '~/routes/safe/store/selectors'
-import SafeTokenRecord from '~/routes/safe/store/models/safeToken'
-import { safeTokensSelector } from '~/routes/safe/store/selectors/index'
 import { SAFE_PARAM_ADDRESS } from '~/routes/routes'
 import updateSafe from './updateSafe'
 
@@ -22,19 +20,18 @@ const updateActiveTokens = (safeAddress: string, tokenAddress: string) => async
   dispatch: ReduxDispatch<GlobalState>,
   getState: GetState<GlobalState>,
 ) => {
-  const token: SafeToken = SafeTokenRecord({ address: tokenAddress })
   const state = getState()
-  const safeTokens: List<SafeToken> = safeTokensSelector(state, generateMatchProps(safeAddress))
+  const safeTokens: List<SafeToken> = safeActiveTokensSelector(state, generateMatchProps(safeAddress))
-  const index = safeTokens.findIndex(safeToken => safeToken.address === token.address)
+  const index = safeTokens.findIndex(safeToken => safeToken === tokenAddress)
 
   let updatedTokens
   if (index !== -1) {
     updatedTokens = safeTokens.delete(index)
   } else {
-    updatedTokens = safeTokens.push(token)
+    updatedTokens = safeTokens.push(tokenAddress)
   }
 
-  dispatch(updateSafe({ address: safeAddress, tokens: updatedTokens }))
+  dispatch(updateSafe({ address: safeAddress, activeTokens: updatedTokens }))
 }
 
 export default updateActiveTokens

src/routes/safe/store/models/safe.js

@@ -2,14 +2,15 @@
 import { List, Record } from 'immutable'
 import type { RecordFactory, RecordOf } from 'immutable'
 import type { Owner } from '~/routes/safe/store/models/owner'
-import type { SafeToken } from '~/routes/safe/store/models/safeToken'
+import TokenBalance from '~/routes/safe/store/models/tokenBalance'
 
 export type SafeProps = {
   name: string,
   address: string,
   threshold: number,
   owners: List<Owner>,
-  tokens?: List<SafeToken>,
+  balances?: List<TokenBalance>,
+  activeTokens?: List<string>,
   ethBalance?: string,
 }
 
@@ -19,11 +20,10 @@ const SafeRecord: RecordFactory<SafeProps> = Record({
   threshold: 0,
   ethBalance: 0,
   owners: List([]),
-  tokens: List([]),
+  activeTokens: List([]),
+  balances: List([]),
 })
 
-// Tokens is a list of currently enabled tokens for the safe with balances
-
 export type Safe = RecordOf<SafeProps>
 
 export default SafeRecord

src/routes/safe/store/models/safeToken.js

@@ -1,17 +0,0 @@
-// @flow
-import { Record } from 'immutable'
-import type { RecordFactory, RecordOf } from 'immutable'
-
-export type SafeTokenProps = {
-  address: string,
-  balance: string,
-}
-
-const SafeTokenRecord: RecordFactory<SafeTokenProps> = Record({
-  address: '',
-  balance: '0',
-})
-
-export type SafeToken = RecordOf<SafeTokenProps>
-
-export default SafeTokenRecord

src/routes/safe/store/models/tokenBalance.js

@@ -0,0 +1,17 @@
+// @flow
+import { Record } from 'immutable'
+import type { RecordFactory, RecordOf } from 'immutable'
+
+export type TokenBalanceProps = {
+  address: string,
+  balance: string,
+}
+
+const TokenBalanceRecord: RecordFactory<TokenBalanceProps> = Record({
+  address: '',
+  balance: '0',
+})
+
+export type TokenBalance = RecordOf<TokenBalanceProps>
+
+export default TokenBalanceRecord

src/routes/safe/store/selectors/index.js

@@ -78,20 +78,29 @@ export const safeSelector: Selector<GlobalState, RouterProps, SafeSelectorProps>
   },
 )
 
-export const safeTokensSelector: Selector<GlobalState, RouterProps, Map<string, string>> = createSelector(
+export const safeActiveTokensSelector: Selector<GlobalState, RouterProps, List<string>> = createSelector(
   safeSelector,
   (safe: Safe) => {
     if (!safe) {
-      return Map()
+      return List()
     }
 
-    const tokens = safe.get('tokens')
+    return safe.activeTokens
+  },
+)
 
-    return tokens
+export const safeBalancesSelector: Selector<GlobalState, RouterProps, Map<string, string>> = createSelector(
+  safeSelector,
+  (safe: Safe) => {
+    if (!safe) {
+      return List()
+    }
+
+    return safe.balances
   },
 )
 
 export default createStructuredSelector<Object, *>({
   safe: safeSelector,
-  tokens: safeTokensSelector,
+  tokens: safeActiveTokensSelector,
 })