From 6467a1a0d6904e959a1d8752e75ab2964c469e79 Mon Sep 17 00:00:00 2001
From: apanizo <adolfo.panizo@gmail.com>
Date: Thu, 5 Jul 2018 16:01:50 +0200
Subject: [PATCH] WA-232 Created safeHelper test class for fetching safe from
 store

---
 .../safe/component/Safe/BalanceInfo.jsx       | 78 ++++++++++---------
 src/routes/safe/container/index.jsx           |  4 +-
 src/test/safe.redux.owners.test.js            | 14 +---
 src/test/utils/safeHelper.js                  | 14 ++++
 4 files changed, 60 insertions(+), 50 deletions(-)
 create mode 100644 src/test/utils/safeHelper.js

diff --git a/src/routes/safe/component/Safe/BalanceInfo.jsx b/src/routes/safe/component/Safe/BalanceInfo.jsx
index 961a964c..dc46ac49 100644
--- a/src/routes/safe/component/Safe/BalanceInfo.jsx
+++ b/src/routes/safe/component/Safe/BalanceInfo.jsx
@@ -34,43 +34,47 @@ export const MOVE_FUNDS_BUTTON_TEXT = 'Move'
 
 const BalanceComponent = openHoc(({
   open, toggle, balances, classes, onMoveFunds,
-}: Props) => (
-  <React.Fragment>
-    <ListItem onClick={toggle}>
-      <Avatar>
-        <AccountBalance />
-      </Avatar>
-      <ListItemText primary="Balance" secondary="List of different token balances" />
-      <ListItemIcon>
-        {open
-          ? <IconButton disableRipple><ExpandLess /></IconButton>
-          : <IconButton disabled={balances.count() === 0} disableRipple><ExpandMore /></IconButton>
-        }
-      </ListItemIcon>
-    </ListItem>
-    <Collapse in={open} timeout="auto">
-      <List component="div" disablePadding>
-        {balances.valueSeq().map((balance: Balance) => {
-          const symbol = balance.get('symbol')
-          const name = balance.get('name')
-          const disabled = Number(balance.get('funds')) === 0
-          const onMoveFundsClick = () => onMoveFunds(balance)
+}: Props) => {
+  const hasBalances = balances.count() > 0
 
-          return (
-            <ListItem key={symbol} className={classNames(classes.nested, symbol)}>
-              <ListItemIcon>
-                <Img src={balance.get('logoUrl')} height={30} alt={name} />
-              </ListItemIcon>
-              <ListItemText primary={name} secondary={`${balance.get('funds')} ${symbol}`} />
-              <Button variant="raised" color="primary" onClick={onMoveFundsClick} disabled={disabled}>
-                {MOVE_FUNDS_BUTTON_TEXT}
-              </Button>
-            </ListItem>
-          )
-        })}
-      </List>
-    </Collapse>
-  </React.Fragment>
-))
+  return (
+    <React.Fragment>
+      <ListItem onClick={hasBalances ? toggle : undefined}>
+        <Avatar>
+          <AccountBalance />
+        </Avatar>
+        <ListItemText primary="Balance" secondary="List of different token balances" />
+        <ListItemIcon>
+          {open
+            ? <IconButton disableRipple><ExpandLess /></IconButton>
+            : <IconButton disabled={!hasBalances} disableRipple><ExpandMore /></IconButton>
+          }
+        </ListItemIcon>
+      </ListItem>
+      <Collapse in={open} timeout="auto">
+        <List component="div" disablePadding>
+          {balances.valueSeq().map((balance: Balance) => {
+            const symbol = balance.get('symbol')
+            const name = balance.get('name')
+            const disabled = Number(balance.get('funds')) === 0
+            const onMoveFundsClick = () => onMoveFunds(balance)
+
+            return (
+              <ListItem key={symbol} className={classNames(classes.nested, symbol)}>
+                <ListItemIcon>
+                  <Img src={balance.get('logoUrl')} height={30} alt={name} />
+                </ListItemIcon>
+                <ListItemText primary={name} secondary={`${balance.get('funds')} ${symbol}`} />
+                <Button variant="raised" color="primary" onClick={onMoveFundsClick} disabled={disabled}>
+                  {MOVE_FUNDS_BUTTON_TEXT}
+                </Button>
+              </ListItem>
+            )
+          })}
+        </List>
+      </Collapse>
+    </React.Fragment>
+  )
+})
 
 export default withStyles(styles)(BalanceComponent)
