Ensure network info popup only displays on networks where the user has no balances (#15821)

ui/pages/routes/routes.component.js

@@ -107,7 +107,8 @@ export default class Routes extends Component {
     theme: PropTypes.string,
     sendStage: PropTypes.string,
     isNetworkUsed: PropTypes.bool,
-    hasAnAccountWithNoFundsOnNetwork: PropTypes.bool,
+    allAccountsOnNetworkAreEmpty: PropTypes.bool,
+    isTestNet: PropTypes.bool,
   };
 
   static contextTypes = {
@@ -363,7 +364,8 @@ export default class Routes extends Component {
       browserEnvironmentOs: os,
       browserEnvironmentBrowser: browser,
       isNetworkUsed,
-      hasAnAccountWithNoFundsOnNetwork,
+      allAccountsOnNetworkAreEmpty,
+      isTestNet,
     } = this.props;
     const loadMessage =
       loadingMessage || isNetworkLoading
@@ -371,7 +373,10 @@ export default class Routes extends Component {
         : null;
 
     const shouldShowNetworkInfo =
-      isUnlocked && !isNetworkUsed && hasAnAccountWithNoFundsOnNetwork;
+      isUnlocked &&
+      !isTestNet &&
+      !isNetworkUsed &&
+      allAccountsOnNetworkAreEmpty;
 
     const windowType = getEnvironmentType();
 

ui/pages/routes/routes.container.js

@@ -2,12 +2,13 @@ import { connect } from 'react-redux';
 import { withRouter } from 'react-router-dom';
 import { compose } from 'redux';
 import {
-  getHasAnyAccountWithNoFundsOnNetwork,
+  getAllAccountsOnNetworkAreEmpty,
   getIsNetworkUsed,
   getNetworkIdentifier,
   getPreferences,
   isNetworkLoading,
   getTheme,
+  getIsTestnet,
 } from '../../selectors';
 import {
   lockMetamask,
@@ -43,8 +44,8 @@ function mapStateToProps(state) {
     theme: getTheme(state),
     sendStage: getSendStage(state),
     isNetworkUsed: getIsNetworkUsed(state),
-    hasAnAccountWithNoFundsOnNetwork:
+    allAccountsOnNetworkAreEmpty: getAllAccountsOnNetworkAreEmpty(state),
-      getHasAnyAccountWithNoFundsOnNetwork(state),
+    isTestnet: getIsTestnet(state),
   };
 }
 

ui/selectors/selectors.js

@@ -1194,10 +1194,12 @@ export function getIsNetworkUsed(state) {
   return Boolean(usedNetworks[chainId]);
 }
 
-export function getHasAnyAccountWithNoFundsOnNetwork(state) {
+export function getAllAccountsOnNetworkAreEmpty(state) {
   const balances = getMetaMaskCachedBalances(state) ?? {};
-  const hasAnAccountWithNoFundsOnNetwork =
+  const hasNoNativeFundsOnAnyAccounts = Object.values(balances).every(
-    Object.values(balances).indexOf('0x0');
+    (balance) => balance === '0x0' || balance === '0x00',
+  );
+  const hasNoTokens = getNumberOfTokens(state) === 0;
 
-  return hasAnAccountWithNoFundsOnNetwork !== -1;
+  return hasNoNativeFundsOnAnyAccounts && hasNoTokens;
 }