Hide ETH Gas Station stimates on non-main network (#9277)

* Hide gas estimate on non-main network (#9189)

* Update v8.0.9 changelog

CHANGELOG.md

@@ -6,6 +6,7 @@
 - [#9228](https://github.com/MetaMask/metamask-extension/pull/9228): Move transaction confirmation footer buttons to scrollable area
 - [#9256](https://github.com/MetaMask/metamask-extension/pull/9256): Handle non-String web3 property access
 - [#9266](https://github.com/MetaMask/metamask-extension/pull/9266): Use @metamask/controllers@2.0.5
+- [#9189](https://github.com/MetaMask/metamask-extension/pull/9189): Hide ETH Gas Station estimates on non-main network
 
 ## 8.0.8 Fri Aug 14 2020
 - [#9211](https://github.com/MetaMask/metamask-extension/pull/9211): Fix Etherscan redirect on notification click

ui/app/components/app/confirm-page-container/confirm-detail-row/confirm-detail-row.component.js

@@ -22,12 +22,16 @@ const ConfirmDetailRow = (props) => {
         { label }
       </div>
       <div className="confirm-detail-row__details">
-        <div
+        {
-          className={classnames('confirm-detail-row__header-text', headerTextClassName)}
+          headerText && (
-          onClick={() => onHeaderClick && onHeaderClick()}
+            <div
-        >
+              className={classnames('confirm-detail-row__header-text', headerTextClassName)}
-          { headerText }
+              onClick={() => onHeaderClick && onHeaderClick()}
-        </div>
+            >
+              { headerText }
+            </div>
+          )
+        }
         {
           primaryText
             ? (

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

@@ -97,6 +97,7 @@ export default class ConfirmTransactionBase extends Component {
     hideSenderToRecipient: PropTypes.bool,
     showAccountInHeader: PropTypes.bool,
     mostRecentOverviewPage: PropTypes.string.isRequired,
+    isMainnet: PropTypes.bool,
   }
 
   state = {
@@ -236,12 +237,15 @@ export default class ConfirmTransactionBase extends Component {
       hideFiatConversion,
       nextNonce,
       getNextNonce,
+      isMainnet,
     } = this.props
 
     if (hideDetails) {
       return null
     }
 
+    const notMainnetOrTest = !(isMainnet || process.env.IN_TEST)
+
     return (
       detailsComponent || (
         <div className="confirm-page-container-content__details">
@@ -249,12 +253,12 @@ export default class ConfirmTransactionBase extends Component {
             <ConfirmDetailRow
               label="Gas Fee"
               value={hexTransactionFee}
-              headerText="Edit"
+              headerText={notMainnetOrTest ? '' : 'Edit'}
-              headerTextClassName="confirm-detail-row__header-text--edit"
+              headerTextClassName={notMainnetOrTest ? '' : 'confirm-detail-row__header-text--edit'}
-              onHeaderClick={() => this.handleEditGas()}
+              onHeaderClick={notMainnetOrTest ? null : () => this.handleEditGas()}
               secondaryText={hideFiatConversion ? this.context.t('noConversionRateAvailable') : ''}
             />
-            {advancedInlineGasShown
+            {advancedInlineGasShown || notMainnetOrTest
               ? (
                 <AdvancedGasInputs
                   updateCustomGasPrice={(newGasPrice) => updateGasAndCalculate({ ...customGas, gasPrice: newGasPrice })}

ui/app/pages/confirm-transaction-base/confirm-transaction-base.container.js

@@ -180,6 +180,7 @@ const mapStateToProps = (state, ownProps) => {
     transactionCategory,
     nextNonce,
     mostRecentOverviewPage: getMostRecentOverviewPage(state),
+    isMainnet,
   }
 }
 

ui/app/pages/send/send-content/send-gas-row/send-gas-row.component.js

@@ -26,6 +26,7 @@ export default class SendGasRow extends Component {
     gasPrice: PropTypes.string,
     gasLimit: PropTypes.string,
     insufficientBalance: PropTypes.bool,
+    isMainnet: PropTypes.bool,
   }
 
   static contextTypes = {
@@ -35,7 +36,11 @@ export default class SendGasRow extends Component {
 
   renderAdvancedOptionsButton () {
     const { metricsEvent } = this.context
-    const { showCustomizeGasModal } = this.props
+    const { showCustomizeGasModal, isMainnet } = this.props
+    // Tests should behave in same way as mainnet, but are using Localhost
+    if (!isMainnet && !process.env.IN_TEST) {
+      return null
+    }
     return (
       <div
         className="advanced-gas-options-btn"
@@ -87,6 +92,7 @@ export default class SendGasRow extends Component {
       gasPrice,
       gasLimit,
       insufficientBalance,
+      isMainnet,
     } = this.props
     const { metricsEvent } = this.context
 
@@ -140,8 +146,8 @@ export default class SendGasRow extends Component {
         { this.renderAdvancedOptionsButton() }
       </div>
     )
-
+    // Tests should behave in same way as mainnet, but are using Localhost
-    if (advancedInlineGasShown) {
+    if (advancedInlineGasShown || (!isMainnet && !process.env.IN_TEST)) {
       return advancedGasInputs
     } else if (gasButtonGroupShown) {
       return gasPriceButtonGroup

ui/app/pages/send/send-content/send-gas-row/send-gas-row.container.js

@@ -17,6 +17,7 @@ import {
   getBasicGasEstimateLoadingStatus,
   getRenderableEstimateDataForSmallButtonsFromGWEI,
   getDefaultActiveButtonIndex,
+  getIsMainnet,
 } from '../../../../selectors'
 import {
   isBalanceSufficient,
@@ -74,6 +75,7 @@ function mapStateToProps (state) {
     maxModeOn: getSendMaxModeState(state),
     sendToken: getSendToken(state),
     tokenBalance: getTokenBalance(state),
+    isMainnet: getIsMainnet(state),
   }
 }
 

ui/app/pages/send/send-content/send-gas-row/tests/send-gas-row-component.test.js

@@ -34,6 +34,7 @@ describe('SendGasRow Component', function () {
           }}
         />
       ), { context: { t: (str) => str + '_t', metricsEvent: () => ({}) } })
+      wrapper.setProps({ isMainnet: true })
     })
 
     afterEach(function () {