Support off chain signatures

Support transactions with refund

Display refund in UI

src/logic/safe/transactions/send.js

@@ -15,6 +15,11 @@ export const getApprovalTransaction = async (
   data: string,
   operation: Operation,
   nonce: number,
+  safeTxGas: number,
+  baseGas: number,
+  gasPrice: number,
+  gasToken: string,
+  refundReceiver: string,
   sender: string,
 ) => {
   const txHash = await safeInstance.getTransactionHash(
@@ -22,11 +27,11 @@ export const getApprovalTransaction = async (
     valueInWei,
     data,
     operation,
-    0,
-    0,
-    0,
-    ZERO_ADDRESS,
-    ZERO_ADDRESS,
+    safeTxGas,
+    baseGas,
+    gasPrice,
+    gasToken,
+    refundReceiver,
     nonce,
     {
       from: sender,
@@ -40,7 +45,6 @@ export const getApprovalTransaction = async (
     return contract.methods.approveHash(txHash)
   } catch (err) {
     console.error(`Error while approving transaction: ${err}`)
-
     throw err
   }
 }
@@ -52,6 +56,11 @@ export const getExecutionTransaction = async (
   data: string,
   operation: Operation,
   nonce: string | number,
+  safeTxGas: string | number,
+  baseGas: string | number,
+  gasPrice: string | number,
+  gasToken: string,
+  refundReceiver: string,
   sender: string,
   sigs: string,
 ) => {
@@ -59,7 +68,7 @@ export const getExecutionTransaction = async (
     const web3 = getWeb3()
     const contract = new web3.eth.Contract(GnosisSafeSol.abi, safeInstance.address)
 
-    return contract.methods.execTransaction(to, valueInWei, data, operation, 0, 0, 0, ZERO_ADDRESS, ZERO_ADDRESS, sigs)
+    return contract.methods.execTransaction(to, valueInWei, data, operation, safeTxGas, baseGas, gasPrice, gasToken, refundReceiver, sigs)
   } catch (err) {
     console.error(`Error while creating transaction: ${err}`)
 

src/logic/safe/transactions/txHistory.js

@@ -2,7 +2,6 @@
 import axios from 'axios'
 import { getWeb3 } from '~/logic/wallets/getWeb3'
 import { getTxServiceUriFrom, getTxServiceHost } from '~/config'
-import { ZERO_ADDRESS } from '~/logic/wallets/ethAddresses'
 
 export type TxServiceType = 'confirmation' | 'execution' | 'initialised'
 export type Operation = 0 | 1 | 2
@@ -14,6 +13,11 @@ const calculateBodyFrom = async (
   data: string,
   operation: Operation,
   nonce: string | number,
+  safeTxGas: string | number,
+  baseGas: string | number,
+  gasPrice: string | number,
+  gasToken: string,
+  refundReceiver: string,
   transactionHash: string,
   sender: string,
   confirmationType: TxServiceType,
@@ -23,11 +27,11 @@ const calculateBodyFrom = async (
     valueInWei,
     data,
     operation,
-    0,
-    0,
-    0,
-    ZERO_ADDRESS,
-    ZERO_ADDRESS,
+    safeTxGas,
+    baseGas,
+    gasPrice,
+    gasToken,
+    refundReceiver,
     nonce,
   )
 
@@ -37,11 +41,11 @@ const calculateBodyFrom = async (
     data,
     operation,
     nonce,
-    safeTxGas: 0,
-    baseGas: 0,
-    gasPrice: 0,
-    gasToken: ZERO_ADDRESS,
-    refundReceiver: ZERO_ADDRESS,
+    safeTxGas,
+    baseGas,
+    gasPrice,
+    gasToken,
+    refundReceiver,
     contractTransactionHash,
     transactionHash,
     sender: getWeb3().utils.toChecksumAddress(sender),
@@ -63,12 +67,32 @@ export const saveTxToHistory = async (
   data: string,
   operation: Operation,
   nonce: number | string,
+  safeTxGas: string | number,
+  baseGas: string | number,
+  gasPrice: string | number,
+  gasToken: string,
+  refundReceiver: string,
   txHash: string,
   sender: string,
   type: TxServiceType,
 ) => {
   const url = buildTxServiceUrl(safeInstance.address)
-  const body = await calculateBodyFrom(safeInstance, to, valueInWei, data, operation, nonce, txHash, sender, type)
+  const body = await calculateBodyFrom(
+    safeInstance,
+    to,
+    valueInWei,
+    data,
+    operation,
+    nonce,
+    safeTxGas,
+    baseGas,
+    gasPrice,
+    gasToken,
+    refundReceiver,
+    txHash,
+    sender,
+    type,
+  )
   const response = await axios.post(url, body)
 
   if (response.status !== 202) {

src/logic/wallets/ethAddresses.js

@@ -16,5 +16,7 @@ export const sameAddress = (firstAddress: string, secondAddress: string): boolea
 export const shortVersionOf = (address: string, cut: number) => {
   const final = 42 - cut
 
+  if (!address) return 'Unknown address'
+  if (address.length < final) return address
   return `${address.substring(0, cut)}...${address.substring(final)}`
 }

src/routes/safe/components/Transactions/TxsTable/ExpandedTx/TxDescription/utils.js

@@ -54,6 +54,9 @@ export const getTxData = (tx: Transaction): DecodedTxData => {
     }
   } else if (tx.cancellationTx) {
     txData.cancellationTx = true
+  } else {
+    txData.recipient = tx.recipient
+    txData.value = 0
   }
 
   return txData

src/routes/safe/components/Transactions/TxsTable/ExpandedTx/index.jsx

@@ -98,6 +98,16 @@ const ExpandedTx = ({
                   {formatDate(tx.executionDate)}
                 </Paragraph>
               )}
+              {tx.refundParams && (
+                <Paragraph noMargin>
+                  <Bold>TX refund: </Bold>
+                  max.
+                  {' '}
+                  {tx.refundParams.fee}
+                  {' '}
+                  {tx.refundParams.symbol}
+                </Paragraph>
+              )}
             </Block>
             <Hairline />
             <TxDescription tx={tx} />

src/routes/safe/container/selector.js

@@ -1,7 +1,6 @@
 // @flow
 import { List, Map } from 'immutable'
 import { createSelector, createStructuredSelector, type Selector } from 'reselect'
-import { isAfter, parseISO } from 'date-fns'
 import {
   safeSelector,
   safeActiveTokensSelector,
@@ -115,9 +114,7 @@ const extendedTransactionsSelector: Selector<GlobalState, RouterProps, List<Tran
       let replacementTransaction
       if (!tx.isExecuted) {
         replacementTransaction = transactions.findLast(
-          (transaction) => (transaction.nonce === tx.nonce
-              && isAfter(parseISO(transaction.submissionDate), parseISO(tx.submissionDate)))
-            || transaction.nonce > tx.nonce,
+          (transaction) => transaction.isExecuted && transaction.nonce >= tx.nonce,
         )
         if (replacementTransaction) {
           extendedTx = tx.set('cancelled', true)

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

@@ -54,9 +54,15 @@ const createTransaction = (
   let tx
   try {
     if (isExecution) {
-      tx = await getExecutionTransaction(safeInstance, to, valueInWei, txData, CALL, nonce, from, sigs)
+      tx = await getExecutionTransaction(
+        safeInstance, to, valueInWei, txData, CALL, nonce, 
+        0, 0, 0, ZERO_ADDRESS, ZERO_ADDRESS, from, sigs
+      )
     } else {
-      tx = await getApprovalTransaction(safeInstance, to, valueInWei, txData, CALL, nonce, from)
+      tx = await getApprovalTransaction(
+        safeInstance, to, valueInWei, txData, CALL, nonce, 
+        0, 0, 0, ZERO_ADDRESS, ZERO_ADDRESS, from, sigs
+      )
     }
 
     const sendParams = { from, value: 0 }
@@ -81,6 +87,11 @@ const createTransaction = (
             txData,
             CALL,
             nonce,
+            0,
+            0,
+            0,
+            ZERO_ADDRESS,
+            ZERO_ADDRESS,
             txHash,
             from,
             isExecution ? TX_TYPE_EXECUTION : TX_TYPE_CONFIRMATION,
@@ -94,7 +105,6 @@ const createTransaction = (
       })
       .then((receipt) => {
         closeSnackbar(pendingExecutionKey)
-
         showSnackbar(
           isExecution
             ? notificationsQueue.afterExecution.noMoreConfirmationsNeeded

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

@@ -16,6 +16,7 @@ import { getHumanFriendlyToken } from '~/logic/tokens/store/actions/fetchTokens'
 import { isTokenTransfer } from '~/logic/tokens/utils/tokenHelpers'
 import { decodeParamsFromSafeMethod } from '~/logic/contracts/methodIds'
 import { ALTERNATIVE_TOKEN_ABI } from '~/logic/tokens/utils/alternativeAbi'
+import { ZERO_ADDRESS } from '~/logic/wallets/ethAddresses'
 
 let web3
 
@@ -32,6 +33,11 @@ type TxServiceModel = {
   data: string,
   operation: number,
   nonce: number,
+  safeTxGas: number,
+  baseGas: number,
+  gasPrice: number,
+  gasToken: string,
+  refundReceiver: string,
   safeTxHash: string,
   submissionDate: string,
   executionDate: string,
@@ -55,6 +61,7 @@ export const buildTransactionFrom = async (
         owner: makeOwner({ address: conf.owner, name: ownerName }),
         type: ((conf.confirmationType.toLowerCase(): any): TxServiceType),
         hash: conf.transactionHash,
+        signature: conf.signature,
       })
     }),
   )
@@ -63,6 +70,27 @@ export const buildTransactionFrom = async (
   const isSendTokenTx = await isTokenTransfer(tx.data, tx.value)
   const customTx = tx.to !== safeAddress && !!tx.data && !isSendTokenTx
 
+  let refundParams = null
+  if (tx.gasPrice > 0) {
+    let refundSymbol = 'ETH'
+    let decimals = 18
+    if (tx.gasToken !== ZERO_ADDRESS) {
+      const gasToken = await (await getHumanFriendlyToken()).at(tx.gasToken)
+      refundSymbol = await gasToken.symbol()
+      decimals = await gasToken.decimals()
+    }
+
+    const feeString = (tx.gasPrice * (tx.baseGas + tx.safeTxGas)).toString().padStart(decimals, 0)
+    const whole = feeString.slice(0, feeString.length - decimals) || '0'
+    const fraction = feeString.slice(feeString.length - decimals)
+
+    const formattedFee = `${whole}.${fraction}`
+    refundParams = {
+      fee: formattedFee,
+      symbol: refundSymbol,
+    }
+  }
+
   let symbol = 'ETH'
   let decimals = 18
   let decodedParams
@@ -102,6 +130,13 @@ export const buildTransactionFrom = async (
     decimals,
     recipient: tx.to,
     data: tx.data ? tx.data : EMPTY_DATA,
+    operation: tx.operation,
+    safeTxGas: tx.safeTxGas,
+    baseGas: tx.baseGas,
+    gasPrice: tx.gasPrice,
+    gasToken: tx.gasToken,
+    refundReceiver: tx.refundReceiver,
+    refundParams,
     isExecuted: tx.isExecuted,
     submissionDate: tx.submissionDate,
     executionDate: tx.executionDate,

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

@@ -11,7 +11,6 @@ import {
   type NotifiedTransaction,
   getApprovalTransaction,
   getExecutionTransaction,
-  CALL,
   saveTxToHistory,
   TX_TYPE_EXECUTION,
   TX_TYPE_CONFIRMATION,
@@ -31,18 +30,27 @@ export const generateSignaturesFromTxConfirmations = (
 ) => {
   // The constant parts need to be sorted so that the recovered signers are sorted ascending
   // (natural order) by address (not checksummed).
-  let confirmedAdresses = confirmations.map((conf) => conf.owner.address)
+  const confirmationsMap = confirmations.reduce((map, obj) => {
+    map[obj.owner.address] = obj // eslint-disable-line no-param-reassign
+    return map
+  }, {})
 
   if (preApprovingOwner) {
-    confirmedAdresses = confirmedAdresses.push(preApprovingOwner)
+    confirmationsMap[preApprovingOwner] = { owner: preApprovingOwner }
   }
 
   let sigs = '0x'
-  confirmedAdresses.sort().forEach((addr) => {
-    sigs += `000000000000000000000000${addr.replace(
-      '0x',
-      '',
-    )}000000000000000000000000000000000000000000000000000000000000000001`
+  Object.keys(confirmationsMap).sort().forEach((addr) => {
+    const conf = confirmationsMap[addr]
+    if (conf.signature) {
+      sigs += conf.signature.slice(2)
+    } else {
+      // https://gnosis-safe.readthedocs.io/en/latest/contracts/signatures.html#pre-validated-signatures
+      sigs += `000000000000000000000000${addr.replace(
+        '0x',
+        '',
+      )}000000000000000000000000000000000000000000000000000000000000000001`
+    }
   })
   return sigs
 }
@@ -60,7 +68,6 @@ const processTransaction = (
 
   const safeInstance = await getGnosisSafeInstanceAt(safeAddress)
   const from = userAccountSelector(state)
-  const nonce = (await safeInstance.nonce()).toString()
   const threshold = (await safeInstance.getThreshold()).toNumber()
   const shouldExecute = threshold === tx.confirmations.size || approveAndExecute
 
@@ -86,13 +93,31 @@ const processTransaction = (
         tx.recipient,
         tx.value,
         tx.data,
-        CALL,
-        nonce,
+        tx.operation,
+        tx.nonce,
+        tx.safeTxGas,
+        tx.baseGas,
+        tx.gasPrice,
+        tx.gasToken,
+        tx.refundReceiver,
         from,
         sigs,
       )
     } else {
-      transaction = await getApprovalTransaction(safeInstance, tx.recipient, tx.value, tx.data, CALL, nonce, from)
+      transaction = await getApprovalTransaction(
+        safeInstance,
+        tx.recipient,
+        tx.value,
+        tx.data,
+        tx.operation,
+        tx.nonce,
+        tx.safeTxGas,
+        tx.baseGas,
+        tx.gasPrice,
+        tx.gasToken,
+        tx.refundReceiver,
+        from,
+      )
     }
 
     const sendParams = { from, value: 0 }
@@ -115,8 +140,13 @@ const processTransaction = (
             tx.recipient,
             tx.value,
             tx.data,
-            CALL,
-            nonce,
+            tx.operation,
+            tx.nonce,
+            tx.safeTxGas,
+            tx.baseGas,
+            tx.gasPrice,
+            tx.gasToken,
+            tx.refundReceiver,
             txHash,
             from,
             shouldExecute ? TX_TYPE_EXECUTION : TX_TYPE_CONFIRMATION,

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

@@ -8,12 +8,14 @@ export type ConfirmationProps = {
   owner: Owner,
   type: TxServiceType,
   hash: string,
+  signature?: string,
 }
 
 export const makeConfirmation: RecordFactory<ConfirmationProps> = Record({
   owner: makeOwner(),
   type: 'initialised',
   hash: '',
+  signature: null,
 })
 
 export type Confirmation = RecordOf<ConfirmationProps>

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

@@ -2,6 +2,7 @@
 import { List, Record } from 'immutable'
 import type { RecordFactory, RecordOf } from 'immutable'
 import { type Confirmation } from '~/routes/safe/store/models/confirmation'
+import { ZERO_ADDRESS } from '~/logic/wallets/ethAddresses'
 
 export type TransactionStatus = 'awaiting_confirmations' | 'success' | 'cancelled' | 'awaiting_execution'
 
@@ -11,7 +12,13 @@ export type TransactionProps = {
   value: string,
   confirmations: List<Confirmation>,
   recipient: string,
-  data: string,
+  data?: string,
+  operation: number,
+  safeTxGas: number,
+  baseGas: number,
+  gasPrice: number,
+  gasToken: string,
+  refundReceiver: string,
   isExecuted: boolean,
   submissionDate: string,
   executionDate: string,
@@ -26,6 +33,7 @@ export type TransactionProps = {
   status?: TransactionStatus,
   isTokenTransfer: boolean,
   decodedParams?: Object,
+  refundParams?: Object,
 }
 
 export const makeTransaction: RecordFactory<TransactionProps> = Record({
@@ -34,7 +42,13 @@ export const makeTransaction: RecordFactory<TransactionProps> = Record({
   value: 0,
   confirmations: List([]),
   recipient: '',
-  data: '',
+  data: null,
+  operation: 0,
+  safeTxGas: 0,
+  baseGas: 0,
+  gasPrice: 0,
+  gasToken: ZERO_ADDRESS,
+  refundReceiver: ZERO_ADDRESS,
   isExecuted: false,
   submissionDate: '',
   executionDate: '',
@@ -49,6 +63,7 @@ export const makeTransaction: RecordFactory<TransactionProps> = Record({
   decimals: 18,
   isTokenTransfer: false,
   decodedParams: {},
+  refundParams: null,
 })
 
 export type Transaction = RecordOf<TransactionProps>