diff --git a/app/scripts/controllers/alert.js b/app/scripts/controllers/alert.js index 15e5ea155..0c682dd38 100644 --- a/app/scripts/controllers/alert.js +++ b/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); } /** diff --git a/app/scripts/controllers/swaps.js b/app/scripts/controllers/swaps.js index 78e6b03ee..534aa54b7 100644 --- a/app/scripts/controllers/swaps.js +++ b/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); } diff --git a/app/scripts/controllers/swaps.test.js b/app/scripts/controllers/swaps.test.js index 7b953ba34..065540985 100644 --- a/app/scripts/controllers/swaps.test.js +++ b/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, }; }); diff --git a/app/scripts/controllers/transactions/index.js b/app/scripts/controllers/transactions/index.js index 4e8d2bea6..64bf8648f 100644 --- a/app/scripts/controllers/transactions/index.js +++ b/app/scripts/controllers/transactions/index.js @@ -27,10 +27,10 @@ import { import { METAMASK_CONTROLLER_EVENTS } from '../../metamask-controller'; import { GAS_LIMITS, - GAS_ESTIMATE_TYPES, - GAS_RECOMMENDATIONS, + GasEstimateTypes, + 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, - GAS_RECOMMENDATIONS.MEDIUM, - GAS_RECOMMENDATIONS.MEDIUM.HIGH, + GasRecommendations.low, + GasRecommendations.medium, + GasRecommendations.high, ].includes(estimateType) ) { const { gasFeeEstimates } = await this._getEIP1559GasFeeEstimates(); diff --git a/app/scripts/controllers/transactions/index.test.js b/app/scripts/controllers/transactions/index.test.js index 021b38d69..7cf1f5a01 100644 --- a/app/scripts/controllers/transactions/index.test.js +++ b/app/scripts/controllers/transactions/index.test.js @@ -22,8 +22,8 @@ import { import { SECOND } from '../../../../shared/constants/time'; import { - GAS_ESTIMATE_TYPES, - GAS_RECOMMENDATIONS, + GasEstimateTypes, + 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, - estimateUsed: GAS_RECOMMENDATIONS.HIGH, + estimateSuggested: GasRecommendations.medium, + estimateUsed: GasRecommendations.high, }; txController.txStateManager._addTransactionsToState([ { @@ -2232,8 +2232,8 @@ describe('Transaction Controller', function () { maxPriorityFeePerGas: '0x77359400', gas: '0x7b0d', nonce: '0x4b', - estimateSuggested: GAS_RECOMMENDATIONS.MEDIUM, - estimateUsed: GAS_RECOMMENDATIONS.HIGH, + estimateSuggested: GasRecommendations.medium, + 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_used: GAS_RECOMMENDATIONS.HIGH, + estimate_suggested: GasRecommendations.medium, + 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_used: GAS_RECOMMENDATIONS.HIGH, + estimate_suggested: GasRecommendations.medium, + estimate_used: GasRecommendations.high, }; const expectedParams = { max_fee_per_gas: '2', max_priority_fee_per_gas: '2', - estimate_suggested: GAS_RECOMMENDATIONS.MEDIUM, - estimate_used: GAS_RECOMMENDATIONS.HIGH, + estimate_suggested: GasRecommendations.medium, + estimate_used: GasRecommendations.high, }; const result = txController._getGasValuesInGWEI(params); assert.deepEqual(result, expectedParams); diff --git a/app/scripts/controllers/transactions/lib/util.test.js b/app/scripts/controllers/transactions/lib/util.test.js index 1aaf81ccf..687163b9f 100644 --- a/app/scripts/controllers/transactions/lib/util.test.js +++ b/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, - estimateUsed: GAS_RECOMMENDATIONS.HIGH, + estimateSuggested: GasRecommendations.medium, + 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', ); }); diff --git a/shared/constants/alerts.js b/shared/constants/alerts.js deleted file mode 100644 index 99ef70f4c..000000000 --- a/shared/constants/alerts.js +++ /dev/null @@ -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, -}; diff --git a/shared/constants/alerts.ts b/shared/constants/alerts.ts new file mode 100644 index 000000000..bbf6318f4 --- /dev/null +++ b/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, +} diff --git a/shared/constants/gas.js b/shared/constants/gas.ts similarity index 67% rename from shared/constants/gas.js rename to shared/constants/gas.ts index 653f24280..cb3b91233 100644 --- a/shared/constants/gas.js +++ b/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 - * transaction generated by our gas estimation API. - * @property {'legacy'} LEGACY - A gas estimate for a legacy Transaction - * generated by our gas estimation API. - * @property {'eth_gasPrice'} ETH_GAS_PRICE - A gas estimate provided by the - * Ethereum node via eth_gasPrice. + * @property {'fee-market'} FEE_MARKET - A gas estimate for a fee market transaction generated by our gas estimation API. + * @property {'legacy'} LEGACY - A gas estimate for a legacy Transaction 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 = { - FEE_MARKET: 'fee-market', - LEGACY: 'legacy', - ETH_GASPRICE: 'eth_gasPrice', - NONE: 'none', -}; +export enum GasEstimateTypes { + feeMarket = 'fee-market', + legacy = 'legacy', + ethGasPrice = 'eth_gasPrice', + none = 'none', +} /** * These represent gas recommendation levels presented in the UI */ -export const GAS_RECOMMENDATIONS = { - LOW: 'low', - MEDIUM: 'medium', - HIGH: 'high', -}; +export enum GasRecommendations { + low = 'low', + medium = 'medium', + high = 'high', +} /** * These represent types of gas estimation */ -export const PRIORITY_LEVELS = { - TEN_PERCENT_INCREASED: 'tenPercentIncreased', - LOW: 'low', - MEDIUM: 'medium', - HIGH: 'high', - CUSTOM: 'custom', - DAPP_SUGGESTED: 'dappSuggested', -}; +export enum PriorityLevels { + tenPercentIncreased = 'tenPercentIncreased', + low = 'low', + medium = 'medium', + high = 'high', + custom = 'custom', + 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 = { - SPEED_UP: 'speed-up', - CANCEL: 'cancel', - MODIFY_IN_PLACE: 'modify-in-place', - SWAPS: 'swaps', -}; +export enum EditGasModes { + speedUp = 'speed-up', + cancel = 'cancel', + modifyInPlace = 'modify-in-place', + 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 = { - NOT_BUSY: 0, - STABLE: 0.33, - BUSY: 0.66, -}; +export enum NetworkCongestionThresholds { + notBusy = 0, + stable = 0.33, + busy = 0.66, +} diff --git a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-defaults/advanced-gas-fee-defaults.js b/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-defaults/advanced-gas-fee-defaults.js index 59428a649..5bbdc0c4b 100644 --- a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-defaults/advanced-gas-fee-defaults.js +++ b/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; } diff --git a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-defaults/advanced-gas-fee-defaults.test.js b/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-defaults/advanced-gas-fee-defaults.test.js index 58e40e209..ca6253774 100644 --- a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-defaults/advanced-gas-fee-defaults.test.js +++ b/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, - GAS_ESTIMATE_TYPES, + EditGasModes, + 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(); diff --git a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-gas-limit/advanced-gas-fee-gas-limit.test.js b/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-gas-limit/advanced-gas-fee-gas-limit.test.js index 2605154a2..7d1495883 100644 --- a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-gas-limit/advanced-gas-fee-gas-limit.test.js +++ b/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, }, }); diff --git a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/base-fee-input/base-fee-input.js b/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/base-fee-input/base-fee-input.js index bf114ce0d..9bc097397 100644 --- a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/base-fee-input/base-fee-input.js +++ b/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, - PRIORITY_LEVELS, + EditGasModes, + 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; } diff --git a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/base-fee-input/base-fee-input.test.js b/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/base-fee-input/base-fee-input.test.js index dbec8b725..c6f088164 100644 --- a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/base-fee-input/base-fee-input.test.js +++ b/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, - GAS_ESTIMATE_TYPES, + EditGasModes, + 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, ), diff --git a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/priority-fee-input/priority-fee-input.js b/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/priority-fee-input/priority-fee-input.js index dd051a19c..6edf04cdc 100644 --- a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/priority-fee-input/priority-fee-input.js +++ b/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, - PRIORITY_LEVELS, + EditGasModes, + 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; } diff --git a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/priority-fee-input/priority-fee-input.test.js b/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/priority-fee-input/priority-fee-input.test.js index 7c1f37fac..83540a3cd 100644 --- a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-inputs/priority-fee-input/priority-fee-input.test.js +++ b/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, - GAS_ESTIMATE_TYPES, + EditGasModes, + 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, ), diff --git a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-popover.test.js b/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-popover.test.js index 169decceb..3b60b3bab 100644 --- a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-popover.test.js +++ b/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, }, }); diff --git a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-save/advanced-gas-fee-save.js b/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-save/advanced-gas-fee-save.js index 347ff23d0..6b1531e81 100644 --- a/ui/components/app/advanced-gas-fee-popover/advanced-gas-fee-save/advanced-gas-fee-save.js +++ b/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, diff --git a/ui/components/app/cancel-speedup-popover/cancel-speedup-popover.js b/ui/components/app/cancel-speedup-popover/cancel-speedup-popover.js index 55f68a1ad..ef8119048 100644 --- a/ui/components/app/cancel-speedup-popover/cancel-speedup-popover.js +++ b/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 { - EDIT_GAS_MODES, - PRIORITY_LEVELS, -} from '../../../../shared/constants/gas'; +import { EditGasModes, PriorityLevels } 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 = () => { - {editGasMode === EDIT_GAS_MODES.CANCEL + {editGasMode === EditGasModes.cancel ? `❌${t('cancel')}` : `🚀${t('speedUp')}`} @@ -114,7 +111,7 @@ const CancelSpeedupPopover = () => { contentText={ {t('cancelSpeedUpTransactionTooltip', [ - editGasMode === EDIT_GAS_MODES.CANCEL + editGasMode === EditGasModes.cancel ? t('cancel') : t('speedUp'), ])} diff --git a/ui/components/app/cancel-speedup-popover/cancel-speedup-popover.test.js b/ui/components/app/cancel-speedup-popover/cancel-speedup-popover.test.js index 9ea165bed..1d8c28056 100644 --- a/ui/components/app/cancel-speedup-popover/cancel-speedup-popover.test.js +++ b/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, - GAS_ESTIMATE_TYPES, + EditGasModes, + 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} > @@ -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}`, ), diff --git a/ui/components/app/confirm-page-container/confirm-page-container.component.js b/ui/components/app/confirm-page-container/confirm-page-container.component.js index 97c889798..2a5a06451 100644 --- a/ui/components/app/confirm-page-container/confirm-page-container.component.js +++ b/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 && ( diff --git a/ui/components/app/edit-gas-display/edit-gas-display.component.js b/ui/components/app/edit-gas-display/edit-gas-display.component.js index 4be1bd4e1..0e61de80b 100644 --- a/ui/components/app/edit-gas-display/edit-gas-display.component.js +++ b/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({ /> )} - {mode === EDIT_GAS_MODES.SPEED_UP && ( + {mode === EditGasModes.speedUp && (
{ 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(); diff --git a/ui/components/app/edit-gas-fee-popover/edit-gas-fee-popover.js b/ui/components/app/edit-gas-fee-popover/edit-gas-fee-popover.js index 622c9b220..b31e3207a 100644 --- a/ui/components/app/edit-gas-fee-popover/edit-gas-fee-popover.js +++ b/ui/components/app/edit-gas-fee-popover/edit-gas-fee-popover.js @@ -1,9 +1,6 @@ import React from 'react'; -import { - EDIT_GAS_MODES, - PRIORITY_LEVELS, -} from '../../../../shared/constants/gas'; +import { EditGasModes, PriorityLevels } 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')} - {editGasMode !== EDIT_GAS_MODES.SWAPS && t('time')} + {editGasMode !== EditGasModes.swaps && t('time')} {t('maxFee')}
- {(editGasMode === EDIT_GAS_MODES.CANCEL || - editGasMode === EDIT_GAS_MODES.SPEED_UP) && ( + {(editGasMode === EditGasModes.cancel || + editGasMode === EditGasModes.speedUp) && ( )} - {editGasMode === EDIT_GAS_MODES.MODIFY_IN_PLACE && ( - + {editGasMode === EditGasModes.modifyInPlace && ( + )} - - + +
- {editGasMode === EDIT_GAS_MODES.MODIFY_IN_PLACE && ( - + {editGasMode === EditGasModes.modifyInPlace && ( + )} - + diff --git a/ui/components/app/edit-gas-fee-popover/edit-gas-fee-popover.test.js b/ui/components/app/edit-gas-fee-popover/edit-gas-fee-popover.test.js index f4fc6c651..5fec41f57 100644 --- a/ui/components/app/edit-gas-fee-popover/edit-gas-fee-popover.test.js +++ b/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(); }); diff --git a/ui/components/app/edit-gas-fee-popover/edit-gas-item/edit-gas-item.js b/ui/components/app/edit-gas-fee-popover/edit-gas-item/edit-gas-item.js index e3fbc9eb9..7856db4b7 100644 --- a/ui/components/app/edit-gas-fee-popover/edit-gas-item/edit-gas-item.js +++ b/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, - PRIORITY_LEVELS, + EditGasModes, + 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 && - editGasMode === EDIT_GAS_MODES.SWAPS + priorityLevel === PriorityLevels.high && + 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 }) => { - {editGasMode !== EDIT_GAS_MODES.SWAPS && + {editGasMode !== EditGasModes.swaps && (minWaitTime ? toHumanReadableTime(t, minWaitTime) : '--')} { 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' }, - contextProps: { editGasMode: EDIT_GAS_MODES.SWAPS }, + componentProps: { priorityLevel: PriorityLevels.high }, + 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' }), diff --git a/ui/components/app/edit-gas-fee-popover/edit-gas-item/useCustomTimeEstimate.js b/ui/components/app/edit-gas-fee-popover/edit-gas-item/useCustomTimeEstimate.js index cda425043..75dde1e6d 100644 --- a/ui/components/app/edit-gas-fee-popover/edit-gas-item/useCustomTimeEstimate.js +++ b/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; diff --git a/ui/components/app/edit-gas-fee-popover/edit-gas-item/useGasItemFeeDetails.js b/ui/components/app/edit-gas-fee-popover/edit-gas-item/useGasItemFeeDetails.js index 1d292e188..559c9f8b3 100644 --- a/ui/components/app/edit-gas-fee-popover/edit-gas-item/useGasItemFeeDetails.js +++ b/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, - PRIORITY_LEVELS, + EditGasModes, + 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) { - if (estimateUsed === PRIORITY_LEVELS.CUSTOM) { + } else if (priorityLevel === PriorityLevels.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 === EDIT_GAS_MODES.SPEED_UP) && - (priorityLevel === PRIORITY_LEVELS.MEDIUM || - priorityLevel === PRIORITY_LEVELS.HIGH) + (editGasMode === EditGasModes.cancel || + editGasMode === EditGasModes.speedUp) && + (priorityLevel === PriorityLevels.medium || + priorityLevel === PriorityLevels.high) ) { const estimateGreater = !gasEstimateGreaterThanGasUsedPlusTenPercent( transaction.previousGas || transaction.txParams, diff --git a/ui/components/app/edit-gas-fee-popover/edit-gas-tooltip/edit-gas-tooltip.js b/ui/components/app/edit-gas-fee-popover/edit-gas-tooltip/edit-gas-tooltip.js index b049a1bc4..2a30295bf 100644 --- a/ui/components/app/edit-gas-fee-popover/edit-gas-tooltip/edit-gas-tooltip.js +++ b/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, - PRIORITY_LEVELS, + EditGasModes, + 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', [ {t('low')} , ]); - case PRIORITY_LEVELS.MEDIUM: + case PriorityLevels.medium: if (estimateGreaterThanGasUse) { return t('disabledGasOptionToolTipMessage', [ @@ -47,7 +47,7 @@ const EditGasToolTip = ({ {t('medium')} , ]); - case PRIORITY_LEVELS.HIGH: + case PriorityLevels.high: if (estimateGreaterThanGasUse) { return t('disabledGasOptionToolTipMessage', [ @@ -55,7 +55,7 @@ const EditGasToolTip = ({ , ]); } - if (editGasMode === EDIT_GAS_MODES.SWAPS) { + if (editGasMode === EditGasModes.swaps) { return t('swapSuggestedGasSettingToolTipMessage'); } return t('highGasSettingToolTipMessage', [ @@ -63,13 +63,13 @@ const EditGasToolTip = ({ {t('high')} , ]); - case PRIORITY_LEVELS.CUSTOM: + case PriorityLevels.custom: return t('customGasSettingToolTipMessage', [ {t('custom')} , ]); - case PRIORITY_LEVELS.DAPP_SUGGESTED: + case PriorityLevels.dAppSuggested: return transaction?.origin ? t('dappSuggestedGasSettingToolTipMessage', [ {transaction?.origin}, @@ -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 && - editGasMode === EDIT_GAS_MODES.SWAPS + priorityLevel === PriorityLevels.high && + editGasMode === EditGasModes.swaps ) && !estimateGreaterThanGasUse; @@ -110,7 +110,7 @@ const EditGasToolTip = ({ {toolTipMessage}
)} - {priorityLevel === PRIORITY_LEVELS.CUSTOM || + {priorityLevel === PriorityLevels.custom || estimateGreaterThanGasUse ? null : (
diff --git a/ui/components/app/edit-gas-fee-popover/network-statistics/status-slider/status-slider.js b/ui/components/app/edit-gas-fee-popover/network-statistics/status-slider/status-slider.js index 35889b687..e3bac38b0 100644 --- a/ui/components/app/edit-gas-fee-popover/network-statistics/status-slider/status-slider.js +++ b/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', diff --git a/ui/components/app/edit-gas-popover/edit-gas-popover.component.js b/ui/components/app/edit-gas-popover/edit-gas-popover.component.js index 3e2dd96c5..a3b9920d3 100644 --- a/ui/components/app/edit-gas-popover/edit-gas-popover.component.js +++ b/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, }; diff --git a/ui/components/app/edit-gas-popover/edit-gas-popover.stories.js b/ui/components/app/edit-gas-popover/edit-gas-popover.stories.js index 4fb286040..51aa87296 100644 --- a/ui/components/app/edit-gas-popover/edit-gas-popover.stories.js +++ b/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, - GAS_RECOMMENDATIONS, + EditGasModes, + 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 mode = EDIT_GAS_MODES.SWAPS; +const defaultEstimateToUse = GasRecommendations.high; +const mode = EditGasModes.swaps; const confirmButtonText = 'Submit'; const minimumGasLimit = '5700'; diff --git a/ui/components/app/gas-details-item/gas-details-item.test.js b/ui/components/app/gas-details-item/gas-details-item.test.js index b1c3b008a..4885f9068 100644 --- a/ui/components/app/gas-details-item/gas-details-item.test.js +++ b/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], }, }); diff --git a/ui/components/app/gas-timing/gas-timing.component.js b/ui/components/app/gas-timing/gas-timing.component.js index 6eb633f48..c2c7cbfb1 100644 --- a/ui/components/app/gas-timing/gas-timing.component.js +++ b/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 ( - isGasEstimatesLoading || - gasEstimateType !== GAS_ESTIMATE_TYPES.FEE_MARKET - ) { + if (isGasEstimatesLoading || gasEstimateType !== GasEstimateTypes.feeMarket) { return null; } diff --git a/ui/components/app/gas-timing/gas-timing.component.test.js b/ui/components/app/gas-timing/gas-timing.component.test.js index a0042bad9..137f0c8bb 100644 --- a/ui/components/app/gas-timing/gas-timing.component.test.js +++ b/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, }, }; diff --git a/ui/components/app/transaction-alerts/transaction-alerts.js b/ui/components/app/transaction-alerts/transaction-alerts.js index e6a856e62..60fb941fe 100644 --- a/ui/components/app/transaction-alerts/transaction-alerts.js +++ b/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 { submittedPendingTransactionsSelector } from '../../../selectors/transactions'; +import { PriorityLevels } from '../../../../shared/constants/gas'; +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 && ( { balance: '0x1F4', }, }, - gasFeeEstimates: mockEstimates[GAS_ESTIMATE_TYPES.FEE_MARKET], + gasFeeEstimates: mockEstimates[GasEstimateTypes.feeMarket], }, }); diff --git a/ui/components/app/transaction-list-item/transaction-list-item.component.js b/ui/components/app/transaction-list-item/transaction-list-item.component.js index b1c668380..3166bab54 100644 --- a/ui/components/app/transaction-list-item/transaction-list-item.component.js +++ b/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 && ( setShowRetryEditGasPopover(false)} - mode={EDIT_GAS_MODES.SPEED_UP} + mode={EditGasModes.speedUp} transaction={transactionGroup.primaryTransaction} /> )} {!supportsEIP1559 && showCancelEditGasPopover && ( setShowCancelEditGasPopover(false)} - mode={EDIT_GAS_MODES.CANCEL} + mode={EditGasModes.cancel} transaction={transactionGroup.primaryTransaction} /> )} diff --git a/ui/components/app/transaction-list-item/transaction-list-item.component.test.js b/ui/components/app/transaction-list-item/transaction-list-item.component.test.js index cd2930e1d..58cfcc552 100644 --- a/ui/components/app/transaction-list-item/transaction-list-item.component.test.js +++ b/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, diff --git a/ui/components/ui/radio-group/radio-group.stories.js b/ui/components/ui/radio-group/radio-group.stories.js index 4775ef936..27b36ad67 100644 --- a/ui/components/ui/radio-group/radio-group.stories.js +++ b/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, }; diff --git a/ui/ducks/alerts/invalid-custom-network.js b/ui/ducks/alerts/invalid-custom-network.js index da3bd2e54..a2cce6da3 100644 --- a/ui/ducks/alerts/invalid-custom-network.js +++ b/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, diff --git a/ui/ducks/alerts/unconnected-account.js b/ui/ducks/alerts/unconnected-account.js index 748389e18..a1cc12ba6 100644 --- a/ui/ducks/alerts/unconnected-account.js +++ b/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, diff --git a/ui/ducks/index.js b/ui/ducks/index.js index 517c2ec70..1fcad417d 100644 --- a/ui/ducks/index.js +++ b/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, - [ALERT_TYPES.unconnectedAccount]: unconnectedAccount, + [AlertTypes.invalidCustomNetwork]: invalidCustomNetwork, + [AlertTypes.unconnectedAccount]: unconnectedAccount, activeTab: (s) => (s === undefined ? null : s), metamask: metamaskReducer, appState: appStateReducer, diff --git a/ui/ducks/metamask/metamask.js b/ui/ducks/metamask/metamask.js index bd31a1517..b3da7b4f4 100644 --- a/ui/ducks/metamask/metamask.js +++ b/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, - NETWORK_CONGESTION_THRESHOLDS, + GasEstimateTypes, + 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 === GAS_ESTIMATE_TYPES.ETH_GASPRICE; + gasEstimateType === GasEstimateTypes.feeMarket || + 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 ( - gasFeeEstimates?.networkCongestion >= NETWORK_CONGESTION_THRESHOLDS.BUSY - ); + return gasFeeEstimates?.networkCongestion >= NetworkCongestionThresholds.busy; } export function getCompletedOnboarding(state) { diff --git a/ui/ducks/send/send.js b/ui/ducks/send/send.js index 828b96194..c811e31a6 100644 --- a/ui/ducks/send/send.js +++ b/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; } diff --git a/ui/ducks/send/send.test.js b/ui/ducks/send/send.test.js index 17fc0ac47..52c6821ad 100644 --- a/ui/ducks/send/send.test.js +++ b/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, }), diff --git a/ui/helpers/constants/design-system.js b/ui/helpers/constants/design-system.ts similarity index 99% rename from ui/helpers/constants/design-system.js rename to ui/helpers/constants/design-system.ts index 1822d6ba6..bde88c55a 100644 --- a/ui/helpers/constants/design-system.js +++ b/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', diff --git a/ui/helpers/constants/routes.js b/ui/helpers/constants/routes.ts similarity index 100% rename from ui/helpers/constants/routes.js rename to ui/helpers/constants/routes.ts diff --git a/ui/helpers/utils/gas.js b/ui/helpers/utils/gas.js index 1aa19cafc..d5e763307 100644 --- a/ui/helpers/utils/gas.js +++ b/ui/helpers/utils/gas.js @@ -1,8 +1,8 @@ import { constant, times, uniq, zip } from 'lodash'; import BigNumber from 'bignumber.js'; import { - GAS_RECOMMENDATIONS, - EDIT_GAS_MODES, + GasRecommendations, + 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, - GAS_RECOMMENDATIONS.MEDIUM, - GAS_RECOMMENDATIONS.LOW, + GasRecommendations.high, + GasRecommendations.medium, + GasRecommendations.low, ].includes(estimate); } @@ -102,7 +102,6 @@ export function formatGasFeeOrFeeRange( */ export function editGasModeIsSpeedUpOrCancel(editGasMode) { return ( - editGasMode === EDIT_GAS_MODES.CANCEL || - editGasMode === EDIT_GAS_MODES.SPEED_UP + editGasMode === EditGasModes.cancel || editGasMode === EditGasModes.speedUp ); } diff --git a/ui/helpers/utils/gas.test.js b/ui/helpers/utils/gas.test.js index 177206a22..3fdcf4f3b 100644 --- a/ui/helpers/utils/gas.test.js +++ b/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, ); }; diff --git a/ui/hooks/gasFeeInput/test-utils.js b/ui/hooks/gasFeeInput/test-utils.js index 3b1b01aaf..86e00a822 100644 --- a/ui/hooks/gasFeeInput/test-utils.js +++ b/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, diff --git a/ui/hooks/gasFeeInput/useGasEstimates.js b/ui/hooks/gasFeeInput/useGasEstimates.js index 33ccf7fe2..228315f6d 100644 --- a/ui/hooks/gasFeeInput/useGasEstimates.js +++ b/ui/hooks/gasFeeInput/useGasEstimates.js @@ -1,9 +1,6 @@ import { useSelector } from 'react-redux'; -import { - EDIT_GAS_MODES, - GAS_ESTIMATE_TYPES, -} from '../../../shared/constants/gas'; +import { EditGasModes, GasEstimateTypes } 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 }; } diff --git a/ui/hooks/gasFeeInput/useGasFeeErrors.js b/ui/hooks/gasFeeInput/useGasFeeErrors.js index 6a8ba2d5c..b48f5cef0 100644 --- a/ui/hooks/gasFeeInput/useGasFeeErrors.js +++ b/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 = - gasEstimateType === GAS_ESTIMATE_TYPES.FEE_MARKET; + const isFeeMarketGasEstimate = gasEstimateType === GasEstimateTypes.feeMarket; // Get all errors const gasLimitError = validateGasLimit(gasLimit, minimumGasLimit); diff --git a/ui/hooks/gasFeeInput/useGasFeeInputs.js b/ui/hooks/gasFeeInput/useGasFeeInputs.js index 57657fa91..9b8d4a4df 100644 --- a/ui/hooks/gasFeeInput/useGasFeeInputs.js +++ b/ui/hooks/gasFeeInput/useGasFeeInputs.js @@ -3,9 +3,9 @@ import { useSelector } from 'react-redux'; import { CUSTOM_GAS_ESTIMATE, - GAS_RECOMMENDATIONS, - EDIT_GAS_MODES, - PRIORITY_LEVELS, + GasRecommendations, + EditGasModes, + 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(() => diff --git a/ui/hooks/gasFeeInput/useGasFeeInputs.test.js b/ui/hooks/gasFeeInput/useGasFeeInputs.test.js index 4779a5cb7..35205583e 100644 --- a/ui/hooks/gasFeeInput/useGasFeeInputs.test.js +++ b/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, - EDIT_GAS_MODES, + GasRecommendations, + 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); }); }); }); diff --git a/ui/hooks/gasFeeInput/useGasPriceInput.js b/ui/hooks/gasFeeInput/useGasPriceInput.js index 2c7f9f87b..cdf62165b 100644 --- a/ui/hooks/gasFeeInput/useGasPriceInput.js +++ b/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'; diff --git a/ui/hooks/gasFeeInput/useGasPriceInput.test.js b/ui/hooks/gasFeeInput/useGasPriceInput.test.js index 9f1d27431..161880501 100644 --- a/ui/hooks/gasFeeInput/useGasPriceInput.test.js +++ b/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); diff --git a/ui/hooks/gasFeeInput/useMaxFeePerGasInput.test.js b/ui/hooks/gasFeeInput/useMaxFeePerGasInput.test.js index edfa52897..0ffb36968 100644 --- a/ui/hooks/gasFeeInput/useMaxFeePerGasInput.test.js +++ b/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' }, }, }); diff --git a/ui/hooks/gasFeeInput/useMaxPriorityFeePerGasInput.test.js b/ui/hooks/gasFeeInput/useMaxPriorityFeePerGasInput.test.js index ac79332ed..9affedc06 100644 --- a/ui/hooks/gasFeeInput/useMaxPriorityFeePerGasInput.test.js +++ b/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' }, }, }); diff --git a/ui/hooks/gasFeeInput/useTransactionFunction.test.js b/ui/hooks/gasFeeInput/useTransactionFunction.test.js index dcfee4d26..60f4ba6c4 100644 --- a/ui/hooks/gasFeeInput/useTransactionFunction.test.js +++ b/ui/hooks/gasFeeInput/useTransactionFunction.test.js @@ -4,8 +4,8 @@ import { renderHook } from '@testing-library/react-hooks'; import { CUSTOM_GAS_ESTIMATE, - EDIT_GAS_MODES, - GAS_RECOMMENDATIONS, + EditGasModes, + 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, - editGasMode: EDIT_GAS_MODES.MODIFY_IN_PLACE, + defaultEstimateToUse: GasRecommendations.medium, + 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( - GAS_RECOMMENDATIONS.LOW, - ); + await result.current.updateTransactionUsingEstimate(GasRecommendations.low); expect(mockUpdateGasFees).toHaveBeenCalledTimes(1); expect(mockUpdateGasFees).toHaveBeenCalledWith(undefined, { estimateSuggested: 'medium', diff --git a/ui/hooks/gasFeeInput/useTransactionFunctions.js b/ui/hooks/gasFeeInput/useTransactionFunctions.js index 9158a8329..17d2c60c4 100644 --- a/ui/hooks/gasFeeInput/useTransactionFunctions.js +++ b/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 !== EDIT_GAS_MODES.SPEED_UP) || + (editGasMode !== EditGasModes.cancel && + 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, - estimateUsed: PRIORITY_LEVELS.TEN_PERCENT_INCREASED, + : PriorityLevels.tenPercentIncreased, + 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, }); diff --git a/ui/hooks/gasFeeInput/utils.js b/ui/hooks/gasFeeInput/utils.js index 3c27f6416..616e69a32 100644 --- a/ui/hooks/gasFeeInput/utils.js +++ b/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); diff --git a/ui/hooks/useGasFeeEstimates.test.js b/ui/hooks/useGasFeeEstimates.test.js index 6e7ef45b0..a76633c11 100644 --- a/ui/hooks/useGasFeeEstimates.test.js +++ b/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, }); }); diff --git a/ui/index.js b/ui/index.js index 36662f209..40f175ec6 100644 --- a/ui/index.js +++ b/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); diff --git a/ui/pages/confirm-approve/confirm-approve.js b/ui/pages/confirm-approve/confirm-approve.js index 17f0c0bf6..0a9e2bc36 100644 --- a/ui/pages/confirm-approve/confirm-approve.js +++ b/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 && ( )} @@ -282,7 +282,7 @@ export default function ConfirmApprove({ {showCustomizeGasPopover && !supportsEIP1559 && ( )} diff --git a/ui/pages/home/home.container.js b/ui/pages/home/home.container.js index b41f1a3de..f2124891c 100644 --- a/ui/pages/home/home.container.js +++ b/ui/pages/home/home.container.js @@ -59,8 +59,8 @@ import { ENVIRONMENT_TYPE_POPUP, } from '../../../shared/constants/app'; import { - ALERT_TYPES, - WEB3_SHIM_USAGE_ALERT_STATES, + AlertTypes, + 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: () => diff --git a/ui/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.test.js b/ui/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.test.js index 45b85d799..0e1824d10 100644 --- a/ui/pages/send/send-content/send-amount-row/amount-max-button/amount-max-button.test.js +++ b/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', () => { , 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: {}, }, diff --git a/ui/pages/send/send.test.js b/ui/pages/send/send.test.js index 017dc786b..a659aae65 100644 --- a/ui/pages/send/send.test.js +++ b/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', diff --git a/ui/pages/settings/alerts-tab/alerts-tab.js b/ui/pages/settings/alerts-tab/alerts-tab.js index 40ecf4394..83dd76e14 100644 --- a/ui/pages/settings/alerts-tab/alerts-tab.js +++ b/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'), }, diff --git a/ui/pages/settings/alerts-tab/alerts-tab.test.js b/ui/pages/settings/alerts-tab/alerts-tab.test.js index 0de3611ff..8750c4a9a 100644 --- a/ui/pages/settings/alerts-tab/alerts-tab.test.js +++ b/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 { ALERT_TYPES } from '../../../../shared/constants/alerts'; +import { renderWithProvider } from '../../../../test/jest'; +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); }); diff --git a/ui/pages/swaps/view-quote/view-quote-price-difference.js b/ui/pages/swaps/view-quote/view-quote-price-difference.js index c8f2cd162..985eacd37 100644 --- a/ui/pages/swaps/view-quote/view-quote-price-difference.js +++ b/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', [ diff --git a/ui/pages/swaps/view-quote/view-quote-price-difference.test.js b/ui/pages/swaps/view-quote/view-quote-price-difference.test.js index 806d4b9c0..cec109c28 100644 --- a/ui/pages/swaps/view-quote/view-quote-price-difference.test.js +++ b/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( , @@ -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( , diff --git a/ui/pages/swaps/view-quote/view-quote.js b/ui/pages/swaps/view-quote/view-quote.js index c63677387..fc663dbd0 100644 --- a/ui/pages/swaps/view-quote/view-quote.js +++ b/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, - GAS_RECOMMENDATIONS.MEDIUM, + GasRecommendations.high, + 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, { - userFeeLevel: swapsUserFeeLevel || GAS_RECOMMENDATIONS.HIGH, + gasFeeInputs = useGasFeeInputs(GasRecommendations.high, { + userFeeLevel: swapsUserFeeLevel || GasRecommendations.high, }); } @@ -725,8 +725,8 @@ export default function ViewQuote() { useEffect(() => { if ( acknowledgedPriceDifference && - lastPriceDifferenceBucket === GAS_RECOMMENDATIONS.MEDIUM && - priceSlippageBucket === GAS_RECOMMENDATIONS.HIGH + lastPriceDifferenceBucket === GasRecommendations.medium && + priceSlippageBucket === GasRecommendations.high ) { setAcknowledgedPriceDifference(false); } diff --git a/ui/selectors/confirm-transaction.js b/ui/selectors/confirm-transaction.js index a93d930be..3b3e7b137 100644 --- a/ui/selectors/confirm-transaction.js +++ b/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; diff --git a/ui/selectors/custom-gas.js b/ui/selectors/custom-gas.js index fa2a39ed2..adda2204d 100644 --- a/ui/selectors/custom-gas.js +++ b/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; } diff --git a/ui/selectors/custom-gas.test.js b/ui/selectors/custom-gas.test.js index 736cac728..4a1e71a11 100644 --- a/ui/selectors/custom-gas.test.js +++ b/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', },