Metametrics fixes (#6238)

* Improve opt-in opt-out event tracking after going 'back' in onboarding.

* Fix 'Switched Networks' metrics event.

* Fix custom variables ids (can only use ids 1-5)

* Fix tracking of function type custom variable for metametrics in confirm-transaction-base

* Add missing metametrics events

ui/app/components/dropdowns/network-dropdown.js

@@ -254,14 +254,14 @@ NetworkDropdown.prototype.render = function () {
 }
 
 NetworkDropdown.prototype.handleClick = function (newProviderType) {
-  const { providerType, setProviderType } = this.props
+  const { provider: { type: providerType }, setProviderType } = this.props
   const { metricsEvent } = this.context
 
   metricsEvent({
     eventOpts: {
       category: 'Navigation',
       action: 'Home',
-      name: 'Opened Network Menu',
+      name: 'Switched Networks',
     },
     customVariables: {
       fromNetwork: providerType,

ui/app/components/menu-bar/menu-bar.component.js

@@ -37,7 +37,7 @@ export default class MenuBar extends PureComponent {
                 eventOpts: {
                   category: 'Navigation',
                   action: 'Home',
-                  name: 'Copied Address',
+                  name: 'Opened Hamburger',
                 },
               })
               sidebarOpen ? hideSidebar() : showSidebar()
@@ -53,7 +53,16 @@ export default class MenuBar extends PureComponent {
             >
               <div
                 className="fa fa-ellipsis-h fa-lg menu-bar__open-in-browser"
-                onClick={() => this.setState({ accountDetailsMenuOpen: true })}
+                onClick={() => {
+                  this.context.metricsEvent({
+                    eventOpts: {
+                      category: 'Navigation',
+                      action: 'Home',
+                      name: 'Opened Account Options',
+                    },
+                  })
+                  this.setState({ accountDetailsMenuOpen: true })
+                }}
               >
               </div>
             </Tooltip>

ui/app/components/pages/confirm-transaction-base/confirm-transaction-base.component.js

@@ -157,7 +157,7 @@ export default class ConfirmTransactionBase extends Component {
   }
 
   handleEditGas () {
-    const { onEditGas, showCustomizeGasModal, methodData = {}, txData: { origin } } = this.props
+    const { onEditGas, showCustomizeGasModal, action, txData: { origin }, methodData = {} } = this.props
 
     this.context.metricsEvent({
       eventOpts: {
@@ -167,7 +167,7 @@ export default class ConfirmTransactionBase extends Component {
       },
       customVariables: {
         recipientKnown: null,
-        functionType: methodData.name || 'notFound',
+        functionType: action || getMethodName(methodData.name) || this.context.t('contractInteraction'),
         origin,
       },
     })
@@ -290,7 +290,7 @@ export default class ConfirmTransactionBase extends Component {
   }
 
   handleEdit () {
-    const { txData, tokenData, tokenProps, onEdit, methodData = {}, txData: { origin } } = this.props
+    const { txData, tokenData, tokenProps, onEdit, action, txData: { origin }, methodData = {} } = this.props
 
     this.context.metricsEvent({
       eventOpts: {
@@ -300,7 +300,7 @@ export default class ConfirmTransactionBase extends Component {
       },
       customVariables: {
         recipientKnown: null,
-        functionType: methodData.name || 'notFound',
+        functionType: action || getMethodName(methodData.name) || this.context.t('contractInteraction'),
         origin,
       },
     })
@@ -329,7 +329,7 @@ export default class ConfirmTransactionBase extends Component {
 
   handleCancel () {
     const { metricsEvent } = this.context
-    const { onCancel, txData, cancelTransaction, history, clearConfirmTransaction, methodData = {}, txData: { origin } } = this.props
+    const { onCancel, txData, cancelTransaction, history, clearConfirmTransaction, action, txData: { origin }, methodData = {} } = this.props
 
     if (onCancel) {
       metricsEvent({
@@ -340,7 +340,7 @@ export default class ConfirmTransactionBase extends Component {
         },
         customVariables: {
           recipientKnown: null,
-          functionType: methodData.name || 'notFound',
+          functionType: action || getMethodName(methodData.name) || this.context.t('contractInteraction'),
           origin,
         },
       })
@@ -356,7 +356,7 @@ export default class ConfirmTransactionBase extends Component {
 
   handleSubmit () {
     const { metricsEvent } = this.context
-    const { txData: { origin }, sendTransaction, clearConfirmTransaction, txData, history, onSubmit, methodData = {}, metaMetricsSendCount = 0, setMetaMetricsSendCount } = this.props
+    const { txData: { origin }, sendTransaction, clearConfirmTransaction, txData, history, onSubmit, action, metaMetricsSendCount = 0, setMetaMetricsSendCount, methodData = {} } = this.props
     const { submitting } = this.state
 
     if (submitting) {
@@ -375,7 +375,7 @@ export default class ConfirmTransactionBase extends Component {
         },
         customVariables: {
           recipientKnown: null,
-          functionType: methodData.name || 'notFound',
+          functionType: action || getMethodName(methodData.name) || this.context.t('contractInteraction'),
           origin,
         },
       })

ui/app/components/pages/first-time-flow/metametrics-opt-in/metametrics-opt-in.component.js

@@ -98,21 +98,21 @@ export default class MetaMetricsOptIn extends Component {
               onCancel={() => {
                 setParticipateInMetaMetrics(false)
                   .then(() => {
-                    if (participateInMetaMetrics === null) {
-                      return metricsEvent({
+                    const promise = participateInMetaMetrics !== false
+                      ? metricsEvent({
                         eventOpts: {
                           category: 'Onboarding',
                           action: 'Metrics Option',
                           name: 'Metrics Opt Out',
                         },
                         isOptIn: true,
-                      }, {
-                        excludeMetaMetricsId: true,
                       })
+                      : Promise.resolve()
+
+                    promise
                       .then(() => {
                         history.push(nextRoute)
                       })
-                  }
                 })
               }}
               cancelText={'No Thanks'}
@@ -120,7 +120,7 @@ export default class MetaMetricsOptIn extends Component {
               onSubmit={() => {
                 setParticipateInMetaMetrics(true)
                   .then(([participateStatus, metaMetricsId]) => {
-                    const promise = participateInMetaMetrics === null
+                    const promise = participateInMetaMetrics !== true
                       ? metricsEvent({
                         eventOpts: {
                           category: 'Onboarding',

ui/app/components/wallet-view.js

@@ -206,9 +206,9 @@ WalletView.prototype.render = function () {
           copyToClipboard(checksummedAddress)
           this.context.metricsEvent({
             eventOpts: {
-              category: 'Activation',
-              action: 'userClicks',
-              name: 'navCopyToClipboard',
+              category: 'Navigation',
+              action: 'Home',
+              name: 'Copied Address',
             },
           })
           this.setState({ hasCopied: true })

ui/app/metametrics/metametrics.util.js

@@ -12,11 +12,9 @@ const METAMETRICS_TRACKING_URL = inDevelopment
   ? 'http://www.metamask.io/metametrics'
   : 'http://www.metamask.io/metametrics-prod'
 
-const METAMETRICS_CUSTOM_HAD_ERROR = 'hadError'
-const METAMETRICS_CUSTOM_HEX_DATA = 'hexData'
-const METAMETRICS_CUSTOM_FUNCTION_TYPE = 'functionType'
 const METAMETRICS_CUSTOM_GAS_LIMIT_CHANGE = 'gasLimitChange'
 const METAMETRICS_CUSTOM_GAS_PRICE_CHANGE = 'gasPriceChange'
+const METAMETRICS_CUSTOM_FUNCTION_TYPE = 'functionType'
 const METAMETRICS_CUSTOM_RECIPIENT_KNOWN = 'recipientKnown'
 const METAMETRICS_CUSTOM_CONFIRM_SCREEN_ORIGIN = 'origin'
 const METAMETRICS_CUSTOM_FROM_NETWORK = 'fromNetwork'
@@ -34,19 +32,17 @@ const METAMETRICS_CUSTOM_NUMBER_OF_TOKENS = 'numberOfTokens'
 const METAMETRICS_CUSTOM_NUMBER_OF_ACCOUNTS = 'numberOfAccounts'
 
 const customVariableNameIdMap = {
-  [METAMETRICS_CUSTOM_HAD_ERROR]: 1,
-  [METAMETRICS_CUSTOM_HEX_DATA]: 2,
-  [METAMETRICS_CUSTOM_FUNCTION_TYPE]: 3,
+  [METAMETRICS_CUSTOM_FUNCTION_TYPE]: 1,
+  [METAMETRICS_CUSTOM_RECIPIENT_KNOWN]: 2,
+  [METAMETRICS_CUSTOM_CONFIRM_SCREEN_ORIGIN]: 3,
   [METAMETRICS_CUSTOM_GAS_LIMIT_CHANGE]: 4,
   [METAMETRICS_CUSTOM_GAS_PRICE_CHANGE]: 5,
-  [METAMETRICS_CUSTOM_RECIPIENT_KNOWN]: 6,
-  [METAMETRICS_CUSTOM_CONFIRM_SCREEN_ORIGIN]: 7,
-  [METAMETRICS_CUSTOM_FROM_NETWORK]: 8,
-  [METAMETRICS_CUSTOM_TO_NETWORK]: 9,
-  [METAMETRICS_CUSTOM_RPC_NETWORK_ID]: 10,
-  [METAMETRICS_CUSTOM_RPC_CHAIN_ID]: 11,
-  [METAMETRICS_CUSTOM_ERROR_FIELD]: 12,
-  [METAMETRICS_CUSTOM_ERROR_MESSAGE]: 13,
+  [METAMETRICS_CUSTOM_FROM_NETWORK]: 1,
+  [METAMETRICS_CUSTOM_TO_NETWORK]: 2,
+  [METAMETRICS_CUSTOM_RPC_NETWORK_ID]: 1,
+  [METAMETRICS_CUSTOM_RPC_CHAIN_ID]: 2,
+  [METAMETRICS_CUSTOM_ERROR_FIELD]: 1,
+  [METAMETRICS_CUSTOM_ERROR_MESSAGE]: 2,
 }
 
 const customDimensionsNameIdMap = {