Using NETWORK_TYPES constants where applicable (Refactor) (#15930)

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

@@ -212,28 +212,26 @@ class NetworkDropdown extends Component {
   getNetworkName() {
     const { provider } = this.props;
     const providerName = provider.type;
+    const { t } = this.context;
 
-    let name;
-
-    if (providerName === 'mainnet') {
-      name = this.context.t('mainnet');
-    } else if (providerName === 'ropsten') {
-      name = this.context.t('ropsten');
-    } else if (providerName === 'kovan') {
-      name = this.context.t('kovan');
-    } else if (providerName === 'rinkeby') {
-      name = this.context.t('rinkeby');
-    } else if (providerName === 'goerli') {
-      name = this.context.t('goerli');
-    } else if (providerName === 'sepolia') {
-      name = this.context.t('sepolia');
-    } else if (providerName === 'localhost') {
-      name = this.context.t('localhost');
-    } else {
-      name = provider.nickname || this.context.t('unknownNetwork');
+    switch (providerName) {
+      case NETWORK_TYPES.MAINNET:
+        return t('mainnet');
+      case NETWORK_TYPES.ROPSTEN:
+        return t('ropsten');
+      case NETWORK_TYPES.KOVAN:
+        return t('kovan');
+      case NETWORK_TYPES.RINKEBY:
+        return t('rinkeby');
+      case NETWORK_TYPES.GOERLI:
+        return t('goerli');
+      case NETWORK_TYPES.SEPOLIA:
+        return t('sepolia');
+      case NETWORK_TYPES.LOCALHOST:
+        return t('localhost');
+      default:
+        return provider.nickname || t('unknownNetwork');
     }
-
-    return name;
   }
 
   renderNetworkEntry(network) {
@@ -347,7 +345,7 @@ class NetworkDropdown extends Component {
         </div>
 
         <div className="network-dropdown-list">
-          {this.renderNetworkEntry('mainnet')}
+          {this.renderNetworkEntry(NETWORK_TYPES.MAINNET)}
 
           {this.renderCustomRpcList(
             rpcListDetailWithoutLocalHost,
@@ -356,11 +354,11 @@ class NetworkDropdown extends Component {
 
           {shouldShowTestNetworks && (
             <>
-              {this.renderNetworkEntry('ropsten')}
-              {this.renderNetworkEntry('kovan')}
-              {this.renderNetworkEntry('rinkeby')}
-              {this.renderNetworkEntry('goerli')}
-              {this.renderNetworkEntry('sepolia')}
+              {this.renderNetworkEntry(NETWORK_TYPES.ROPSTEN)}
+              {this.renderNetworkEntry(NETWORK_TYPES.KOVAN)}
+              {this.renderNetworkEntry(NETWORK_TYPES.RINKEBY)}
+              {this.renderNetworkEntry(NETWORK_TYPES.GOERLI)}
+              {this.renderNetworkEntry(NETWORK_TYPES.SEPOLIA)}
               {this.renderCustomRpcList(
                 rpcListDetailForLocalHost,
                 this.props.provider,

ui/components/app/loading-network-screen/loading-network-screen.component.js

@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
 import Button from '../../ui/button';
 import LoadingScreen from '../../ui/loading-screen';
 import { SECOND } from '../../../../shared/constants/time';
+import { NETWORK_TYPES } from '../../../../shared/constants/network';
 
 export default class LoadingNetworkScreen extends PureComponent {
   state = {
@@ -38,26 +39,24 @@ export default class LoadingNetworkScreen extends PureComponent {
     }
     const { provider, providerId } = this.props;
     const providerName = provider.type;
-
-    let name;
-
-    if (providerName === 'mainnet') {
-      name = this.context.t('connectingToMainnet');
-    } else if (providerName === 'ropsten') {
-      name = this.context.t('connectingToRopsten');
-    } else if (providerName === 'kovan') {
-      name = this.context.t('connectingToKovan');
-    } else if (providerName === 'rinkeby') {
-      name = this.context.t('connectingToRinkeby');
-    } else if (providerName === 'goerli') {
-      name = this.context.t('connectingToGoerli');
-    } else if (providerName === 'sepolia') {
-      name = this.context.t('connectingToSepolia');
-    } else {
-      name = this.context.t('connectingTo', [providerId]);
+    const { t } = this.context;
+
+    switch (providerName) {
+      case NETWORK_TYPES.MAINNET:
+        return t('connectingToMainnet');
+      case NETWORK_TYPES.ROPSTEN:
+        return t('connectingToRopsten');
+      case NETWORK_TYPES.KOVAN:
+        return t('connectingToKovan');
+      case NETWORK_TYPES.RINKEBY:
+        return t('connectingToRinkeby');
+      case NETWORK_TYPES.GOERLI:
+        return t('connectingToGoerli');
+      case NETWORK_TYPES.SEPOLIA:
+        return t('connectingToSepolia');
+      default:
+        return t('connectingTo', [providerId]);
     }
-
-    return name;
   };
 
   renderErrorScreenContent = () => {

ui/pages/routes/routes.component.js

@@ -71,6 +71,7 @@ import {
   ENVIRONMENT_TYPE_NOTIFICATION,
   ENVIRONMENT_TYPE_POPUP,
 } from '../../../shared/constants/app';
+import { NETWORK_TYPES } from '../../../shared/constants/network';
 import { getEnvironmentType } from '../../../app/scripts/lib/util';
 import ConfirmationPage from '../confirmation';
 import OnboardingFlow from '../onboarding-flow/onboarding-flow';
@@ -459,22 +460,23 @@ export default class Routes extends Component {
       return loadingMessage;
     }
     const { providerType, providerId } = this.props;
+    const { t } = this.context;
 
     switch (providerType) {
-      case 'mainnet':
-        return this.context.t('connectingToMainnet');
-      case 'ropsten':
-        return this.context.t('connectingToRopsten');
-      case 'kovan':
-        return this.context.t('connectingToKovan');
-      case 'rinkeby':
-        return this.context.t('connectingToRinkeby');
-      case 'goerli':
-        return this.context.t('connectingToGoerli');
-      case 'sepolia':
-        return this.context.t('connectingToSepolia');
+      case NETWORK_TYPES.MAINNET:
+        return t('connectingToMainnet');
+      case NETWORK_TYPES.ROPSTEN:
+        return t('connectingToRopsten');
+      case NETWORK_TYPES.KOVAN:
+        return t('connectingToKovan');
+      case NETWORK_TYPES.RINKEBY:
+        return t('connectingToRinkeby');
+      case NETWORK_TYPES.GOERLI:
+        return t('connectingToGoerli');
+      case NETWORK_TYPES.SEPOLIA:
+        return t('connectingToSepolia');
       default:
-        return this.context.t('connectingTo', [providerId]);
+        return t('connectingTo', [providerId]);
     }
   }
 }