WA-238 Delaying fetchDailyLimit after withdrawing

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

@@ -1,16 +1,22 @@
 // @flow
 import * as React from 'react'
+import { CircularProgress } from 'material-ui/Progress'
 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 './withdrawn'
+import { DESTINATION_PARAM, VALUE_PARAM } from '~/routes/safe/component/Withdrawn/withdrawn'
 
 type FormProps = {
   values: Object,
+  submitting: boolean,
 }
 
-const Review = () => ({ values }: FormProps) => (
+const spinnerStyle = {
+  minHeight: '50px',
+}
+
+const Review = () => ({ values, submitting }: FormProps) => (
   <Block>
     <Heading tag="h2">Review the Withdrawn Operation</Heading>
     <Paragraph align="left">
@@ -19,6 +25,9 @@ const Review = () => ({ values }: FormProps) => (
     <Paragraph align="left">
       <Bold>Value in ETH: </Bold> {values[VALUE_PARAM]}
     </Paragraph>
+    <Block style={spinnerStyle}>
+      { submitting && <CircularProgress size={50} /> }
+    </Block>
   </Block>
 )
 

src/routes/safe/component/Withdrawn/WithdrawnForm/index.jsx

@@ -5,7 +5,7 @@ import TextField from '~/components/forms/TextField'
 import { composeValidators, mustBeNumber, 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 './withdrawn'
+import { DESTINATION_PARAM, VALUE_PARAM } from '~/routes/safe/component/Withdrawn/withdrawn'
 
 export const CONFIRMATIONS_ERROR = 'Number of confirmations can not be higher than the number of owners'
 

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

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

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

@@ -3,6 +3,8 @@ import * as React from 'react'
 import { connect } from 'react-redux'
 import Stepper from '~/components/Stepper'
 import { SAFELIST_ADDRESS } from '~/routes/routes'
+import { sleep } from '~/utils/timer'
+import actions, { type Actions } from './actions'
 import selector, { type SelectorProps } from './selector'
 import withdrawn from './withdrawn'
 import WithdrawnForm from './WithdrawnForm'
@@ -12,7 +14,7 @@ const getSteps = () => [
   'Fill Withdrawn Form', 'Review Withdrawn',
 ]
 
-type Props = SelectorProps & {
+type Props = SelectorProps & Actions & {
   safeAddress: string,
   dailyLimit: DailyLimit,
 }
@@ -32,6 +34,8 @@ class Withdrawn extends React.Component<Props, State> {
     try {
       const { safeAddress, userAddress } = this.props
       await withdrawn(values, safeAddress, userAddress)
+      await sleep(5000)
+      this.props.fetchDailyLimit(safeAddress)
       this.setState({ done: true })
     } catch (error) {
       this.setState({ done: false })
@@ -66,5 +70,5 @@ class Withdrawn extends React.Component<Props, State> {
   }
 }
 
-export default connect(selector)(Withdrawn)
+export default connect(selector, actions)(Withdrawn)
 

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

@@ -24,6 +24,3 @@ describe('Safe Blockchain Test', () => {
     expect(executeWithdrawnOn(safeAddress, value)).rejects.toThrow('VM Exception while processing transaction: revert')
   })
 })
-// }
-
-// export default updateDailyLimitReducerTests

src/routes/safe/container/actions.js

@@ -1,10 +1,13 @@
 // @flow
 import fetchBalance from '~/routes/safe/store/actions/fetchBalance'
+import fetchDailyLimit from '~/routes/safe/store/actions/fetchDailyLimit'
 
 export type Actions = {
   fetchBalance: typeof fetchBalance,
+  fetchDailyLimit: typeof fetchDailyLimit,
 }
 
 export default {
   fetchBalance,
+  fetchDailyLimit,
 }

src/routes/safe/container/index.jsx

@@ -17,6 +17,8 @@ class SafeView extends React.PureComponent<Props> {
       const safeAddress: string = safe.get('address')
       fetchBalance(safeAddress)
     }, 1500)
+
+    this.props.fetchDailyLimit(this.props.safe.get('address'))
   }
 
   componentWillUnmount() {