Merge pull request #43 from gnosis/feature/WA-438-daily-limit

WA-438 Feature: daily limit

safe-contracts/build/contracts/CreateAndAddModules.json

@@ -1270,8 +1270,14 @@
       "links": {},
       "address": "0xadf257fb7290315d37d6b11ccdbb648a5d3d148f",
       "transactionHash": "0x80d74510df045a8b9ff09a084394dfd4eae7b7db3921dd9bde780fa7edf4d076"
+    },
+    "1529652204341": {
+      "events": {},
+      "links": {},
+      "address": "0x8abc460ef144c8a56bee97dc35821f3adff74f3c",
+      "transactionHash": "0x7af1e557142bc9cc9bedcfbd550efa8d91bfabefb4cde8f29294155c9465c137"
     }
   },
   "schemaVersion": "2.0.0",
-  "updatedAt": "2018-06-20T07:58:01.354Z"
+  "updatedAt": "2018-06-22T07:24:16.273Z"
 }

safe-contracts/build/contracts/DailyLimitModule.json

@@ -6693,8 +6693,14 @@
       "links": {},
       "address": "0xaff94993c9e18850a990c68bbb61d4531d3e61dd",
       "transactionHash": "0xff53c43c6c273ba0614353b138d78042df23d7dc6bdf767fd00fe03b538fa019"
+    },
+    "1529652204341": {
+      "events": {},
+      "links": {},
+      "address": "0x33eccff7f17d7533b9d127d3885ea4b145ca962c",
+      "transactionHash": "0x95b2c0b5b1a282240281542feb7748212fb861c364007da93b6aba6ce6bc38cf"
     }
   },
   "schemaVersion": "2.0.0",
-  "updatedAt": "2018-06-20T07:58:01.364Z"
+  "updatedAt": "2018-06-22T07:24:16.257Z"
 }

safe-contracts/build/contracts/GnosisSafePersonalEdition.json

@@ -9122,8 +9122,14 @@
       "links": {},
       "address": "0x0c6b67148fe8939c20040e409fc2e5bc349cf1fd",
       "transactionHash": "0xa3d4ad952d11ed76260a43d543cd9e20075a9fd4e69a1001c5ca76dfc73b8ca0"
+    },
+    "1529652204341": {
+      "events": {},
+      "links": {},
+      "address": "0x3a153e91544b2639d1bff08ddf29cfe0b90d54c2",
+      "transactionHash": "0x3324c7ff6568820ed79ff9613ae1d851689b2d93a8eafa70c1a40e833f7cfe7b"
     }
   },
   "schemaVersion": "2.0.0",
-  "updatedAt": "2018-06-20T07:58:01.351Z"
+  "updatedAt": "2018-06-22T07:24:16.246Z"
 }

safe-contracts/build/contracts/GnosisSafeTeamEdition.json

@@ -6954,8 +6954,14 @@
       "links": {},
       "address": "0xd748a53c2061521b6b3b5b0d40b91461591b0dc7",
       "transactionHash": "0xe82ec5350517d60310a99990cfa668570eb06a1d69fa9f4b884eab0d5caa1ad1"
+    },
+    "1529652204341": {
+      "events": {},
+      "links": {},
+      "address": "0xffc8d32e746202b3676a206fa5296edd43cb2cd3",
+      "transactionHash": "0x9ae1de406cd8d0ca8fe85c77d43349ae77fd4d9691defa15cd9380f4c49e3a98"
     }
   },
   "schemaVersion": "2.0.0",
-  "updatedAt": "2018-06-20T07:58:01.347Z"
+  "updatedAt": "2018-06-22T07:24:16.250Z"
 }

safe-contracts/build/contracts/Migrations.json

@@ -1392,8 +1392,14 @@
       "links": {},
       "address": "0xf1a3a15c821eb31eadcbbdb05e3a19d41e622074",
       "transactionHash": "0x78a7a50665062991b8931337e43ac4f21200e6cecaa102d7685d9a391119c3ce"
+    },
+    "1529652204341": {
+      "events": {},
+      "links": {},
+      "address": "0x8b8f0365a24b4c968b7a1ada7b116c510f2df133",
+      "transactionHash": "0xb6a19a7a679a1474c09c651e4151421f210afa3f47effed019d4c0206144ee5f"
     }
   },
   "schemaVersion": "2.0.0",
-  "updatedAt": "2018-06-20T07:58:01.359Z"
+  "updatedAt": "2018-06-22T07:24:16.275Z"
 }

safe-contracts/build/contracts/MultiSend.json

@@ -372,8 +372,14 @@
       "links": {},
       "address": "0xaba1a0da223a2a5e04158bd80b2af7671e27e2c6",
       "transactionHash": "0x6e7c0c3947a3a851738677ae63915781ce79fdfb0453030fc63bbcd346f2cf89"
+    },
+    "1529652204341": {
+      "events": {},
+      "links": {},
+      "address": "0x2013688de17569d52fc4cd4fe5f18821d8b32b2a",
+      "transactionHash": "0x2d7f72a94ced345c372040faa1f51a51f3e8da27a02dd04b9eefef487de3ba05"
     }
   },
   "schemaVersion": "2.0.0",
-  "updatedAt": "2018-06-20T07:58:01.355Z"
+  "updatedAt": "2018-06-22T07:24:16.274Z"
 }

safe-contracts/build/contracts/ProxyFactory.json

@@ -1005,8 +1005,14 @@
       "links": {},
       "address": "0xce824fab495ef56405218cce3512b7a73df9e2ca",
       "transactionHash": "0x10a89cb87c96bb1becc3a78f1bfdd54f98cdc1cb7e5164e26b1cbbd09d69be8c"
+    },
+    "1529652204341": {
+      "events": {},
+      "links": {},
+      "address": "0xffacf76025eda5f84659135a9d5c2d815dbe1caa",
+      "transactionHash": "0x75ad1066b44cd801ac66a316dbe4c09e72636d72b70fd62eb647295a0fc5e285"
     }
   },
   "schemaVersion": "2.0.0",
-  "updatedAt": "2018-06-20T07:58:01.341Z"
+  "updatedAt": "2018-06-22T07:24:16.243Z"
 }

safe-contracts/build/contracts/SocialRecoveryModule.json

@@ -7304,8 +7304,14 @@
       "links": {},
       "address": "0x9d6575ea466550e050f4c08eff7075ab099db8f6",
       "transactionHash": "0x8c0dc99f8f345ac15f129ef0e98e60a7fde3975cf8b77fbb9f0b1e75eae34c30"
+    },
+    "1529652204341": {
+      "events": {},
+      "links": {},
+      "address": "0xdfcdce812f5f001cdd35506bfb01cc02e31ae5a2",
+      "transactionHash": "0x6c40a3712932d0e03f4a6f0ad0f39be479bac35533935534577070e087245a52"
     }
   },
   "schemaVersion": "2.0.0",
-  "updatedAt": "2018-06-20T07:58:01.368Z"
+  "updatedAt": "2018-06-22T07:24:16.270Z"
 }

safe-contracts/build/contracts/StateChannelModule.json

@@ -5437,8 +5437,14 @@
       "links": {},
       "address": "0x437ca411c1aa04e6012dbe1ac8cd0ccc87c1e6d9",
       "transactionHash": "0xe7066b0fd7695e7e5956681c536759a36839b507de3a4fde6509dab7c6d9b152"
+    },
+    "1529652204341": {
+      "events": {},
+      "links": {},
+      "address": "0xcda1de5ecadaf89d663ed589a615e0ba8d697d3d",
+      "transactionHash": "0xcc681aa2ad918c4a255559fa45f9c64405ce4064db091ce1d7749bf3e6f05899"
     }
   },
   "schemaVersion": "2.0.0",
