Refactoring threshold

src/logic/safe/safeBlockchainOperations.js

@@ -19,11 +19,14 @@ export const approveTransaction = async (
   const gasPrice = await calculateGasPrice()
 
   if (signaturesViaMetamask()) {
+    // return executeTransaction(safeAddress, to, valueInWei, data, operation, nonce, sender)
     const safe = await getSafeEthereumInstance(safeAddress)
     const txGasEstimate = await generateTxGasEstimateFrom(safe, safeAddress, data, to, valueInWei, operation)
     const signature =
       await generateMetamaskSignature(safe, safeAddress, sender, to, valueInWei, nonce, data, operation, txGasEstimate)
     storeSignature(safeAddress, nonce, signature)
+
+    return undefined
   }
 
   const gnosisSafe = await getSafeEthereumInstance(safeAddress)
@@ -58,7 +61,6 @@ export const executeTransaction = async (
     storeSignature(safeAddress, nonce, signature)
 
     const sigs = getSignaturesFrom(safeAddress, nonce)
-
     const threshold = await safe.getThreshold()
     const gas =
       await estimateDataGas(safe, to, valueInWei, data, operation, txGasEstimate, 0, nonce, Number(threshold), 0)

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

@@ -3,6 +3,7 @@ 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 OpenPaper from '~/components/Stepper/OpenPaper'
 import Heading from '~/components/layout/Heading'
 import Paragraph from '~/components/layout/Paragraph'
 import { THRESHOLD_PARAM } from '~/routes/safe/component/Threshold/ThresholdForm'
@@ -16,8 +17,8 @@ const spinnerStyle = {
   minHeight: '50px',
 }
 
-const Review = () => ({ values, submitting }: FormProps) => (
-  <Block>
+const Review = () => (controls: React$Node, { values, submitting }: FormProps) => (
+  <OpenPaper controls={controls}>
     <Heading tag="h2">Review the Threshold operation</Heading>
     <Paragraph align="left">
       <Bold>The new threshold will be: </Bold> {values[THRESHOLD_PARAM]}
@@ -25,7 +26,7 @@ const Review = () => ({ values, submitting }: FormProps) => (
     <Block style={spinnerStyle}>
       { submitting && <CircularProgress size={50} /> }
     </Block>
-  </Block>
+  </OpenPaper>
 )
 
 export default Review

src/routes/safe/component/Threshold/ThresholdForm/index.jsx

@@ -2,6 +2,7 @@
 import * as React from 'react'
 import Block from '~/components/layout/Block'
 import Heading from '~/components/layout/Heading'
+import OpenPaper from '~/components/Stepper/OpenPaper'
 import Field from '~/components/forms/Field'
 import TextField from '~/components/forms/TextField'
 import { composeValidators, minValue, maxValue, mustBeInteger, required } from '~/components/forms/validator'
@@ -14,8 +15,8 @@ type ThresholdProps = {
   safe: Safe,
 }
 
-const ThresholdForm = ({ numOwners, safe }: ThresholdProps) => () => (
-  <Block margin="md">
+const ThresholdForm = ({ numOwners, safe }: ThresholdProps) => (controls: React$Node) => (
+  <OpenPaper controls={controls}>
     <Heading tag="h2" margin="lg">
       {'Change safe\'s threshold'}
     </Heading>
@@ -37,7 +38,7 @@ const ThresholdForm = ({ numOwners, safe }: ThresholdProps) => () => (
         text="Safe's threshold"
       />
     </Block>
-  </Block>
+  </OpenPaper>
 )
 
 export default ThresholdForm

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

@@ -36,7 +36,7 @@ class Threshold extends React.PureComponent<Props, State> {
       const newThreshold = values[THRESHOLD_PARAM]
       const safeAddress = safe.get('address')
       const gnosisSafe = await getSafeEthereumInstance(safeAddress)
-      const nonce = Date.now()
+      const nonce = await gnosisSafe.nonce()
       const data = gnosisSafe.contract.changeThreshold.getData(newThreshold)
       await createTransaction(safe, `Change Safe's threshold [${nonce}]`, safeAddress, 0, nonce, userAddress, data)
       await this.props.fetchTransactions(safeAddress)