Metrics tracking gas changed - slow, average, fast, custom - on edit screen.-

ui/app/components/app/send/send-footer/send-footer.component.js

@@ -27,6 +27,7 @@ export default class SendFooter extends Component {
     unapprovedTxs: PropTypes.object,
     update: PropTypes.func,
     sendErrors: PropTypes.object,
+    gasChangedLabel: PropTypes.string,
   }
 
   static contextTypes = {
@@ -57,6 +58,7 @@ export default class SendFooter extends Component {
       update,
       toAccounts,
       history,
+      gasChangedLabel,
     } = this.props
     const { metricsEvent } = this.context
 
@@ -91,6 +93,9 @@ export default class SendFooter extends Component {
             action: 'Edit Screen',
             name: 'Complete',
           },
+          customVariables: {
+            gasChanged: gasChangedLabel,
+          },
         })
         history.push(CONFIRM_TRANSACTION_ROUTE)
       })

ui/app/components/app/send/send-footer/send-footer.container.js

@@ -31,10 +31,21 @@ import {
   constructTxParams,
   constructUpdatedTx,
 } from './send-footer.utils'
+import {
+  getRenderableEstimateDataForSmallButtonsFromGWEI,
+  getDefaultActiveButtonIndex,
+} from '../../../../selectors/custom-gas'
 
 export default connect(mapStateToProps, mapDispatchToProps)(SendFooter)
 
 function mapStateToProps (state) {
+  const gasButtonInfo = getRenderableEstimateDataForSmallButtonsFromGWEI(state)
+  const gasPrice = getGasPrice(state)
+  const activeButtonIndex = getDefaultActiveButtonIndex(gasButtonInfo, gasPrice)
+  const gasChangedLabel = activeButtonIndex >= 0
+    ? gasButtonInfo[activeButtonIndex].labelKey
+    : 'custom'
+
   return {
     amount: getSendAmount(state),
     data: getSendHexData(state),
@@ -50,6 +61,7 @@ function mapStateToProps (state) {
     tokenBalance: getTokenBalance(state),
     unapprovedTxs: getUnapprovedTxs(state),
     sendErrors: getSendErrors(state),
+    gasChangedLabel,
   }
 }
 

ui/app/components/app/send/send-footer/tests/send-footer-container.test.js

@@ -46,6 +46,10 @@ proxyquire('../send-footer.container.js', {
   },
   './send-footer.selectors': { isSendFormInError: (s) => `mockInError:${s}` },
   './send-footer.utils': utilsStubs,
+  '../../../../selectors/custom-gas': {
+    getRenderableEstimateDataForSmallButtonsFromGWEI: (s) => ([{ labelKey: `mockLabel:${s}` }]),
+    getDefaultActiveButtonIndex: () => 0,
+  },
 })
 
 describe('send-footer container', () => {
@@ -68,6 +72,7 @@ describe('send-footer container', () => {
         tokenBalance: 'mockTokenBalance:mockState',
         unapprovedTxs: 'mockUnapprovedTxs:mockState',
         sendErrors: 'mockSendErrors:mockState',
+        gasChangedLabel: 'mockLabel:mockState',
       })
     })
 

ui/app/helpers/utils/metametrics.util.js

@@ -23,6 +23,7 @@ const METAMETRICS_CUSTOM_ERROR_FIELD = 'errorField'
 const METAMETRICS_CUSTOM_ERROR_MESSAGE = 'errorMessage'
 const METAMETRICS_CUSTOM_RPC_NETWORK_ID = 'networkId'
 const METAMETRICS_CUSTOM_RPC_CHAIN_ID = 'chainId'
+const METAMETRICS_CUSTOM_GAS_CHANGED = 'gasChanged'
 
 const METAMETRICS_CUSTOM_NETWORK = 'network'
 const METAMETRICS_CUSTOM_ENVIRONMENT_TYPE = 'environmentType'
@@ -43,6 +44,7 @@ const customVariableNameIdMap = {
   [METAMETRICS_CUSTOM_RPC_CHAIN_ID]: 2,
   [METAMETRICS_CUSTOM_ERROR_FIELD]: 1,
   [METAMETRICS_CUSTOM_ERROR_MESSAGE]: 2,
+  [METAMETRICS_CUSTOM_GAS_CHANGED]: 1,
 }
 
 const customDimensionsNameIdMap = {