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

gas fee details displayed on UI should be used gas estimates if available ()

This commit is contained in:
Jyoti Puri 2022-03-03 05:52:46 +05:30 committed by GitHub
parent b8fc1ae671
commit 6e8f4a6a76
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 38 additions and 49 deletions
ui
components/app
advanced-gas-fee-popover/advanced-gas-fee-inputs
base-fee-input
priority-fee-input
gas-details-item
hooks/gasFeeInput

View File

@ -60,24 +60,24 @@ describe('BaseFeeInput', () => {
it('should renders advancedGasFee.baseFee value if current estimate used is not custom', () => {
render({
userFeeLevel: 'high',
txParams: {
maxFeePerGas: '0x2E90EDD000',
},
});
expect(document.getElementsByTagName('input')[0]).toHaveValue(100);
});
it('should not advancedGasFee.baseFee value for swaps', () => {
it('should not use advancedGasFee.baseFee value for swaps', () => {
render(
{
userFeeLevel: 'high',
txParams: {
maxFeePerGas: '0x2E90EDD000',
},
},
{ editGasMode: EDIT_GAS_MODES.SWAPS },
);
expect(document.getElementsByTagName('input')[0]).toHaveValue(200);
expect(document.getElementsByTagName('input')[0]).toHaveValue(
parseInt(
mockEstimates[GAS_ESTIMATE_TYPES.FEE_MARKET].gasFeeEstimates.high
.suggestedMaxFeePerGas,
10,
),
);
});
it('should renders baseFee values from transaction if current estimate used is custom', () => {
@ -89,19 +89,11 @@ describe('BaseFeeInput', () => {
expect(document.getElementsByTagName('input')[0]).toHaveValue(200);
});
it('should show current value of estimatedBaseFee in subtext', () => {
render({
txParams: {
maxFeePerGas: '0x174876E800',
},
});
render();
expect(screen.queryByText('50 GWEI')).toBeInTheDocument();
});
it('should show 12hr range value in subtext', () => {
render({
txParams: {
maxFeePerGas: '0x174876E800',
},
});
render();
expect(screen.queryByText('50 - 100 GWEI')).toBeInTheDocument();
});
it('should show error if base fee is less than suggested low value', () => {
@ -120,7 +112,6 @@ describe('BaseFeeInput', () => {
target: { value: 50 },
});
});
it('should show error if base if is more than suggested high value', () => {
render({
txParams: {

View File

@ -60,26 +60,24 @@ describe('PriorityfeeInput', () => {
it('should renders advancedGasFee.priorityfee value if current estimate used is not custom', () => {
render({
userFeeLevel: 'high',
txParams: {
maxFeePerGas: '0x2E90EDD000',
},
});
expect(document.getElementsByTagName('input')[0]).toHaveValue(100);
});
it('should not advancedGasFee.baseFee value for swaps', () => {
it('should not use advancedGasFee.priorityfee value for swaps', () => {
render(
{
userFeeLevel: 'high',
txParams: {
maxFeePerGas: '0x2E90EDD000',
},
},
{ editGasMode: EDIT_GAS_MODES.SWAPS },
);
expect(document.getElementsByTagName('input')[0]).toHaveValue(200);
expect(document.getElementsByTagName('input')[0]).toHaveValue(
parseInt(
mockEstimates[GAS_ESTIMATE_TYPES.FEE_MARKET].gasFeeEstimates.high
.suggestedMaxPriorityFeePerGas,
10,
),
);
});
it('should renders priorityfee value from transaction if current estimate used is custom', () => {
render({
txParams: {
@ -89,19 +87,11 @@ describe('PriorityfeeInput', () => {
expect(document.getElementsByTagName('input')[0]).toHaveValue(2);
});
it('should show current priority fee range in subtext', () => {
render({
txParams: {
maxFeePerGas: '0x174876E800',
},
});
render();
expect(screen.queryByText('1 - 20 GWEI')).toBeInTheDocument();
});
it('should show 12hr range value in subtext', () => {
render({
txParams: {
maxFeePerGas: '0x174876E800',
},
});
render();
expect(screen.queryByText('2 - 125 GWEI')).toBeInTheDocument();
});
it('should show error if value entered is 0', () => {

View File

@ -5,7 +5,6 @@ import { useSelector } from 'react-redux';
import { COLORS } from '../../../helpers/constants/design-system';
import { PRIMARY, SECONDARY } from '../../../helpers/constants/common';
import { hexWEIToDecGWEI } from '../../../helpers/utils/conversions.util';
import { getPreferences } from '../../../selectors';
import { useGasFeeContext } from '../../../contexts/gasFee';
@ -23,7 +22,8 @@ const GasDetailsItem = ({ userAcknowledgedGasMissing = false }) => {
hasSimulationError,
maximumCostInHexWei: hexMaximumTransactionFee,
minimumCostInHexWei: hexMinimumTransactionFee,
transaction,
maxPriorityFeePerGas,
maxFeePerGas,
} = useGasFeeContext();
const { useNativeCurrencyAsPrimaryCurrency } = useSelector(getPreferences);
@ -90,10 +90,8 @@ const GasDetailsItem = ({ userAcknowledgedGasMissing = false }) => {
}
subTitle={
<GasTiming
maxPriorityFeePerGas={hexWEIToDecGWEI(
transaction.txParams.maxPriorityFeePerGas,
)}
maxFeePerGas={hexWEIToDecGWEI(transaction.txParams.maxFeePerGas)}
maxPriorityFeePerGas={maxPriorityFeePerGas}
maxFeePerGas={maxFeePerGas}
/>
}
/>

View File

@ -19,7 +19,10 @@ import { useCurrencyDisplay } from '../useCurrencyDisplay';
import { useUserPreferencedCurrency } from '../useUserPreferencedCurrency';
import { feeParamsAreCustom, getGasFeeEstimate } from './utils';
const getMaxFeePerGasFromTransaction = (transaction) => {
const getMaxFeePerGasFromTransaction = (transaction, gasFeeEstimates) => {
if (gasFeeEstimates?.[transaction?.userFeeLevel]) {
return gasFeeEstimates[transaction.userFeeLevel].suggestedMaxFeePerGas;
}
const { maxFeePerGas, gasPrice } = transaction?.txParams || {};
return Number(hexWEIToDecGWEI(maxFeePerGas || gasPrice));
};
@ -64,7 +67,7 @@ export function useMaxFeePerGasInput({
const showFiat = useSelector(getShouldShowFiat);
const initialMaxFeePerGas = supportsEIP1559
? getMaxFeePerGasFromTransaction(transaction)
? getMaxFeePerGasFromTransaction(transaction, gasFeeEstimates)
: 0;
// This hook keeps track of a few pieces of transitional state. It is

View File

@ -16,7 +16,14 @@ import { useCurrencyDisplay } from '../useCurrencyDisplay';
import { useUserPreferencedCurrency } from '../useUserPreferencedCurrency';
import { feeParamsAreCustom, getGasFeeEstimate } from './utils';
const getMaxPriorityFeePerGasFromTransaction = (transaction) => {
const getMaxPriorityFeePerGasFromTransaction = (
transaction,
gasFeeEstimates,
) => {
if (gasFeeEstimates?.[transaction?.userFeeLevel]) {
return gasFeeEstimates[transaction.userFeeLevel]
.suggestedMaxPriorityFeePerGas;
}
const { maxPriorityFeePerGas, maxFeePerGas, gasPrice } =
transaction?.txParams || {};
return Number(
@ -64,7 +71,7 @@ export function useMaxPriorityFeePerGasInput({
const showFiat = useSelector(getShouldShowFiat);
const initialMaxPriorityFeePerGas = supportsEIP1559
? getMaxPriorityFeePerGasFromTransaction(transaction)
? getMaxPriorityFeePerGasFromTransaction(transaction, gasFeeEstimates)
: 0;
const [maxPriorityFeePerGas, setMaxPriorityFeePerGas] = useState(() => {