Chore: don't use safeTxGas on Safes >=1.3.0

src/config/networks/network.d.ts

@@ -25,6 +25,7 @@ export enum FEATURES {
   CONTRACT_INTERACTION = 'CONTRACT_INTERACTION',
   DOMAIN_LOOKUP = 'DOMAIN_LOOKUP',
   SPENDING_LIMIT = 'SPENDING_LIMIT',
+  SAFE_TX_GAS_OPTIONAL = 'SAFE_TX_GAS_OPTIONAL',
 }
 
 type Token = {

src/logic/hooks/useEstimateTransactionGas.tsx

@@ -164,14 +164,18 @@ export const useEstimateTransactionGas = ({
         let txEstimationExecutionStatus = EstimationStatus.LOADING
 
         if (isCreation) {
-          safeTxGasEstimation = await estimateSafeTxGas({
-            safeAddress,
-            txData,
-            txRecipient,
-            txAmount: txAmount || '0',
-            operation: operation || Operation.CALL,
-          })
+          safeTxGasEstimation = await estimateSafeTxGas(
+            {
+              safeAddress,
+              txData,
+              txRecipient,
+              txAmount: txAmount || '0',
+              operation: operation || Operation.CALL,
+            },
+            safeVersion,
+          )
         }
+
         if (isExecution || approvalAndExecution) {
           ethGasLimitEstimation = await estimateTransactionGasLimit({
             safeAddress,

src/logic/safe/store/actions/__tests__/fetchSafe.test.ts

@@ -127,7 +127,7 @@ describe('fetchSafe', () => {
           nonce: 492,
           currentVersion: '1.3.0',
           needsUpdate: false,
-          featuresEnabled: ['ERC721', 'ERC1155', 'SAFE_APPS', 'CONTRACT_INTERACTION'],
+          featuresEnabled: ['ERC721', 'ERC1155', 'SAFE_APPS', 'CONTRACT_INTERACTION', 'SAFE_TX_GAS_OPTIONAL'],
         },
       },
     ]

src/logic/safe/store/actions/__tests__/utils.test.ts

@@ -191,7 +191,13 @@ describe('extractRemoteSafeInfo', () => {
       currentVersion: '1.3.0',
       needsUpdate: false,
       guard: undefined,
-      featuresEnabled: [FEATURES.ERC721, FEATURES.ERC1155, FEATURES.SAFE_APPS, FEATURES.CONTRACT_INTERACTION],
+      featuresEnabled: [
+        FEATURES.ERC721,
+        FEATURES.ERC1155,
+        FEATURES.SAFE_APPS,
+        FEATURES.CONTRACT_INTERACTION,
+        FEATURES.SAFE_TX_GAS_OPTIONAL,
+      ],
     }
 
     const remoteSafeInfo = await extractRemoteSafeInfo(remoteSafeInfoWithoutModules as any)
@@ -215,7 +221,13 @@ describe('extractRemoteSafeInfo', () => {
       currentVersion: '1.3.0',
       needsUpdate: false,
       guard: '0x4f8a82d73729A33E0165aDeF3450A7F85f007528',
-      featuresEnabled: [FEATURES.ERC721, FEATURES.ERC1155, FEATURES.SAFE_APPS, FEATURES.CONTRACT_INTERACTION],
+      featuresEnabled: [
+        FEATURES.ERC721,
+        FEATURES.ERC1155,
+        FEATURES.SAFE_APPS,
+        FEATURES.CONTRACT_INTERACTION,
+        FEATURES.SAFE_TX_GAS_OPTIONAL,
+      ],
     }
 
     const remoteSafeInfo = await extractRemoteSafeInfo(remoteSafeInfoWithModules as any)

src/logic/safe/store/actions/createTransaction.ts

@@ -106,7 +106,10 @@ export const createTransaction =
     let safeTxGas = safeTxGasArg || '0'
     try {
       if (safeTxGasArg === undefined) {
-        safeTxGas = await estimateSafeTxGas({ safeAddress, txData, txRecipient: to, txAmount: valueInWei, operation })
+        safeTxGas = await estimateSafeTxGas(
+          { safeAddress, txData, txRecipient: to, txAmount: valueInWei, operation },
+          safeVersion,
+        )
       }
     } catch (error) {
       safeTxGas = safeTxGasArg || '0'

src/logic/safe/store/actions/mocks/safeInformation.ts

@@ -246,7 +246,7 @@ export const inMemoryPartialSafeInformation = {
   nonce: 492,
   currentVersion: '1.3.0',
   needsUpdate: false,
-  featuresEnabled: ['ERC721', 'ERC1155', 'SAFE_APPS', 'CONTRACT_INTERACTION'],
+  featuresEnabled: ['ERC721', 'ERC1155', 'SAFE_APPS', 'CONTRACT_INTERACTION', 'SAFE_TX_GAS_OPTIONAL'],
   collectiblesTag: '1634550387',
   txQueuedTag: '1634550387',
   txHistoryTag: '1633430459',

src/logic/safe/transactions/gas.ts

@@ -9,6 +9,8 @@ import { Confirmation } from 'src/logic/safe/store/models/types/confirmation'
 import { checksumAddress } from 'src/utils/checksumAddress'
 import { EIP1559Chains } from 'src/config/chain-workarounds'
 import { getNetworkId } from 'src/config'
+import { hasFeature } from '../utils/safeVersion'
+import { FEATURES } from 'src/config/networks/network.d'
 
 type SafeTxGasEstimationProps = {
   safeAddress: string
@@ -18,13 +20,14 @@ type SafeTxGasEstimationProps = {
   operation: number
 }
 
-export const estimateSafeTxGas = async ({
-  safeAddress,
-  txData,
-  txRecipient,
-  txAmount,
-  operation,
-}: SafeTxGasEstimationProps): Promise<string> => {
+export const estimateSafeTxGas = async (
+  { safeAddress, txData, txRecipient, txAmount, operation }: SafeTxGasEstimationProps,
+  safeVersion: string,
+): Promise<string> => {
+  if (hasFeature(safeVersion, FEATURES.SAFE_TX_GAS_OPTIONAL)) {
+    return '0'
+  }
+
   try {
     const safeTxGasEstimation = await fetchSafeTxGasEstimation({
       safeAddress,

src/logic/safe/utils/safeVersion.test.ts → src/logic/safe/utils/__tests__/safeVersion.test.ts

@@ -1,4 +1,5 @@
-import { checkIfSafeNeedsUpdate } from 'src/logic/safe/utils/safeVersion'
+import { FEATURES } from 'src/config/networks/network.d'
+import { checkIfSafeNeedsUpdate, hasFeature } from 'src/logic/safe/utils/safeVersion'
 
 describe('Check safe version', () => {
   it('Calls checkIfSafeNeedUpdate, should return true if the safe version is bellow the target one', async () => {
@@ -19,4 +20,19 @@ describe('Check safe version', () => {
     const { needUpdate } = await checkIfSafeNeedsUpdate(safeVersion, targetVersion)
     expect(needUpdate).toEqual(false)
   })
+
+  describe('hasFeature', () => {
+    it('returns false for old Safes and SAFE_TX_GAS_OPTIONAL', () => {
+      expect(hasFeature('1.1.1', FEATURES.SAFE_TX_GAS_OPTIONAL)).toBe(false)
+    })
+
+    it('returns true for new Safes and SAFE_TX_GAS_OPTIONAL', () => {
+      expect(hasFeature('1.3.0', FEATURES.SAFE_TX_GAS_OPTIONAL)).toBe(true)
+    })
+
+    it('returns true for any Safes and SAFE_APPS', () => {
+      expect(hasFeature('1.3.0', FEATURES.SAFE_APPS)).toBe(true)
+      expect(hasFeature('1.1.1', FEATURES.SAFE_APPS)).toBe(true)
+    })
+  })
 })

src/logic/safe/utils/safeVersion.ts

@@ -19,6 +19,7 @@ const FEATURES_BY_VERSION: FeatureConfigByVersion[] = [
   { name: FEATURES.ERC1155, validVersion: '>=1.1.1' },
   { name: FEATURES.SAFE_APPS },
   { name: FEATURES.CONTRACT_INTERACTION },
+  { name: FEATURES.SAFE_TX_GAS_OPTIONAL, validVersion: '>=1.3.0' },
 ]
 
 type Feature = typeof FEATURES_BY_VERSION[number]
@@ -53,6 +54,10 @@ export const enabledFeatures = (version?: string): FEATURES[] => {
   }, [] as FEATURES[])
 }
 
+export const hasFeature = (version: string, name: FEATURES): boolean => {
+  return enabledFeatures(version).includes(name)
+}
+
 interface SafeVersionInfo {
   current: string
   latest: string

src/routes/safe/components/Transactions/helpers/EditTxParametersForm/index.tsx

@@ -16,6 +16,7 @@ import { minValue } from 'src/components/forms/validator'
 import { Modal } from 'src/components/Modal'
 
 import { ParametersStatus, areSafeParamsEnabled, areEthereumParamsVisible, ethereumTxParametersTitle } from '../utils'
+import useSafeTxGas from '../useSafeTxGas'
 
 const StyledDivider = styled(Divider)`
   margin: 0px;
@@ -94,6 +95,7 @@ export const EditTxParametersForm = ({
 }: Props): ReactElement => {
   const classes = useStyles()
   const { safeNonce, safeTxGas, ethNonce, ethGasLimit, ethGasPrice } = txParameters
+  const showSafeTxGas = useSafeTxGas()
 
   const onSubmit = (values: TxParameters) => {
     onClose(values)
@@ -146,16 +148,18 @@ export const EditTxParametersForm = ({
                   component={TextField}
                   disabled={!areSafeParamsEnabled(parametersStatus)}
                 />
-                <Field
-                  name="safeTxGas"
-                  defaultValue={safeTxGas}
-                  placeholder="SafeTxGas"
-                  text="SafeTxGas"
-                  type="number"
-                  min="0"
-                  component={TextField}
-                  disabled={!areSafeParamsEnabled(parametersStatus)}
-                />
+                {showSafeTxGas && (
+                  <Field
+                    name="safeTxGas"
+                    defaultValue={safeTxGas}
+                    placeholder="SafeTxGas"
+                    text="SafeTxGas"
+                    type="number"
+                    min="0"
+                    component={TextField}
+                    disabled={!areSafeParamsEnabled(parametersStatus)}
+                  />
+                )}
               </SafeOptions>
 
               {areEthereumParamsVisible(parametersStatus) && (

src/routes/safe/components/Transactions/helpers/TxParametersDetail/index.tsx

@@ -6,6 +6,7 @@ import { Text, ButtonLink, Accordion, AccordionSummary, AccordionDetails } from
 import { currentSafe, currentSafeThreshold } from 'src/logic/safe/store/selectors'
 import { TxParameters } from 'src/routes/safe/container/hooks/useTransactionParameters'
 import { ParametersStatus, areEthereumParamsVisible, areSafeParamsEnabled, ethereumTxParametersTitle } from '../utils'
+import useSafeTxGas from '../useSafeTxGas'
 
 const TxParameterWrapper = styled.div`
   display: flex;
@@ -60,6 +61,7 @@ export const TxParametersDetail = ({
   const { safeNonce = '' } = txParameters
   const isSafeNonceFuture = parseInt(safeNonce, 10) > nonce
   const [isAccordionExpanded, setIsAccordionExpanded] = useState(isSafeNonceFuture)
+  const showSafeTxGas = useSafeTxGas()
 
   useEffect(() => {
     if (parseInt(safeNonce, 10) > nonce) {
@@ -103,20 +105,22 @@ export const TxParametersDetail = ({
             </ColoredText>
           </TxParameterWrapper>
 
-          <TxParameterWrapper>
-            <Text
-              size="lg"
-              color={areSafeParamsEnabled(parametersStatus || defaultParameterStatus) ? 'text' : 'secondaryLight'}
-            >
-              SafeTxGas
-            </Text>
-            <Text
-              size="lg"
-              color={areSafeParamsEnabled(parametersStatus || defaultParameterStatus) ? 'text' : 'secondaryLight'}
-            >
-              {txParameters.safeTxGas}
-            </Text>
-          </TxParameterWrapper>
+          {showSafeTxGas && (
+            <TxParameterWrapper>
+              <Text
+                size="lg"
+                color={areSafeParamsEnabled(parametersStatus || defaultParameterStatus) ? 'text' : 'secondaryLight'}
+              >
+                SafeTxGas
+              </Text>
+              <Text
+                size="lg"
+                color={areSafeParamsEnabled(parametersStatus || defaultParameterStatus) ? 'text' : 'secondaryLight'}
+              >
+                {txParameters.safeTxGas}
+              </Text>
+            </TxParameterWrapper>
+          )}
 
           {areEthereumParamsVisible(parametersStatus || defaultParameterStatus) && (
             <>

src/routes/safe/components/Transactions/helpers/useSafeTxGas.ts

@@ -0,0 +1,12 @@
+import { useSelector } from 'react-redux'
+import { currentSafeCurrentVersion } from 'src/logic/safe/store/selectors'
+import { hasFeature } from 'src/logic/safe/utils/safeVersion'
+import { FEATURES } from 'src/config/networks/network.d'
+
+const useSafeTxGas = (): boolean => {
+  const safeVersion = useSelector(currentSafeCurrentVersion)
+  const showSafeTxGas = !hasFeature(safeVersion, FEATURES.SAFE_TX_GAS_OPTIONAL)
+  return showSafeTxGas
+}
+
+export default useSafeTxGas