diff --git a/src/routes/safe/container/index.jsx b/src/routes/safe/container/index.jsx
index 5d719293..2b1c9d0d 100644
--- a/src/routes/safe/container/index.jsx
+++ b/src/routes/safe/container/index.jsx
@@ -11,6 +11,8 @@ type Props = Actions & SelectorProps & {
   granted: boolean,
 }
 
+const TIMEOUT = process.env.NODE_ENV === 'test' ? 1500 : 15000
+
 class SafeView extends React.PureComponent<Props> {
   componentDidMount() {
     this.intervalId = setInterval(() => {
@@ -21,7 +23,7 @@ class SafeView extends React.PureComponent<Props> {
       const safeAddress = safe.get('address')
       fetchBalances(safeAddress)
       fetchSafe(safe)
-    }, 15000)
+    }, TIMEOUT)
   }
 
   componentDidUpdate(prevProps) {
diff --git a/src/test/safe.redux.owners.test.js b/src/test/safe.redux.owners.test.js
index 375c1434..a6f533a2 100644
--- a/src/test/safe.redux.owners.test.js
+++ b/src/test/safe.redux.owners.test.js
@@ -1,14 +1,11 @@
 // @flow
 import { aNewStore } from '~/store'
 import { getWeb3 } from '~/wallets/getWeb3'
-import { type Match } from 'react-router-dom'
 import { promisify } from '~/utils/promisify'
 import { processTransaction } from '~/routes/safe/component/Transactions/processTransactions'
-import { confirmationsTransactionSelector, safeSelector } from '~/routes/safe/store/selectors/index'
+import { confirmationsTransactionSelector } from '~/routes/safe/store/selectors/index'
 import { getTransactionFromReduxStore } from '~/routes/safe/test/testMultisig'
-import { buildMathPropsFrom } from '~/test/utils/buildReactRouterProps'
 import fetchTransactions from '~/routes/safe/store/actions/fetchTransactions'
-import { type GlobalState } from '~/store/index'
 import { type Safe } from '~/routes/safe/store/model/safe'
 import { getGnosisSafeInstanceAt } from '~/wallets/safeContracts'
 import { aMinedSafe } from '~/test/builder/safe.redux.builder'
@@ -17,14 +14,7 @@ import { addOwner } from '~/routes/safe/component/AddOwner/index'
 import fetchSafe from '~/routes/safe/store/actions/fetchSafe'
 import { removeOwner, shouldDecrease, initialValuesFrom } from '~/routes/safe/component/RemoveOwner'
 import { DECREASE_PARAM } from '~/routes/safe/component/RemoveOwner/RemoveOwnerForm/index'
-
-const getSafeFrom = (state: GlobalState, safeAddress: string): Safe => {
-  const match: Match = buildMathPropsFrom(safeAddress)
-  const safe = safeSelector(state, { match })
-  if (!safe) throw new Error()
-
-  return safe
-}
+import { getSafeFrom } from '~/test/utils/safeHelper'
 
 describe('React DOM TESTS > Add and remove owners', () => {
   const processOwnerModification = async (store, safeAddress, executor) => {
diff --git a/src/test/utils/safeHelper.js b/src/test/utils/safeHelper.js
new file mode 100644
index 00000000..fb094bbc
--- /dev/null
+++ b/src/test/utils/safeHelper.js
@@ -0,0 +1,14 @@
+// @flow
+import { buildMathPropsFrom } from '~/test/utils/buildReactRouterProps'
+import { safeSelector } from '~/routes/safe/store/selectors/index'
+import { type Match } from 'react-router-dom'
+import { type GlobalState } from '~/store'
+import { type Safe } from '~/routes/safe/store/model/safe'
+
+export const getSafeFrom = (state: GlobalState, safeAddress: string): Safe => {
+  const match: Match = buildMathPropsFrom(safeAddress)
+  const safe = safeSelector(state, { match })
+  if (!safe) throw new Error()
+
+  return safe
+}