m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Code

Use gas recommendation constants throughout app (#12461)

Browse Source
This commit is contained in:
David Walsh 2021-11-05 19:59:23 -05:00 committed by GitHub
parent 2822379bdc
commit 17b64e94fc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
22 changed files with 166 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/scripts/controllers/transactions/index.js
View File

@ -30,6 +30,8 @@ import { METAMASK_CONTROLLER_EVENTS } from '../../metamask-controller';
import {
GAS_LIMITS,
GAS_ESTIMATE_TYPES,
GAS_RECOMMENDATIONS,
CUSTOM_GAS_ESTIMATE,
} from '../../../../shared/constants/gas';
import { decGWEIToHexWEI } from '../../../../shared/modules/conversion.utils';
import {
@ -435,7 +437,7 @@ export default class TransactionController extends EventEmitter {
) {
txMeta.txParams.maxFeePerGas = txMeta.txParams.gasPrice;
txMeta.txParams.maxPriorityFeePerGas = txMeta.txParams.gasPrice;
txMeta.userFeeLevel = 'custom';
txMeta.userFeeLevel = CUSTOM_GAS_ESTIMATE;
} else {
if (
(defaultMaxFeePerGas &&
@ -444,9 +446,9 @@ export default class TransactionController extends EventEmitter {
!txMeta.txParams.maxPriorityFeePerGas) ||
txMeta.origin === 'metamask'
) {
txMeta.userFeeLevel = 'medium';
txMeta.userFeeLevel = GAS_RECOMMENDATIONS.MEDIUM;
} else {
txMeta.userFeeLevel = 'custom';
txMeta.userFeeLevel = CUSTOM_GAS_ESTIMATE;
}
if (defaultMaxFeePerGas && !txMeta.txParams.maxFeePerGas) {

25
app/scripts/controllers/transactions/index.test.js
View File

@ -16,7 +16,10 @@ import {
} from '../../../../shared/constants/transaction';
import { SECOND } from '../../../../shared/constants/time';
import { GAS_ESTIMATE_TYPES } from '../../../../shared/constants/gas';
import {
GAS_ESTIMATE_TYPES,
GAS_RECOMMENDATIONS,
} from '../../../../shared/constants/gas';
import { METAMASK_CONTROLLER_EVENTS } from '../../metamask-controller';
import TransactionController, { TRANSACTION_EVENTS } from '.';
@ -1001,8 +1004,8 @@ describe('Transaction Controller', function () {
to: '0xB09d8505E1F4EF1CeA089D47094f5DD3464083d4',
gas: '0x5209',
gasPrice: '0xa',
estimateSuggested: 'medium',
estimateUsed: 'high',
estimateSuggested: GAS_RECOMMENDATIONS.MEDIUM,
estimateUsed: GAS_RECOMMENDATIONS.HIGH,
};
txController.txStateManager._addTransactionsToState([
{
@ -1702,8 +1705,8 @@ describe('Transaction Controller', function () {
maxPriorityFeePerGas: '0x77359400',
gas: '0x7b0d',
nonce: '0x4b',
estimateSuggested: 'medium',
estimateUsed: 'high',
estimateSuggested: GAS_RECOMMENDATIONS.MEDIUM,
estimateUsed: GAS_RECOMMENDATIONS.HIGH,
},
type: TRANSACTION_TYPES.SIMPLE_SEND,
origin: 'other',
@ -1730,8 +1733,8 @@ describe('Transaction Controller', function () {
first_seen: 1624408066355,
transaction_envelope_type: 'fee-market',
status: 'unapproved',
estimate_suggested: 'medium',
estimate_used: 'high',
estimate_suggested: GAS_RECOMMENDATIONS.MEDIUM,
estimate_used: GAS_RECOMMENDATIONS.HIGH,
},
};
@ -1804,14 +1807,14 @@ describe('Transaction Controller', function () {
const params = {
max_fee_per_gas: '0x77359400',
max_priority_fee_per_gas: '0x77359400',
estimate_suggested: 'medium',
estimate_used: 'high',
estimate_suggested: GAS_RECOMMENDATIONS.MEDIUM,
estimate_used: GAS_RECOMMENDATIONS.HIGH,
};
const expectedParams = {
max_fee_per_gas: '2',
max_priority_fee_per_gas: '2',
estimate_suggested: 'medium',
estimate_used: 'high',
estimate_suggested: GAS_RECOMMENDATIONS.MEDIUM,
estimate_used: GAS_RECOMMENDATIONS.HIGH,
};
const result = txController._getGasValuesInGWEI(params);
assert.deepEqual(result, expectedParams);

9
app/scripts/controllers/transactions/lib/util.test.js
View File

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

5
shared/constants/gas.js
View File

@ -30,6 +30,11 @@ export const GAS_RECOMMENDATIONS = {
HIGH: 'high',
};
/**
* Represents the user customizing their gas preference
*/
export const CUSTOM_GAS_ESTIMATE = 'custom';
/**
* These represent the different edit modes presented in the UI
*/

3
ui/components/app/edit-gas-display/edit-gas-display.component.js
View File

@ -6,6 +6,7 @@ import {
GAS_RECOMMENDATIONS,
EDIT_GAS_MODES,
GAS_ESTIMATE_TYPES,
CUSTOM_GAS_ESTIMATE,
} from '../../../../shared/constants/gas';
import Button from '../../ui/button';
@ -84,7 +85,7 @@ export default function EditGasDisplay({
);
const [showAdvancedForm, setShowAdvancedForm] = useState(
!estimateToUse || estimateToUse === 'custom' || !supportsEIP1559,
!estimateToUse || estimateToUse === CUSTOM_GAS_ESTIMATE || !supportsEIP1559,
);
const [hideRadioButtons, setHideRadioButtons] = useState(
showAdvancedInlineGasIfPossible,

20
ui/components/app/edit-gas-popover/edit-gas-popover.component.js
View File

@ -4,7 +4,12 @@ import { useDispatch, useSelector } from 'react-redux';
import { useGasFeeInputs } from '../../../hooks/gasFeeInput/useGasFeeInputs';
import { getGasLoadingAnimationIsShowing } from '../../../ducks/app/app';
import { txParamsAreDappSuggested } from '../../../../shared/modules/transaction.utils';
import { EDIT_GAS_MODES, GAS_LIMITS } from '../../../../shared/constants/gas';
import {
EDIT_GAS_MODES,
GAS_LIMITS,
GAS_RECOMMENDATIONS,
CUSTOM_GAS_ESTIMATE,
} from '../../../../shared/constants/gas';
import {
decGWEIToHexWEI,
@ -35,7 +40,7 @@ export default function EditGasPopover({
popoverTitle = '',
confirmButtonText = '',
editGasDisplayProps = {},
defaultEstimateToUse = 'medium',
defaultEstimateToUse = GAS_RECOMMENDATIONS.MEDIUM,
transaction,
mode,
onClose,
@ -70,7 +75,7 @@ export default function EditGasPopover({
if (mode === EDIT_GAS_MODES.SPEED_UP || mode === EDIT_GAS_MODES.CANCEL) {
updatedTransaction = {
...transaction,
userFeeLevel: 'custom',
userFeeLevel: CUSTOM_GAS_ESTIMATE,
txParams: {
...transaction.txParams,
...updatedCustomGasSettings,
@ -112,7 +117,8 @@ export default function EditGasPopover({
);
const txParamsHaveBeenCustomized =
estimateToUse === 'custom' || txParamsAreDappSuggested(updatedTransaction);
estimateToUse === CUSTOM_GAS_ESTIMATE ||
txParamsAreDappSuggested(updatedTransaction);
/**
* Temporary placeholder, this should be managed by the parent component but
@ -157,7 +163,7 @@ export default function EditGasPopover({
const updatedTxMeta = {
...updatedTransaction,
userFeeLevel: estimateToUse || 'custom',
userFeeLevel: estimateToUse || CUSTOM_GAS_ESTIMATE,
txParams: {
...cleanTransactionParams,
...newGasSettings,
@ -185,7 +191,9 @@ export default function EditGasPopover({
case EDIT_GAS_MODES.SWAPS:
// This popover component should only be used for the "FEE_MARKET" type in Swaps.
if (supportsEIP1559) {
dispatch(updateSwapsUserFeeLevel(estimateToUse || 'custom'));
dispatch(
updateSwapsUserFeeLevel(estimateToUse || CUSTOM_GAS_ESTIMATE),
);
dispatch(updateCustomSwapsEIP1559GasParams(newGasSettings));
}
break;

18
ui/components/app/edit-gas-popover/edit-gas-popover.stories.js
View File

@ -5,7 +5,11 @@ import { boolean } from '@storybook/addon-knobs';
import { decGWEIToHexWEI } from '../../../helpers/utils/conversions.util';
import configureStore from '../../../store/store';
import testData from '../../../../.storybook/test-data';
import { EDIT_GAS_MODES } from '../../../../shared/constants/gas';
import {
EDIT_GAS_MODES,
GAS_RECOMMENDATIONS,
} from '../../../../shared/constants/gas';
import EditGasPopover from '.';
const store = configureStore(testData);
@ -21,7 +25,7 @@ export const Basic = () => {
<div style={{ width: '600px' }}>
<EditGasPopover
transaction={{
userFeeLevel: 'medium',
userFeeLevel: GAS_RECOMMENDATIONS.MEDIUM,
txParams: {
maxFeePerGas: decGWEIToHexWEI('10000'),
maxPriorityFeePerGas: '0x5600',
@ -29,7 +33,7 @@ export const Basic = () => {
gasPrice: '0x5600',
},
}}
defaultEstimateToUse="high"
defaultEstimateToUse={GAS_RECOMMENDATIONS.HIGH}
mode={EDIT_GAS_MODES.SWAPS}
confirmButtonText="Submit"
onClose={() => action(`Close Edit Gas Popover`)()}
@ -45,7 +49,7 @@ export const BasicWithDifferentButtonText = () => {
<EditGasPopover
confirmButtonText="Custom Value"
transaction={{
userFeeLevel: 'medium',
userFeeLevel: GAS_RECOMMENDATIONS.MEDIUM,
txParams: {
maxFeePerGas: decGWEIToHexWEI('10000'),
maxPriorityFeePerGas: '0x5600',
@ -53,7 +57,7 @@ export const BasicWithDifferentButtonText = () => {
gasPrice: '0x5600',
},
}}
defaultEstimateToUse="high"
defaultEstimateToUse={GAS_RECOMMENDATIONS.HIGH}
mode={EDIT_GAS_MODES.SWAPS}
onClose={() => action(`Close Edit Gas Popover`)()}
minimumGasLimit="5700"
@ -70,7 +74,7 @@ export const EducationalContentFlow = () => {
showEducationButton: boolean('Show Education Button', true),
}}
transaction={{
userFeeLevel: 'medium',
userFeeLevel: GAS_RECOMMENDATIONS.MEDIUM,
txParams: {
maxFeePerGas: decGWEIToHexWEI('10000'),
maxPriorityFeePerGas: '0x5600',
@ -78,7 +82,7 @@ export const EducationalContentFlow = () => {
gasPrice: '0x5600',
},
}}
defaultEstimateToUse="high"
defaultEstimateToUse={GAS_RECOMMENDATIONS.HIGH}
mode={EDIT_GAS_MODES.SWAPS}
confirmButtonText="Submit"
onClose={() => action(`Close Edit Gas Popover`)()}

13
ui/components/ui/radio-group/radio-group.stories.js
View File

@ -1,4 +1,5 @@
import React from 'react';
import { GAS_RECOMMENDATIONS } from '../../../../shared/constants/gas';
import RadioGroup from '.';
export default {
@ -12,11 +13,15 @@ export const radioGroup = () => {
<RadioGroup
name="gas-recommendation"
options={[
{ value: 'low', label: 'Low', recommended: false },
{ value: 'medium', label: 'Medium', recommended: false },
{ value: 'high', label: 'High', recommended: true },
{ value: GAS_RECOMMENDATIONS.LOW, label: 'Low', recommended: false },
{
value: GAS_RECOMMENDATIONS.MEDIUM,
label: 'Medium',
recommended: false,
},
{ value: GAS_RECOMMENDATIONS.HIGH, label: 'High', recommended: true },
]}
selectedValue="high"
selectedValue={GAS_RECOMMENDATIONS.HIGH}
/>
</div>
);

8
ui/hooks/gasFeeInput/useGasFeeInputs.js
View File

@ -4,6 +4,10 @@ import { useSelector } from 'react-redux';
import { getAdvancedInlineGasShown } from '../../selectors';
import { hexToDecimal } from '../../helpers/utils/conversions.util';
import { GAS_FORM_ERRORS } from '../../helpers/constants/gas';
import {
GAS_RECOMMENDATIONS,
CUSTOM_GAS_ESTIMATE,
} from '../../../shared/constants/gas';
import { useGasFeeEstimates } from '../useGasFeeEstimates';
import { useGasFeeErrors } from './useGasFeeErrors';
@ -58,7 +62,7 @@ import { useGasEstimates } from './useGasEstimates';
* ).GasEstimates} - gas fee input state and the GasFeeEstimates object
*/
export function useGasFeeInputs(
defaultEstimateToUse = 'medium',
defaultEstimateToUse = GAS_RECOMMENDATIONS.MEDIUM,
transaction,
minimumGasLimit = '0x5208',
editGasMode,
@ -199,7 +203,7 @@ export function useGasFeeInputs(
);
const onManualChange = useCallback(() => {
setInternalEstimateToUse('custom');
setInternalEstimateToUse(CUSTOM_GAS_ESTIMATE);
handleGasLimitOutOfBoundError();
// Restore existing values
setGasPrice(gasPrice);

25
ui/hooks/gasFeeInput/useGasFeeInputs.test.js
View File

@ -1,6 +1,10 @@
import { act, renderHook } from '@testing-library/react-hooks';
import { useSelector } from 'react-redux';
import { TRANSACTION_ENVELOPE_TYPES } from '../../../shared/constants/transaction';
import {
GAS_RECOMMENDATIONS,
CUSTOM_GAS_ESTIMATE,
} from '../../../shared/constants/gas';
import { ETH, PRIMARY } from '../../helpers/constants/common';
@ -116,7 +120,7 @@ describe('useGasFeeInputs', () => {
it('returns gasPrice appropriately, and "0" for EIP1559 fields', () => {
const { result } = renderHook(() =>
useGasFeeInputs('medium', {
useGasFeeInputs(GAS_RECOMMENDATIONS.MEDIUM, {
txParams: {
value: '3782DACE9D90000',
gasLimit: '0x5028',
@ -167,7 +171,10 @@ describe('useGasFeeInputs', () => {
}),
);
const { result } = renderHook(() =>
useGasFeeInputs(null, { txParams: {}, userFeeLevel: 'medium' }),
useGasFeeInputs(null, {
txParams: {},
userFeeLevel: GAS_RECOMMENDATIONS.MEDIUM,
}),
);
expect(result.current.maxFeePerGas).toBe(
FEE_MARKET_ESTIMATE_RETURN_VALUE.gasFeeEstimates.medium
@ -226,7 +233,7 @@ describe('useGasFeeInputs', () => {
it('should return true', () => {
const { result } = renderHook(() =>
useGasFeeInputs(null, {
userFeeLevel: 'medium',
userFeeLevel: GAS_RECOMMENDATIONS.MEDIUM,
txParams: { gas: '0x5208' },
}),
);
@ -242,14 +249,14 @@ describe('useGasFeeInputs', () => {
it('should change estimateToUse value', () => {
const { result } = renderHook(() =>
useGasFeeInputs(null, {
userFeeLevel: 'medium',
userFeeLevel: GAS_RECOMMENDATIONS.MEDIUM,
txParams: { gas: '0x5208' },
}),
);
act(() => {
result.current.setEstimateToUse('high');
result.current.setEstimateToUse(GAS_RECOMMENDATIONS.HIGH);
});
expect(result.current.estimateToUse).toBe('high');
expect(result.current.estimateToUse).toBe(GAS_RECOMMENDATIONS.HIGH);
expect(result.current.maxFeePerGas).toBe(
FEE_MARKET_ESTIMATE_RETURN_VALUE.gasFeeEstimates.high
.suggestedMaxFeePerGas,
@ -269,7 +276,7 @@ describe('useGasFeeInputs', () => {
it('should change estimateToUse value to custom', () => {
const { result } = renderHook(() =>
useGasFeeInputs(null, {
userFeeLevel: 'medium',
userFeeLevel: GAS_RECOMMENDATIONS.MEDIUM,
txParams: { gas: '0x5208' },
}),
);
@ -278,7 +285,7 @@ describe('useGasFeeInputs', () => {
result.current.setMaxFeePerGas('100');
result.current.setMaxPriorityFeePerGas('10');
});
expect(result.current.estimateToUse).toBe('custom');
expect(result.current.estimateToUse).toBe(CUSTOM_GAS_ESTIMATE);
expect(result.current.maxFeePerGas).toBe('100');
expect(result.current.maxPriorityFeePerGas).toBe('10');
});
@ -298,7 +305,7 @@ describe('useGasFeeInputs', () => {
it('does not return fiat values', () => {
const { result } = renderHook(() =>
useGasFeeInputs(null, {
userFeeLevel: 'medium',
userFeeLevel: GAS_RECOMMENDATIONS.MEDIUM,
txParams: { gas: '0x5208' },
}),
);

7
ui/hooks/gasFeeInput/useGasPriceInput.js
View File

@ -1,7 +1,10 @@
import { useState } from 'react';
import { isEqual } from 'lodash';
import { GAS_ESTIMATE_TYPES } from '../../../shared/constants/gas';
import {
GAS_ESTIMATE_TYPES,
CUSTOM_GAS_ESTIMATE,
} from '../../../shared/constants/gas';
import { hexWEIToDecGWEI } from '../../helpers/utils/conversions.util';
import { isLegacyTransaction } from '../../helpers/utils/transactions.util';
@ -30,7 +33,7 @@ export function useGasPriceInput({
transaction,
}) {
const [gasPriceHasBeenManuallySet, setGasPriceHasBeenManuallySet] = useState(
transaction?.userFeeLevel === 'custom',
transaction?.userFeeLevel === CUSTOM_GAS_ESTIMATE,
);
const [gasPrice, setGasPrice] = useState(() => {

18
ui/hooks/gasFeeInput/useGasPriceInput.test.js
View File

@ -1,5 +1,9 @@
import { act, renderHook } from '@testing-library/react-hooks';
import {
GAS_RECOMMENDATIONS,
CUSTOM_GAS_ESTIMATE,
} from '../../../shared/constants/gas';
import {
FEE_MARKET_ESTIMATE_RETURN_VALUE,
LEGACY_GAS_ESTIMATE_RETURN_VALUE,
@ -30,7 +34,7 @@ describe('useGasPriceInput', () => {
const { result } = renderHook(() =>
useGasPriceInput({
transaction: {
userFeeLevel: 'custom',
userFeeLevel: CUSTOM_GAS_ESTIMATE,
txParams: { gasPrice: '0x5028' },
},
}),
@ -42,9 +46,9 @@ describe('useGasPriceInput', () => {
configure();
const { result } = renderHook(() =>
useGasPriceInput({
estimateToUse: 'high',
estimateToUse: GAS_RECOMMENDATIONS.HIGH,
transaction: {
userFeeLevel: 'high',
userFeeLevel: GAS_RECOMMENDATIONS.HIGH,
txParams: { gasPrice: '0x5028' },
},
...LEGACY_GAS_ESTIMATE_RETURN_VALUE,
@ -56,7 +60,7 @@ describe('useGasPriceInput', () => {
it('if no gasPrice is provided returns default estimate for legacy transaction', () => {
const { result } = renderHook(() =>
useGasPriceInput({
estimateToUse: 'medium',
estimateToUse: GAS_RECOMMENDATIONS.MEDIUM,
...LEGACY_GAS_ESTIMATE_RETURN_VALUE,
}),
);
@ -66,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: 'high',
estimateToUse: GAS_RECOMMENDATIONS.HIGH,
...LEGACY_GAS_ESTIMATE_RETURN_VALUE,
}),
);
@ -76,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: 'medium',
estimateToUse: GAS_RECOMMENDATIONS.MEDIUM,
...FEE_MARKET_ESTIMATE_RETURN_VALUE,
}),
);
@ -85,7 +89,7 @@ describe('useGasPriceInput', () => {
it('returns gasPrice set by user if gasPriceHasBeenManuallySet is true', () => {
const { result } = renderHook(() =>
useGasPriceInput({ estimateToUse: 'medium' }),
useGasPriceInput({ estimateToUse: GAS_RECOMMENDATIONS.MEDIUM }),
);
act(() => {
result.current.setGasPriceHasBeenManuallySet(true);

16
ui/hooks/gasFeeInput/useMaxFeePerGasInput.test.js
View File

@ -3,6 +3,10 @@ import { act, renderHook } from '@testing-library/react-hooks';
import { getMaximumGasTotalInHexWei } from '../../../shared/modules/gas.utils';
import { decimalToHex } from '../../helpers/utils/conversions.util';
import {
GAS_RECOMMENDATIONS,
CUSTOM_GAS_ESTIMATE,
} from '../../../shared/constants/gas';
import {
FEE_MARKET_ESTIMATE_RETURN_VALUE,
@ -31,9 +35,9 @@ const renderUseMaxFeePerGasInputHook = (props) =>
renderHook(() =>
useMaxFeePerGasInput({
gasLimit: '21000',
estimateToUse: 'medium',
estimateToUse: GAS_RECOMMENDATIONS.MEDIUM,
transaction: {
userFeeLevel: 'custom',
userFeeLevel: CUSTOM_GAS_ESTIMATE,
txParams: { maxFeePerGas: '0x5028' },
},
...FEE_MARKET_ESTIMATE_RETURN_VALUE,
@ -55,7 +59,7 @@ describe('useMaxFeePerGasInput', () => {
it('returns gasPrice values from transaction if transaction.userFeeLevel is custom and maxFeePerGas is not provided', () => {
const { result } = renderUseMaxFeePerGasInputHook({
transaction: {
userFeeLevel: 'custom',
userFeeLevel: CUSTOM_GAS_ESTIMATE,
txParams: { gasPrice: '0x5028' },
},
});
@ -64,9 +68,9 @@ describe('useMaxFeePerGasInput', () => {
it('does not returns maxFeePerGas values from transaction if transaction.userFeeLevel is not custom', () => {
const { result } = renderUseMaxFeePerGasInputHook({
estimateToUse: 'high',
estimateToUse: GAS_RECOMMENDATIONS.HIGH,
transaction: {
userFeeLevel: 'high',
userFeeLevel: GAS_RECOMMENDATIONS.HIGH,
txParams: { maxFeePerGas: '0x5028' },
},
});
@ -79,7 +83,7 @@ describe('useMaxFeePerGasInput', () => {
it('if no maxFeePerGas is provided by user or in transaction it returns value from fee market estimate', () => {
const { result } = renderUseMaxFeePerGasInputHook({
transaction: {
userFeeLevel: 'high',
userFeeLevel: GAS_RECOMMENDATIONS.HIGH,
txParams: {},
},
});

14
ui/hooks/gasFeeInput/useMaxPriorityFeePerGasInput.test.js
View File

@ -1,6 +1,10 @@
import { useSelector } from 'react-redux';
import { act, renderHook } from '@testing-library/react-hooks';
import {
GAS_RECOMMENDATIONS,
CUSTOM_GAS_ESTIMATE,
} from '../../../shared/constants/gas';
import {
FEE_MARKET_ESTIMATE_RETURN_VALUE,
LEGACY_GAS_ESTIMATE_RETURN_VALUE,
@ -28,9 +32,9 @@ const renderUseMaxPriorityFeePerGasInputHook = (props) => {
return renderHook(() =>
useMaxPriorityFeePerGasInput({
gasLimit: '21000',
estimateToUse: 'medium',
estimateToUse: GAS_RECOMMENDATIONS.MEDIUM,
transaction: {
userFeeLevel: 'custom',
userFeeLevel: CUSTOM_GAS_ESTIMATE,
txParams: { maxPriorityFeePerGas: '0x5028' },
},
...FEE_MARKET_ESTIMATE_RETURN_VALUE,
@ -56,7 +60,7 @@ describe('useMaxPriorityFeePerGasInput', () => {
it('returns maxFeePerGas values from transaction if transaction.userFeeLevel is custom and maxPriorityFeePerGas is not provided', () => {
const { result } = renderUseMaxPriorityFeePerGasInputHook({
transaction: {
userFeeLevel: 'custom',
userFeeLevel: CUSTOM_GAS_ESTIMATE,
txParams: { maxFeePerGas: '0x5028' },
},
});
@ -65,9 +69,9 @@ describe('useMaxPriorityFeePerGasInput', () => {
it('does not returns maxPriorityFeePerGas values from transaction if transaction.userFeeLevel is not custom', () => {
const { result } = renderUseMaxPriorityFeePerGasInputHook({
estimateToUse: 'high',
estimateToUse: GAS_RECOMMENDATIONS.HIGH,
transaction: {
userFeeLevel: 'high',
userFeeLevel: GAS_RECOMMENDATIONS.HIGH,
txParams: { maxPriorityFeePerGas: '0x5028' },
},
});

8
ui/hooks/gasFeeInput/utils.js
View File

@ -1,4 +1,7 @@
import { GAS_ESTIMATE_TYPES } from '../../../shared/constants/gas';
import {
GAS_ESTIMATE_TYPES,
CUSTOM_GAS_ESTIMATE,
} from '../../../shared/constants/gas';
export function getGasFeeEstimate(
field,
@ -14,4 +17,5 @@ export function getGasFeeEstimate(
}
export const feeParamsAreCustom = (transaction) =>
!transaction?.userFeeLevel || transaction?.userFeeLevel === 'custom';
!transaction?.userFeeLevel ||
transaction?.userFeeLevel === CUSTOM_GAS_ESTIMATE;

3
ui/pages/confirm-transaction-base/confirm-transaction-base.container.js
View File

@ -48,6 +48,7 @@ import { toChecksumHexAddress } from '../../../shared/modules/hexstring-utils';
import { getGasLoadingAnimationIsShowing } from '../../ducks/app/app';
import { isLegacyTransaction } from '../../helpers/utils/transactions.util';
import { CUSTOM_GAS_ESTIMATE } from '../../../shared/constants/gas';
import ConfirmTransactionBase from './confirm-transaction-base.component';
let customNonceValue = '';
@ -168,7 +169,7 @@ const mapStateToProps = (state, ownProps) => {
const noGasPrice = !supportsEIP1559 && getNoGasPriceFetched(state);
const { useNativeCurrencyAsPrimaryCurrency } = getPreferences(state);
const gasFeeIsCustom =
fullTxData.userFeeLevel === 'custom' ||
fullTxData.userFeeLevel === CUSTOM_GAS_ESTIMATE ||
txParamsAreDappSuggested(fullTxData);
const fromAddressIsLedger = isAddressLedger(state, fromAddress);
const nativeCurrency = getNativeCurrency(state);

3
ui/pages/send/send-footer/send-footer.container.js
View File

@ -17,6 +17,7 @@ import {
import { getMostRecentOverviewPage } from '../../../ducks/history/history';
import { addHexPrefix } from '../../../../app/scripts/lib/util';
import { getSendToAccounts } from '../../../ducks/metamask/metamask';
import { CUSTOM_GAS_ESTIMATE } from '../../../../shared/constants/gas';
import SendFooter from './send-footer.component';
export default connect(mapStateToProps, mapDispatchToProps)(SendFooter);
@ -39,7 +40,7 @@ function mapStateToProps(state) {
const gasEstimateType =
activeButtonIndex >= 0
? gasButtonInfo[activeButtonIndex].gasEstimateType
: 'custom';
: CUSTOM_GAS_ESTIMATE;
return {
disabled: isSendFormInvalid(state),

5
ui/pages/swaps/swaps-gas-customization-modal/swaps-gas-customization-modal.component.js
View File

@ -7,6 +7,7 @@ import { sumHexWEIsToUnformattedFiat } from '../../../helpers/utils/conversions.
import AdvancedGasInputs from '../../../components/app/gas-customization/advanced-gas-inputs';
import BasicTabContent from '../../../components/app/gas-customization/gas-modal-page-container/basic-tab-content';
import { GAS_ESTIMATE_TYPES } from '../../../helpers/constants/common';
import { CUSTOM_GAS_ESTIMATE } from '../../../../shared/constants/gas';
export default class GasModalPageContainer extends Component {
static contextTypes = {
@ -99,11 +100,11 @@ export default class GasModalPageContainer extends Component {
<div className="advanced-tab__gas-inputs">
<AdvancedGasInputs
updateCustomGasPrice={(updatedPrice) => {
this.setState({ gasSpeedType: 'custom' });
this.setState({ gasSpeedType: CUSTOM_GAS_ESTIMATE });
setSwapsCustomizationModalPrice(updatedPrice);
}}
updateCustomGasLimit={(updatedLimit) => {
this.setState({ gasSpeedType: 'custom' });
this.setState({ gasSpeedType: CUSTOM_GAS_ESTIMATE });
setSwapsCustomizationModalLimit(updatedLimit);
}}
customGasPrice={customGasPrice}

3
ui/pages/swaps/view-quote/view-quote-price-difference.js
View File

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

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

@ -3,6 +3,7 @@ import { shallow } from 'enzyme';
import { Provider } from 'react-redux';
import configureMockStore from 'redux-mock-store';
import { NETWORK_TYPE_RPC } from '../../../../shared/constants/network';
import { GAS_RECOMMENDATIONS } from '../../../../shared/constants/gas';
import ViewQuotePriceDifference from './view-quote-price-difference';
describe('View Price Quote Difference', () => {
@ -48,7 +49,7 @@ describe('View Price Quote Difference', () => {
priceSlippage: {
ratio: 1.007876641534847,
calculationError: '',
bucket: 'low',
bucket: GAS_RECOMMENDATIONS.LOW,
sourceAmountInETH: 1,
destinationAmountInETH: 0.9921849150875727,
},
@ -113,7 +114,7 @@ describe('View Price Quote Difference', () => {
it('does not render when the item is in the low bucket', () => {
const props = { ...DEFAULT_PROPS };
props.usedQuote.priceSlippage.bucket = 'low';
props.usedQuote.priceSlippage.bucket = GAS_RECOMMENDATIONS.LOW;
renderComponent(props);
const wrappingDiv = component.find(
@ -124,18 +125,18 @@ describe('View Price Quote Difference', () => {
it('displays an error when in medium bucket', () => {
const props = { ...DEFAULT_PROPS };
props.usedQuote.priceSlippage.bucket = 'medium';
props.usedQuote.priceSlippage.bucket = GAS_RECOMMENDATIONS.MEDIUM;
renderComponent(props);
expect(component.html()).toContain('medium');
expect(component.html()).toContain(GAS_RECOMMENDATIONS.MEDIUM);
});
it('displays an error when in high bucket', () => {
const props = { ...DEFAULT_PROPS };
props.usedQuote.priceSlippage.bucket = 'high';
props.usedQuote.priceSlippage.bucket = GAS_RECOMMENDATIONS.HIGH;
renderComponent(props);
expect(component.html()).toContain('high');
expect(component.html()).toContain(GAS_RECOMMENDATIONS.HIGH);
});
it('displays a fiat error when calculationError is present', () => {
@ -144,6 +145,6 @@ describe('View Price Quote Difference', () => {
'Could not determine price.';
renderComponent(props);
expect(component.html()).toContain('high');
expect(component.html()).toContain(GAS_RECOMMENDATIONS.HIGH);
});
});

22
ui/pages/swaps/view-quote/view-quote.js
View File

@ -93,7 +93,10 @@ import {
} from '../swaps.util';
import { useTokenTracker } from '../../../hooks/useTokenTracker';
import { QUOTES_EXPIRED_ERROR } from '../../../../shared/constants/swaps';
import { EDIT_GAS_MODES } from '../../../../shared/constants/gas';
import {
EDIT_GAS_MODES,
GAS_RECOMMENDATIONS,
} from '../../../../shared/constants/gas';
import CountdownTimer from '../countdown-timer';
import SwapsFooter from '../swaps-footer';
import ViewQuotePriceDifference from './view-quote-price-difference';
@ -117,7 +120,10 @@ export default function ViewQuote() {
acknowledgedPriceDifference,
setAcknowledgedPriceDifference,
] = useState(false);
const priceDifferenceRiskyBuckets = ['high', 'medium'];
const priceDifferenceRiskyBuckets = [
GAS_RECOMMENDATIONS.HIGH,
GAS_RECOMMENDATIONS.MEDIUM,
];
const routeState = useSelector(getBackgroundSwapRouteState);
const quotes = useSelector(getQuotes, isEqual);
@ -163,8 +169,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('high', {
userFeeLevel: swapsUserFeeLevel || 'high',
gasFeeInputs = useGasFeeInputs(GAS_RECOMMENDATIONS.HIGH, {
userFeeLevel: swapsUserFeeLevel || GAS_RECOMMENDATIONS.HIGH,
});
}
@ -592,8 +598,8 @@ export default function ViewQuote() {
useEffect(() => {
if (
acknowledgedPriceDifference &&
lastPriceDifferenceBucket === 'medium' &&
priceSlippageBucket === 'high'
lastPriceDifferenceBucket === GAS_RECOMMENDATIONS.MEDIUM &&
priceSlippageBucket === GAS_RECOMMENDATIONS.HIGH
) {
setAcknowledgedPriceDifference(false);
}
@ -695,7 +701,7 @@ export default function ViewQuote() {
{showEditGasPopover && networkAndAccountSupports1559 && (
<EditGasPopover
transaction={{
userFeeLevel: swapsUserFeeLevel || 'high',
userFeeLevel: swapsUserFeeLevel || GAS_RECOMMENDATIONS.HIGH,
txParams: {
maxFeePerGas,
maxPriorityFeePerGas,
@ -703,7 +709,7 @@ export default function ViewQuote() {
},
}}
minimumGasLimit={usedGasLimit}
defaultEstimateToUse="high"
defaultEstimateToUse={GAS_RECOMMENDATIONS.HIGH}
mode={EDIT_GAS_MODES.SWAPS}
confirmButtonText={t('submit')}
onClose={onCloseEditGasPopover}

10
ui/selectors/confirm-transaction.js
View File

@ -17,7 +17,10 @@ import {
} from '../ducks/metamask/metamask';
import { TRANSACTION_ENVELOPE_TYPES } from '../../shared/constants/transaction';
import { decGWEIToHexWEI } from '../helpers/utils/conversions.util';
import { GAS_ESTIMATE_TYPES } from '../../shared/constants/gas';
import {
GAS_ESTIMATE_TYPES,
CUSTOM_GAS_ESTIMATE,
} from '../../shared/constants/gas';
import {
getMaximumGasTotalInHexWei,
getMinimumGasTotalInHexWei,
@ -258,12 +261,13 @@ export const transactionFeeSelector = function (state, txData) {
} = selectedGasEstimates;
gasEstimationObject.maxFeePerGas =
txData.txParams?.maxFeePerGas &&
(txData.userFeeLevel === 'custom' || !suggestedMaxFeePerGas)
(txData.userFeeLevel === CUSTOM_GAS_ESTIMATE || !suggestedMaxFeePerGas)
? txData.txParams?.maxFeePerGas
: decGWEIToHexWEI(suggestedMaxFeePerGas || gasPrice);
gasEstimationObject.maxPriorityFeePerGas =
txData.txParams?.maxPriorityFeePerGas &&
(txData.userFeeLevel === 'custom' || !suggestedMaxPriorityFeePerGas)
(txData.userFeeLevel === CUSTOM_GAS_ESTIMATE ||
!suggestedMaxPriorityFeePerGas)
? txData.txParams?.maxPriorityFeePerGas
: (suggestedMaxPriorityFeePerGas &&
decGWEIToHexWEI(suggestedMaxPriorityFeePerGas)) ||