-  "updatedAt": "2018-06-20T07:58:01.343Z"
+  "updatedAt": "2018-06-22T07:24:16.253Z"
 }

safe-contracts/build/contracts/WhitelistModule.json

@@ -4348,8 +4348,14 @@
       "links": {},
       "address": "0x6fafade61582e994730a7cd15480155d8017e888",
       "transactionHash": "0x7850b601cdea18ba050f455b4fad47c152c51ed5d2c56e88a54a336780ddcbd2"
+    },
+    "1529652204341": {
+      "events": {},
+      "links": {},
+      "address": "0x88ed584819ee8dda7263b501af76ca07befa9ac7",
+      "transactionHash": "0x07909d849b2c29127266874541e7145062da0e1af6ab5d204cd91ca8d08d48d0"
     }
   },
   "schemaVersion": "2.0.0",
-  "updatedAt": "2018-06-20T07:58:01.360Z"
+  "updatedAt": "2018-06-22T07:24:16.263Z"
 }

src/routes/safe/component/AddTransaction/MultisigForm/index.jsx

@@ -23,7 +23,7 @@ type Props = {
   balance: number,
 }
 
-const WithdrawnForm = ({ balance }: Props) => () => (
+const WithdrawForm = ({ balance }: Props) => () => (
   <Block margin="md">
     <Heading tag="h2" margin="lg">
       Multisig Transaction
@@ -64,4 +64,4 @@ const WithdrawnForm = ({ balance }: Props) => () => (
   </Block>
 )
 
-export default WithdrawnForm
+export default WithdrawForm

src/routes/safe/component/EditDailyLimit/EditDailyLimitForm/index.jsx

@@ -0,0 +1,36 @@
+// @flow
+import * as React from 'react'
+import Block from '~/components/layout/Block'
+import Heading from '~/components/layout/Heading'
+import Field from '~/components/forms/Field'
+import TextField from '~/components/forms/TextField'
+import { composeValidators, minValue, mustBeFloat, required } from '~/components/forms/validator'
+
+export const EDIT_DAILY_LIMIT_PARAM = 'daily'
+
+type EditDailyLimitProps = {
+  dailyLimit: string,
+}
+
+const EditDailyLimitForm = ({ dailyLimit }: EditDailyLimitProps) => () => (
+  <Block margin="md">
+    <Heading tag="h2" margin="lg">
+      {'Change safe\'s daily limit'}
+    </Heading>
+    <Heading tag="h4" margin="lg">
+      {`Actual daily limit: ${dailyLimit}`}
+    </Heading>
+    <Block margin="md">
+      <Field
+        name={EDIT_DAILY_LIMIT_PARAM}
+        component={TextField}
+        type="text"
+        validate={composeValidators(required, mustBeFloat, minValue(0))}
+        placeholder="New daily limit"
+        text="Safe's daily limit"
+      />
+    </Block>
+  </Block>
+)
+
+export default EditDailyLimitForm

src/routes/safe/component/EditDailyLimit/Review/index.jsx

@@ -0,0 +1,31 @@
+// @flow
+import * as React from 'react'
+import CircularProgress from '@material-ui/core/CircularProgress'
+import Block from '~/components/layout/Block'
+import Bold from '~/components/layout/Bold'
+import Heading from '~/components/layout/Heading'
+import Paragraph from '~/components/layout/Paragraph'
+import { EDIT_DAILY_LIMIT_PARAM } from '~/routes/safe/component/EditDailyLimit/EditDailyLimitForm'
+
+type FormProps = {
+  values: Object,
+  submitting: boolean,
+}
+
+const spinnerStyle = {
+  minHeight: '50px',
+}
+
+const Review = () => ({ values, submitting }: FormProps) => (
+  <Block>
+    <Heading tag="h2">Review the DailyLimit operation</Heading>
+    <Paragraph align="left">
+      <Bold>The new daily limit will be: </Bold> {values[EDIT_DAILY_LIMIT_PARAM]}
+    </Paragraph>
+    <Block style={spinnerStyle}>
+      { submitting && <CircularProgress size={50} /> }
+    </Block>
+  </Block>
+)
+
+export default Review

src/routes/safe/component/EditDailyLimit/actions.js

@@ -0,0 +1,12 @@
+// @flow
+import fetchTransactions from '~/routes/safe/store/actions/fetchTransactions'
+
+type FetchTransactions = typeof fetchTransactions
+
+export type Actions = {
+  fetchTransactions: FetchTransactions,
+}
+
+export default {
+  fetchTransactions,
+}

src/routes/safe/component/EditDailyLimit/index.jsx

@@ -0,0 +1,84 @@
+// @flow
+import * as React from 'react'
+import Stepper from '~/components/Stepper'
+import { connect } from 'react-redux'
+import { createTransaction } from '~/routes/safe/component/AddTransaction/createTransactions'
+import { getEditDailyLimitData, getDailyLimitAddress } from '~/routes/safe/component/Withdraw/withdraw'
+import { type Safe } from '~/routes/safe/store/model/safe'
+import EditDailyLimitForm, { EDIT_DAILY_LIMIT_PARAM } from './EditDailyLimitForm'
+import selector, { type SelectorProps } from './selector'
+import actions, { type Actions } from './actions'
+import Review from './Review'
+
+type Props = SelectorProps & Actions & {
+  dailyLimit: number,
+  onReset: () => void,
+  safe: Safe,
+}
+
+const getSteps = () => [
+  'Fill Edit Daily Limit Form', 'Review Edit Daily Limit operation',
+]
+
+type State = {
+  done: boolean,
+}
+
+export const CHANGE_THRESHOLD_RESET_BUTTON_TEXT = 'SEE TXs'
+
+class EditDailyLimit extends React.PureComponent<Props, State> {
+  state = {
+    done: false,
+  }
+
+  onEditDailyLimit = async (values: Object) => {
+    try {
+      const { safe, userAddress } = this.props
+      const newDailyLimit = values[EDIT_DAILY_LIMIT_PARAM]
+      const safeAddress = safe.get('address')
+      const data = await getEditDailyLimitData(safeAddress, 0, Number(newDailyLimit))
+      const to = await getDailyLimitAddress(safeAddress)
+      const nonce = Date.now()
+      await createTransaction(safe, `Change Safe's daily limit to ${newDailyLimit} [${nonce}]`, to, 0, nonce, userAddress, data)
+      await this.props.fetchTransactions()
+      this.setState({ done: true })
+    } catch (error) {
+      this.setState({ done: false })
+      // eslint-disable-next-line
+      console.log('Error while editing the daily limit ' + error)
+    }
+  }
+
+  onReset = () => {
+    this.setState({ done: false })
+    this.props.onReset()
+  }
+
+  render() {
+    const { dailyLimit } = this.props
+    const { done } = this.state
+    const steps = getSteps()
+    const finishedButton = <Stepper.FinishButton title={CHANGE_THRESHOLD_RESET_BUTTON_TEXT} />
+
+    return (
+      <React.Fragment>
+        <Stepper
+          finishedTransaction={done}
+          finishedButton={finishedButton}
+          onSubmit={this.onEditDailyLimit}
+          steps={steps}
+          onReset={this.onReset}
+        >
+          <Stepper.Page dailyLimit={dailyLimit} >
+            { EditDailyLimitForm }
+          </Stepper.Page>
+          <Stepper.Page>
+            { Review }
+          </Stepper.Page>
+        </Stepper>
+      </React.Fragment>
+    )
+  }
+}
+
+export default connect(selector, actions)(EditDailyLimit)

src/routes/safe/component/Safe/DailyLimit.jsx

@@ -9,13 +9,20 @@ import { type DailyLimit } from '~/routes/safe/store/model/dailyLimit'
 
 type Props = {
   dailyLimit: DailyLimit,
-  onWithdrawn: () => void,
+  onWithdraw: () => void,
+  onEditDailyLimit: () => void,
   balance: string,
 }
+export const EDIT_WITHDRAW = 'Edit'
+export const WITHDRAW_BUTTON_TEXT = 'Withdraw'
 
-export const WITHDRAWN_BUTTON_TEXT = 'Withdrawn'
+const editStyle = {
+  marginRight: '10px',
+}
 
-const DailyLimitComponent = ({ dailyLimit, balance, onWithdrawn }: Props) => {
+const DailyLimitComponent = ({
+  dailyLimit, balance, onWithdraw, onEditDailyLimit,
+}: Props) => {
   const limit = dailyLimit.get('value')
   const spentToday = dailyLimit.get('spentToday')
 
@@ -29,12 +36,20 @@ const DailyLimitComponent = ({ dailyLimit, balance, onWithdrawn }: Props) => {
       </Avatar>
       <ListItemText primary="Daily Limit" secondary={text} />
       <Button
+        style={editStyle}
         variant="raised"
         color="primary"
-        onClick={onWithdrawn}
+        onClick={onEditDailyLimit}
+      >
+        {EDIT_WITHDRAW}
+      </Button>
+      <Button
+        variant="raised"
+        color="primary"
+        onClick={onWithdraw}
         disabled={disabled}
       >
-        {WITHDRAWN_BUTTON_TEXT}
+        {WITHDRAW_BUTTON_TEXT}
       </Button>
     </ListItem>
   )

src/routes/safe/component/Safe/index.jsx

@@ -9,12 +9,13 @@ import Row from '~/components/layout/Row'
 import { type Safe } from '~/routes/safe/store/model/safe'
 import List from '@material-ui/core/List'
 
-import Withdrawn from '~/routes/safe/component/Withdrawn'
+import Withdraw from '~/routes/safe/component/Withdraw'
 import Transactions from '~/routes/safe/component/Transactions'
 import AddTransaction from '~/routes/safe/component/AddTransaction'
 import Threshold from '~/routes/safe/component/Threshold'
 import AddOwner from '~/routes/safe/component/AddOwner'
 import RemoveOwner from '~/routes/safe/component/RemoveOwner'
+import EditDailyLimit from '~/routes/safe/component/EditDailyLimit'
 
 import Address from './Address'
 import Balance from './Balance'
@@ -44,10 +45,17 @@ class GnoSafe extends React.PureComponent<SafeProps, State> {
     component: undefined,
   }
 
-  onWithdrawn = () => {
+  onEditDailyLimit = () => {
     const { safe } = this.props
 
-    this.setState({ component: <Withdrawn safeAddress={safe.get('address')} dailyLimit={safe.get('dailyLimit')} /> })
+    const value = safe.get('dailyLimit').get('value')
+    this.setState({ component: <EditDailyLimit safe={safe} dailyLimit={value} onReset={this.onListTransactions} /> })
+  }
+
+  onWithdraw = () => {
+    const { safe } = this.props
+
+    this.setState({ component: <Withdraw safe={safe} dailyLimit={safe.get('dailyLimit')} /> })
   }
 
   onAddTx = () => {
@@ -98,7 +106,7 @@ class GnoSafe extends React.PureComponent<SafeProps, State> {
             />
             <Confirmations confirmations={safe.get('threshold')} onEditThreshold={this.onEditThreshold} />
             <Address address={safe.get('address')} />
-            <DailyLimit balance={balance} dailyLimit={safe.get('dailyLimit')} onWithdrawn={this.onWithdrawn} />
+            <DailyLimit balance={balance} dailyLimit={safe.get('dailyLimit')} onWithdraw={this.onWithdraw} onEditDailyLimit={this.onEditDailyLimit} />
             <MultisigTx balance={balance} onAddTx={this.onAddTx} onSeeTxs={this.onListTransactions} />
           </List>
         </Col>

src/routes/safe/component/Transactions/processTransactions.js

@@ -126,8 +126,10 @@ export const processTransaction = async (
 
   checkReceiptStatus(txHash.tx)
 
-  const confirmationHash = thresholdReached ? EXECUTED_CONFIRMATION_HASH : txHash.tx
+  const confirmationHash =
-  const executedConfirmations: List<Confirmation> = updateConfirmations(tx.get('confirmations'), userAddress, confirmationHash)
+    thresholdReached ? EXECUTED_CONFIRMATION_HASH : txHash.tx
+  const executedConfirmations: List<Confirmation> =
+    updateConfirmations(tx.get('confirmations'), userAddress, confirmationHash)
 
   return updateTransaction(
     txName,

src/routes/safe/component/Withdraw/Review/index.jsx

@@ -5,7 +5,7 @@ import Block from '~/components/layout/Block'
 import Bold from '~/components/layout/Bold'
 import Heading from '~/components/layout/Heading'
 import Paragraph from '~/components/layout/Paragraph'
-import { DESTINATION_PARAM, VALUE_PARAM } from '~/routes/safe/component/Withdrawn/withdrawn'
+import { DESTINATION_PARAM, VALUE_PARAM } from '~/routes/safe/component/Withdraw/withdraw'
 
 type FormProps = {
   values: Object,
@@ -18,7 +18,7 @@ const spinnerStyle = {
 
 const Review = () => ({ values, submitting }: FormProps) => (
   <Block>
-    <Heading tag="h2">Review the Withdrawn Operation</Heading>
+    <Heading tag="h2">Review the Withdraw Operation</Heading>
     <Paragraph align="left">
       <Bold>Destination: </Bold> {values[DESTINATION_PARAM]}
     </Paragraph>

src/routes/safe/component/Withdraw/WithdrawForm/WithdrawForm.stories.js

@@ -3,7 +3,7 @@ import { storiesOf } from '@storybook/react'
 import * as React from 'react'
 import Stepper from '~/components/Stepper'
 import styles from '~/components/layout/PageFrame/index.scss'
-import WithdrawnForm from './index'
+import WithdrawForm from './index'
 
 
 const FrameDecorator = story => (
@@ -14,16 +14,16 @@ const FrameDecorator = story => (
 
 storiesOf('Components', module)
   .addDecorator(FrameDecorator)
-  .add('WithdrawnForm', () => (
+  .add('WithdrawForm', () => (
     <Stepper
       finishedTransaction={false}
       finishedButton={<Stepper.FinishButton title="RESET" />}
       onSubmit={() => {}}
-      steps={['Fill Withdrawn Form', 'Review Withdrawn']}
+      steps={['Fill Withdraw Form', 'Review Withdraw']}
       onReset={() => {}}
     >
       <Stepper.Page dailyLimit={10} spentToday={7}>
-        { WithdrawnForm }
+        { WithdrawForm }
       </Stepper.Page>
     </Stepper>
   ))

src/routes/safe/component/Withdraw/WithdrawForm/index.jsx

@@ -5,7 +5,7 @@ import TextField from '~/components/forms/TextField'
 import { composeValidators, inLimit, mustBeFloat, required, greaterThan, mustBeEthereumAddress } from '~/components/forms/validator'
 import Block from '~/components/layout/Block'
 import Heading from '~/components/layout/Heading'
-import { DESTINATION_PARAM, VALUE_PARAM } from '~/routes/safe/component/Withdrawn/withdrawn'
+import { DESTINATION_PARAM, VALUE_PARAM } from '~/routes/safe/component/Withdraw/withdraw'
 
 export const CONFIRMATIONS_ERROR = 'Number of confirmations can not be higher than the number of owners'
 
@@ -24,10 +24,10 @@ type Props = {
   spentToday: number,
 }
 
-const WithdrawnForm = ({ limit, spentToday }: Props) => () => (
+const WithdrawForm = ({ limit, spentToday }: Props) => () => (
   <Block margin="md">
     <Heading tag="h2" margin="lg">
-      Withdrawn Funds
+      Withdraw Funds
     </Heading>
     <Heading tag="h4" margin="lg">
       {`Daily limit ${limit} ETH (spent today: ${spentToday} ETH)`}
@@ -55,4 +55,4 @@ const WithdrawnForm = ({ limit, spentToday }: Props) => () => (
   </Block>
 )
 
-export default WithdrawnForm
+export default WithdrawForm

src/routes/safe/component/Withdraw/actions.js

@@ -0,0 +1,12 @@
+// @flow
+import fetchTransactions from '~/routes/safe/store/actions/fetchTransactions'
+
+type FetchTransactions = typeof fetchTransactions
+
+export type Actions = {
+  fetchTransactions: FetchTransactions,
+}
+
+export default {
+  fetchTransactions,
+}

src/routes/safe/component/Withdraw/index.jsx

@@ -3,17 +3,19 @@ import * as React from 'react'
 import { connect } from 'react-redux'
 import Stepper from '~/components/Stepper'
 import { type DailyLimit } from '~/routes/safe/store/model/dailyLimit'
+import { type Safe } from '~/routes/safe/store/model/safe'
 import selector, { type SelectorProps } from './selector'
-import withdrawn from './withdrawn'
+import withdraw from './withdraw'
-import WithdrawnForm from './WithdrawnForm'
+import WithdrawForm from './WithdrawForm'
 import Review from './Review'
+import actions, { type Actions } from './actions'
 
 const getSteps = () => [
-  'Fill Withdrawn Form', 'Review Withdrawn',
+  'Fill Withdraw Form', 'Review Withdraw',
 ]
 
-type Props = SelectorProps & {
+type Props = SelectorProps & Actions & {
-  safeAddress: string,
+  safe: Safe,
   dailyLimit: DailyLimit,
 }
 
@@ -23,15 +25,17 @@ type State = {
 
 export const SEE_TXS_BUTTON_TEXT = 'RESET'
 
-class Withdrawn extends React.Component<Props, State> {
+class Withdraw extends React.Component<Props, State> {
   state = {
     done: false,
   }
 
-  onWithdrawn = async (values: Object) => {
+  onWithdraw = async (values: Object) => {
     try {
-      const { safeAddress, userAddress } = this.props
+      const { safe, userAddress, fetchTransactions } = this.props
-      await withdrawn(values, safeAddress, userAddress)
+      await withdraw(values, safe, userAddress)
+      fetchTransactions()
+
       this.setState({ done: true })
     } catch (error) {
       this.setState({ done: false })
@@ -55,12 +59,12 @@ class Withdrawn extends React.Component<Props, State> {
         <Stepper
           finishedTransaction={done}
           finishedButton={finishedButton}
-          onSubmit={this.onWithdrawn}
+          onSubmit={this.onWithdraw}
           steps={steps}
           onReset={this.onReset}
         >
           <Stepper.Page limit={dailyLimit.get('value')} spentToday={dailyLimit.get('spentToday')}>
-            { WithdrawnForm }
+            { WithdrawForm }
           </Stepper.Page>
           <Stepper.Page>
             { Review }
@@ -71,5 +75,5 @@ class Withdrawn extends React.Component<Props, State> {
   }
 }
 
-export default connect(selector)(Withdrawn)
+export default connect(selector, actions)(Withdraw)
 

src/routes/safe/component/Withdraw/selector.js

@@ -0,0 +1,11 @@
+// @flow
+import { createStructuredSelector } from 'reselect'
+import { userAccountSelector } from '~/wallets/store/selectors/index'
+
+export type SelectorProps = {
+  userAddress: userAccountSelector,
+}
+
+export default createStructuredSelector({
+  userAddress: userAccountSelector,
+})

src/routes/safe/component/Withdraw/withdraw.js

@@ -3,6 +3,8 @@ import { getWeb3 } from '~/wallets/getWeb3'
 import { getGnosisSafeContract, getCreateDailyLimitExtensionContract } from '~/wallets/safeContracts'
 import { type DailyLimitProps } from '~/routes/safe/store/model/dailyLimit'
 import { checkReceiptStatus, calculateGasOf, calculateGasPrice } from '~/wallets/ethTransactions'
+import { type Safe } from '~/routes/safe/store/model/safe'
+import { buildExecutedConfirmationFrom, storeTransaction } from '~/routes/safe/component/AddTransaction/createTransactions'
 
 export const LIMIT_POSITION = 0
 export const SPENT_TODAY_POS = 1
@@ -36,12 +38,27 @@ export const getDailyLimitFrom = async (safeAddress: string, tokenAddress: numbe
   return { value: Number(limit), spentToday: Number(spentToday) }
 }
 
-const withdrawn = async (values: Object, safeAddress: string, userAccount: string): Promise<void> => {
+export const getDailyLimitAddress = async (safeAddress: string) => {
+  const dailyLimitModule = await getDailyLimitModuleFrom(safeAddress)
+
+  return dailyLimitModule.address
+}
+
+export const getEditDailyLimitData = async (safeAddress: string, token: string, dailyLimit: string) => {
   const web3 = getWeb3()
   const dailyLimitModule = await getDailyLimitModuleFrom(safeAddress)
+  const dailyLimitInWei = web3.toWei(dailyLimit, 'ether')
+  return dailyLimitModule.contract.changeDailyLimit.getData(token, dailyLimitInWei)
+}
+
+const withdraw = async (values: Object, safe: Safe, userAccount: string): Promise<void> => {
+  const web3 = getWeb3()
+  const safeAddress = safe.get('address')
+  const dailyLimitModule = await getDailyLimitModuleFrom(safeAddress)
 
   const destination = values[DESTINATION_PARAM]
-  const value = web3.toWei(values[VALUE_PARAM], 'ether')
+  const valueInEth = values[VALUE_PARAM]
+  const value = web3.toWei(valueInEth, 'ether')
 
   const dailyLimitData = dailyLimitModule.contract.executeDailyLimit.getData(0, destination, value)
   const gas = await calculateGasOf(dailyLimitData, userAccount, dailyLimitModule.address)
@@ -49,6 +66,11 @@ const withdrawn = async (values: Object, safeAddress: string, userAccount: strin
 
   const txHash = await dailyLimitModule.executeDailyLimit(0, destination, value, { from: userAccount, gas, gasPrice })
   checkReceiptStatus(txHash.tx)
+
+  const nonce = Date.now()
+  const executedConfirmations: List<Confirmation> = buildExecutedConfirmationFrom(safe.get('owners'), userAccount)
+
+  return storeTransaction(`Withdraw movement of ${valueInEth}`, nonce, destination, valueInEth, userAccount, executedConfirmations, txHash.tx, safeAddress, safe.get('threshold'), '0x')
 }
 
-export default withdrawn
+export default withdraw

src/routes/safe/component/Withdraw/withdraw.test.js

@@ -0,0 +1,30 @@
+// @flow
+import { aNewStore } from '~/store'
+import { addEtherTo } from '~/test/utils/etherMovements'
+import { aDeployedSafe, executeWithdrawOn } from '~/routes/safe/store/test/builder/deployedSafe.builder'
+import { buildMathPropsFrom } from '~/test/utils/buildReactRouterProps'
+import { safeSelector } from '~/routes/safe/store/selectors/index'
+
+describe('Safe Blockchain Test', () => {
+  let store
+  beforeEach(async () => {
+    store = aNewStore()
+  })
+
+  it('wihdrawn should return revert error if exceeded dailyLimit', async () => {
+    // GIVEN
+    const dailyLimitValue = 0.30
+    const safeAddress = await aDeployedSafe(store, dailyLimitValue)
+    await addEtherTo(safeAddress, '0.7')
+    const value = 0.15
+
+    // WHEN
+    const match: Match = buildMathPropsFrom(safeAddress)
+    const safe = safeSelector(store.getState(), { match })
+    await executeWithdrawOn(safe, value)
+    await executeWithdrawOn(safe, value)
+
+    // THEN
+    expect(executeWithdrawOn(safeAddress, value)).rejects.toThrow('VM Exception while processing transaction: revert')
+  })
+})

src/routes/safe/component/Withdrawn/withdrawn.test.js

@@ -1,26 +0,0 @@
-// @flow
-import { aNewStore } from '~/store'
-import { addEtherTo } from '~/test/utils/etherMovements'
-import { aDeployedSafe, executeWithdrawnOn } from '~/routes/safe/store/test/builder/deployedSafe.builder'
-
-describe('Safe Blockchain Test', () => {
-  let store
-  beforeEach(async () => {
-    store = aNewStore()
-  })
-
-  it('wihdrawn should return revert error if exceeded dailyLimit', async () => {
-    // GIVEN
-    const dailyLimitValue = 0.30
-    const safeAddress = await aDeployedSafe(store, dailyLimitValue)
-    await addEtherTo(safeAddress, '0.7')
-    const value = 0.15
-
-    // WHEN
-    await executeWithdrawnOn(safeAddress, value)
-    await executeWithdrawnOn(safeAddress, value)
-
-    // THEN
-    expect(executeWithdrawnOn(safeAddress, value)).rejects.toThrow('VM Exception while processing transaction: revert')
-  })
-})

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

@@ -5,7 +5,7 @@ import { type GlobalState } from '~/store/index'
 import { makeOwner } from '~/routes/safe/store/model/owner'
 import { type SafeProps, type Safe, makeSafe } from '~/routes/safe/store/model/safe'
 import { makeDailyLimit } from '~/routes/safe/store/model/dailyLimit'
-import { getDailyLimitFrom } from '~/routes/safe/component/Withdrawn/withdrawn'
+import { getDailyLimitFrom } from '~/routes/safe/component/Withdraw/withdraw'
 import { getGnosisSafeInstanceAt } from '~/wallets/safeContracts'
 import updateSafe from '~/routes/safe/store/actions/updateSafe'
 import { getOwners } from '~/utils/localStorage'

src/routes/safe/store/test/builder/deployedSafe.builder.js

@@ -11,8 +11,9 @@ import { sleep } from '~/utils/timer'
 import { getProviderInfo, getWeb3 } from '~/wallets/getWeb3'
 import addProvider from '~/wallets/store/actions/addProvider'
 import { makeProvider } from '~/wallets/store/model/provider'
-import withdrawn, { DESTINATION_PARAM, VALUE_PARAM } from '~/routes/safe/component/Withdrawn/withdrawn'
+import withdraw, { DESTINATION_PARAM, VALUE_PARAM } from '~/routes/safe/component/Withdraw/withdraw'
 import { promisify } from '~/utils/promisify'
+import { type Safe } from '~/routes/safe/store/model/safe'
 
 export const renderSafe = async (localStore: Store<GlobalState>) => {
   const provider = await getProviderInfo()
@@ -94,7 +95,7 @@ export const aDeployedSafe = async (
   return deployedSafe.logs[1].args.proxy
 }
 
-export const executeWithdrawnOn = async (safeAddress: string, value: number) => {
+export const executeWithdrawOn = async (safe: Safe, value: number) => {
   const providerInfo = await getProviderInfo()
   const userAddress = providerInfo.account
 
@@ -103,5 +104,5 @@ export const executeWithdrawnOn = async (safeAddress: string, value: number) =>
     [VALUE_PARAM]: `${value}`,
   }
 
-  return withdrawn(values, safeAddress, userAddress)
+  return withdraw(values, safe, userAddress)
 }

src/routes/safe/test/Safe.multisig.1owners1threshold.test.js

@@ -17,8 +17,9 @@ import { getBalanceInEtherOf } from '~/wallets/getWeb3'
 import { sleep } from '~/utils/timer'
 import { ADD_MULTISIG_BUTTON_TEXT } from '~/routes/safe/component/Safe/MultisigTx'
 import { safeTransactionsSelector } from '~/routes/safe/store/selectors/index'
+import { MOVE_FUNDS_INDEX } from '~/test/builder/safe.dom.utils'
 
-describe('React DOM TESTS > Withdrawn funds from safe', () => {
+describe('React DOM TESTS > Withdraw funds from safe', () => {
   let SafeDom
   let store
   let address
@@ -44,12 +45,13 @@ describe('React DOM TESTS > Withdrawn funds from safe', () => {
     const Safe = TestUtils.findRenderedComponentWithType(SafeDom, SafeView)
 
     // $FlowFixMe
-    const buttons = TestUtils.scryRenderedComponentsWithType(Safe, Button)
+    const buttons = TestUtils.scryRenderedDOMComponentsWithTag(Safe, 'button')
-    const addTxButton = buttons[3]
+    const addTxButton = buttons[MOVE_FUNDS_INDEX]
-    expect(addTxButton.props.children).toEqual(ADD_MULTISIG_BUTTON_TEXT)
+    expect(addTxButton.getElementsByTagName('span')[0].innerHTML).toEqual(ADD_MULTISIG_BUTTON_TEXT)
-    await sleep(1800) // Give time to enable Add button
-    TestUtils.Simulate.click(TestUtils.scryRenderedDOMComponentsWithTag(addTxButton, 'button')[0])
 
+    await sleep(1800) // Give time to enable Add button
+    TestUtils.Simulate.click(addTxButton)
+    await sleep(1800) // Give time to render the form
     const AddTransaction = TestUtils.findRenderedComponentWithType(SafeDom, AddTransactionComponent)
 
     // $FlowFixMe

src/routes/safe/test/Safe.withdraw.test.js

@@ -6,19 +6,22 @@ import { ConnectedRouter } from 'react-router-redux'
 import Button from '~/components/layout/Button'
 import { aNewStore, history } from '~/store'
 import { addEtherTo } from '~/test/utils/etherMovements'
-import { aDeployedSafe, executeWithdrawnOn } from '~/routes/safe/store/test/builder/deployedSafe.builder'
+import { aDeployedSafe, executeWithdrawOn } from '~/routes/safe/store/test/builder/deployedSafe.builder'
 import { SAFELIST_ADDRESS } from '~/routes/routes'
 import SafeView from '~/routes/safe/component/Safe'
 import AppRoutes from '~/routes'
-import { WITHDRAWN_BUTTON_TEXT } from '~/routes/safe/component/Safe/DailyLimit'
+import { WITHDRAW_BUTTON_TEXT } from '~/routes/safe/component/Safe/DailyLimit'
-import WithdrawnComponent, { SEE_TXS_BUTTON_TEXT } from '~/routes/safe/component/Withdrawn'
+import WithdrawComponent, { SEE_TXS_BUTTON_TEXT } from '~/routes/safe/component/Withdraw'
 import { getBalanceInEtherOf } from '~/wallets/getWeb3'
 import { sleep } from '~/utils/timer'
-import { getDailyLimitFrom } from '~/routes/safe/component/Withdrawn/withdrawn'
+import { getDailyLimitFrom } from '~/routes/safe/component/Withdraw/withdraw'
 import { type DailyLimitProps } from '~/routes/safe/store/model/dailyLimit'
 import { ADD_MULTISIG_BUTTON_TEXT } from '~/routes/safe/component/Safe/MultisigTx'
+import { WITHDRAW_INDEX, MOVE_FUNDS_INDEX } from '~/test/builder/safe.dom.utils'
+import { buildMathPropsFrom } from '~/test/utils/buildReactRouterProps'
+import { safeSelector } from '~/routes/safe/store/selectors/index'
 
-describe('React DOM TESTS > Withdrawn funds from safe', () => {
+describe('React DOM TESTS > Withdraw funds from safe', () => {
   let SafeDom
   let store
   let address
@@ -38,29 +41,29 @@ describe('React DOM TESTS > Withdrawn funds from safe', () => {
     ))
   })
 
-  it('should withdrawn funds under dailyLimit without needing confirmations', async () => {
+  it('should withdraw funds under dailyLimit without needing confirmations', async () => {
     // add funds to safe
     await addEtherTo(address, '0.1')
     await sleep(3000)
     const Safe = TestUtils.findRenderedComponentWithType(SafeDom, SafeView)
 
     // $FlowFixMe
-    const buttons = TestUtils.scryRenderedComponentsWithType(Safe, Button)
+    const buttons = TestUtils.scryRenderedDOMComponentsWithTag(Safe, 'button')
-    const withdrawnButton = buttons[2]
+    const addWithdrawButton = buttons[WITHDRAW_INDEX]
-    expect(withdrawnButton.props.children).toEqual(WITHDRAWN_BUTTON_TEXT)
+    expect(addWithdrawButton.getElementsByTagName('span')[0].innerHTML).toEqual(WITHDRAW_BUTTON_TEXT)
-    TestUtils.Simulate.click(TestUtils.scryRenderedDOMComponentsWithTag(withdrawnButton, 'button')[0])
+    TestUtils.Simulate.click(addWithdrawButton)
     await sleep(4000)
-    const Withdrawn = TestUtils.findRenderedComponentWithType(SafeDom, WithdrawnComponent)
+    const Withdraw = TestUtils.findRenderedComponentWithType(SafeDom, WithdrawComponent)
 
     // $FlowFixMe
-    const inputs = TestUtils.scryRenderedDOMComponentsWithTag(Withdrawn, 'input')
+    const inputs = TestUtils.scryRenderedDOMComponentsWithTag(Withdraw, 'input')
     const amountInEth = inputs[0]
     const toAddress = inputs[1]
     TestUtils.Simulate.change(amountInEth, { target: { value: '0.01' } })
     TestUtils.Simulate.change(toAddress, { target: { value: store.getState().providers.account } })
 
     // $FlowFixMe
-    const form = TestUtils.findRenderedDOMComponentWithTag(Withdrawn, 'form')
+    const form = TestUtils.findRenderedDOMComponentWithTag(Withdraw, 'form')
 
     TestUtils.Simulate.submit(form) // fill the form
     TestUtils.Simulate.submit(form) // confirming data
@@ -70,8 +73,8 @@ describe('React DOM TESTS > Withdrawn funds from safe', () => {
     expect(safeBalance).toBe('0.09')
 
     // $FlowFixMe
-    const withdrawnButtons = TestUtils.scryRenderedComponentsWithType(Withdrawn, Button)
+    const withdrawButtons = TestUtils.scryRenderedComponentsWithType(Withdraw, Button)
-    const visitTxsButton = withdrawnButtons[0]
+    const visitTxsButton = withdrawButtons[0]
     expect(visitTxsButton.props.children).toEqual(SEE_TXS_BUTTON_TEXT)
   })
 
@@ -79,10 +82,10 @@ describe('React DOM TESTS > Withdrawn funds from safe', () => {
     // add funds to safe
     await addEtherTo(address, '0.1')
 
-    // GIVEN in beforeEach
+    const match: Match = buildMathPropsFrom(address)
-    // WHEN
+    const safe = safeSelector(store.getState(), { match })
-    await executeWithdrawnOn(address, 0.01)
+    await executeWithdrawOn(safe, 0.01)
-    await executeWithdrawnOn(address, 0.01)
+    await executeWithdrawOn(safe, 0.01)
 
     const ethAddress = 0
     const dailyLimit: DailyLimitProps = await getDailyLimitFrom(address, ethAddress)
@@ -95,28 +98,28 @@ describe('React DOM TESTS > Withdrawn funds from safe', () => {
   it('add multisig txs button disabled when balance is 0', async () => {
     const Safe = TestUtils.findRenderedComponentWithType(SafeDom, SafeView)
     // $FlowFixMe
-    const buttons = TestUtils.scryRenderedComponentsWithType(Safe, Button)
+    const buttons = TestUtils.scryRenderedDOMComponentsWithTag(Safe, 'button')
-    const addTxButton = buttons[3]
+    const addTxButton = buttons[MOVE_FUNDS_INDEX]
-    expect(addTxButton.props.children).toEqual(ADD_MULTISIG_BUTTON_TEXT)
+    expect(addTxButton.getElementsByTagName('span')[0].innerHTML).toEqual(ADD_MULTISIG_BUTTON_TEXT)
-    expect(addTxButton.props.disabled).toBe(true)
+    expect(addTxButton.hasAttribute('disabled')).toBe(true)
 
     await addEtherTo(address, '0.1')
     await sleep(1800)
 
-    expect(addTxButton.props.disabled).toBe(false)
+    expect(addTxButton.hasAttribute('disabled')).toBe(false)
   })
 
-  it('Withdrawn button disabled when balance is 0', async () => {
+  it('Withdraw button disabled when balance is 0', async () => {
     const Safe = TestUtils.findRenderedComponentWithType(SafeDom, SafeView)
     // $FlowFixMe
-    const buttons = TestUtils.scryRenderedComponentsWithType(Safe, Button)
+    const buttons = TestUtils.scryRenderedDOMComponentsWithTag(Safe, 'button')
-    const addTxButton = buttons[2]
+    const addWithdrawButton = buttons[WITHDRAW_INDEX]
-    expect(addTxButton.props.children).toEqual(WITHDRAWN_BUTTON_TEXT)
+    expect(addWithdrawButton.getElementsByTagName('span')[0].innerHTML).toEqual(WITHDRAW_BUTTON_TEXT)
-    expect(addTxButton.props.disabled).toBe(true)
+    expect(addWithdrawButton.hasAttribute('disabled')).toBe(true)
 
     await addEtherTo(address, '0.1')
     await sleep(1800)
 
-    expect(addTxButton.props.disabled).toBe(false)
+    expect(addWithdrawButton.hasAttribute('disabled')).toBe(false)
   })
 })

src/routes/safe/test/testMultisig.js

@@ -2,7 +2,6 @@
 import TestUtils from 'react-dom/test-utils'
 import { sleep } from '~/utils/timer'
 import { getBalanceInEtherOf } from '~/wallets/getWeb3'
-import Button from '~/components/layout/Button'
 import { ADD_MULTISIG_BUTTON_TEXT, SEE_MULTISIG_BUTTON_TEXT } from '~/routes/safe/component/Safe/MultisigTx'
 import { addEtherTo } from '~/test/utils/etherMovements'
 import SafeView from '~/routes/safe/component/Safe'
@@ -11,6 +10,7 @@ import TransactionComponent from '~/routes/safe/component/Transactions/Transacti
 import { safeTransactionsSelector } from '~/routes/safe/store/selectors/index'
 import { type GlobalState } from '~/store/index'
 import ListItemText from '~/components/List/ListItemText'
+import { MOVE_FUNDS_INDEX, LIST_TXS_INDEX } from '~/test/builder/safe.dom.utils'
 
 export const createMultisigTxFilling = async (
   SafeDom: React$Component<any, any>,
@@ -48,21 +48,22 @@ export const addFundsTo = async (SafeDom: React$Component<any, any>, destination
   const Safe = TestUtils.findRenderedComponentWithType(SafeDom, SafeView)
 
   // $FlowFixMe
-  const buttons = TestUtils.scryRenderedComponentsWithType(Safe, Button)
+  const buttons = TestUtils.scryRenderedDOMComponentsWithTag(Safe, 'button')
-  const addTxButton = buttons[3]
+  const addTxButton = buttons[MOVE_FUNDS_INDEX]
-  expect(addTxButton.props.children).toEqual(ADD_MULTISIG_BUTTON_TEXT)
+  expect(addTxButton.getElementsByTagName('span')[0].innerHTML).toEqual(ADD_MULTISIG_BUTTON_TEXT)
+
   await sleep(1800) // Give time to enable Add button
-  TestUtils.Simulate.click(TestUtils.scryRenderedDOMComponentsWithTag(addTxButton, 'button')[0])
+  TestUtils.Simulate.click(addTxButton)
 }
 
 export const listTxsOf = (SafeDom: React$Component<any, any>) => {
   const Safe = TestUtils.findRenderedComponentWithType(SafeDom, SafeView)
 
   // $FlowFixMe
-  const buttons = TestUtils.scryRenderedComponentsWithType(Safe, Button)
+  const buttons = TestUtils.scryRenderedDOMComponentsWithTag(Safe, 'button')
-  const seeTx = buttons[4]
+  const seeTx = buttons[LIST_TXS_INDEX]
-  expect(seeTx.props.children).toEqual(SEE_MULTISIG_BUTTON_TEXT)
+  expect(seeTx.getElementsByTagName('span')[0].innerHTML).toEqual(SEE_MULTISIG_BUTTON_TEXT)
-  TestUtils.Simulate.click(TestUtils.scryRenderedDOMComponentsWithTag(seeTx, 'button')[0])
+  TestUtils.Simulate.click(seeTx)
 }
 
 export const getListItemsFrom = (SafeDom: React$Component<any, any>) => {

src/test/builder/safe.dom.utils.js

@@ -8,9 +8,10 @@ import { sleep } from '~/utils/timer'
 export const EXPAND_OWNERS_INDEX = 0
 export const ADD_OWNERS_INDEX = 1
 export const EDIT_THRESHOLD_INDEX = 2
-export const WITHDRAWN_INDEX = 3
+export const EDIT_INDEX = 3
-export const MOVE_FUNDS_INDEX = 4
+export const WITHDRAW_INDEX = 4
-export const LIST_TXS_INDEX = 5
+export const MOVE_FUNDS_INDEX = 5
+export const LIST_TXS_INDEX = 6
 
 export const listTxsClickingOn = async (seeTxsButton: Element) => {
   expect(seeTxsButton.getElementsByTagName('span')[0].innerHTML).toEqual(SEE_MULTISIG_BUTTON_TEXT)

src/test/safe.dom.test.js

@@ -1,13 +1,13 @@
 // @flow
 import TestUtils from 'react-dom/test-utils'
 import Transaction from '~/routes/safe/component/Transactions/Transaction'
-import { listTxsClickingOn, LIST_TXS_INDEX, MOVE_FUNDS_INDEX, ADD_OWNERS_INDEX, EXPAND_OWNERS_INDEX, EDIT_THRESHOLD_INDEX, WITHDRAWN_INDEX, refreshTransactions } from '~/test/builder/safe.dom.utils'
+import { listTxsClickingOn, LIST_TXS_INDEX, MOVE_FUNDS_INDEX, ADD_OWNERS_INDEX, EXPAND_OWNERS_INDEX, EDIT_THRESHOLD_INDEX, WITHDRAW_INDEX, refreshTransactions } from '~/test/builder/safe.dom.utils'
 import { renderSafeInDom, type DomSafe } from '~/test/builder/safe.dom.builder'
 import { sendMoveFundsForm, checkMinedMoveFundsTx, checkPendingMoveFundsTx } from '~/test/utils/transactions/moveFunds.helper'
 import { sendAddOwnerForm, checkMinedAddOwnerTx, checkPendingAddOwnerTx } from '~/test/utils/transactions/addOwner.helper'
 import { sendRemoveOwnerForm, checkMinedRemoveOwnerTx, checkPendingRemoveOwnerTx } from '~/test/utils/transactions/removeOwner.helper'
 import { checkMinedThresholdTx, sendChangeThresholdForm, checkThresholdOf } from '~/test/utils/transactions/threshold.helper'
-import { sendWithdrawnForm, checkMinedWithdrawnTx } from '~/test/utils/transactions/withdrawn.helper'
+import { sendWithdrawForm, checkMinedWithdrawTx } from '~/test/utils/transactions/withdraw.helper'
 import { processTransaction } from '~/routes/safe/component/Transactions/processTransactions'
 import { checkBalanceOf } from '~/test/utils/etherMovements'
 
@@ -24,7 +24,7 @@ describe('DOM > Feature > SAFE MULTISIG TX 1 Owner 1 Threshold', () => {
 
     // WHEN
     await sendMoveFundsForm(SafeDom, safeButtons[MOVE_FUNDS_INDEX], 'Move funds', '0.01', accounts[1])
-    await sendWithdrawnForm(SafeDom, safeButtons[WITHDRAWN_INDEX], '0.01', accounts[3])
+    await sendWithdrawForm(SafeDom, safeButtons[WITHDRAW_INDEX], '0.01', accounts[3])
     await sendAddOwnerForm(SafeDom, safeButtons[ADD_OWNERS_INDEX], 'Adol Metamask 2', accounts[1])
     await sendChangeThresholdForm(SafeDom, safeButtons[EDIT_THRESHOLD_INDEX], '2')
 
@@ -33,9 +33,9 @@ describe('DOM > Feature > SAFE MULTISIG TX 1 Owner 1 Threshold', () => {
     const transactions = TestUtils.scryRenderedComponentsWithType(SafeDom, Transaction)
 
     checkMinedMoveFundsTx(transactions[0], 'Move funds')
-    await checkMinedWithdrawnTx(address, '0.08') // 0.1 - 0.01 tx - 0.01 withdrawn
+    await checkMinedWithdrawTx(transactions[1], 'Withdraw movement of 0.01', address, '0.08') // 0.1 - 0.01 tx - 0.01 withdraw
-    checkMinedAddOwnerTx(transactions[1], 'Add Owner Adol Metamask 2')
+    checkMinedAddOwnerTx(transactions[2], 'Add Owner Adol Metamask 2')
-    checkMinedThresholdTx(transactions[2], 'Change Safe\'s threshold')
+    checkMinedThresholdTx(transactions[3], 'Change Safe\'s threshold')
   })
 
   it('mines withdraw process correctly all multisig txs in a 2 owner & 2 threshold safe', async () => {
@@ -48,17 +48,17 @@ describe('DOM > Feature > SAFE MULTISIG TX 1 Owner 1 Threshold', () => {
     await sendMoveFundsForm(SafeDom, safeButtons[MOVE_FUNDS_INDEX], 'Buy batteries', '0.01', accounts[1])
     const increaseThreshold = true
     await sendAddOwnerForm(SafeDom, safeButtons[ADD_OWNERS_INDEX], 'Adol Metamask 3', accounts[2], increaseThreshold)
-    await sendWithdrawnForm(SafeDom, safeButtons[WITHDRAWN_INDEX], '0.01', accounts[3])
+    await sendWithdrawForm(SafeDom, safeButtons[WITHDRAW_INDEX], '0.01', accounts[3])
 
     // THEN
     await listTxsClickingOn(safeButtons[LIST_TXS_INDEX])
     const transactions = TestUtils.scryRenderedComponentsWithType(SafeDom, Transaction)
 
     const statusses = ['Adol Metamask 2 [Not confirmed]', 'Adolfo 1 Eth Account [Confirmed]']
-    await checkPendingMoveFundsTx(transactions[3], 2, 'Buy batteries', statusses)
+    await checkPendingMoveFundsTx(transactions[4], 2, 'Buy batteries', statusses)
-    await checkPendingAddOwnerTx(transactions[4], 2, 'Add Owner Adol Metamask 3', statusses)
+    await checkPendingAddOwnerTx(transactions[5], 2, 'Add Owner Adol Metamask 3', statusses)
     // checkMinedThresholdTx(transactions[4], 'Add Owner Adol Metamask 3')
-    await checkMinedWithdrawnTx(address, '0.07')
+    await checkMinedWithdrawTx(transactions[6], 'Withdraw movement of 0.01', address, '0.07')
   })
 
   it('approves and executes pending transactions', async () => {
@@ -68,17 +68,17 @@ describe('DOM > Feature > SAFE MULTISIG TX 1 Owner 1 Threshold', () => {
     } = domSafe
 
     let transactions = TestUtils.scryRenderedComponentsWithType(SafeDom, Transaction)
-    expect(transactions.length).toBe(5)
+    expect(transactions.length).toBe(7)
 
     // WHEN... processing pending TXs
-    await processTransaction(address, transactions[3].props.transaction, 1, accounts[1])
     await processTransaction(address, transactions[4].props.transaction, 1, accounts[1])
+    await processTransaction(address, transactions[5].props.transaction, 1, accounts[1])
     await refreshTransactions(store)
 
     // THEN
-    checkMinedMoveFundsTx(transactions[3], 'Buy batteries')
+    checkMinedMoveFundsTx(transactions[4], 'Buy batteries')
     await checkBalanceOf(address, '0.06')
-    checkMinedAddOwnerTx(transactions[4], 'Add Owner Adol Metamask 3')
+    checkMinedAddOwnerTx(transactions[5], 'Add Owner Adol Metamask 3')
     await checkThresholdOf(address, 3)
 
     // WHEN... reducing threshold
@@ -87,22 +87,22 @@ describe('DOM > Feature > SAFE MULTISIG TX 1 Owner 1 Threshold', () => {
     // THEN
     await listTxsClickingOn(safeButtons[LIST_TXS_INDEX])
     transactions = TestUtils.scryRenderedComponentsWithType(SafeDom, Transaction)
-    expect(transactions.length).toBe(6)
+    expect(transactions.length).toBe(8)
     let statusses = ['Adol Metamask 3 [Not confirmed]', 'Adol Metamask 2 [Not confirmed]', 'Adolfo 1 Eth Account [Confirmed]']
-    await checkPendingRemoveOwnerTx(transactions[5], 3, 'Remove Owner Adol Metamask 3', statusses)
+    await checkPendingRemoveOwnerTx(transactions[7], 3, 'Remove Owner Adol Metamask 3', statusses)
 
-    await processTransaction(address, transactions[5].props.transaction, 1, accounts[1])
+    await processTransaction(address, transactions[7].props.transaction, 1, accounts[1])
     await refreshTransactions(store)
     transactions = TestUtils.scryRenderedComponentsWithType(SafeDom, Transaction)
     statusses = ['Adol Metamask 3 [Not confirmed]', 'Adol Metamask 2 [Confirmed]', 'Adolfo 1 Eth Account [Confirmed]']
-    await checkPendingRemoveOwnerTx(transactions[5], 2, 'Remove Owner Adol Metamask 3', statusses)
+    await checkPendingRemoveOwnerTx(transactions[7], 2, 'Remove Owner Adol Metamask 3', statusses)
     await checkThresholdOf(address, 3)
 
-    await processTransaction(address, transactions[5].props.transaction, 2, accounts[2])
+    await processTransaction(address, transactions[7].props.transaction, 2, accounts[2])
     await refreshTransactions(store)
     await checkThresholdOf(address, 2)
     transactions = TestUtils.scryRenderedComponentsWithType(SafeDom, Transaction)
-    await checkMinedRemoveOwnerTx(transactions[5], 'Remove Owner')
+    await checkMinedRemoveOwnerTx(transactions[7], 'Remove Owner')
 
     // WHEN... changing threshold
     await sendChangeThresholdForm(SafeDom, safeButtons[EDIT_THRESHOLD_INDEX], '1')
@@ -110,7 +110,7 @@ describe('DOM > Feature > SAFE MULTISIG TX 1 Owner 1 Threshold', () => {
 
     // THEN
     transactions = TestUtils.scryRenderedComponentsWithType(SafeDom, Transaction)
-    await processTransaction(address, transactions[6].props.transaction, 1, accounts[1])
+    await processTransaction(address, transactions[8].props.transaction, 1, accounts[1])
     await checkThresholdOf(address, 1)
   })
 })

src/test/utils/etherMovements.js

@@ -1,7 +1,7 @@
 // @flow
 import { getProviderInfo, getBalanceInEtherOf, getWeb3 } from '~/wallets/getWeb3'
 import { promisify } from '~/utils/promisify'
-import withdrawn, { DESTINATION_PARAM, VALUE_PARAM } from '~/routes/safe/component/Withdrawn/withdrawn'
+import withdraw, { DESTINATION_PARAM, VALUE_PARAM } from '~/routes/safe/component/Withdraw/withdraw'
 
 export const addEtherTo = async (address: string, eth: string) => {
   const web3 = getWeb3()
@@ -10,7 +10,7 @@ export const addEtherTo = async (address: string, eth: string) => {
   return promisify(cb => web3.eth.sendTransaction(txData, cb))
 }
 
-export const executeWithdrawnOn = async (safeAddress: string, value: number) => {
+export const executeWithdrawOn = async (safeAddress: string, value: number) => {
   const providerInfo = await getProviderInfo()
   const userAddress = providerInfo.account
 
@@ -19,7 +19,7 @@ export const executeWithdrawnOn = async (safeAddress: string, value: number) =>
     [VALUE_PARAM]: `${value}`,
   }
 
-  return withdrawn(values, safeAddress, userAddress)
+  return withdraw(values, safeAddress, userAddress)
 }
 
 export const checkBalanceOf = async (addressToTest: string, value: string) => {

src/test/utils/transactions/withdraw.helper.js

@@ -2,15 +2,16 @@
 import TestUtils from 'react-dom/test-utils'
 import { sleep } from '~/utils/timer'
 import { checkBalanceOf } from '~/test/utils/etherMovements'
+import { checkMinedTx } from '~/test/builder/safe.dom.utils'
 
-export const sendWithdrawnForm = (
+export const sendWithdrawForm = (
   SafeDom: React$Component<any, any>,
-  withdrawnButton: React$Component<any, any>,
+  withdrawButton: React$Component<any, any>,
   amount: string,
   destination: string,
 ) => {
   // load add multisig form component
-  TestUtils.Simulate.click(withdrawnButton)
+  TestUtils.Simulate.click(withdrawButton)
   // give time to re-render it
   sleep(600)
 
@@ -31,6 +32,13 @@ export const sendWithdrawnForm = (
   return sleep(2500)
 }
 
-export const checkMinedWithdrawnTx = async (address: string, funds: number) => {
+export const checkMinedWithdrawTx = async (
+  Transaction: React$Component<any, any>,
+  name: string,
+  address: string,
+  funds: number,
+) => {
   await checkBalanceOf(address, funds)
+
+  checkMinedTx(Transaction, name)
 }