Skip to content

Commit 42d2ece

Browse files
committed
Ensure that the correct default currency symbols are used for fees on the view quote screen
1 parent d8fd4b8 commit 42d2ece

File tree

5 files changed

+65
-26
lines changed

5 files changed

+65
-26
lines changed

ui/app/helpers/utils/formatters.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1-
export function formatETHFee(ethFee) {
2-
return `${ethFee} ETH`;
1+
// TODO: Rename to reflect that this function is used for more cases than ETH, and update all uses.
2+
export function formatETHFee(ethFee, currencySymbol = 'ETH') {
3+
return `${ethFee} ${currencySymbol}`;
34
}

ui/app/pages/swaps/swaps-gas-customization-modal/swaps-gas-customization-modal.container.js

Lines changed: 26 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,8 @@ import {
88
getDefaultActiveButtonIndex,
99
getRenderableGasButtonData,
1010
getUSDConversionRate,
11+
getNativeCurrency,
12+
getSwapsDefaultToken,
1113
} from '../../../selectors';
1214

1315
import {
@@ -21,7 +23,6 @@ import {
2123
shouldShowCustomPriceTooLowWarning,
2224
swapCustomGasModalClosed,
2325
} from '../../../ducks/swaps/swaps';
24-
2526
import {
2627
addHexes,
2728
getValueFromWeiHex,
@@ -34,6 +35,9 @@ import SwapsGasCustomizationModalComponent from './swaps-gas-customization-modal
3435
const mapStateToProps = (state) => {
3536
const currentCurrency = getCurrentCurrency(state);
3637
const conversionRate = getConversionRate(state);
38+
const nativeCurrencySymbol = getNativeCurrency(state);
39+
const { symbol: swapsDefaultCurrencySymbol } = getSwapsDefaultToken(state);
40+
const usedCurrencySymbol = nativeCurrencySymbol || swapsDefaultCurrencySymbol;
3741

3842
const { modalState: { props: modalProps } = {} } = state.appState.modal || {};
3943
const {
@@ -63,6 +67,7 @@ const mapStateToProps = (state) => {
6367
true,
6468
conversionRate,
6569
currentCurrency,
70+
usedCurrencySymbol,
6671
);
6772
const gasButtonInfo = [averageEstimateData, fastEstimateData];
6873

@@ -74,13 +79,15 @@ const mapStateToProps = (state) => {
7479

7580
const balance = getCurrentEthBalance(state);
7681

77-
const newTotalEth = sumHexWEIsToRenderableEth([
78-
value,
79-
customGasTotal,
80-
customTotalSupplement,
81-
]);
82+
const newTotalEth = sumHexWEIsToRenderableEth(
83+
[value, customGasTotal, customTotalSupplement],
84+
usedCurrencySymbol,
85+
);
8286

83-
const sendAmount = sumHexWEIsToRenderableEth([value, '0x0']);
87+
const sendAmount = sumHexWEIsToRenderableEth(
88+
[value, '0x0'],
89+
usedCurrencySymbol,
90+
);
8491

8592
const insufficientBalance = !isBalanceSufficient({
8693
amount: value,
@@ -112,14 +119,16 @@ const mapStateToProps = (state) => {
112119
currentCurrency,
113120
conversionRate,
114121
),
115-
originalTotalEth: sumHexWEIsToRenderableEth([
116-
value,
117-
customGasTotal,
118-
customTotalSupplement,
119-
]),
122+
originalTotalEth: sumHexWEIsToRenderableEth(
123+
[value, customGasTotal, customTotalSupplement],
124+
usedCurrencySymbol,
125+
),
120126
newTotalFiat,
121127
newTotalEth,
122-
transactionFee: sumHexWEIsToRenderableEth(['0x0', customGasTotal]),
128+
transactionFee: sumHexWEIsToRenderableEth(
129+
['0x0', customGasTotal],
130+
usedCurrencySymbol,
131+
),
123132
sendAmount,
124133
extraInfoRow,
125134
},
@@ -158,13 +167,15 @@ export default connect(
158167
mapDispatchToProps,
159168
)(SwapsGasCustomizationModalComponent);
160169

161-
function sumHexWEIsToRenderableEth(hexWEIs) {
170+
function sumHexWEIsToRenderableEth(hexWEIs, currencySymbol = 'ETH') {
162171
const hexWEIsSum = hexWEIs.filter(Boolean).reduce(addHexes);
163172
return formatETHFee(
164173
getValueFromWeiHex({
165174
value: hexWEIsSum,
166-
toCurrency: 'ETH',
175+
fromCurrency: currencySymbol,
176+
toCurrency: currencySymbol,
167177
numberOfDecimals: 6,
168178
}),
179+
currencySymbol,
169180
);
170181
}

ui/app/pages/swaps/swaps.util.js

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -427,6 +427,7 @@ export function getRenderableNetworkFeesForQuote({
427427
sourceSymbol,
428428
sourceAmount,
429429
chainId,
430+
nativeCurrencySymbol,
430431
}) {
431432
const totalGasLimitForCalculation = new BigNumber(tradeGas || '0x0', 16)
432433
.plus(approveGas || '0x0', 16)
@@ -456,11 +457,15 @@ export function getRenderableNetworkFeesForQuote({
456457
numberOfDecimals: 2,
457458
});
458459
const formattedNetworkFee = formatCurrency(rawNetworkFees, currentCurrency);
460+
461+
const chainCurrencySymbolToUse =
462+
nativeCurrencySymbol || SWAPS_CHAINID_DEFAULT_TOKEN_MAP[chainId].symbol;
463+
459464
return {
460465
rawNetworkFees,
461466
rawEthFee: ethFee,
462467
feeInFiat: formattedNetworkFee,
463-
feeInEth: `${ethFee} ${SWAPS_CHAINID_DEFAULT_TOKEN_MAP[chainId].symbol}`,
468+
feeInEth: `${ethFee} ${chainCurrencySymbolToUse}`,
464469
nonGasFee,
465470
};
466471
}

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

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,7 @@ import {
3838
getTokenExchangeRates,
3939
getSwapsDefaultToken,
4040
getCurrentChainId,
41+
getNativeCurrency,
4142
} from '../../../selectors';
4243
import { toPrecisionWithoutTrailingZeros } from '../../../helpers/utils/util';
4344
import { getTokens } from '../../../ducks/metamask/metamask';
@@ -128,6 +129,7 @@ export default function ViewQuote() {
128129
const swapsQuoteRefreshTime = useSelector(getSwapsQuoteRefreshTime);
129130
const defaultSwapsToken = useSelector(getSwapsDefaultToken);
130131
const chainId = useSelector(getCurrentChainId);
132+
const nativeCurrencySymbol = useSelector(getNativeCurrency);
131133

132134
const { isBestQuote } = usedQuote;
133135

@@ -223,6 +225,7 @@ export default function ViewQuote() {
223225
sourceSymbol: sourceTokenSymbol,
224226
sourceAmount: usedQuote.sourceAmount,
225227
chainId,
228+
nativeCurrencySymbol,
226229
});
227230

228231
const {
@@ -239,6 +242,7 @@ export default function ViewQuote() {
239242
sourceSymbol: sourceTokenSymbol,
240243
sourceAmount: usedQuote.sourceAmount,
241244
chainId,
245+
nativeCurrencySymbol,
242246
});
243247

244248
const tokenCost = new BigNumber(usedQuote.sourceAmount);

ui/app/selectors/custom-gas.js

Lines changed: 26 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -134,13 +134,18 @@ export function basicPriceEstimateToETHTotal(
134134
});
135135
}
136136

137-
export function getRenderableEthFee(estimate, gasLimit, numberOfDecimals = 9) {
137+
export function getRenderableEthFee(
138+
estimate,
139+
gasLimit,
140+
numberOfDecimals = 9,
141+
nativeCurrency = 'ETH',
142+
) {
138143
const value = conversionUtil(estimate, {
139144
fromNumericBase: 'dec',
140145
toNumericBase: 'hex',
141146
});
142147
const fee = basicPriceEstimateToETHTotal(value, gasLimit, numberOfDecimals);
143-
return formatETHFee(fee);
148+
return formatETHFee(fee, nativeCurrency);
144149
}
145150

146151
export function getRenderableConvertedCurrencyFee(
@@ -186,12 +191,18 @@ export function getRenderableGasButtonData(
186191
showFiat,
187192
conversionRate,
188193
currentCurrency,
194+
nativeCurrency,
189195
) {
190196
const { safeLow, average, fast } = estimates;
191197

192198
const slowEstimateData = {
193199
gasEstimateType: GAS_ESTIMATE_TYPES.SLOW,
194-
feeInPrimaryCurrency: getRenderableEthFee(safeLow, gasLimit),
200+
feeInPrimaryCurrency: getRenderableEthFee(
201+
safeLow,
202+
gasLimit,
203+
9,
204+
nativeCurrency,
205+
),
195206
feeInSecondaryCurrency: showFiat
196207
? getRenderableConvertedCurrencyFee(
197208
safeLow,
@@ -204,7 +215,12 @@ export function getRenderableGasButtonData(
204215
};
205216
const averageEstimateData = {
206217
gasEstimateType: GAS_ESTIMATE_TYPES.AVERAGE,
207-
feeInPrimaryCurrency: getRenderableEthFee(average, gasLimit),
218+
feeInPrimaryCurrency: getRenderableEthFee(
219+
average,
220+
gasLimit,
221+
9,
222+
nativeCurrency,
223+
),
208224
feeInSecondaryCurrency: showFiat
209225
? getRenderableConvertedCurrencyFee(
210226
average,
@@ -217,7 +233,12 @@ export function getRenderableGasButtonData(
217233
};
218234
const fastEstimateData = {
219235
gasEstimateType: GAS_ESTIMATE_TYPES.FAST,
220-
feeInPrimaryCurrency: getRenderableEthFee(fast, gasLimit),
236+
feeInPrimaryCurrency: getRenderableEthFee(
237+
fast,
238+
gasLimit,
239+
9,
240+
nativeCurrency,
241+
),
221242
feeInSecondaryCurrency: showFiat
222243
? getRenderableConvertedCurrencyFee(
223244
fast,
@@ -295,7 +316,6 @@ export function getRenderableEstimateDataForSmallButtonsFromGWEI(state) {
295316
safeLow,
296317
gasLimit,
297318
NUMBER_OF_DECIMALS_SM_BTNS,
298-
true,
299319
),
300320
priceInHexWei: getGasPriceInHexWei(safeLow, true),
301321
},
@@ -313,7 +333,6 @@ export function getRenderableEstimateDataForSmallButtonsFromGWEI(state) {
313333
average,
314334
gasLimit,
315335
NUMBER_OF_DECIMALS_SM_BTNS,
316-
true,
317336
),
318337
priceInHexWei: getGasPriceInHexWei(average, true),
319338
},
@@ -331,7 +350,6 @@ export function getRenderableEstimateDataForSmallButtonsFromGWEI(state) {
331350
fast,
332351
gasLimit,
333352
NUMBER_OF_DECIMALS_SM_BTNS,
334-
true,
335353
),
336354
priceInHexWei: getGasPriceInHexWei(fast, true),
337355
},

0 commit comments

Comments
 (0)