feature: convert level 32 files to typescript (#17390)

app/scripts/controllers/alert.js

@@ -1,7 +1,7 @@
 import { ObservableStore } from '@metamask/obs-store';
 import {
   TOGGLEABLE_ALERT_TYPES,
-  WEB3_SHIM_USAGE_ALERT_STATES,
+  Web3ShimUsageAlertStates,
 } from '../../../shared/constants/alerts';
 
 /**
@@ -101,7 +101,7 @@ export default class AlertController {
    * @param {string} origin - The origin the that used the web3 shim.
    */
   setWeb3ShimUsageRecorded(origin) {
-    this._setWeb3ShimUsageState(origin, WEB3_SHIM_USAGE_ALERT_STATES.RECORDED);
+    this._setWeb3ShimUsageState(origin, Web3ShimUsageAlertStates.recorded);
   }
 
   /**
@@ -111,7 +111,7 @@ export default class AlertController {
    * dismissed for.
    */
   setWeb3ShimUsageAlertDismissed(origin) {
-    this._setWeb3ShimUsageState(origin, WEB3_SHIM_USAGE_ALERT_STATES.DISMISSED);
+    this._setWeb3ShimUsageState(origin, Web3ShimUsageAlertStates.dismissed);
   }
 
   /**

app/scripts/controllers/swaps.js

@@ -16,7 +16,7 @@ import {
   SWAPS_FETCH_ORDER_CONFLICT,
   SWAPS_CHAINID_CONTRACT_ADDRESS_MAP,
 } from '../../../shared/constants/swaps';
-import { GAS_ESTIMATE_TYPES } from '../../../shared/constants/gas';
+import { GasEstimateTypes } from '../../../shared/constants/gas';
 import { CHAIN_IDS } from '../../../shared/constants/network';
 import {
   FALLBACK_SMART_TRANSACTIONS_REFRESH_TIME,
@@ -682,7 +682,7 @@ export default class SwapsController {
 
     let usedGasPrice = '0x0';
 
-    if (gasEstimateType === GAS_ESTIMATE_TYPES.FEE_MARKET) {
+    if (gasEstimateType === GasEstimateTypes.feeMarket) {
       const {
         high: { suggestedMaxPriorityFeePerGas },
         estimatedBaseFee,
@@ -704,9 +704,9 @@ export default class SwapsController {
         .add(estimatedBaseFeeNumeric)
         .round(6)
         .toString();
-    } else if (gasEstimateType === GAS_ESTIMATE_TYPES.LEGACY) {
+    } else if (gasEstimateType === GasEstimateTypes.legacy) {
       usedGasPrice = customGasPrice || decGWEIToHexWEI(gasFeeEstimates.high);
-    } else if (gasEstimateType === GAS_ESTIMATE_TYPES.ETH_GASPRICE) {
+    } else if (gasEstimateType === GasEstimateTypes.ethGasPrice) {
       usedGasPrice =
         customGasPrice || decGWEIToHexWEI(gasFeeEstimates.gasPrice);
     }

app/scripts/controllers/swaps.test.js

@@ -8,7 +8,7 @@ import { CHAIN_IDS, NETWORK_IDS } from '../../../shared/constants/network';
 import { ETH_SWAPS_TOKEN_OBJECT } from '../../../shared/constants/swaps';
 import { createTestProviderTools } from '../../../test/stub/provider';
 import { SECOND } from '../../../shared/constants/time';
-import { GAS_ESTIMATE_TYPES } from '../../../shared/constants/gas';
+import { GasEstimateTypes } from '../../../shared/constants/gas';
 import {
   FALLBACK_SMART_TRANSACTIONS_REFRESH_TIME,
   FALLBACK_SMART_TRANSACTIONS_MAX_FEE_MULTIPLIER,
@@ -151,7 +151,7 @@ const getEIP1559GasFeeEstimatesStub = sandbox.stub(() => {
     gasFeeEstimates: {
       high: '150',
     },
-    gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+    gasEstimateType: GasEstimateTypes.legacy,
   };
 });
 

app/scripts/controllers/transactions/index.js

@@ -27,10 +27,10 @@ import {
 import { METAMASK_CONTROLLER_EVENTS } from '../../metamask-controller';
 import {
   GAS_LIMITS,
-  GAS_ESTIMATE_TYPES,
+  GasEstimateTypes,
-  GAS_RECOMMENDATIONS,
+  GasRecommendations,
   CUSTOM_GAS_ESTIMATE,
-  PRIORITY_LEVELS,
+  PriorityLevels,
 } from '../../../../shared/constants/gas';
 import {
   bnToHex,
@@ -927,7 +927,7 @@ export default class TransactionController extends EventEmitter {
         if (txMeta.origin === ORIGIN_METAMASK) {
           txMeta.userFeeLevel = CUSTOM_GAS_ESTIMATE;
         } else {
-          txMeta.userFeeLevel = PRIORITY_LEVELS.DAPP_SUGGESTED;
+          txMeta.userFeeLevel = PriorityLevels.dAppSuggested;
         }
       } else {
         if (
@@ -937,9 +937,9 @@ export default class TransactionController extends EventEmitter {
             !txMeta.txParams.maxPriorityFeePerGas) ||
           txMeta.origin === ORIGIN_METAMASK
         ) {
-          txMeta.userFeeLevel = GAS_RECOMMENDATIONS.MEDIUM;
+          txMeta.userFeeLevel = GasRecommendations.medium;
         } else {
-          txMeta.userFeeLevel = PRIORITY_LEVELS.DAPP_SUGGESTED;
+          txMeta.userFeeLevel = PriorityLevels.dAppSuggested;
         }
 
         if (defaultMaxFeePerGas && !txMeta.txParams.maxFeePerGas) {
@@ -1036,7 +1036,7 @@ export default class TransactionController extends EventEmitter {
         await this._getEIP1559GasFeeEstimates();
       if (
         eip1559Compatibility &&
-        gasEstimateType === GAS_ESTIMATE_TYPES.FEE_MARKET
+        gasEstimateType === GasEstimateTypes.feeMarket
       ) {
         const {
           medium: { suggestedMaxPriorityFeePerGas, suggestedMaxFeePerGas } = {},
@@ -1050,13 +1050,13 @@ export default class TransactionController extends EventEmitter {
             ),
           };
         }
-      } else if (gasEstimateType === GAS_ESTIMATE_TYPES.LEGACY) {
+      } else if (gasEstimateType === GasEstimateTypes.legacy) {
         // The LEGACY type includes low, medium and high estimates of
         // gas price values.
         return {
           gasPrice: decGWEIToHexWEI(gasFeeEstimates.medium),
         };
-      } else if (gasEstimateType === GAS_ESTIMATE_TYPES.ETH_GASPRICE) {
+      } else if (gasEstimateType === GasEstimateTypes.ethGasPrice) {
         // The ETH_GASPRICE type just includes a single gas price property,
         // which we can assume was retrieved from eth_gasPrice
         return {
@@ -2186,9 +2186,9 @@ export default class TransactionController extends EventEmitter {
 
         if (
           [
-            GAS_RECOMMENDATIONS.LOW,
+            GasRecommendations.low,
-            GAS_RECOMMENDATIONS.MEDIUM,
+            GasRecommendations.medium,
-            GAS_RECOMMENDATIONS.MEDIUM.HIGH,
+            GasRecommendations.high,
           ].includes(estimateType)
         ) {
           const { gasFeeEstimates } = await this._getEIP1559GasFeeEstimates();

app/scripts/controllers/transactions/index.test.js

@@ -22,8 +22,8 @@ import {
 
 import { SECOND } from '../../../../shared/constants/time';
 import {
-  GAS_ESTIMATE_TYPES,
+  GasEstimateTypes,
-  GAS_RECOMMENDATIONS,
+  GasRecommendations,
 } from '../../../../shared/constants/gas';
 import { METAMASK_CONTROLLER_EVENTS } from '../../metamask-controller';
 import { ORIGIN_METAMASK } from '../../../../shared/constants/app';
@@ -849,7 +849,7 @@ describe('Transaction Controller', function () {
             suggestedMaxFeePerGas: '5',
           },
         },
-        gasEstimateType: GAS_ESTIMATE_TYPES.FEE_MARKET,
+        gasEstimateType: GasEstimateTypes.feeMarket,
       }));
 
       const defaultGasFees = await txController._getDefaultGasFees(
@@ -868,7 +868,7 @@ describe('Transaction Controller', function () {
 
       getGasFeeStub.callsFake(() => ({
         gasFeeEstimates: { medium: '2' },
-        gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+        gasEstimateType: GasEstimateTypes.legacy,
       }));
 
       const defaultGasFees = await txController._getDefaultGasFees(
@@ -886,7 +886,7 @@ describe('Transaction Controller', function () {
 
       getGasFeeStub.callsFake(() => ({
         gasFeeEstimates: { gasPrice: '2' },
-        gasEstimateType: GAS_ESTIMATE_TYPES.ETH_GASPRICE,
+        gasEstimateType: GasEstimateTypes.ethGasPrice,
       }));
 
       const defaultGasFees = await txController._getDefaultGasFees(
@@ -1218,8 +1218,8 @@ describe('Transaction Controller', function () {
         to: '0xB09d8505E1F4EF1CeA089D47094f5DD3464083d4',
         gas: '0x5209',
         gasPrice: '0xa',
-        estimateSuggested: GAS_RECOMMENDATIONS.MEDIUM,
+        estimateSuggested: GasRecommendations.medium,
-        estimateUsed: GAS_RECOMMENDATIONS.HIGH,
+        estimateUsed: GasRecommendations.high,
       };
       txController.txStateManager._addTransactionsToState([
         {
@@ -2232,8 +2232,8 @@ describe('Transaction Controller', function () {
           maxPriorityFeePerGas: '0x77359400',
           gas: '0x7b0d',
           nonce: '0x4b',
-          estimateSuggested: GAS_RECOMMENDATIONS.MEDIUM,
+          estimateSuggested: GasRecommendations.medium,
-          estimateUsed: GAS_RECOMMENDATIONS.HIGH,
+          estimateUsed: GasRecommendations.high,
         },
         type: TransactionType.simpleSend,
         origin: 'other',
@@ -2280,8 +2280,8 @@ describe('Transaction Controller', function () {
           first_seen: 1624408066355,
           transaction_envelope_type: TRANSACTION_ENVELOPE_TYPE_NAMES.FEE_MARKET,
           status: 'unapproved',
-          estimate_suggested: GAS_RECOMMENDATIONS.MEDIUM,
+          estimate_suggested: GasRecommendations.medium,
-          estimate_used: GAS_RECOMMENDATIONS.HIGH,
+          estimate_used: GasRecommendations.high,
           default_estimate: 'medium',
           default_max_fee_per_gas: '70',
           default_max_priority_fee_per_gas: '7',
@@ -2359,14 +2359,14 @@ describe('Transaction Controller', function () {
       const params = {
         max_fee_per_gas: '0x77359400',
         max_priority_fee_per_gas: '0x77359400',
-        estimate_suggested: GAS_RECOMMENDATIONS.MEDIUM,
+        estimate_suggested: GasRecommendations.medium,
-        estimate_used: GAS_RECOMMENDATIONS.HIGH,
+        estimate_used: GasRecommendations.high,
       };
       const expectedParams = {
         max_fee_per_gas: '2',
         max_priority_fee_per_gas: '2',
-        estimate_suggested: GAS_RECOMMENDATIONS.MEDIUM,
+        estimate_suggested: GasRecommendations.medium,
-        estimate_used: GAS_RECOMMENDATIONS.HIGH,
+        estimate_used: GasRecommendations.high,
       };
       const result = txController._getGasValuesInGWEI(params);
       assert.deepEqual(result, expectedParams);

app/scripts/controllers/transactions/lib/util.test.js

@@ -1,7 +1,7 @@
 import { strict as assert } from 'assert';
 import { TransactionEnvelopeType } from '../../../../../shared/constants/transaction';
 import { BURN_ADDRESS } from '../../../../../shared/modules/hexstring-utils';
-import { GAS_RECOMMENDATIONS } from '../../../../../shared/constants/gas';
+import { GasRecommendations } from '../../../../../shared/constants/gas';
 import * as txUtils from './util';
 
 describe('txUtils', function () {
@@ -324,8 +324,8 @@ describe('txUtils', function () {
         gasPrice: '1',
         maxFeePerGas: '1',
         maxPriorityFeePerGas: '1',
-        estimateSuggested: GAS_RECOMMENDATIONS.MEDIUM,
+        estimateSuggested: GasRecommendations.medium,
-        estimateUsed: GAS_RECOMMENDATIONS.HIGH,
+        estimateUsed: GasRecommendations.high,
         type: '1',
       };
 
@@ -383,12 +383,12 @@ describe('txUtils', function () {
 
       assert.equal(
         normalizedTxParams.estimateSuggested,
-        GAS_RECOMMENDATIONS.MEDIUM,
+        GasRecommendations.medium,
         'estimateSuggested should be the string originally provided',
       );
       assert.equal(
         normalizedTxParams.estimateUsed,
-        GAS_RECOMMENDATIONS.HIGH,
+        GasRecommendations.high,
         'estimateSuggested should be the string originally provided',
       );
     });

shared/constants/alerts.js

@@ -1,18 +0,0 @@
-export const ALERT_TYPES = {
-  unconnectedAccount: 'unconnectedAccount',
-  web3ShimUsage: 'web3ShimUsage',
-  invalidCustomNetwork: 'invalidCustomNetwork',
-};
-
-/**
- * Alerts that can be enabled or disabled by the user.
- */
-export const TOGGLEABLE_ALERT_TYPES = [
-  ALERT_TYPES.unconnectedAccount,
-  ALERT_TYPES.web3ShimUsage,
-];
-
-export const WEB3_SHIM_USAGE_ALERT_STATES = {
-  RECORDED: 1,
-  DISMISSED: 2,
-};

shared/constants/alerts.ts

@@ -0,0 +1,18 @@
+export enum AlertTypes {
+  unconnectedAccount = 'unconnectedAccount',
+  web3ShimUsage = 'web3ShimUsage',
+  invalidCustomNetwork = 'invalidCustomNetwork',
+}
+
+/**
+ * Alerts that can be enabled or disabled by the user.
+ */
+export const TOGGLEABLE_ALERT_TYPES = [
+  AlertTypes.unconnectedAccount,
+  AlertTypes.web3ShimUsage,
+];
+
+export enum Web3ShimUsageAlertStates {
+  recorded = 1,
+  dismissed = 2,
+}

shared/constants/gas.ts

@@ -14,12 +14,9 @@ export const GAS_LIMITS = {
 
 /**
  * @typedef {object} GasEstimateTypes
- * @property {'fee-market'} FEE_MARKET - A gas estimate for a fee market
+ * @property {'fee-market'} FEE_MARKET - A gas estimate for a fee market transaction generated by our gas estimation API.
- *  transaction generated by our gas estimation API.
+ * @property {'legacy'} LEGACY - A gas estimate for a legacy Transaction generated by our gas estimation API.
- * @property {'legacy'} LEGACY - A gas estimate for a legacy Transaction
+ * @property {'eth_gasPrice'} ETH_GAS_PRICE - A gas estimate provided by the Ethereum node via eth_gasPrice.
- *  generated by our gas estimation API.
- * @property {'eth_gasPrice'} ETH_GAS_PRICE - A gas estimate provided by the
- *  Ethereum node via eth_gasPrice.
  * @property {'none'} NONE - No gas estimate available.
  */
 
@@ -32,33 +29,33 @@ export const GAS_LIMITS = {
  *
  * @type {GasEstimateTypes}
  */
-export const GAS_ESTIMATE_TYPES = {
+export enum GasEstimateTypes {
-  FEE_MARKET: 'fee-market',
+  feeMarket = 'fee-market',
-  LEGACY: 'legacy',
+  legacy = 'legacy',
-  ETH_GASPRICE: 'eth_gasPrice',
+  ethGasPrice = 'eth_gasPrice',
-  NONE: 'none',
+  none = 'none',
-};
+}
 
 /**
  * These represent gas recommendation levels presented in the UI
  */
-export const GAS_RECOMMENDATIONS = {
+export enum GasRecommendations {
-  LOW: 'low',
+  low = 'low',
-  MEDIUM: 'medium',
+  medium = 'medium',
-  HIGH: 'high',
+  high = 'high',
-};
+}
 
 /**
  * These represent types of gas estimation
  */
-export const PRIORITY_LEVELS = {
+export enum PriorityLevels {
-  TEN_PERCENT_INCREASED: 'tenPercentIncreased',
+  tenPercentIncreased = 'tenPercentIncreased',
-  LOW: 'low',
+  low = 'low',
-  MEDIUM: 'medium',
+  medium = 'medium',
-  HIGH: 'high',
+  high = 'high',
-  CUSTOM: 'custom',
+  custom = 'custom',
-  DAPP_SUGGESTED: 'dappSuggested',
+  dAppSuggested = 'dappSuggested',
-};
+}
 
 /**
  * Represents the user customizing their gas preference
@@ -68,12 +65,12 @@ export const CUSTOM_GAS_ESTIMATE = 'custom';
 /**
  * These represent the different edit modes presented in the UI
  */
-export const EDIT_GAS_MODES = {
+export enum EditGasModes {
-  SPEED_UP: 'speed-up',
+  speedUp = 'speed-up',
-  CANCEL: 'cancel',
+  cancel = 'cancel',
-  MODIFY_IN_PLACE: 'modify-in-place',
+  modifyInPlace = 'modify-in-place',
-  SWAPS: 'swaps',
+  swaps = 'swaps',
-};
+}
 
 /**
  * Represents levels for `networkCongestion` (calculated along with gas fee
@@ -81,8 +78,8 @@ export const EDIT_GAS_MODES = {
  * network status slider on the send transaction screen and inform users when
  * gas fees are high
  */
-export const NETWORK_CONGESTION_THRESHOLDS = {
+export enum NetworkCongestionThresholds {
-  NOT_BUSY: 0,
+  notBusy = 0,
-  STABLE: 0.33,
+  stable = 0.33,
-  BUSY: 0.66,
+  busy = 0.66,
-};
+}

ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-defaults/advanced-gas-fee-defaults.js

@@ -2,7 +2,7 @@ import React, { useEffect, useState } from 'react';
 import { useSelector, useDispatch } from 'react-redux';
 
 import { useTransactionEventFragment } from '../../../../hooks/useTransactionEventFragment';
-import { EDIT_GAS_MODES } from '../../../../../shared/constants/gas';
+import { EditGasModes } from '../../../../../shared/constants/gas';
 import Box from '../../../ui/box';
 import Typography from '../../../ui/typography';
 import CheckBox from '../../../ui/check-box';
@@ -67,7 +67,7 @@ const AdvancedGasFeeDefaults = () => {
     }
   };
 
-  if (editGasMode === EDIT_GAS_MODES.SWAPS) {
+  if (editGasMode === EditGasModes.swaps) {
     return null;
   }
 

ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-defaults/advanced-gas-fee-defaults.test.js

@@ -2,8 +2,8 @@ import React from 'react';
 import { fireEvent, screen } from '@testing-library/react';
 
 import {
-  EDIT_GAS_MODES,
+  EditGasModes,
-  GAS_ESTIMATE_TYPES,
+  GasEstimateTypes,
 } from '../../../../../shared/constants/gas';
 import { renderWithProvider } from '../../../../../test/lib/render-helpers';
 import mockEstimates from '../../../../../test/data/mock-estimates.json';
@@ -42,7 +42,7 @@ const render = (defaultGasParams, contextParams) => {
       },
       featureFlags: { advancedInlineGas: true },
       gasFeeEstimates:
-        mockEstimates[GAS_ESTIMATE_TYPES.FEE_MARKET].gasFeeEstimates,
+        mockEstimates[GasEstimateTypes.feeMarket].gasFeeEstimates,
     },
   });
   return renderWithProvider(
@@ -132,7 +132,7 @@ describe('AdvancedGasFeeDefaults', () => {
   });
 
   it('should not render option to set default gas options in a swaps transaction', () => {
-    render({}, { editGasMode: EDIT_GAS_MODES.SWAPS });
+    render({}, { editGasMode: EditGasModes.swaps });
     expect(
       document.querySelector('input[type=checkbox]'),
     ).not.toBeInTheDocument();

ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-gas-limit/advanced-gas-fee-gas-limit.test.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { fireEvent, screen } from '@testing-library/react';
 
-import { GAS_ESTIMATE_TYPES } from '../../../../../shared/constants/gas';
+import { GasEstimateTypes } from '../../../../../shared/constants/gas';
 import { renderWithProvider } from '../../../../../test/lib/render-helpers';
 import mockEstimates from '../../../../../test/data/mock-estimates.json';
 import mockState from '../../../../../test/data/mock-state.json';
@@ -34,7 +34,7 @@ const render = (contextProps) => {
       advancedGasFee: { priorityFee: 100 },
       featureFlags: { advancedInlineGas: true },
       gasFeeEstimates:
-        mockEstimates[GAS_ESTIMATE_TYPES.FEE_MARKET].gasFeeEstimates,
+        mockEstimates[GasEstimateTypes.feeMarket].gasFeeEstimates,
     },
   });
 

ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/base-fee-input/base-fee-input.js

@@ -3,8 +3,8 @@ import { useSelector } from 'react-redux';
 
 import { HIGH_FEE_WARNING_MULTIPLIER } from '../../../../../pages/send/send.constants';
 import {
-  EDIT_GAS_MODES,
+  EditGasModes,
-  PRIORITY_LEVELS,
+  PriorityLevels,
 } from '../../../../../../shared/constants/gas';
 import { PRIMARY } from '../../../../../helpers/constants/common';
 import { bnGreaterThan, bnLessThan } from '../../../../../helpers/utils/util';
@@ -64,9 +64,9 @@ const BaseFeeInput = () => {
 
   const [baseFee, setBaseFee] = useState(() => {
     if (
-      estimateUsed !== PRIORITY_LEVELS.CUSTOM &&
+      estimateUsed !== PriorityLevels.custom &&
       advancedGasFeeValues?.maxBaseFee &&
-      editGasMode !== EDIT_GAS_MODES.SWAPS
+      editGasMode !== EditGasModes.swaps
     ) {
       return advancedGasFeeValues.maxBaseFee;
     }

ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/base-fee-input/base-fee-input.test.js

@@ -2,8 +2,8 @@ import React from 'react';
 import { fireEvent, screen } from '@testing-library/react';
 
 import {
-  EDIT_GAS_MODES,
+  EditGasModes,
-  GAS_ESTIMATE_TYPES,
+  GasEstimateTypes,
 } from '../../../../../../shared/constants/gas';
 import { renderWithProvider } from '../../../../../../test/lib/render-helpers';
 import mockEstimates from '../../../../../../test/data/mock-estimates.json';
@@ -37,7 +37,7 @@ const render = (txProps, contextProps) => {
       advancedGasFee: { maxBaseFee: 100 },
       featureFlags: { advancedInlineGas: true },
       gasFeeEstimates:
-        mockEstimates[GAS_ESTIMATE_TYPES.FEE_MARKET].gasFeeEstimates,
+        mockEstimates[GasEstimateTypes.feeMarket].gasFeeEstimates,
     },
   });
 
@@ -71,11 +71,11 @@ describe('BaseFeeInput', () => {
       {
         userFeeLevel: 'high',
       },
-      { editGasMode: EDIT_GAS_MODES.SWAPS },
+      { editGasMode: EditGasModes.swaps },
     );
     expect(document.getElementsByTagName('input')[0]).toHaveValue(
       parseInt(
-        mockEstimates[GAS_ESTIMATE_TYPES.FEE_MARKET].gasFeeEstimates.high
+        mockEstimates[GasEstimateTypes.feeMarket].gasFeeEstimates.high
           .suggestedMaxFeePerGas,
         10,
       ),

ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/priority-fee-input/priority-fee-input.js

@@ -3,8 +3,8 @@ import { useSelector } from 'react-redux';
 
 import { HIGH_FEE_WARNING_MULTIPLIER } from '../../../../../pages/send/send.constants';
 import {
-  EDIT_GAS_MODES,
+  EditGasModes,
-  PRIORITY_LEVELS,
+  PriorityLevels,
 } from '../../../../../../shared/constants/gas';
 import { PRIMARY } from '../../../../../helpers/constants/common';
 import { getAdvancedGasFeeValues } from '../../../../../selectors';
@@ -59,9 +59,9 @@ const PriorityFeeInput = () => {
 
   const [priorityFee, setPriorityFee] = useState(() => {
     if (
-      estimateUsed !== PRIORITY_LEVELS.CUSTOM &&
+      estimateUsed !== PriorityLevels.custom &&
       advancedGasFeeValues?.priorityFee &&
-      editGasMode !== EDIT_GAS_MODES.SWAPS
+      editGasMode !== EditGasModes.swaps
     ) {
       return advancedGasFeeValues.priorityFee;
     }

ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/priority-fee-input/priority-fee-input.test.js

@@ -2,8 +2,8 @@ import React from 'react';
 import { fireEvent, screen } from '@testing-library/react';
 
 import {
-  EDIT_GAS_MODES,
+  EditGasModes,
-  GAS_ESTIMATE_TYPES,
+  GasEstimateTypes,
 } from '../../../../../../shared/constants/gas';
 import { renderWithProvider } from '../../../../../../test/lib/render-helpers';
 import mockEstimates from '../../../../../../test/data/mock-estimates.json';
@@ -37,7 +37,7 @@ const render = (txProps, contextProps) => {
       advancedGasFee: { priorityFee: 100 },
       featureFlags: { advancedInlineGas: true },
       gasFeeEstimates:
-        mockEstimates[GAS_ESTIMATE_TYPES.FEE_MARKET].gasFeeEstimates,
+        mockEstimates[GasEstimateTypes.feeMarket].gasFeeEstimates,
     },
   });
 
@@ -71,11 +71,11 @@ describe('PriorityfeeInput', () => {
       {
         userFeeLevel: 'high',
       },
-      { editGasMode: EDIT_GAS_MODES.SWAPS },
+      { editGasMode: EditGasModes.swaps },
     );
     expect(document.getElementsByTagName('input')[0]).toHaveValue(
       parseInt(
-        mockEstimates[GAS_ESTIMATE_TYPES.FEE_MARKET].gasFeeEstimates.high
+        mockEstimates[GasEstimateTypes.feeMarket].gasFeeEstimates.high
           .suggestedMaxPriorityFeePerGas,
         10,
       ),

ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-popover.test.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { fireEvent, screen } from '@testing-library/react';
 
-import { GAS_ESTIMATE_TYPES } from '../../../../shared/constants/gas';
+import { GasEstimateTypes } from '../../../../shared/constants/gas';
 import { renderWithProvider } from '../../../../test/lib/render-helpers';
 import mockEstimates from '../../../../test/data/mock-estimates.json';
 import mockState from '../../../../test/data/mock-state.json';
@@ -40,7 +40,7 @@ const render = () => {
       },
       featureFlags: { advancedInlineGas: true },
       gasFeeEstimates:
-        mockEstimates[GAS_ESTIMATE_TYPES.FEE_MARKET].gasFeeEstimates,
+        mockEstimates[GasEstimateTypes.feeMarket].gasFeeEstimates,
     },
   });
 

ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-save/advanced-gas-fee-save.js

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { PRIORITY_LEVELS } from '../../../../../shared/constants/gas';
+import { PriorityLevels } from '../../../../../shared/constants/gas';
 import { decGWEIToHexWEI } from '../../../../../shared/modules/conversion.utils';
 import { useTransactionModalContext } from '../../../../contexts/transaction-modal';
 import { useGasFeeContext } from '../../../../contexts/gasFee';
@@ -20,7 +20,7 @@ const AdvancedGasFeeSaveButton = () => {
 
   const onSave = () => {
     updateTransaction({
-      estimateUsed: PRIORITY_LEVELS.CUSTOM,
+      estimateUsed: PriorityLevels.custom,
       maxFeePerGas: decGWEIToHexWEI(maxFeePerGas),
       maxPriorityFeePerGas: decGWEIToHexWEI(maxPriorityFeePerGas),
       gasLimit,

ui/components/app/cancel-speedup-popover/cancel-speedup-popover.js

@@ -1,10 +1,7 @@
 import { useSelector } from 'react-redux';
 import React, { useEffect } from 'react';
 
-import {
+import { EditGasModes, PriorityLevels } from '../../../../shared/constants/gas';
-  EDIT_GAS_MODES,
-  PRIORITY_LEVELS,
-} from '../../../../shared/constants/gas';
 import {
   ALIGN_ITEMS,
   DISPLAY,
@@ -55,10 +52,10 @@ const CancelSpeedupPopover = () => {
       gasEstimateGreaterThanGasUsedPlusTenPercent(
         transaction.txParams,
         gasFeeEstimates,
-        PRIORITY_LEVELS.MEDIUM,
+        PriorityLevels.medium,
       );
     if (gasUsedLessThanMedium) {
-      updateTransactionUsingEstimate(PRIORITY_LEVELS.MEDIUM);
+      updateTransactionUsingEstimate(PriorityLevels.medium);
       return;
     }
     updateTransactionToTenPercentIncreasedGasFee(true);
@@ -78,7 +75,7 @@ const CancelSpeedupPopover = () => {
   }
 
   const submitTransactionChange = () => {
-    if (editGasMode === EDIT_GAS_MODES.CANCEL) {
+    if (editGasMode === EditGasModes.cancel) {
       cancelTransaction();
     } else {
       speedUpTransaction();
@@ -90,7 +87,7 @@ const CancelSpeedupPopover = () => {
     <Popover
       title={
         <>
-          {editGasMode === EDIT_GAS_MODES.CANCEL
+          {editGasMode === EditGasModes.cancel
             ? `❌${t('cancel')}`
             : `🚀${t('speedUp')}`}
         </>
@@ -114,7 +111,7 @@ const CancelSpeedupPopover = () => {
             contentText={
               <Box>
                 {t('cancelSpeedUpTransactionTooltip', [
-                  editGasMode === EDIT_GAS_MODES.CANCEL
+                  editGasMode === EditGasModes.cancel
                     ? t('cancel')
                     : t('speedUp'),
                 ])}

ui/components/app/cancel-speedup-popover/cancel-speedup-popover.test.js

@@ -3,8 +3,8 @@ import { act, screen } from '@testing-library/react';
 import BigNumber from 'bignumber.js';
 
 import {
-  EDIT_GAS_MODES,
+  EditGasModes,
-  GAS_ESTIMATE_TYPES,
+  GasEstimateTypes,
 } from '../../../../shared/constants/gas';
 import { renderWithProvider } from '../../../../test/lib/render-helpers';
 import mockEstimates from '../../../../test/data/mock-estimates.json';
@@ -31,7 +31,7 @@ const EXPECTED_ETH_FEE_1 = hexWEIToDecETH(
 );
 
 const MOCK_SUGGESTED_MEDIUM_MAXFEEPERGAS_DEC_GWEI =
-  mockEstimates[GAS_ESTIMATE_TYPES.FEE_MARKET].gasFeeEstimates.medium
+  mockEstimates[GasEstimateTypes.feeMarket].gasFeeEstimates.medium
     .suggestedMaxFeePerGas;
 const MOCK_SUGGESTED_MEDIUM_MAXFEEPERGAS_BN_WEI = new BigNumber(
   decGWEIToHexWEI(MOCK_SUGGESTED_MEDIUM_MAXFEEPERGAS_DEC_GWEI),
@@ -84,7 +84,7 @@ const render = (
       },
       featureFlags: { advancedInlineGas: true },
       gasFeeEstimates:
-        mockEstimates[GAS_ESTIMATE_TYPES.FEE_MARKET].gasFeeEstimates,
+        mockEstimates[GasEstimateTypes.feeMarket].gasFeeEstimates,
     },
   });
 
@@ -98,7 +98,7 @@ const render = (
           maxPriorityFeePerGas: '0x59682f00',
         },
       }}
-      editGasMode={EDIT_GAS_MODES.CANCEL}
+      editGasMode={EditGasModes.cancel}
       {...props}
     >
       <CancelSpeedupPopover />
@@ -118,7 +118,7 @@ describe('CancelSpeedupPopover', () => {
   });
 
   it('should have 🚀Speed up in header if editGasMode is speedup', async () => {
-    await act(async () => render({ editGasMode: EDIT_GAS_MODES.SPEED_UP }));
+    await act(async () => render({ editGasMode: EditGasModes.speedUp }));
     expect(screen.queryByText('🚀Speed up')).toBeInTheDocument();
   });
 
@@ -132,7 +132,7 @@ describe('CancelSpeedupPopover', () => {
   });
 
   it('information tooltip should contain the correct text if editGasMode is speedup', async () => {
-    await act(async () => render({ editGasMode: EDIT_GAS_MODES.SPEED_UP }));
+    await act(async () => render({ editGasMode: EditGasModes.speedUp }));
     expect(
       InfoTooltip.mock.calls[0][0].contentText.props.children[0],
     ).toStrictEqual(
@@ -144,7 +144,7 @@ describe('CancelSpeedupPopover', () => {
     await act(async () =>
       render(
         {
-          editGasMode: EDIT_GAS_MODES.SPEED_UP,
+          editGasMode: EditGasModes.speedUp,
         },
         MAXFEEPERGAS_ABOVE_MOCK_MEDIUM_HEX,
       ),
@@ -158,7 +158,7 @@ describe('CancelSpeedupPopover', () => {
     await act(async () =>
       render(
         {
-          editGasMode: EDIT_GAS_MODES.SPEED_UP,
+          editGasMode: EditGasModes.speedUp,
         },
         `0x${MAXFEEPERGAS_BELOW_MOCK_MEDIUM_HEX}`,
       ),

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

@@ -2,7 +2,7 @@ import React, { useCallback, useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
 import { useSelector } from 'react-redux';
 
-import { EDIT_GAS_MODES } from '../../../../shared/constants/gas';
+import { EditGasModes } from '../../../../shared/constants/gas';
 import { GasFeeContextProvider } from '../../../contexts/gasFee';
 import {
   TokenStandard,
@@ -289,7 +289,7 @@ const ConfirmPageContainer = (props) => {
         )}
         {editingGas && !supportsEIP1559 && (
           <EditGasPopover
-            mode={EDIT_GAS_MODES.MODIFY_IN_PLACE}
+            mode={EditGasModes.modifyInPlace}
             onClose={handleCloseEditGas}
             transaction={currentTransaction}
           />

ui/components/app/edit-gas-display/edit-gas-display.component.js

@@ -2,7 +2,7 @@ import React, { useContext, useRef } from 'react';
 import PropTypes from 'prop-types';
 
 import BigNumber from 'bignumber.js';
-import { EDIT_GAS_MODES } from '../../../../shared/constants/gas';
+import { EditGasModes } from '../../../../shared/constants/gas';
 
 import Button from '../../ui/button';
 import Typography from '../../ui/typography/typography';
@@ -23,7 +23,7 @@ import ActionableMessage from '../../ui/actionable-message/actionable-message';
 import { I18nContext } from '../../../contexts/i18n';
 
 export default function EditGasDisplay({
-  mode = EDIT_GAS_MODES.MODIFY_IN_PLACE,
+  mode = EditGasModes.modifyInPlace,
   estimatedMinimumNative,
   transaction,
   gasPrice,
@@ -95,7 +95,7 @@ export default function EditGasDisplay({
             />
           </div>
         )}
-        {mode === EDIT_GAS_MODES.SPEED_UP && (
+        {mode === EditGasModes.speedUp && (
           <div className="edit-gas-display__top-tooltip">
             <Typography
               color={COLORS.TEXT_DEFAULT}
@@ -143,7 +143,7 @@ export default function EditGasDisplay({
 }
 
 EditGasDisplay.propTypes = {
-  mode: PropTypes.oneOf(Object.values(EDIT_GAS_MODES)),
+  mode: PropTypes.oneOf(Object.values(EditGasModes)),
   estimatedMinimumNative: PropTypes.string,
   gasPrice: PropTypes.string,
   setGasPrice: PropTypes.func,

ui/components/app/edit-gas-fee-button/edit-gas-fee-button.js

@@ -1,10 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 
-import {
+import { EditGasModes, PriorityLevels } from '../../../../shared/constants/gas';
-  EDIT_GAS_MODES,
-  PRIORITY_LEVELS,
-} from '../../../../shared/constants/gas';
 import { COLORS, TYPOGRAPHY } from '../../../helpers/constants/design-system';
 import { PRIORITY_LEVEL_ICON_MAP } from '../../../helpers/constants/gas';
 import { useGasFeeContext } from '../../../contexts/gasFee';
@@ -38,12 +35,12 @@ export default function EditGasFeeButton({ userAcknowledgedGasMissing }) {
   let icon = estimateUsed;
   let title = estimateUsed;
   if (
-    estimateUsed === PRIORITY_LEVELS.HIGH &&
+    estimateUsed === PriorityLevels.high &&
-    editGasMode === EDIT_GAS_MODES.SWAPS
+    editGasMode === EditGasModes.swaps
   ) {
     icon = 'swapSuggested';
     title = 'swapSuggested';
-  } else if (estimateUsed === PRIORITY_LEVELS.TEN_PERCENT_INCREASED) {
+  } else if (estimateUsed === PriorityLevels.tenPercentIncreased) {
     icon = undefined;
     title = 'tenPercentIncreased';
   }

ui/components/app/edit-gas-fee-button/edit-gas-fee-button.test.js

@@ -2,9 +2,9 @@ import React from 'react';
 import { screen } from '@testing-library/react';
 
 import {
-  EDIT_GAS_MODES,
+  EditGasModes,
-  GAS_ESTIMATE_TYPES,
+  GasEstimateTypes,
-  PRIORITY_LEVELS,
+  PriorityLevels,
 } from '../../../../shared/constants/gas';
 import { TransactionEnvelopeType } from '../../../../shared/constants/transaction';
 
@@ -35,7 +35,7 @@ const render = ({ componentProps, contextProps } = {}) => {
           balance: '0x1F4',
         },
       },
-      gasFeeEstimates: mockEstimates[GAS_ESTIMATE_TYPES.FEE_MARKET],
+      gasFeeEstimates: mockEstimates[GasEstimateTypes.feeMarket],
     },
   });
 
@@ -77,7 +77,7 @@ describe('EditGasFeeButton', () => {
     render({
       contextProps: {
         transaction: {
-          userFeeLevel: PRIORITY_LEVELS.DAPP_SUGGESTED,
+          userFeeLevel: PriorityLevels.dAppSuggested,
           dappSuggestedGasFees: { maxFeePerGas: 1, maxPriorityFeePerGas: 1 },
           txParams: { maxFeePerGas: 1, maxPriorityFeePerGas: 1 },
         },
@@ -92,7 +92,7 @@ describe('EditGasFeeButton', () => {
     render({
       contextProps: {
         transaction: { userFeeLevel: 'high' },
-        editGasMode: EDIT_GAS_MODES.SWAPS,
+        editGasMode: EditGasModes.swaps,
       },
     });
     expect(screen.queryByText('🔄')).toBeInTheDocument();

ui/components/app/edit-gas-fee-popover/edit-gas-fee-popover.js

@@ -1,9 +1,6 @@
 import React from 'react';
 
-import {
+import { EditGasModes, PriorityLevels } from '../../../../shared/constants/gas';
-  EDIT_GAS_MODES,
-  PRIORITY_LEVELS,
-} from '../../../../shared/constants/gas';
 import { useI18nContext } from '../../../hooks/useI18nContext';
 import { useTransactionModalContext } from '../../../contexts/transaction-modal';
 import Box from '../../ui/box';
@@ -30,9 +27,9 @@ const EditGasFeePopover = () => {
   }
 
   let popupTitle = 'editGasFeeModalTitle';
-  if (editGasMode === EDIT_GAS_MODES.CANCEL) {
+  if (editGasMode === EditGasModes.cancel) {
     popupTitle = 'editCancellationGasFeeModalTitle';
-  } else if (editGasMode === EDIT_GAS_MODES.SPEED_UP) {
+  } else if (editGasMode === EditGasModes.speedUp) {
     popupTitle = 'editSpeedUpEditGasFeeModalTitle';
   }
 
@@ -59,28 +56,28 @@ const EditGasFeePopover = () => {
                   {t('gasOption')}
                 </span>
                 <span className="edit-gas-fee-popover__content__header-time">
-                  {editGasMode !== EDIT_GAS_MODES.SWAPS && t('time')}
+                  {editGasMode !== EditGasModes.swaps && t('time')}
                 </span>
                 <span className="edit-gas-fee-popover__content__header-max-fee">
                   {t('maxFee')}
                 </span>
               </div>
-              {(editGasMode === EDIT_GAS_MODES.CANCEL ||
+              {(editGasMode === EditGasModes.cancel ||
-                editGasMode === EDIT_GAS_MODES.SPEED_UP) && (
+                editGasMode === EditGasModes.speedUp) && (
                 <EditGasItem
-                  priorityLevel={PRIORITY_LEVELS.TEN_PERCENT_INCREASED}
+                  priorityLevel={PriorityLevels.tenPercentIncreased}
                 />
               )}
-              {editGasMode === EDIT_GAS_MODES.MODIFY_IN_PLACE && (
+              {editGasMode === EditGasModes.modifyInPlace && (
-                <EditGasItem priorityLevel={PRIORITY_LEVELS.LOW} />
+                <EditGasItem priorityLevel={PriorityLevels.low} />
               )}
-              <EditGasItem priorityLevel={PRIORITY_LEVELS.MEDIUM} />
+              <EditGasItem priorityLevel={PriorityLevels.medium} />
-              <EditGasItem priorityLevel={PRIORITY_LEVELS.HIGH} />
+              <EditGasItem priorityLevel={PriorityLevels.high} />
               <div className="edit-gas-fee-popover__content__separator" />
-              {editGasMode === EDIT_GAS_MODES.MODIFY_IN_PLACE && (
+              {editGasMode === EditGasModes.modifyInPlace && (
-                <EditGasItem priorityLevel={PRIORITY_LEVELS.DAPP_SUGGESTED} />
+                <EditGasItem priorityLevel={PriorityLevels.dAppSuggested} />
               )}
-              <EditGasItem priorityLevel={PRIORITY_LEVELS.CUSTOM} />
+              <EditGasItem priorityLevel={PriorityLevels.custom} />
             </Box>
             <Box>
               <NetworkStatistics />

ui/components/app/edit-gas-fee-popover/edit-gas-fee-popover.test.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { screen } from '@testing-library/react';
 
-import { EDIT_GAS_MODES } from '../../../../shared/constants/gas';
+import { EditGasModes } from '../../../../shared/constants/gas';
 import { renderWithProvider } from '../../../../test/lib/render-helpers';
 import { ETH } from '../../../helpers/constants/common';
 import configureStore from '../../../store/store';
@@ -121,7 +121,7 @@ describe('EditGasFeePopover', () => {
 
   it('should not show low, aggressive and dapp-suggested options for swap', () => {
     render({
-      contextProps: { editGasMode: EDIT_GAS_MODES.SWAPS },
+      contextProps: { editGasMode: EditGasModes.swaps },
     });
     expect(screen.queryByText('🐢')).not.toBeInTheDocument();
     expect(screen.queryByText('🦊')).toBeInTheDocument();
@@ -139,7 +139,7 @@ describe('EditGasFeePopover', () => {
 
   it('should not show time estimates for swaps', () => {
     render({
-      contextProps: { editGasMode: EDIT_GAS_MODES.SWAPS },
+      contextProps: { editGasMode: EditGasModes.swaps },
     });
     expect(screen.queryByText('Time')).not.toBeInTheDocument();
     expect(screen.queryByText('Max fee')).toBeInTheDocument();
@@ -147,43 +147,43 @@ describe('EditGasFeePopover', () => {
 
   it('should show correct header for edit gas mode', () => {
     render({
-      contextProps: { editGasMode: EDIT_GAS_MODES.SWAPS },
+      contextProps: { editGasMode: EditGasModes.swaps },
     });
     expect(screen.queryByText('Edit gas fee')).toBeInTheDocument();
     render({
-      contextProps: { editGasMode: EDIT_GAS_MODES.CANCEL },
+      contextProps: { editGasMode: EditGasModes.cancel },
     });
     expect(screen.queryByText('Edit cancellation gas fee')).toBeInTheDocument();
     render({
-      contextProps: { editGasMode: EDIT_GAS_MODES.SPEED_UP },
+      contextProps: { editGasMode: EditGasModes.speedUp },
     });
     expect(screen.queryByText('Edit speed up gas fee')).toBeInTheDocument();
   });
 
   it('should not show low option for cancel mode', () => {
     render({
-      contextProps: { editGasMode: EDIT_GAS_MODES.CANCEL },
+      contextProps: { editGasMode: EditGasModes.cancel },
     });
     expect(screen.queryByText('Low')).not.toBeInTheDocument();
   });
 
   it('should not show low option for speedup mode', () => {
     render({
-      contextProps: { editGasMode: EDIT_GAS_MODES.SPEED_UP },
+      contextProps: { editGasMode: EditGasModes.speedUp },
     });
     expect(screen.queryByText('Low')).not.toBeInTheDocument();
   });
 
   it('should show tenPercentIncreased option for cancel gas mode', () => {
     render({
-      contextProps: { editGasMode: EDIT_GAS_MODES.CANCEL },
+      contextProps: { editGasMode: EditGasModes.cancel },
     });
     expect(screen.queryByText('10% increase')).toBeInTheDocument();
   });
 
   it('should show tenPercentIncreased option for speedup gas mode', () => {
     render({
-      contextProps: { editGasMode: EDIT_GAS_MODES.SPEED_UP },
+      contextProps: { editGasMode: EditGasModes.speedUp },
     });
     expect(screen.queryByText('10% increase')).toBeInTheDocument();
   });

ui/components/app/edit-gas-fee-popover/edit-gas-item/edit-gas-item.js

@@ -3,8 +3,8 @@ import PropTypes from 'prop-types';
 import React from 'react';
 
 import {
-  EDIT_GAS_MODES,
+  EditGasModes,
-  PRIORITY_LEVELS,
+  PriorityLevels,
 } from '../../../../../shared/constants/gas';
 import { PRIORITY_LEVEL_ICON_MAP } from '../../../../helpers/constants/gas';
 import { PRIMARY } from '../../../../helpers/constants/common';
@@ -23,14 +23,14 @@ import { useGasItemFeeDetails } from './useGasItemFeeDetails';
 const getTitleAndIcon = (priorityLevel, editGasMode) => {
   let icon = priorityLevel;
   let title = priorityLevel;
-  if (priorityLevel === PRIORITY_LEVELS.DAPP_SUGGESTED) {
+  if (priorityLevel === PriorityLevels.dAppSuggested) {
     title = 'dappSuggestedShortLabel';
-  } else if (priorityLevel === PRIORITY_LEVELS.TEN_PERCENT_INCREASED) {
+  } else if (priorityLevel === PriorityLevels.tenPercentIncreased) {
     icon = null;
     title = 'tenPercentIncreased';
   } else if (
-    priorityLevel === PRIORITY_LEVELS.HIGH &&
+    priorityLevel === PriorityLevels.high &&
-    editGasMode === EDIT_GAS_MODES.SWAPS
+    editGasMode === EditGasModes.swaps
   ) {
     icon = 'swapSuggested';
     title = 'swapSuggested';
@@ -64,7 +64,7 @@ const EditGasItem = ({ priorityLevel }) => {
   } = useGasItemFeeDetails(priorityLevel);
 
   if (
-    priorityLevel === PRIORITY_LEVELS.DAPP_SUGGESTED &&
+    priorityLevel === PriorityLevels.dAppSuggested &&
     !dappSuggestedGasFees?.maxFeePerGas &&
     !dappSuggestedGasFees?.gasPrice
   ) {
@@ -72,7 +72,7 @@ const EditGasItem = ({ priorityLevel }) => {
   }
 
   const onOptionSelect = () => {
-    if (priorityLevel === PRIORITY_LEVELS.CUSTOM) {
+    if (priorityLevel === PriorityLevels.custom) {
       updateTransactionEventFragment({
         properties: {
           gas_edit_attempted: 'advanced',
@@ -88,9 +88,9 @@ const EditGasItem = ({ priorityLevel }) => {
 
       closeModal(['editGasFee']);
 
-      if (priorityLevel === PRIORITY_LEVELS.TEN_PERCENT_INCREASED) {
+      if (priorityLevel === PriorityLevels.tenPercentIncreased) {
         updateTransactionToTenPercentIncreasedGasFee();
-      } else if (priorityLevel === PRIORITY_LEVELS.DAPP_SUGGESTED) {
+      } else if (priorityLevel === PriorityLevels.dAppSuggested) {
         updateTransactionUsingDAPPSuggestedValues();
       } else {
         updateTransactionUsingEstimate(priorityLevel);
@@ -125,7 +125,7 @@ const EditGasItem = ({ priorityLevel }) => {
       <span
         className={`edit-gas-item__time-estimate edit-gas-item__time-estimate-${priorityLevel}`}
       >
-        {editGasMode !== EDIT_GAS_MODES.SWAPS &&
+        {editGasMode !== EditGasModes.swaps &&
           (minWaitTime ? toHumanReadableTime(t, minWaitTime) : '--')}
       </span>
       <span

ui/components/app/edit-gas-fee-popover/edit-gas-item/edit-gas-item.test.js

@@ -1,7 +1,10 @@
 import React from 'react';
 import { screen } from '@testing-library/react';
 
-import { EDIT_GAS_MODES } from '../../../../../shared/constants/gas';
+import {
+  EditGasModes,
+  PriorityLevels,
+} from '../../../../../shared/constants/gas';
 import { renderWithProvider } from '../../../../../test/lib/render-helpers';
 import { ETH } from '../../../../helpers/constants/common';
 import configureStore from '../../../../store/store';
@@ -88,7 +91,7 @@ const renderComponent = ({
 
 describe('EditGasItem', () => {
   it('should renders low gas estimate option for priorityLevel low', () => {
-    renderComponent({ componentProps: { priorityLevel: 'low' } });
+    renderComponent({ componentProps: { priorityLevel: PriorityLevels.low } });
     expect(screen.queryByRole('button', { name: 'low' })).toBeInTheDocument();
     expect(screen.queryByText('🐢')).toBeInTheDocument();
     expect(screen.queryByText('Low')).toBeInTheDocument();
@@ -97,7 +100,9 @@ describe('EditGasItem', () => {
   });
 
   it('should renders market gas estimate option for priorityLevel medium', () => {
-    renderComponent({ componentProps: { priorityLevel: 'medium' } });
+    renderComponent({
+      componentProps: { priorityLevel: PriorityLevels.medium },
+    });
     expect(
       screen.queryByRole('button', { name: 'medium' }),
     ).toBeInTheDocument();
@@ -108,7 +113,7 @@ describe('EditGasItem', () => {
   });
 
   it('should renders aggressive gas estimate option for priorityLevel high', () => {
-    renderComponent({ componentProps: { priorityLevel: 'high' } });
+    renderComponent({ componentProps: { priorityLevel: PriorityLevels.high } });
     expect(screen.queryByRole('button', { name: 'high' })).toBeInTheDocument();
     expect(screen.queryByText('🦍')).toBeInTheDocument();
     expect(screen.queryByText('Aggressive')).toBeInTheDocument();
@@ -118,8 +123,8 @@ describe('EditGasItem', () => {
 
   it('should render priorityLevel high as "Swap suggested" for swaps', () => {
     renderComponent({
-      componentProps: { priorityLevel: 'high' },
+      componentProps: { priorityLevel: PriorityLevels.high },
-      contextProps: { editGasMode: EDIT_GAS_MODES.SWAPS },
+      contextProps: { editGasMode: EditGasModes.swaps },
     });
     expect(screen.queryByRole('button', { name: 'high' })).toBeInTheDocument();
     expect(screen.queryByText('🔄')).toBeInTheDocument();
@@ -130,7 +135,7 @@ describe('EditGasItem', () => {
 
   it('should highlight option is priorityLevel is currently selected', () => {
     renderComponent({
-      componentProps: { priorityLevel: 'high' },
+      componentProps: { priorityLevel: PriorityLevels.high },
       transactionProps: { userFeeLevel: 'high' },
     });
     expect(
@@ -140,7 +145,7 @@ describe('EditGasItem', () => {
 
   it('should renders site gas estimate option for priorityLevel dappSuggested', () => {
     renderComponent({
-      componentProps: { priorityLevel: 'dappSuggested' },
+      componentProps: { priorityLevel: PriorityLevels.dAppSuggested },
       transactionProps: { dappSuggestedGasFees: ESTIMATE_MOCK },
     });
     expect(
@@ -153,14 +158,14 @@ describe('EditGasItem', () => {
 
   it('should not renders site gas estimate option for priorityLevel dappSuggested if site does not provided gas estimates', () => {
     renderComponent({
-      componentProps: { priorityLevel: 'dappSuggested' },
+      componentProps: { priorityLevel: PriorityLevels.dAppSuggested },
       transactionProps: {},
     });
     expect(
       screen.queryByRole('button', { name: 'dappSuggested' }),
     ).not.toBeInTheDocument();
     renderComponent({
-      componentProps: { priorityLevel: 'dappSuggested' },
+      componentProps: { priorityLevel: PriorityLevels.dAppSuggested },
       transactionProps: { dappSuggestedGasFees: { gas: '0x59682f10' } },
     });
     expect(
@@ -170,7 +175,7 @@ describe('EditGasItem', () => {
 
   it('should renders advance gas estimate option for priorityLevel custom', () => {
     renderComponent({
-      componentProps: { priorityLevel: 'custom' },
+      componentProps: { priorityLevel: PriorityLevels.custom },
       transactionProps: { userFeeLevel: 'high' },
     });
     expect(
@@ -184,12 +189,12 @@ describe('EditGasItem', () => {
 
   it('should renders +10% gas estimate option for priorityLevel minimum', () => {
     renderComponent({
-      componentProps: { priorityLevel: 'tenPercentIncreased' },
+      componentProps: { priorityLevel: PriorityLevels.tenPercentIncreased },
       transactionProps: {
         userFeeLevel: 'tenPercentIncreased',
         previousGas: ESTIMATE_MOCK,
       },
-      contextProps: { editGasMode: EDIT_GAS_MODES.CANCEL },
+      contextProps: { editGasMode: EditGasModes.cancel },
     });
     expect(
       screen.queryByRole('button', { name: 'tenPercentIncreased' }),

ui/components/app/edit-gas-fee-popover/edit-gas-item/useCustomTimeEstimate.js

@@ -2,7 +2,7 @@ import { useEffect, useState } from 'react';
 import { useSelector } from 'react-redux';
 import BigNumber from 'bignumber.js';
 
-import { GAS_ESTIMATE_TYPES } from '../../../../../shared/constants/gas';
+import { GasEstimateTypes } from '../../../../../shared/constants/gas';
 import {
   getGasEstimateType,
   getIsGasEstimatesLoading,
@@ -21,7 +21,7 @@ export const useCustomTimeEstimate = ({
 
   const returnNoEstimates =
     isGasEstimatesLoading ||
-    gasEstimateType !== GAS_ESTIMATE_TYPES.FEE_MARKET ||
+    gasEstimateType !== GasEstimateTypes.feeMarket ||
     !maxPriorityFeePerGas;
 
   // If the user has chosen a value lower than the low gas fee estimate,
@@ -35,7 +35,7 @@ export const useCustomTimeEstimate = ({
   useEffect(() => {
     if (
       isGasEstimatesLoading ||
-      gasEstimateType !== GAS_ESTIMATE_TYPES.FEE_MARKET ||
+      gasEstimateType !== GasEstimateTypes.feeMarket ||
       !maxPriorityFeePerGas
     ) {
       return;

ui/components/app/edit-gas-fee-popover/edit-gas-item/useGasItemFeeDetails.js

@@ -2,8 +2,8 @@ import { useEffect, useState } from 'react';
 import { useSelector } from 'react-redux';
 
 import {
-  EDIT_GAS_MODES,
+  EditGasModes,
-  PRIORITY_LEVELS,
+  PriorityLevels,
 } from '../../../../../shared/constants/gas';
 import { getMaximumGasTotalInHexWei } from '../../../../../shared/modules/gas.utils';
 import {
@@ -44,7 +44,7 @@ export const useGasItemFeeDetails = (priorityLevel) => {
     maxPriorityFeePerGas =
       gasFeeEstimates[priorityLevel].suggestedMaxPriorityFeePerGas;
   } else if (
-    priorityLevel === PRIORITY_LEVELS.DAPP_SUGGESTED &&
+    priorityLevel === PriorityLevels.dAppSuggested &&
     dappSuggestedGasFees
   ) {
     maxFeePerGas = hexWEIToDecGWEI(
@@ -53,16 +53,16 @@ export const useGasItemFeeDetails = (priorityLevel) => {
     maxPriorityFeePerGas = hexWEIToDecGWEI(
       dappSuggestedGasFees.maxPriorityFeePerGas || maxFeePerGas,
     );
-  } else if (priorityLevel === PRIORITY_LEVELS.CUSTOM) {
+  } else if (priorityLevel === PriorityLevels.custom) {
-    if (estimateUsed === PRIORITY_LEVELS.CUSTOM) {
+    if (estimateUsed === PriorityLevels.custom) {
       maxFeePerGas = maxFeePerGasValue;
       maxPriorityFeePerGas = maxPriorityFeePerGasValue;
-    } else if (advancedGasFeeValues && editGasMode !== EDIT_GAS_MODES.SWAPS) {
+    } else if (advancedGasFeeValues && editGasMode !== EditGasModes.swaps) {
       maxFeePerGas = advancedGasFeeValues.maxBaseFee;
       maxPriorityFeePerGas = advancedGasFeeValues.priorityFee;
     }
   } else if (
-    priorityLevel === PRIORITY_LEVELS.TEN_PERCENT_INCREASED &&
+    priorityLevel === PriorityLevels.tenPercentIncreased &&
     transaction.previousGas
   ) {
     maxFeePerGas = hexWEIToDecGWEI(
@@ -81,7 +81,7 @@ export const useGasItemFeeDetails = (priorityLevel) => {
 
   if (gasFeeEstimates[priorityLevel]) {
     minWaitTime =
-      priorityLevel === PRIORITY_LEVELS.HIGH
+      priorityLevel === PriorityLevels.high
         ? gasFeeEstimates?.high.minWaitTimeEstimate
         : gasFeeEstimates?.low.maxWaitTimeEstimate;
   } else {
@@ -99,10 +99,10 @@ export const useGasItemFeeDetails = (priorityLevel) => {
     // For cancel and speed-up medium / high option is disabled if
     // gas used in transaction + 10% is greater tham estimate
     if (
-      (editGasMode === EDIT_GAS_MODES.CANCEL ||
+      (editGasMode === EditGasModes.cancel ||
-        editGasMode === EDIT_GAS_MODES.SPEED_UP) &&
+        editGasMode === EditGasModes.speedUp) &&
-      (priorityLevel === PRIORITY_LEVELS.MEDIUM ||
+      (priorityLevel === PriorityLevels.medium ||
-        priorityLevel === PRIORITY_LEVELS.HIGH)
+        priorityLevel === PriorityLevels.high)
     ) {
       const estimateGreater = !gasEstimateGreaterThanGasUsedPlusTenPercent(
         transaction.previousGas || transaction.txParams,

ui/components/app/edit-gas-fee-popover/edit-gas-tooltip/edit-gas-tooltip.js

@@ -1,8 +1,8 @@
 import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
 import {
-  EDIT_GAS_MODES,
+  EditGasModes,
-  PRIORITY_LEVELS,
+  PriorityLevels,
 } from '../../../../../shared/constants/gas';
 import {
   COLORS,
@@ -28,13 +28,13 @@ const EditGasToolTip = ({
 }) => {
   const toolTipMessage = useMemo(() => {
     switch (priorityLevel) {
-      case PRIORITY_LEVELS.LOW:
+      case PriorityLevels.low:
         return t('lowGasSettingToolTipMessage', [
           <span key={priorityLevel}>
             <b>{t('low')}</b>
           </span>,
         ]);
-      case PRIORITY_LEVELS.MEDIUM:
+      case PriorityLevels.medium:
         if (estimateGreaterThanGasUse) {
           return t('disabledGasOptionToolTipMessage', [
             <span key={`disabled-priority-level-${priorityLevel}`}>
@@ -47,7 +47,7 @@ const EditGasToolTip = ({
             <b>{t('medium')}</b>
           </span>,
         ]);
-      case PRIORITY_LEVELS.HIGH:
+      case PriorityLevels.high:
         if (estimateGreaterThanGasUse) {
           return t('disabledGasOptionToolTipMessage', [
             <span key={`disabled-priority-level-${priorityLevel}`}>
@@ -55,7 +55,7 @@ const EditGasToolTip = ({
             </span>,
           ]);
         }
-        if (editGasMode === EDIT_GAS_MODES.SWAPS) {
+        if (editGasMode === EditGasModes.swaps) {
           return t('swapSuggestedGasSettingToolTipMessage');
         }
         return t('highGasSettingToolTipMessage', [
@@ -63,13 +63,13 @@ const EditGasToolTip = ({
             <b>{t('high')}</b>
           </span>,
         ]);
-      case PRIORITY_LEVELS.CUSTOM:
+      case PriorityLevels.custom:
         return t('customGasSettingToolTipMessage', [
           <span key={priorityLevel}>
             <b>{t('custom')}</b>
           </span>,
         ]);
-      case PRIORITY_LEVELS.DAPP_SUGGESTED:
+      case PriorityLevels.dAppSuggested:
         return transaction?.origin
           ? t('dappSuggestedGasSettingToolTipMessage', [
               <span key={transaction?.origin}>{transaction?.origin}</span>,
@@ -81,11 +81,11 @@ const EditGasToolTip = ({
   }, [editGasMode, estimateGreaterThanGasUse, priorityLevel, transaction, t]);
 
   let imgAltText;
-  if (priorityLevel === PRIORITY_LEVELS.LOW) {
+  if (priorityLevel === PriorityLevels.low) {
     imgAltText = t('curveLowGasEstimate');
-  } else if (priorityLevel === PRIORITY_LEVELS.MEDIUM) {
+  } else if (priorityLevel === PriorityLevels.medium) {
     imgAltText = t('curveMediumGasEstimate');
-  } else if (priorityLevel === PRIORITY_LEVELS.HIGH) {
+  } else if (priorityLevel === PriorityLevels.high) {
     imgAltText = t('curveHighGasEstimate');
   }
 
@@ -95,8 +95,8 @@ const EditGasToolTip = ({
   const showGasEstimateCurve =
     isMetamaskSuggestedGasEstimate(priorityLevel) &&
     !(
-      priorityLevel === PRIORITY_LEVELS.HIGH &&
+      priorityLevel === PriorityLevels.high &&
-      editGasMode === EDIT_GAS_MODES.SWAPS
+      editGasMode === EditGasModes.swaps
     ) &&
     !estimateGreaterThanGasUse;
 
@@ -110,7 +110,7 @@ const EditGasToolTip = ({
           <Typography variant={TYPOGRAPHY.H7}>{toolTipMessage}</Typography>
         </div>
       )}
-      {priorityLevel === PRIORITY_LEVELS.CUSTOM ||
+      {priorityLevel === PriorityLevels.custom ||
       estimateGreaterThanGasUse ? null : (
         <div className="edit-gas-tooltip__container__values">
           <div>

ui/components/app/edit-gas-fee-popover/network-statistics/status-slider/status-slider.js

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { NETWORK_CONGESTION_THRESHOLDS } from '../../../../../../shared/constants/gas';
+import { NetworkCongestionThresholds } from '../../../../../../shared/constants/gas';
 import { useGasFeeContext } from '../../../../../contexts/gasFee';
 import { useI18nContext } from '../../../../../hooks/useI18nContext';
 import { NetworkStabilityTooltip } from '../tooltips';
@@ -25,14 +25,14 @@ const determineStatusInfo = (givenNetworkCongestion) => {
   const color = GRADIENT_COLORS[colorIndex];
   const sliderTickValue = colorIndex * 10;
 
-  if (networkCongestion >= NETWORK_CONGESTION_THRESHOLDS.BUSY) {
+  if (networkCongestion >= NetworkCongestionThresholds.busy) {
     return {
       statusLabel: 'busy',
       tooltipLabel: 'highLowercase',
       color,
       sliderTickValue,
     };
-  } else if (networkCongestion >= NETWORK_CONGESTION_THRESHOLDS.STABLE) {
+  } else if (networkCongestion >= NetworkCongestionThresholds.stable) {
     return {
       statusLabel: 'stable',
       tooltipLabel: 'stableLowercase',

ui/components/app/edit-gas-popover/edit-gas-popover.component.js

@@ -4,10 +4,10 @@ import { useDispatch } from 'react-redux';
 import { useGasFeeInputs } from '../../../hooks/gasFeeInput/useGasFeeInputs';
 import { txParamsAreDappSuggested } from '../../../../shared/modules/transaction.utils';
 import {
-  EDIT_GAS_MODES,
+  EditGasModes,
   GAS_LIMITS,
   CUSTOM_GAS_ESTIMATE,
-  GAS_RECOMMENDATIONS,
+  GasRecommendations,
 } from '../../../../shared/constants/gas';
 
 import Popover from '../../ui/popover';
@@ -50,7 +50,7 @@ export default function EditGasPopover({
   const updatedCustomGasSettings = useIncrementedGasFees(transaction);
 
   let updatedTransaction = transaction;
-  if (mode === EDIT_GAS_MODES.SPEED_UP || mode === EDIT_GAS_MODES.CANCEL) {
+  if (mode === EditGasModes.speedUp || mode === EditGasModes.cancel) {
     updatedTransaction = {
       ...transaction,
       userFeeLevel: CUSTOM_GAS_ESTIMATE,
@@ -74,7 +74,7 @@ export default function EditGasPopover({
     onManualChange,
     balanceError,
   } = useGasFeeInputs(
-    GAS_RECOMMENDATIONS.MEDIUM,
+    GasRecommendations.medium,
     updatedTransaction,
     minimumGasLimit,
     mode,
@@ -123,17 +123,17 @@ export default function EditGasPopover({
     };
 
     switch (mode) {
-      case EDIT_GAS_MODES.CANCEL:
+      case EditGasModes.cancel:
         dispatch(
           createCancelTransaction(updatedTransaction.id, newGasSettings),
         );
         break;
-      case EDIT_GAS_MODES.SPEED_UP:
+      case EditGasModes.speedUp:
         dispatch(
           createSpeedUpTransaction(updatedTransaction.id, newGasSettings),
         );
         break;
-      case EDIT_GAS_MODES.MODIFY_IN_PLACE:
+      case EditGasModes.modifyInPlace:
         newGasSettings.userEditedGasLimit = updatedTxMeta.userEditedGasLimit;
         newGasSettings.userFeeLevel = updatedTxMeta.userFeeLevel;
 
@@ -162,9 +162,9 @@ export default function EditGasPopover({
   let title = t('editGasTitle');
   if (popoverTitle) {
     title = popoverTitle;
-  } else if (mode === EDIT_GAS_MODES.SPEED_UP) {
+  } else if (mode === EditGasModes.speedUp) {
     title = t('speedUpPopoverTitle');
-  } else if (mode === EDIT_GAS_MODES.CANCEL) {
+  } else if (mode === EditGasModes.cancel) {
     title = t('cancelPopoverTitle');
   }
 
@@ -217,6 +217,6 @@ EditGasPopover.propTypes = {
   confirmButtonText: PropTypes.string,
   onClose: PropTypes.func,
   transaction: PropTypes.object,
-  mode: PropTypes.oneOf(Object.values(EDIT_GAS_MODES)),
+  mode: PropTypes.oneOf(Object.values(EditGasModes)),
   minimumGasLimit: PropTypes.string,
 };

ui/components/app/edit-gas-popover/edit-gas-popover.stories.js

@@ -3,8 +3,8 @@ import { Provider } from 'react-redux';
 import configureStore from '../../../store/store';
 import testData from '../../../../.storybook/test-data';
 import {
-  EDIT_GAS_MODES,
+  EditGasModes,
-  GAS_RECOMMENDATIONS,
+  GasRecommendations,
 } from '../../../../shared/constants/gas';
 
 import { decGWEIToHexWEI } from '../../../../shared/modules/conversion.utils';
@@ -32,7 +32,7 @@ export default {
 };
 
 const transaction = {
-  userFeeLevel: GAS_RECOMMENDATIONS.MEDIUM,
+  userFeeLevel: GasRecommendations.medium,
   txParams: {
     maxFeePerGas: decGWEIToHexWEI('10000'),
     maxPriorityFeePerGas: '0x5600',
@@ -40,8 +40,8 @@ const transaction = {
     gasPrice: '0x5600',
   },
 };
-const defaultEstimateToUse = GAS_RECOMMENDATIONS.HIGH;
+const defaultEstimateToUse = GasRecommendations.high;
-const mode = EDIT_GAS_MODES.SWAPS;
+const mode = EditGasModes.swaps;
 const confirmButtonText = 'Submit';
 const minimumGasLimit = '5700';
 

ui/components/app/gas-details-item/gas-details-item.test.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { screen, waitFor } from '@testing-library/react';
 
-import { GAS_ESTIMATE_TYPES } from '../../../../shared/constants/gas';
+import { GasEstimateTypes } from '../../../../shared/constants/gas';
 import mockEstimates from '../../../../test/data/mock-estimates.json';
 import mockState from '../../../../test/data/mock-state.json';
 import { GasFeeContextProvider } from '../../../contexts/gasFee';
@@ -32,7 +32,7 @@ const render = ({ contextProps } = {}) => {
       preferences: {
         useNativeCurrencyAsPrimaryCurrency: true,
       },
-      gasFeeEstimates: mockEstimates[GAS_ESTIMATE_TYPES.FEE_MARKET],
+      gasFeeEstimates: mockEstimates[GasEstimateTypes.feeMarket],
     },
   });
 

ui/components/app/gas-timing/gas-timing.component.js

@@ -4,7 +4,7 @@ import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import BigNumber from 'bignumber.js';
 
-import { GAS_ESTIMATE_TYPES } from '../../../../shared/constants/gas';
+import { GasEstimateTypes } from '../../../../shared/constants/gas';
 
 import { usePrevious } from '../../../hooks/usePrevious';
 import { I18nContext } from '../../../contexts/i18n';
@@ -109,10 +109,7 @@ export default function GasTiming({
   }
 
   // Don't show anything if we don't have enough information
-  if (
+  if (isGasEstimatesLoading || gasEstimateType !== GasEstimateTypes.feeMarket) {
-    isGasEstimatesLoading ||
-    gasEstimateType !== GAS_ESTIMATE_TYPES.FEE_MARKET
-  ) {
     return null;
   }
 

ui/components/app/gas-timing/gas-timing.component.test.js

@@ -3,7 +3,7 @@ import configureMockStore from 'redux-mock-store';
 import { waitFor } from '@testing-library/react';
 import { renderWithProvider } from '../../../../test/lib/render-helpers';
 
-import { GAS_ESTIMATE_TYPES } from '../../../../shared/constants/gas';
+import { GasEstimateTypes } from '../../../../shared/constants/gas';
 import mockState from '../../../../test/data/mock-state.json';
 
 import GasTiming from '.';
@@ -18,7 +18,7 @@ describe('Gas timing', () => {
     const nullGasState = {
       metamask: {
         gasFeeEstimates: null,
-        gasEstimateType: GAS_ESTIMATE_TYPES.FEE_MARKET,
+        gasEstimateType: GasEstimateTypes.feeMarket,
       },
     };
 

ui/components/app/transaction-alerts/transaction-alerts.js

@@ -2,8 +2,8 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { useSelector } from 'react-redux';
 
-import { PRIORITY_LEVELS } from '../../../../shared/constants/gas';
+import { PriorityLevels } from '../../../../shared/constants/gas';
-import { submittedPendingTransactionsSelector } from '../../../selectors/transactions';
+import { submittedPendingTransactionsSelector } from '../../../selectors';
 import { useGasFeeContext } from '../../../contexts/gasFee';
 import { useI18nContext } from '../../../hooks/useI18nContext';
 import ActionableMessage from '../../ui/actionable-message/actionable-message';
@@ -73,7 +73,7 @@ const TransactionAlerts = ({
           type="warning"
         />
       )}
-      {estimateUsed === PRIORITY_LEVELS.LOW && (
+      {estimateUsed === PriorityLevels.low && (
         <ActionableMessage
           dataTestId="low-gas-fee-alert"
           message={

ui/components/app/transaction-detail/transaction-detail.component.test.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { screen } from '@testing-library/react';
 
-import { GAS_ESTIMATE_TYPES } from '../../../../shared/constants/gas';
+import { GasEstimateTypes } from '../../../../shared/constants/gas';
 import { TransactionEnvelopeType } from '../../../../shared/constants/transaction';
 
 import { GasFeeContextProvider } from '../../../contexts/gasFee';
@@ -31,7 +31,7 @@ const render = ({ componentProps, contextProps } = {}) => {
           balance: '0x1F4',
         },
       },
-      gasFeeEstimates: mockEstimates[GAS_ESTIMATE_TYPES.FEE_MARKET],
+      gasFeeEstimates: mockEstimates[GasEstimateTypes.feeMarket],
     },
   });
 

ui/components/app/transaction-list-item/transaction-list-item.component.js

@@ -18,7 +18,7 @@ import {
   TransactionGroupCategory,
   TransactionStatus,
 } from '../../../../shared/constants/transaction';
-import { EDIT_GAS_MODES } from '../../../../shared/constants/gas';
+import { EditGasModes } from '../../../../shared/constants/gas';
 import {
   GasFeeContextProvider,
   useGasFeeContext,
@@ -72,7 +72,7 @@ function TransactionListItemInner({
         },
       });
       if (supportsEIP1559) {
-        setEditGasMode(EDIT_GAS_MODES.SPEED_UP);
+        setEditGasMode(EditGasModes.speedUp);
         openModal('cancelSpeedUpTransaction');
       } else {
         setShowRetryEditGasPopover(true);
@@ -93,7 +93,7 @@ function TransactionListItemInner({
         },
       });
       if (supportsEIP1559) {
-        setEditGasMode(EDIT_GAS_MODES.CANCEL);
+        setEditGasMode(EditGasModes.cancel);
         openModal('cancelSpeedUpTransaction');
       } else {
         setShowCancelEditGasPopover(true);
@@ -252,14 +252,14 @@ function TransactionListItemInner({
       {!supportsEIP1559 && showRetryEditGasPopover && (
         <EditGasPopover
           onClose={() => setShowRetryEditGasPopover(false)}
-          mode={EDIT_GAS_MODES.SPEED_UP}
+          mode={EditGasModes.speedUp}
           transaction={transactionGroup.primaryTransaction}
         />
       )}
       {!supportsEIP1559 && showCancelEditGasPopover && (
         <EditGasPopover
           onClose={() => setShowCancelEditGasPopover(false)}
-          mode={EDIT_GAS_MODES.CANCEL}
+          mode={EditGasModes.cancel}
           transaction={transactionGroup.primaryTransaction}
         />
       )}

ui/components/app/transaction-list-item/transaction-list-item.component.test.js

@@ -15,11 +15,11 @@ import {
 } from '../../../../test/jest';
 
 import { useGasFeeEstimates } from '../../../hooks/useGasFeeEstimates';
-import { GAS_ESTIMATE_TYPES } from '../../../../shared/constants/gas';
+import { GasEstimateTypes } from '../../../../shared/constants/gas';
 import TransactionListItem from '.';
 
 const FEE_MARKET_ESTIMATE_RETURN_VALUE = {
-  gasEstimateType: GAS_ESTIMATE_TYPES.FEE_MARKET,
+  gasEstimateType: GasEstimateTypes.feeMarket,
   gasFeeEstimates: {
     low: {
       minWaitTimeEstimate: 180000,

ui/components/ui/radio-group/radio-group.stories.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { GAS_RECOMMENDATIONS } from '../../../../shared/constants/gas';
+import { GasRecommendations } from '../../../../shared/constants/gas';
 import README from './README.mdx';
 import RadioGroup from '.';
 
@@ -31,13 +31,13 @@ DefaultStory.storyName = 'Default';
 DefaultStory.args = {
   name: 'gas-recommendation',
   options: [
-    { value: GAS_RECOMMENDATIONS.LOW, label: 'Low', recommended: false },
+    { value: GasRecommendations.low, label: 'Low', recommended: false },
     {
-      value: GAS_RECOMMENDATIONS.MEDIUM,
+      value: GasRecommendations.medium,
       label: 'Medium',
       recommended: false,
     },
-    { value: GAS_RECOMMENDATIONS.HIGH, label: 'High', recommended: true },
+    { value: GasRecommendations.high, label: 'High', recommended: true },
   ],
-  selectedValue: GAS_RECOMMENDATIONS.HIGH,
+  selectedValue: GasRecommendations.high,
 };

ui/ducks/alerts/invalid-custom-network.js

@@ -1,11 +1,11 @@
 import { createSlice } from '@reduxjs/toolkit';
 
-import { ALERT_TYPES } from '../../../shared/constants/alerts';
+import { AlertTypes } from '../../../shared/constants/alerts';
 import { ALERT_STATE } from './enums';
 
 // Constants
 
-const name = ALERT_TYPES.invalidCustomNetwork;
+const name = AlertTypes.invalidCustomNetwork;
 
 const initialState = {
   state: ALERT_STATE.CLOSED,

ui/ducks/alerts/unconnected-account.js

@@ -1,7 +1,7 @@
 import { createSlice } from '@reduxjs/toolkit';
 import { captureException } from '@sentry/browser';
 
-import { ALERT_TYPES } from '../../../shared/constants/alerts';
+import { AlertTypes } from '../../../shared/constants/alerts';
 import * as actionConstants from '../../store/actionConstants';
 import {
   addPermittedAccount,
@@ -13,7 +13,7 @@ import { ALERT_STATE } from './enums';
 
 // Constants
 
-const name = ALERT_TYPES.unconnectedAccount;
+const name = AlertTypes.unconnectedAccount;
 
 const initialState = {
   state: ALERT_STATE.CLOSED,

ui/ducks/index.js

@@ -1,5 +1,5 @@
 import { combineReducers } from 'redux';
-import { ALERT_TYPES } from '../../shared/constants/alerts';
+import { AlertTypes } from '../../shared/constants/alerts';
 import metamaskReducer from './metamask/metamask';
 import localeMessagesReducer from './locale/locale';
 import sendReducer from './send/send';
@@ -12,8 +12,8 @@ import swapsReducer from './swaps/swaps';
 import historyReducer from './history/history';
 
 export default combineReducers({
-  [ALERT_TYPES.invalidCustomNetwork]: invalidCustomNetwork,
+  [AlertTypes.invalidCustomNetwork]: invalidCustomNetwork,
-  [ALERT_TYPES.unconnectedAccount]: unconnectedAccount,
+  [AlertTypes.unconnectedAccount]: unconnectedAccount,
   activeTab: (s) => (s === undefined ? null : s),
   metamask: metamaskReducer,
   appState: appStateReducer,

ui/ducks/metamask/metamask.js

@@ -1,9 +1,9 @@
 import { addHexPrefix, isHexString } from 'ethereumjs-util';
 import * as actionConstants from '../../store/actionConstants';
-import { ALERT_TYPES } from '../../../shared/constants/alerts';
+import { AlertTypes } from '../../../shared/constants/alerts';
 import {
-  GAS_ESTIMATE_TYPES,
+  GasEstimateTypes,
-  NETWORK_CONGESTION_THRESHOLDS,
+  NetworkCongestionThresholds,
 } from '../../../shared/constants/gas';
 import { NETWORK_TYPES } from '../../../shared/constants/network';
 import {
@@ -255,10 +255,10 @@ export const getCurrentLocale = (state) => state.metamask.currentLocale;
 export const getAlertEnabledness = (state) => state.metamask.alertEnabledness;
 
 export const getUnconnectedAccountAlertEnabledness = (state) =>
-  getAlertEnabledness(state)[ALERT_TYPES.unconnectedAccount];
+  getAlertEnabledness(state)[AlertTypes.unconnectedAccount];
 
 export const getWeb3ShimUsageAlertEnabledness = (state) =>
-  getAlertEnabledness(state)[ALERT_TYPES.web3ShimUsage];
+  getAlertEnabledness(state)[AlertTypes.web3ShimUsage];
 
 export const getUnconnectedAccountAlertShown = (state) =>
   state.metamask.unconnectedAccountAlertShownOrigins;
@@ -367,22 +367,20 @@ export function getIsGasEstimatesLoading(state) {
   // 'NONE' or if the current gasEstimateType cannot be supported by the current
   // network
   const isEIP1559TolerableEstimateType =
-    gasEstimateType === GAS_ESTIMATE_TYPES.FEE_MARKET ||
+    gasEstimateType === GasEstimateTypes.feeMarket ||
-    gasEstimateType === GAS_ESTIMATE_TYPES.ETH_GASPRICE;
+    gasEstimateType === GasEstimateTypes.ethGasPrice;
   const isGasEstimatesLoading =
-    gasEstimateType === GAS_ESTIMATE_TYPES.NONE ||
+    gasEstimateType === GasEstimateTypes.none ||
     (networkAndAccountSupports1559 && !isEIP1559TolerableEstimateType) ||
     (!networkAndAccountSupports1559 &&
-      gasEstimateType === GAS_ESTIMATE_TYPES.FEE_MARKET);
+      gasEstimateType === GasEstimateTypes.feeMarket);
 
   return isGasEstimatesLoading;
 }
 
 export function getIsNetworkBusy(state) {
   const gasFeeEstimates = getGasFeeEstimates(state);
-  return (
+  return gasFeeEstimates?.networkCongestion >= NetworkCongestionThresholds.busy;
-    gasFeeEstimates?.networkCongestion >= NETWORK_CONGESTION_THRESHOLDS.BUSY
-  );
 }
 
 export function getCompletedOnboarding(state) {

ui/ducks/send/send.js

@@ -7,7 +7,7 @@ import {
   decimalToHex,
   getValueFromWeiHex,
 } from '../../../shared/modules/conversion.utils';
-import { GAS_ESTIMATE_TYPES, GAS_LIMITS } from '../../../shared/constants/gas';
+import { GasEstimateTypes, GAS_LIMITS } from '../../../shared/constants/gas';
 import {
   CONTRACT_ADDRESS_ERROR,
   INSUFFICIENT_FUNDS_ERROR,
@@ -626,11 +626,11 @@ export const initializeSendState = createAsyncThunk(
       // Because we are only interested in getting a gasLimit estimation we only
       // need to worry about gasPrice. So we use maxFeePerGas as gasPrice if we
       // have a fee market estimation.
-      if (gasEstimateType === GAS_ESTIMATE_TYPES.LEGACY) {
+      if (gasEstimateType === GasEstimateTypes.legacy) {
         gasPrice = getGasPriceInHexWei(gasFeeEstimates.medium);
-      } else if (gasEstimateType === GAS_ESTIMATE_TYPES.ETH_GASPRICE) {
+      } else if (gasEstimateType === GasEstimateTypes.ethGasPrice) {
         gasPrice = getRoundedGasPrice(gasFeeEstimates.gasPrice);
-      } else if (gasEstimateType === GAS_ESTIMATE_TYPES.FEE_MARKET) {
+      } else if (gasEstimateType === GasEstimateTypes.feeMarket) {
         gasPrice = getGasPriceInHexWei(
           gasFeeEstimates.medium.suggestedMaxFeePerGas,
         );
@@ -644,7 +644,7 @@ export const initializeSendState = createAsyncThunk(
     // Set a basic gasLimit in the event that other estimation fails
     let { gasLimit } = draftTransaction.gas;
     if (
-      gasEstimateType !== GAS_ESTIMATE_TYPES.NONE &&
+      gasEstimateType !== GasEstimateTypes.none &&
       sendState.stage !== SEND_STAGES.EDIT &&
       draftTransaction.recipient.address
     ) {
@@ -973,7 +973,7 @@ const slice = createSlice({
       const { gasFeeEstimates, gasEstimateType } = action.payload;
       let gasPriceEstimate = '0x0';
       switch (gasEstimateType) {
-        case GAS_ESTIMATE_TYPES.FEE_MARKET:
+        case GasEstimateTypes.feeMarket:
           slice.caseReducers.updateGasFees(state, {
             payload: {
               transactionType: TransactionEnvelopeType.feeMarket,
@@ -986,7 +986,7 @@ const slice = createSlice({
             },
           });
           break;
-        case GAS_ESTIMATE_TYPES.LEGACY:
+        case GasEstimateTypes.legacy:
           gasPriceEstimate = getRoundedGasPrice(gasFeeEstimates.medium);
           slice.caseReducers.updateGasFees(state, {
             payload: {
@@ -996,7 +996,7 @@ const slice = createSlice({
             },
           });
           break;
-        case GAS_ESTIMATE_TYPES.ETH_GASPRICE:
+        case GasEstimateTypes.ethGasPrice:
           gasPriceEstimate = getRoundedGasPrice(gasFeeEstimates.gasPrice);
           slice.caseReducers.updateGasFees(state, {
             payload: {
@@ -1006,7 +1006,7 @@ const slice = createSlice({
             },
           });
           break;
-        case GAS_ESTIMATE_TYPES.NONE:
+        case GasEstimateTypes.none:
         default:
           break;
       }
@@ -2502,7 +2502,7 @@ export function getGasInputMode(state) {
   // mainnet or IN_TEST.
   if (
     (isMainnet || process.env.IN_TEST) &&
-    gasEstimateType === GAS_ESTIMATE_TYPES.ETH_GASPRICE
+    gasEstimateType === GasEstimateTypes.ethGasPrice
   ) {
     return GAS_INPUT_MODES.INLINE;
   }

ui/ducks/send/send.test.js

@@ -12,7 +12,7 @@ import {
   NEGATIVE_ETH_ERROR,
 } from '../../pages/send/send.constants';
 import { CHAIN_IDS } from '../../../shared/constants/network';
-import { GAS_ESTIMATE_TYPES, GAS_LIMITS } from '../../../shared/constants/gas';
+import { GasEstimateTypes, GAS_LIMITS } from '../../../shared/constants/gas';
 import { HardwareKeyringTypes } from '../../../shared/constants/hardware-wallets';
 import {
   AssetType,
@@ -1267,7 +1267,7 @@ describe('Send Slice', () => {
       it('should dispatch async action thunk first with pending, then finally fulfilling from minimal state', async () => {
         getState = jest.fn().mockReturnValue({
           metamask: {
-            gasEstimateType: GAS_ESTIMATE_TYPES.NONE,
+            gasEstimateType: GasEstimateTypes.none,
             gasFeeEstimates: {},
             networkDetails: {
               EIPS: {
@@ -1365,7 +1365,7 @@ describe('Send Slice', () => {
         const action = {
           type: 'GAS_FEE_ESTIMATES_UPDATED',
           payload: {
-            gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+            gasEstimateType: GasEstimateTypes.legacy,
             gasFeeEstimates: {
               medium: '1',
             },
@@ -2372,7 +2372,7 @@ describe('Send Slice', () => {
       it('should set up the appropriate state for editing a native asset transaction', async () => {
         const editTransactionState = {
           metamask: {
-            gasEstimateType: GAS_ESTIMATE_TYPES.NONE,
+            gasEstimateType: GasEstimateTypes.none,
             gasFeeEstimates: {},
             provider: {
               chainId: CHAIN_IDS.GOERLI,
@@ -2952,7 +2952,7 @@ describe('Send Slice', () => {
               metamask: {
                 provider: { chainId: CHAIN_IDS.MAINNET },
                 featureFlags: { advancedInlineGas: false },
-                gasEstimateType: GAS_ESTIMATE_TYPES.ETH_GASPRICE,
+                gasEstimateType: GasEstimateTypes.ethGasPrice,
               },
               send: initialState,
             }),
@@ -2966,7 +2966,7 @@ describe('Send Slice', () => {
               metamask: {
                 provider: { chainId: CHAIN_IDS.MAINNET },
                 featureFlags: { advancedInlineGas: false },
-                gasEstimateType: GAS_ESTIMATE_TYPES.ETH_GASPRICE,
+                gasEstimateType: GasEstimateTypes.ethGasPrice,
               },
               send: initialState,
             }),

ui/helpers/constants/design-system.ts

@@ -54,6 +54,7 @@ export const COLORS = {
   GOERLI_INVERSE: 'goerli-inverse',
   SEPOLIA_INVERSE: 'sepolia-inverse',
 };
+
 export const BACKGROUND_COLORS = pick(COLORS, [
   'BACKGROUND_DEFAULT',
   'BACKGROUND_ALTERNATIVE',

ui/helpers/utils/gas.js

@@ -1,8 +1,8 @@
 import { constant, times, uniq, zip } from 'lodash';
 import BigNumber from 'bignumber.js';
 import {
-  GAS_RECOMMENDATIONS,
+  GasRecommendations,
-  EDIT_GAS_MODES,
+  EditGasModes,
 } from '../../../shared/constants/gas';
 import { hexWEIToDecGWEI } from '../../../shared/modules/conversion.utils';
 import { Numeric } from '../../../shared/modules/Numeric';
@@ -48,9 +48,9 @@ export function addTenPercentAndRound(hexStringValue) {
 
 export function isMetamaskSuggestedGasEstimate(estimate) {
   return [
-    GAS_RECOMMENDATIONS.HIGH,
+    GasRecommendations.high,
-    GAS_RECOMMENDATIONS.MEDIUM,
+    GasRecommendations.medium,
-    GAS_RECOMMENDATIONS.LOW,
+    GasRecommendations.low,
   ].includes(estimate);
 }
 
@@ -102,7 +102,6 @@ export function formatGasFeeOrFeeRange(
  */
 export function editGasModeIsSpeedUpOrCancel(editGasMode) {
   return (
-    editGasMode === EDIT_GAS_MODES.CANCEL ||
+    editGasMode === EditGasModes.cancel || editGasMode === EditGasModes.speedUp
-    editGasMode === EDIT_GAS_MODES.SPEED_UP
   );
 }

ui/helpers/utils/gas.test.js

@@ -1,4 +1,4 @@
-import { PRIORITY_LEVELS } from '../../../shared/constants/gas';
+import { PriorityLevels } from '../../../shared/constants/gas';
 
 import {
   gasEstimateGreaterThanGasUsedPlusTenPercent,
@@ -16,7 +16,7 @@ describe('Gas utils', () => {
         {
           medium: estimateValues,
         },
-        PRIORITY_LEVELS.MEDIUM,
+        PriorityLevels.medium,
       );
     };
 

ui/hooks/gasFeeInput/test-utils.js

@@ -1,6 +1,6 @@
 import { useSelector } from 'react-redux';
 
-import { GAS_ESTIMATE_TYPES } from '../../../shared/constants/gas';
+import { GasEstimateTypes } from '../../../shared/constants/gas';
 import {
   getConversionRate,
   getNativeCurrency,
@@ -31,7 +31,7 @@ import { EtherDenomination } from '../../../shared/constants/common';
 export const MOCK_ETH_USD_CONVERSION_RATE = 100000;
 
 export const LEGACY_GAS_ESTIMATE_RETURN_VALUE = {
-  gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+  gasEstimateType: GasEstimateTypes.legacy,
   gasFeeEstimates: {
     low: '10',
     medium: '20',
@@ -41,7 +41,7 @@ export const LEGACY_GAS_ESTIMATE_RETURN_VALUE = {
 };
 
 export const FEE_MARKET_ESTIMATE_RETURN_VALUE = {
-  gasEstimateType: GAS_ESTIMATE_TYPES.FEE_MARKET,
+  gasEstimateType: GasEstimateTypes.feeMarket,
   gasFeeEstimates: {
     low: {
       minWaitTimeEstimate: 180000,
@@ -67,7 +67,7 @@ export const FEE_MARKET_ESTIMATE_RETURN_VALUE = {
 };
 
 export const HIGH_FEE_MARKET_ESTIMATE_RETURN_VALUE = {
-  gasEstimateType: GAS_ESTIMATE_TYPES.FEE_MARKET,
+  gasEstimateType: GasEstimateTypes.feeMarket,
   gasFeeEstimates: {
     low: {
       minWaitTimeEstimate: 180000,

ui/hooks/gasFeeInput/useGasEstimates.js

@@ -1,9 +1,6 @@
 import { useSelector } from 'react-redux';
 
-import {
+import { EditGasModes, GasEstimateTypes } from '../../../shared/constants/gas';
-  EDIT_GAS_MODES,
-  GAS_ESTIMATE_TYPES,
-} from '../../../shared/constants/gas';
 import {
   getMaximumGasTotalInHexWei,
   getMinimumGasTotalInHexWei,
@@ -82,7 +79,7 @@ export function useGasEstimates({
     gasSettings = {
       ...gasSettings,
       gasPrice:
-        gasEstimateType === GAS_ESTIMATE_TYPES.NONE
+        gasEstimateType === GasEstimateTypes.none
           ? '0x0'
           : decGWEIToHexWEI(gasPrice),
     };
@@ -91,7 +88,7 @@ export function useGasEstimates({
   // The maximum amount this transaction will cost
   const maximumCostInHexWei = getMaximumGasTotalInHexWei(gasSettings);
 
-  if (editGasMode === EDIT_GAS_MODES.SWAPS) {
+  if (editGasMode === EditGasModes.swaps) {
     gasSettings = { ...gasSettings, gasLimit: minimumGasLimit };
   }
 

ui/hooks/gasFeeInput/useGasFeeErrors.js

@@ -1,6 +1,6 @@
 import { useMemo } from 'react';
 import { shallowEqual, useSelector } from 'react-redux';
-import { GAS_ESTIMATE_TYPES, GAS_LIMITS } from '../../../shared/constants/gas';
+import { GasEstimateTypes, GAS_LIMITS } from '../../../shared/constants/gas';
 import {
   checkNetworkAndAccountSupports1559,
   getSelectedAccount,
@@ -180,8 +180,7 @@ export function useGasFeeErrors({
     useSelector(checkNetworkAndAccountSupports1559) &&
     !isLegacyTransaction(transaction?.txParams);
 
-  const isFeeMarketGasEstimate =
+  const isFeeMarketGasEstimate = gasEstimateType === GasEstimateTypes.feeMarket;
-    gasEstimateType === GAS_ESTIMATE_TYPES.FEE_MARKET;
 
   // Get all errors
   const gasLimitError = validateGasLimit(gasLimit, minimumGasLimit);

ui/hooks/gasFeeInput/useGasFeeInputs.js

@@ -3,9 +3,9 @@ import { useSelector } from 'react-redux';
 
 import {
   CUSTOM_GAS_ESTIMATE,
-  GAS_RECOMMENDATIONS,
+  GasRecommendations,
-  EDIT_GAS_MODES,
+  EditGasModes,
-  PRIORITY_LEVELS,
+  PriorityLevels,
 } from '../../../shared/constants/gas';
 import { GAS_FORM_ERRORS } from '../../helpers/constants/gas';
 import {
@@ -81,20 +81,20 @@ import { useTransactionFunctions } from './useTransactionFunctions';
  * Will update the gas fee state when estimates update if the user has not yet
  * modified the fields.
  *
- * @param {EstimateLevel} [defaultEstimateToUse] - which estimate
+ * @param {GasRecommendations} [defaultEstimateToUse] - which estimate
  *  level to default the 'estimateToUse' state variable to.
  * @param {object} [_transaction]
  * @param {string} [minimumGasLimit]
- * @param {EDIT_GAS_MODES[keyof EDIT_GAS_MODES]} editGasMode
+ * @param {EditGasModes[keyof EditGasModes]} editGasMode
  * @returns {GasFeeInputReturnType & import(
  *  './useGasFeeEstimates'
  * ).GasEstimates} gas fee input state and the GasFeeEstimates object
  */
 export function useGasFeeInputs(
-  defaultEstimateToUse = GAS_RECOMMENDATIONS.MEDIUM,
+  defaultEstimateToUse = GasRecommendations.medium,
   _transaction,
   minimumGasLimit = '0x5208',
-  editGasMode = EDIT_GAS_MODES.MODIFY_IN_PLACE,
+  editGasMode = EditGasModes.modifyInPlace,
 ) {
   const initialRetryTxMeta = {
     txParams: _transaction?.txParams,
@@ -148,7 +148,7 @@ export function useGasFeeInputs(
     if (estimateToUse) {
       return estimateToUse;
     }
-    return PRIORITY_LEVELS.CUSTOM;
+    return PriorityLevels.custom;
   });
 
   const [gasLimit, setGasLimit] = useState(() =>

ui/hooks/gasFeeInput/useGasFeeInputs.test.js

@@ -2,8 +2,8 @@ import { act, renderHook } from '@testing-library/react-hooks';
 import { useSelector } from 'react-redux';
 import { TransactionEnvelopeType } from '../../../shared/constants/transaction';
 import {
-  GAS_RECOMMENDATIONS,
+  GasRecommendations,
-  EDIT_GAS_MODES,
+  EditGasModes,
 } from '../../../shared/constants/gas';
 
 import { ETH, PRIMARY } from '../../helpers/constants/common';
@@ -94,7 +94,7 @@ describe('useGasFeeInputs', () => {
 
     it('returns gasPrice appropriately, and "0" for EIP1559 fields', () => {
       const { result } = renderHook(() =>
-        useGasFeeInputs(GAS_RECOMMENDATIONS.MEDIUM, {
+        useGasFeeInputs(GasRecommendations.medium, {
           txParams: {
             value: '3782DACE9D90000',
             gasLimit: '0x5028',
@@ -157,7 +157,7 @@ describe('useGasFeeInputs', () => {
     it('should return true', () => {
       const { result } = renderHook(() =>
         useGasFeeInputs(null, {
-          userFeeLevel: GAS_RECOMMENDATIONS.MEDIUM,
+          userFeeLevel: GasRecommendations.medium,
           txParams: { gas: '0x5208' },
         }),
       );
@@ -168,9 +168,9 @@ describe('useGasFeeInputs', () => {
   describe('editGasMode', () => {
     it('should return editGasMode passed', () => {
       const { result } = renderHook(() =>
-        useGasFeeInputs(undefined, undefined, undefined, EDIT_GAS_MODES.SWAPS),
+        useGasFeeInputs(undefined, undefined, undefined, EditGasModes.swaps),
       );
-      expect(result.current.editGasMode).toBe(EDIT_GAS_MODES.SWAPS);
+      expect(result.current.editGasMode).toBe(EditGasModes.swaps);
     });
   });
 });

ui/hooks/gasFeeInput/useGasPriceInput.js

@@ -2,7 +2,7 @@ import { useState } from 'react';
 import { isEqual } from 'lodash';
 
 import {
-  GAS_ESTIMATE_TYPES,
+  GasEstimateTypes,
   CUSTOM_GAS_ESTIMATE,
 } from '../../../shared/constants/gas';
 import { isLegacyTransaction } from '../../helpers/utils/transactions.util';
@@ -11,9 +11,9 @@ import { hexWEIToDecGWEI } from '../../../shared/modules/conversion.utils';
 import { feeParamsAreCustom } from './utils';
 
 function getGasPriceEstimate(gasFeeEstimates, gasEstimateType, estimateToUse) {
-  if (gasEstimateType === GAS_ESTIMATE_TYPES.LEGACY) {
+  if (gasEstimateType === GasEstimateTypes.legacy) {
     return gasFeeEstimates?.[estimateToUse] ?? '0';
-  } else if (gasEstimateType === GAS_ESTIMATE_TYPES.ETH_GASPRICE) {
+  } else if (gasEstimateType === GasEstimateTypes.ethGasPrice) {
     return gasFeeEstimates?.gasPrice ?? '0';
   }
   return '0';

ui/hooks/gasFeeInput/useGasPriceInput.test.js

@@ -1,7 +1,7 @@
 import { act, renderHook } from '@testing-library/react-hooks';
 
 import {
-  GAS_RECOMMENDATIONS,
+  GasRecommendations,
   CUSTOM_GAS_ESTIMATE,
 } from '../../../shared/constants/gas';
 import {
@@ -46,9 +46,9 @@ describe('useGasPriceInput', () => {
     configure();
     const { result } = renderHook(() =>
       useGasPriceInput({
-        estimateToUse: GAS_RECOMMENDATIONS.HIGH,
+        estimateToUse: GasRecommendations.high,
         transaction: {
-          userFeeLevel: GAS_RECOMMENDATIONS.HIGH,
+          userFeeLevel: GasRecommendations.high,
           txParams: { gasPrice: '0x5028' },
         },
         ...LEGACY_GAS_ESTIMATE_RETURN_VALUE,
@@ -60,7 +60,7 @@ describe('useGasPriceInput', () => {
   it('if no gasPrice is provided returns default estimate for legacy transaction', () => {
     const { result } = renderHook(() =>
       useGasPriceInput({
-        estimateToUse: GAS_RECOMMENDATIONS.MEDIUM,
+        estimateToUse: GasRecommendations.medium,
         ...LEGACY_GAS_ESTIMATE_RETURN_VALUE,
       }),
     );
@@ -70,7 +70,7 @@ describe('useGasPriceInput', () => {
   it('for legacy transaction if estimateToUse is high and no gasPrice is provided returns high estimate value', () => {
     const { result } = renderHook(() =>
       useGasPriceInput({
-        estimateToUse: GAS_RECOMMENDATIONS.HIGH,
+        estimateToUse: GasRecommendations.high,
         ...LEGACY_GAS_ESTIMATE_RETURN_VALUE,
       }),
     );
@@ -80,7 +80,7 @@ describe('useGasPriceInput', () => {
   it('returns 0 if gasPrice is not present in transaction and estimates are also not legacy', () => {
     const { result } = renderHook(() =>
       useGasPriceInput({
-        estimateToUse: GAS_RECOMMENDATIONS.MEDIUM,
+        estimateToUse: GasRecommendations.medium,
         ...FEE_MARKET_ESTIMATE_RETURN_VALUE,
       }),
     );
@@ -89,7 +89,7 @@ describe('useGasPriceInput', () => {
 
   it('returns gasPrice set by user if gasPriceHasBeenManuallySet is true', () => {
     const { result } = renderHook(() =>
-      useGasPriceInput({ estimateToUse: GAS_RECOMMENDATIONS.MEDIUM }),
+      useGasPriceInput({ estimateToUse: GasRecommendations.medium }),
     );
     act(() => {
       result.current.setGasPriceHasBeenManuallySet(true);

ui/hooks/gasFeeInput/useMaxFeePerGasInput.test.js

@@ -1,7 +1,7 @@
 import { act, renderHook } from '@testing-library/react-hooks';
 
 import {
-  GAS_RECOMMENDATIONS,
+  GasRecommendations,
   CUSTOM_GAS_ESTIMATE,
 } from '../../../shared/constants/gas';
 
@@ -30,7 +30,7 @@ const renderUseMaxFeePerGasInputHook = (props) =>
   renderHook(() =>
     useMaxFeePerGasInput({
       gasLimit: '21000',
-      estimateToUse: GAS_RECOMMENDATIONS.MEDIUM,
+      estimateToUse: GasRecommendations.medium,
       transaction: {
         userFeeLevel: CUSTOM_GAS_ESTIMATE,
         txParams: { maxFeePerGas: '0x5028' },
@@ -63,9 +63,9 @@ describe('useMaxFeePerGasInput', () => {
 
   it('does not returns maxFeePerGas values from transaction if transaction.userFeeLevel is not custom', () => {
     const { result } = renderUseMaxFeePerGasInputHook({
-      estimateToUse: GAS_RECOMMENDATIONS.HIGH,
+      estimateToUse: GasRecommendations.high,
       transaction: {
-        userFeeLevel: GAS_RECOMMENDATIONS.HIGH,
+        userFeeLevel: GasRecommendations.high,
         txParams: { maxFeePerGas: '0x5028' },
       },
     });

ui/hooks/gasFeeInput/useMaxPriorityFeePerGasInput.test.js

@@ -1,7 +1,7 @@
 import { act, renderHook } from '@testing-library/react-hooks';
 
 import {
-  GAS_RECOMMENDATIONS,
+  GasRecommendations,
   CUSTOM_GAS_ESTIMATE,
 } from '../../../shared/constants/gas';
 import {
@@ -29,7 +29,7 @@ const renderUseMaxPriorityFeePerGasInputHook = (props) => {
   return renderHook(() =>
     useMaxPriorityFeePerGasInput({
       gasLimit: '21000',
-      estimateToUse: GAS_RECOMMENDATIONS.MEDIUM,
+      estimateToUse: GasRecommendations.medium,
       transaction: {
         userFeeLevel: CUSTOM_GAS_ESTIMATE,
         txParams: { maxPriorityFeePerGas: '0x5028' },
@@ -63,9 +63,9 @@ describe('useMaxPriorityFeePerGasInput', () => {
 
   it('does not returns maxPriorityFeePerGas values from transaction if transaction.userFeeLevel is not custom', () => {
     const { result } = renderUseMaxPriorityFeePerGasInputHook({
-      estimateToUse: GAS_RECOMMENDATIONS.HIGH,
+      estimateToUse: GasRecommendations.high,
       transaction: {
-        userFeeLevel: GAS_RECOMMENDATIONS.HIGH,
+        userFeeLevel: GasRecommendations.high,
         txParams: { maxPriorityFeePerGas: '0x5028' },
       },
     });

ui/hooks/gasFeeInput/useTransactionFunction.test.js

@@ -4,8 +4,8 @@ import { renderHook } from '@testing-library/react-hooks';
 
 import {
   CUSTOM_GAS_ESTIMATE,
-  EDIT_GAS_MODES,
+  EditGasModes,
-  GAS_RECOMMENDATIONS,
+  GasRecommendations,
 } from '../../../shared/constants/gas';
 import mockState from '../../../test/data/mock-state.json';
 import * as Actions from '../../store/actions';
@@ -31,8 +31,8 @@ const renderUseTransactionFunctions = (props) => {
   return renderHook(
     () =>
       useTransactionFunctions({
-        defaultEstimateToUse: GAS_RECOMMENDATIONS.MEDIUM,
+        defaultEstimateToUse: GasRecommendations.medium,
-        editGasMode: EDIT_GAS_MODES.MODIFY_IN_PLACE,
+        editGasMode: EditGasModes.modifyInPlace,
         estimatedBaseFee: '0x59682f10',
         gasFeeEstimates: FEE_MARKET_ESTIMATE_RETURN_VALUE.gasFeeEstimates,
         gasLimit: '21000',
@@ -96,9 +96,7 @@ describe('useMaxPriorityFeePerGasInput', () => {
       .mockImplementation(() => ({ type: '' }));
 
     const { result } = renderUseTransactionFunctions();
-    await result.current.updateTransactionUsingEstimate(
+    await result.current.updateTransactionUsingEstimate(GasRecommendations.low);
-      GAS_RECOMMENDATIONS.LOW,
-    );
     expect(mockUpdateGasFees).toHaveBeenCalledTimes(1);
     expect(mockUpdateGasFees).toHaveBeenCalledWith(undefined, {
       estimateSuggested: 'medium',

ui/hooks/gasFeeInput/useTransactionFunctions.js

@@ -1,7 +1,7 @@
 import { useCallback } from 'react';
 import { useDispatch } from 'react-redux';
 
-import { EDIT_GAS_MODES, PRIORITY_LEVELS } from '../../../shared/constants/gas';
+import { EditGasModes, PriorityLevels } from '../../../shared/constants/gas';
 import {
   addTenPercentAndRound,
   editGasModeIsSpeedUpOrCancel,
@@ -56,8 +56,8 @@ export const useTransactionFunctions = ({
 
   const getTxMeta = useCallback(() => {
     if (
-      (editGasMode !== EDIT_GAS_MODES.CANCEL &&
+      (editGasMode !== EditGasModes.cancel &&
-        editGasMode !== EDIT_GAS_MODES.SPEED_UP) ||
+        editGasMode !== EditGasModes.speedUp) ||
       transaction.previousGas
     ) {
       return {};
@@ -98,7 +98,7 @@ export const useTransactionFunctions = ({
 
       const updatedTxMeta = {
         ...transaction,
-        userFeeLevel: estimateUsed || PRIORITY_LEVELS.CUSTOM,
+        userFeeLevel: estimateUsed || PriorityLevels.custom,
         txParams: {
           ...transaction.txParams,
           ...newGasSettings,
@@ -106,9 +106,9 @@ export const useTransactionFunctions = ({
         ...txMeta,
       };
 
-      if (editGasMode === EDIT_GAS_MODES.SWAPS) {
+      if (editGasMode === EditGasModes.swaps) {
         dispatch(
-          updateSwapsUserFeeLevel(estimateUsed || PRIORITY_LEVELS.CUSTOM),
+          updateSwapsUserFeeLevel(estimateUsed || PriorityLevels.custom),
         );
         dispatch(updateCustomSwapsEIP1559GasParams(newGasSettings));
       } else if (editGasModeIsSpeedUpOrCancel(editGasMode)) {
@@ -167,8 +167,8 @@ export const useTransactionFunctions = ({
       updateTransaction({
         estimateSuggested: initTransaction
           ? defaultEstimateToUse
-          : PRIORITY_LEVELS.TEN_PERCENT_INCREASED,
+          : PriorityLevels.tenPercentIncreased,
-        estimateUsed: PRIORITY_LEVELS.TEN_PERCENT_INCREASED,
+        estimateUsed: PriorityLevels.tenPercentIncreased,
         gasLimit,
         maxFeePerGas: addTenPercentAndRound(maxFeePerGas),
         maxPriorityFeePerGas: addTenPercentAndRound(maxPriorityFeePerGas),
@@ -197,7 +197,7 @@ export const useTransactionFunctions = ({
     const { maxFeePerGas, maxPriorityFeePerGas } =
       transaction?.dappSuggestedGasFees ?? {};
     updateTransaction({
-      estimateUsed: PRIORITY_LEVELS.DAPP_SUGGESTED,
+      estimateUsed: PriorityLevels.dAppSuggested,
       maxFeePerGas,
       maxPriorityFeePerGas,
     });

ui/hooks/gasFeeInput/utils.js

@@ -1,5 +1,5 @@
 import {
-  GAS_ESTIMATE_TYPES,
+  GasEstimateTypes,
   CUSTOM_GAS_ESTIMATE,
 } from '../../../shared/constants/gas';
 
@@ -10,7 +10,7 @@ export function getGasFeeEstimate(
   estimateToUse,
   fallback = '0',
 ) {
-  if (gasEstimateType === GAS_ESTIMATE_TYPES.FEE_MARKET) {
+  if (gasEstimateType === GasEstimateTypes.feeMarket) {
     return gasFeeEstimates?.[estimateToUse]?.[field] ?? String(fallback);
   }
   return String(fallback);

ui/hooks/useGasFeeEstimates.test.js

@@ -1,6 +1,6 @@
 import { cleanup, renderHook } from '@testing-library/react-hooks';
 import { useSelector } from 'react-redux';
-import { GAS_ESTIMATE_TYPES } from '../../shared/constants/gas';
+import { GasEstimateTypes } from '../../shared/constants/gas';
 import createRandomId from '../../shared/modules/random-id';
 import {
   getGasEstimateType,
@@ -33,7 +33,7 @@ jest.mock('react-redux', () => {
 
 const DEFAULT_OPTS = {
   checkNetworkAndAccountSupports1559: false,
-  gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+  gasEstimateType: GasEstimateTypes.legacy,
   gasFeeEstimates: {
     low: '10',
     medium: '20',
@@ -106,7 +106,7 @@ describe('useGasFeeEstimates', () => {
     } = renderHook(() => useGasFeeEstimates());
     expect(current).toMatchObject({
       gasFeeEstimates: DEFAULT_OPTS.gasFeeEstimates,
-      gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+      gasEstimateType: GasEstimateTypes.legacy,
       isGasEstimatesLoading: false,
     });
   });
@@ -115,7 +115,7 @@ describe('useGasFeeEstimates', () => {
     const gasFeeEstimates = { gasPrice: '10' };
     useSelector.mockImplementation(
       generateUseSelectorRouter({
-        gasEstimateType: GAS_ESTIMATE_TYPES.ETH_GASPRICE,
+        gasEstimateType: GasEstimateTypes.ethGasPrice,
         gasFeeEstimates,
         isGasEstimatesLoading: false,
       }),
@@ -126,7 +126,7 @@ describe('useGasFeeEstimates', () => {
     } = renderHook(() => useGasFeeEstimates());
     expect(current).toMatchObject({
       gasFeeEstimates,
-      gasEstimateType: GAS_ESTIMATE_TYPES.ETH_GASPRICE,
+      gasEstimateType: GasEstimateTypes.ethGasPrice,
       isGasEstimatesLoading: false,
     });
   });
@@ -156,7 +156,7 @@ describe('useGasFeeEstimates', () => {
     useSelector.mockImplementation(
       generateUseSelectorRouter({
         checkNetworkAndAccountSupports1559: true,
-        gasEstimateType: GAS_ESTIMATE_TYPES.FEE_MARKET,
+        gasEstimateType: GasEstimateTypes.feeMarket,
         gasFeeEstimates,
         isGasEstimatesLoading: false,
       }),
@@ -167,7 +167,7 @@ describe('useGasFeeEstimates', () => {
     } = renderHook(() => useGasFeeEstimates());
     expect(current).toMatchObject({
       gasFeeEstimates,
-      gasEstimateType: GAS_ESTIMATE_TYPES.FEE_MARKET,
+      gasEstimateType: GasEstimateTypes.feeMarket,
       isGasEstimatesLoading: false,
     });
   });
@@ -175,7 +175,7 @@ describe('useGasFeeEstimates', () => {
   it('indicates that gas estimates are loading when gasEstimateType is NONE', () => {
     useSelector.mockImplementation(
       generateUseSelectorRouter({
-        gasEstimateType: GAS_ESTIMATE_TYPES.NONE,
+        gasEstimateType: GasEstimateTypes.none,
         gasFeeEstimates: {},
       }),
     );
@@ -185,7 +185,7 @@ describe('useGasFeeEstimates', () => {
     } = renderHook(() => useGasFeeEstimates());
     expect(current).toMatchObject({
       gasFeeEstimates: {},
-      gasEstimateType: GAS_ESTIMATE_TYPES.NONE,
+      gasEstimateType: GasEstimateTypes.none,
       isGasEstimatesLoading: true,
     });
   });
@@ -194,7 +194,7 @@ describe('useGasFeeEstimates', () => {
     useSelector.mockImplementation(
       generateUseSelectorRouter({
         checkNetworkAndAccountSupports1559: true,
-        gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+        gasEstimateType: GasEstimateTypes.legacy,
         gasFeeEstimates: {
           gasPrice: '10',
         },
@@ -206,7 +206,7 @@ describe('useGasFeeEstimates', () => {
     } = renderHook(() => useGasFeeEstimates());
     expect(current).toMatchObject({
       gasFeeEstimates: { gasPrice: '10' },
-      gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+      gasEstimateType: GasEstimateTypes.legacy,
       isGasEstimatesLoading: true,
     });
   });
@@ -236,7 +236,7 @@ describe('useGasFeeEstimates', () => {
     useSelector.mockImplementation(
       generateUseSelectorRouter({
         checkNetworkAndAccountSupports1559: false,
-        gasEstimateType: GAS_ESTIMATE_TYPES.FEE_MARKET,
+        gasEstimateType: GasEstimateTypes.feeMarket,
         gasFeeEstimates,
       }),
     );
@@ -246,7 +246,7 @@ describe('useGasFeeEstimates', () => {
     } = renderHook(() => useGasFeeEstimates());
     expect(current).toMatchObject({
       gasFeeEstimates,
-      gasEstimateType: GAS_ESTIMATE_TYPES.FEE_MARKET,
+      gasEstimateType: GasEstimateTypes.feeMarket,
       isGasEstimatesLoading: true,
     });
   });

ui/index.js

@@ -6,7 +6,7 @@ import { render } from 'react-dom';
 import browser from 'webextension-polyfill';
 
 import { getEnvironmentType } from '../app/scripts/lib/util';
-import { ALERT_TYPES } from '../shared/constants/alerts';
+import { AlertTypes } from '../shared/constants/alerts';
 import { maskObject } from '../shared/modules/object.utils';
 import { SENTRY_STATE } from '../app/scripts/lib/setupSentry';
 import { ENVIRONMENT_TYPE_POPUP } from '../shared/constants/app';
@@ -114,7 +114,7 @@ async function startApp(metamaskState, backgroundConnection, opts) {
       permittedAccountsForCurrentTab.length > 0 &&
       !permittedAccountsForCurrentTab.includes(selectedAddress)
     ) {
-      draftInitialState[ALERT_TYPES.unconnectedAccount] = {
+      draftInitialState[AlertTypes.unconnectedAccount] = {
         state: ALERT_STATE.OPEN,
       };
       actions.setUnconnectedAccountAlertShown(origin);

ui/pages/confirm-approve/confirm-approve.js

@@ -2,7 +2,7 @@ import React, { useEffect, useRef, useState, useCallback } from 'react';
 import PropTypes from 'prop-types';
 import { useDispatch, useSelector } from 'react-redux';
 import ConfirmTransactionBase from '../confirm-transaction-base';
-import { EDIT_GAS_MODES } from '../../../shared/constants/gas';
+import { EditGasModes } from '../../../shared/constants/gas';
 import {
   showModal,
   updateCustomNonce,
@@ -195,7 +195,7 @@ export default function ConfirmApprove({
           {showCustomizeGasPopover && !supportsEIP1559 && (
             <EditGasPopover
               onClose={closeCustomizeGasPopover}
-              mode={EDIT_GAS_MODES.MODIFY_IN_PLACE}
+              mode={EditGasModes.modifyInPlace}
               transaction={transaction}
             />
           )}
@@ -282,7 +282,7 @@ export default function ConfirmApprove({
             {showCustomizeGasPopover && !supportsEIP1559 && (
               <EditGasPopover
                 onClose={closeCustomizeGasPopover}
-                mode={EDIT_GAS_MODES.MODIFY_IN_PLACE}
+                mode={EditGasModes.modifyInPlace}
                 transaction={transaction}
               />
             )}

ui/pages/home/home.container.js

@@ -59,8 +59,8 @@ import {
   ENVIRONMENT_TYPE_POPUP,
 } from '../../../shared/constants/app';
 import {
-  ALERT_TYPES,
+  AlertTypes,
-  WEB3_SHIM_USAGE_ALERT_STATES,
+  Web3ShimUsageAlertStates,
 } from '../../../shared/constants/alerts';
 import Home from './home.component';
 
@@ -104,7 +104,7 @@ const mapStateToProps = (state) => {
     getWeb3ShimUsageAlertEnabledness(state) &&
     activeTabHasPermissions(state) &&
     getWeb3ShimUsageStateForOrigin(state, originOfCurrentTab) ===
-      WEB3_SHIM_USAGE_ALERT_STATES.RECORDED;
+      Web3ShimUsageAlertStates.recorded;
 
   const isSigningQRHardwareTransaction =
     hasUnsignedQRHardwareTransaction(state) ||
@@ -165,7 +165,7 @@ const mapDispatchToProps = (dispatch) => ({
   setWeb3ShimUsageAlertDismissed: (origin) =>
     setWeb3ShimUsageAlertDismissed(origin),
   disableWeb3ShimUsageAlert: () =>
-    setAlertEnabledness(ALERT_TYPES.web3ShimUsage, false),
+    setAlertEnabledness(AlertTypes.web3ShimUsage, false),
   hideWhatsNewPopup: () => dispatch(hideWhatsNewPopup()),
   hidePortfolioTooltip,
   setRecoveryPhraseReminderHasBeenShown: () =>

ui/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.test.js

@@ -5,7 +5,7 @@ import thunk from 'redux-thunk';
 import { fireEvent } from '@testing-library/react';
 import { AMOUNT_MODES, SEND_STATUSES } from '../../../../../ducks/send';
 import { renderWithProvider } from '../../../../../../test/jest';
-import { GAS_ESTIMATE_TYPES } from '../../../../../../shared/constants/gas';
+import { GasEstimateTypes } from '../../../../../../shared/constants/gas';
 import {
   getInitialSendStateWithExistingTxState,
   INITIAL_SEND_STATE_FOR_EXISTING_DRAFT,
@@ -21,7 +21,7 @@ describe('AmountMaxButton Component', () => {
         <AmountMaxButton />,
         configureMockStore(middleware)({
           metamask: {
-            gasEstimateType: GAS_ESTIMATE_TYPES.NONE,
+            gasEstimateType: GasEstimateTypes.none,
             networkDetails: {
               EIPS: {},
             },
@@ -35,7 +35,7 @@ describe('AmountMaxButton Component', () => {
     it('should dispatch action to set mode to MAX', () => {
       const store = configureMockStore(middleware)({
         metamask: {
-          gasEstimateType: GAS_ESTIMATE_TYPES.ETH_GASPRICE,
+          gasEstimateType: GasEstimateTypes.ethGasPrice,
           networkDetails: {
             EIPS: {},
           },
@@ -58,7 +58,7 @@ describe('AmountMaxButton Component', () => {
     it('should dispatch action to set amount mode to INPUT', () => {
       const store = configureMockStore(middleware)({
         metamask: {
-          gasEstimateType: GAS_ESTIMATE_TYPES.ETH_GASPRICE,
+          gasEstimateType: GasEstimateTypes.ethGasPrice,
           networkDetails: {
             EIPS: {},
           },

ui/pages/send/send.test.js

@@ -9,7 +9,7 @@ import {
   renderWithProvider,
   setBackgroundConnection,
 } from '../../../test/jest';
-import { GAS_ESTIMATE_TYPES } from '../../../shared/constants/gas';
+import { GasEstimateTypes } from '../../../shared/constants/gas';
 import { HardwareKeyringTypes } from '../../../shared/constants/hardware-wallets';
 import { INITIAL_SEND_STATE_FOR_EXISTING_DRAFT } from '../../../test/jest/mocks';
 import Send from './send';
@@ -72,7 +72,7 @@ const baseStore = {
         },
       },
     },
-    gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+    gasEstimateType: GasEstimateTypes.legacy,
     gasFeeEstimates: {
       low: '0',
       medium: '1',

ui/pages/settings/alerts-tab/alerts-tab.js

@@ -2,7 +2,7 @@ import React, { useEffect, useRef } from 'react';
 import PropTypes from 'prop-types';
 import { useSelector } from 'react-redux';
 
-import { ALERT_TYPES } from '../../../../shared/constants/alerts';
+import { AlertTypes } from '../../../../shared/constants/alerts';
 import Tooltip from '../../../components/ui/tooltip';
 import ToggleButton from '../../../components/ui/toggle-button';
 import { setAlertEnabledness } from '../../../store/actions';
@@ -54,11 +54,11 @@ const AlertsTab = () => {
   const t = useI18nContext();
 
   const alertConfig = {
-    [ALERT_TYPES.unconnectedAccount]: {
+    [AlertTypes.unconnectedAccount]: {
       title: t('alertSettingsUnconnectedAccount'),
       description: t('alertSettingsUnconnectedAccountDescription'),
     },
-    [ALERT_TYPES.web3ShimUsage]: {
+    [AlertTypes.web3ShimUsage]: {
       title: t('alertSettingsWeb3ShimUsage'),
       description: t('alertSettingsWeb3ShimUsageDescription'),
     },

ui/pages/settings/alerts-tab/alerts-tab.test.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import { fireEvent, screen } from '@testing-library/react';
 import configureMockStore from 'redux-mock-store';
-import { renderWithProvider } from '../../../../test/jest/rendering';
+import { renderWithProvider } from '../../../../test/jest';
-import { ALERT_TYPES } from '../../../../shared/constants/alerts';
+import { AlertTypes } from '../../../../shared/constants/alerts';
 import AlertsTab from '.';
 
 const mockSetAlertEnabledness = jest.fn();
@@ -28,14 +28,14 @@ describe('Alerts Tab', () => {
     fireEvent.click(screen.getAllByRole('checkbox')[0]);
     expect(mockSetAlertEnabledness.mock.calls).toHaveLength(1);
     expect(mockSetAlertEnabledness.mock.calls[0][0]).toBe(
-      ALERT_TYPES.unconnectedAccount,
+      AlertTypes.unconnectedAccount,
     );
     expect(mockSetAlertEnabledness.mock.calls[0][1]).toBe(true);
 
     fireEvent.click(screen.getAllByRole('checkbox')[1]);
     expect(mockSetAlertEnabledness.mock.calls).toHaveLength(2);
     expect(mockSetAlertEnabledness.mock.calls[1][0]).toBe(
-      ALERT_TYPES.web3ShimUsage,
+      AlertTypes.web3ShimUsage,
     );
     expect(mockSetAlertEnabledness.mock.calls[1][1]).toBe(true);
   });

ui/pages/swaps/view-quote/view-quote-price-difference.js

@@ -11,7 +11,7 @@ import {
   JUSTIFY_CONTENT,
   DISPLAY,
 } from '../../../helpers/constants/design-system';
-import { GAS_RECOMMENDATIONS } from '../../../../shared/constants/gas';
+import { GasRecommendations } from '../../../../shared/constants/gas';
 
 export default function ViewQuotePriceDifference(props) {
   const {
@@ -36,7 +36,7 @@ export default function ViewQuotePriceDifference(props) {
     // A calculation error signals we cannot determine dollar value
     priceDifferenceTitle = t('swapPriceUnavailableTitle');
     priceDifferenceMessage = t('swapPriceUnavailableDescription');
-    priceDifferenceClass = GAS_RECOMMENDATIONS.HIGH;
+    priceDifferenceClass = GasRecommendations.high;
     priceDifferenceAcknowledgementText = t('tooltipApproveButton');
   } else {
     priceDifferenceTitle = t('swapPriceDifferenceTitle', [

ui/pages/swaps/view-quote/view-quote-price-difference.test.js

@@ -2,7 +2,7 @@ import React from 'react';
 import configureMockStore from 'redux-mock-store';
 import { renderWithProvider } from '../../../../test/lib/render-helpers';
 import { NETWORK_TYPES } from '../../../../shared/constants/network';
-import { GAS_RECOMMENDATIONS } from '../../../../shared/constants/gas';
+import { GasRecommendations } from '../../../../shared/constants/gas';
 import ViewQuotePriceDifference from './view-quote-price-difference';
 
 describe('View Price Quote Difference', () => {
@@ -45,7 +45,7 @@ describe('View Price Quote Difference', () => {
       priceSlippage: {
         ratio: 1.007876641534847,
         calculationError: '',
-        bucket: GAS_RECOMMENDATIONS.LOW,
+        bucket: GasRecommendations.low,
         sourceAmountInETH: 1,
         destinationAmountInETH: 0.9921849150875727,
       },
@@ -93,7 +93,7 @@ describe('View Price Quote Difference', () => {
 
   it('displays an error when in medium bucket', () => {
     const props = { ...DEFAULT_PROPS };
-    props.usedQuote.priceSlippage.bucket = GAS_RECOMMENDATIONS.MEDIUM;
+    props.usedQuote.priceSlippage.bucket = GasRecommendations.medium;
 
     const { container } = renderWithProvider(
       <ViewQuotePriceDifference {...props} />,
@@ -105,7 +105,7 @@ describe('View Price Quote Difference', () => {
 
   it('displays an error when in high bucket', () => {
     const props = { ...DEFAULT_PROPS };
-    props.usedQuote.priceSlippage.bucket = GAS_RECOMMENDATIONS.HIGH;
+    props.usedQuote.priceSlippage.bucket = GasRecommendations.high;
 
     const { container } = renderWithProvider(
       <ViewQuotePriceDifference {...props} />,

ui/pages/swaps/view-quote/view-quote.js

@@ -92,7 +92,7 @@ import {
 } from '../swaps.util';
 import { useTokenTracker } from '../../../hooks/useTokenTracker';
 import { QUOTES_EXPIRED_ERROR } from '../../../../shared/constants/swaps';
-import { GAS_RECOMMENDATIONS } from '../../../../shared/constants/gas';
+import { GasRecommendations } from '../../../../shared/constants/gas';
 import CountdownTimer from '../countdown-timer';
 import SwapsFooter from '../swaps-footer';
 import PulseLoader from '../../../components/ui/pulse-loader'; // TODO: Replace this with a different loading component.
@@ -141,8 +141,8 @@ export default function ViewQuote() {
   const [acknowledgedPriceDifference, setAcknowledgedPriceDifference] =
     useState(false);
   const priceDifferenceRiskyBuckets = [
-    GAS_RECOMMENDATIONS.HIGH,
+    GasRecommendations.high,
-    GAS_RECOMMENDATIONS.MEDIUM,
+    GasRecommendations.medium,
   ];
 
   const routeState = useSelector(getBackgroundSwapRouteState);
@@ -206,8 +206,8 @@ export default function ViewQuote() {
   if (networkAndAccountSupports1559) {
     // For Swaps we want to get 'high' estimations by default.
     // eslint-disable-next-line react-hooks/rules-of-hooks
-    gasFeeInputs = useGasFeeInputs(GAS_RECOMMENDATIONS.HIGH, {
+    gasFeeInputs = useGasFeeInputs(GasRecommendations.high, {
-      userFeeLevel: swapsUserFeeLevel || GAS_RECOMMENDATIONS.HIGH,
+      userFeeLevel: swapsUserFeeLevel || GasRecommendations.high,
     });
   }
 
@@ -725,8 +725,8 @@ export default function ViewQuote() {
   useEffect(() => {
     if (
       acknowledgedPriceDifference &&
-      lastPriceDifferenceBucket === GAS_RECOMMENDATIONS.MEDIUM &&
+      lastPriceDifferenceBucket === GasRecommendations.medium &&
-      priceSlippageBucket === GAS_RECOMMENDATIONS.HIGH
+      priceSlippageBucket === GasRecommendations.high
     ) {
       setAcknowledgedPriceDifference(false);
     }

ui/selectors/confirm-transaction.js

@@ -14,7 +14,7 @@ import {
 } from '../ducks/metamask/metamask';
 import { TransactionEnvelopeType } from '../../shared/constants/transaction';
 import {
-  GAS_ESTIMATE_TYPES,
+  GasEstimateTypes,
   CUSTOM_GAS_ESTIMATE,
 } from '../../shared/constants/gas';
 import {
@@ -300,19 +300,19 @@ export const transactionFeeSelector = function (state, txData) {
     }
   } else {
     switch (gasEstimateType) {
-      case GAS_ESTIMATE_TYPES.NONE:
+      case GasEstimateTypes.none:
         gasEstimationObject.gasPrice = txData.txParams?.gasPrice ?? '0x0';
         break;
-      case GAS_ESTIMATE_TYPES.ETH_GASPRICE:
+      case GasEstimateTypes.ethGasPrice:
         gasEstimationObject.gasPrice =
           txData.txParams?.gasPrice ??
           decGWEIToHexWEI(gasFeeEstimates.gasPrice);
         break;
-      case GAS_ESTIMATE_TYPES.LEGACY:
+      case GasEstimateTypes.legacy:
         gasEstimationObject.gasPrice =
           txData.txParams?.gasPrice ?? getAveragePriceEstimateInHexWEI(state);
         break;
-      case GAS_ESTIMATE_TYPES.FEE_MARKET:
+      case GasEstimateTypes.feeMarket:
         break;
       default:
         break;

ui/selectors/custom-gas.js

@@ -4,7 +4,7 @@ import { formatCurrency } from '../helpers/utils/confirm-tx.util';
 import { formatETHFee } from '../helpers/utils/formatters';
 
 import { getGasPrice } from '../ducks/send';
-import { GAS_ESTIMATE_TYPES as GAS_FEE_CONTROLLER_ESTIMATE_TYPES } from '../../shared/constants/gas';
+import { GasEstimateTypes as GAS_FEE_CONTROLLER_ESTIMATE_TYPES } from '../../shared/constants/gas';
 import {
   getGasEstimateType,
   getGasFeeEstimates,
@@ -52,7 +52,7 @@ export function getSafeLowEstimate(state) {
   const gasFeeEstimates = getGasFeeEstimates(state);
   const gasEstimateType = getGasEstimateType(state);
 
-  return gasEstimateType === GAS_FEE_CONTROLLER_ESTIMATE_TYPES.LEGACY
+  return gasEstimateType === GAS_FEE_CONTROLLER_ESTIMATE_TYPES.legacy
     ? gasFeeEstimates?.low
     : null;
 }
@@ -61,7 +61,7 @@ export function getAverageEstimate(state) {
   const gasFeeEstimates = getGasFeeEstimates(state);
   const gasEstimateType = getGasEstimateType(state);
 
-  return gasEstimateType === GAS_FEE_CONTROLLER_ESTIMATE_TYPES.LEGACY
+  return gasEstimateType === GAS_FEE_CONTROLLER_ESTIMATE_TYPES.legacy
     ? gasFeeEstimates?.medium
     : null;
 }
@@ -71,7 +71,7 @@ export function getFastPriceEstimate(state) {
 
   const gasEstimateType = getGasEstimateType(state);
 
-  return gasEstimateType === GAS_FEE_CONTROLLER_ESTIMATE_TYPES.LEGACY
+  return gasEstimateType === GAS_FEE_CONTROLLER_ESTIMATE_TYPES.legacy
     ? gasFeeEstimates?.high
     : null;
 }
@@ -193,7 +193,7 @@ export function getGasPriceInHexWei(price) {
 export function getIsEthGasPriceFetched(state) {
   const gasEstimateType = getGasEstimateType(state);
   return (
-    gasEstimateType === GAS_FEE_CONTROLLER_ESTIMATE_TYPES.ETH_GASPRICE &&
+    gasEstimateType === GAS_FEE_CONTROLLER_ESTIMATE_TYPES.ethGasPrice &&
     getIsMainnet(state)
   );
 }
@@ -201,14 +201,14 @@ export function getIsEthGasPriceFetched(state) {
 export function getIsCustomNetworkGasPriceFetched(state) {
   const gasEstimateType = getGasEstimateType(state);
   return (
-    gasEstimateType === GAS_FEE_CONTROLLER_ESTIMATE_TYPES.ETH_GASPRICE &&
+    gasEstimateType === GAS_FEE_CONTROLLER_ESTIMATE_TYPES.ethGasPrice &&
     !getIsMainnet(state)
   );
 }
 
 export function getNoGasPriceFetched(state) {
   const gasEstimateType = getGasEstimateType(state);
-  return gasEstimateType === GAS_FEE_CONTROLLER_ESTIMATE_TYPES.NONE;
+  return gasEstimateType === GAS_FEE_CONTROLLER_ESTIMATE_TYPES.none;
 }
 
 export function getIsGasEstimatesFetched(state) {
@@ -216,5 +216,5 @@ export function getIsGasEstimatesFetched(state) {
   if (isEIP1559Network(state)) {
     return false;
   }
-  return gasEstimateType !== GAS_FEE_CONTROLLER_ESTIMATE_TYPES.NONE;
+  return gasEstimateType !== GAS_FEE_CONTROLLER_ESTIMATE_TYPES.none;
 }

ui/selectors/custom-gas.test.js

@@ -1,4 +1,4 @@
-import { GAS_ESTIMATE_TYPES } from '../../shared/constants/gas';
+import { GasEstimateTypes } from '../../shared/constants/gas';
 import { getInitialSendStateWithExistingTxState } from '../../test/jest/mocks';
 import {
   getCustomGasLimit,
@@ -20,7 +20,7 @@ describe('custom-gas selectors', () => {
     it('should return true for gas.customData.price 0x77359400', () => {
       const mockState = {
         metamask: {
-          gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+          gasEstimateType: GasEstimateTypes.legacy,
           gasFeeEstimates: {
             low: '1',
           },
@@ -37,7 +37,7 @@ describe('custom-gas selectors', () => {
     it('should return true for gas.customData.price null', () => {
       const mockState = {
         metamask: {
-          gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+          gasEstimateType: GasEstimateTypes.legacy,
           gasFeeEstimates: {
             low: '1',
           },
@@ -54,7 +54,7 @@ describe('custom-gas selectors', () => {
     it('should return true gas.customData.price undefined', () => {
       const mockState = {
         metamask: {
-          gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+          gasEstimateType: GasEstimateTypes.legacy,
           gasFeeEstimates: {
             low: '1',
           },
@@ -71,7 +71,7 @@ describe('custom-gas selectors', () => {
     it('should return false gas.basicEstimates.safeLow undefined', () => {
       const mockState = {
         metamask: {
-          gasEstimateType: GAS_ESTIMATE_TYPES.NONE,
+          gasEstimateType: GasEstimateTypes.none,
           gasFeeEstimates: {
             low: undefined,
           },
@@ -91,7 +91,7 @@ describe('custom-gas selectors', () => {
     it('should return false for gas.customData.price null', () => {
       const mockState = {
         metamask: {
-          gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+          gasEstimateType: GasEstimateTypes.legacy,
           gasFeeEstimates: {
             high: '150',
           },
@@ -108,7 +108,7 @@ describe('custom-gas selectors', () => {
     it('should return false gas.basicEstimates.fast undefined', () => {
       const mockState = {
         metamask: {
-          gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+          gasEstimateType: GasEstimateTypes.legacy,
           gasFeeEstimates: {
             high: undefined,
           },
@@ -125,7 +125,7 @@ describe('custom-gas selectors', () => {
     it('should return false gas.basicEstimates.price 0x205d0bae00 (139)', () => {
       const mockState = {
         metamask: {
-          gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+          gasEstimateType: GasEstimateTypes.legacy,
           gasFeeEstimates: {
             high: '139',
           },
@@ -142,7 +142,7 @@ describe('custom-gas selectors', () => {
     it('should return false gas.basicEstimates.price 0x1bf08eb000 (120)', () => {
       const mockState = {
         metamask: {
-          gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+          gasEstimateType: GasEstimateTypes.legacy,
           gasFeeEstimates: {
             high: '139',
           },
@@ -159,7 +159,7 @@ describe('custom-gas selectors', () => {
     it('should return false gas.basicEstimates.price 0x28bed01600 (175)', () => {
       const mockState = {
         metamask: {
-          gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+          gasEstimateType: GasEstimateTypes.legacy,
           gasFeeEstimates: {
             high: '139',
           },
@@ -176,7 +176,7 @@ describe('custom-gas selectors', () => {
     it('should return true gas.basicEstimates.price 0x30e4f9b400 (210)', () => {
       const mockState = {
         metamask: {
-          gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+          gasEstimateType: GasEstimateTypes.legacy,
           gasFeeEstimates: {
             high: '139',
           },
@@ -193,7 +193,7 @@ describe('custom-gas selectors', () => {
     it('should return false gas.basicEstimates.price 0x28bed01600 (175) (checkSend=true)', () => {
       const mockState = {
         metamask: {
-          gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+          gasEstimateType: GasEstimateTypes.legacy,
           gasFeeEstimates: {
             high: '139',
           },
@@ -215,7 +215,7 @@ describe('custom-gas selectors', () => {
     it('should return true gas.basicEstimates.price 0x30e4f9b400 (210) (checkSend=true)', () => {
       const mockState = {
         metamask: {
-          gasEstimateType: GAS_ESTIMATE_TYPES.LEGACY,
+          gasEstimateType: GasEstimateTypes.legacy,
           gasFeeEstimates: {
             high: '139',
           },