- {formatCurrency(fiatTransactionTotal, currentCurrency)}
+ {useCurrencyRateCheck &&
+ formatCurrency(fiatTransactionTotal, currentCurrency)}
{`${ethTransactionTotal} ${nativeCurrency}`}
diff --git a/ui/pages/confirm-approve/confirm-approve-content/confirm-approve-content.component.test.js b/ui/pages/confirm-approve/confirm-approve-content/confirm-approve-content.component.test.js
index 647ec2b50..952a38af6 100644
--- a/ui/pages/confirm-approve/confirm-approve-content/confirm-approve-content.component.test.js
+++ b/ui/pages/confirm-approve/confirm-approve-content/confirm-approve-content.component.test.js
@@ -21,7 +21,7 @@ const props = {
showCustomizeGasModal: jest.fn(),
data: '0x095ea7b30000000000000000000000009bc5baf874d2da8d216ae9f137804184ee5afef40000000000000000000000000000000000000000000000000000000000011170',
toAddress: '0x9bc5baf874d2da8d216ae9f137804184ee5afef4',
- currentCurrency: 'TST',
+ currentCurrency: 'usd',
nativeCurrency: 'ETH',
ethTransactionTotal: '20',
fiatTransactionTotal: '10',
@@ -36,6 +36,7 @@ const props = {
chainId: '1337',
rpcPrefs: {},
isContract: true,
+ useCurrencyRateCheck: true,
};
describe('ConfirmApproveContent Component', () => {
@@ -69,6 +70,7 @@ describe('ConfirmApproveContent Component', () => {
queryByText('A fee is associated with this request.'),
).toBeInTheDocument();
expect(queryByText(`${props.ethTransactionTotal} ETH`)).toBeInTheDocument();
+ expect(queryByText(`$10.00`)).toBeInTheDocument();
fireEvent.click(editButtons[0]);
expect(props.showCustomizeGasModal).toHaveBeenCalledTimes(1);
@@ -98,10 +100,12 @@ describe('ConfirmApproveContent Component', () => {
});
it('should render Confirm approve page correctly and simulation error message without I want to procced anyway link', () => {
- props.userAcknowledgedGasMissing = true;
- props.renderSimulationFailureWarning = true;
const { queryByText, getByText, getAllByText, getByTestId } =
- renderComponent(props);
+ renderComponent({
+ ...props,
+ userAcknowledgedGasMissing: true,
+ renderSimulationFailureWarning: true,
+ });
expect(
queryByText('https://metamask.github.io/test-dapp/'),
).toBeInTheDocument();
@@ -158,10 +162,12 @@ describe('ConfirmApproveContent Component', () => {
});
it('should render Confirm approve page correctly and simulation error message with I want to procced anyway link', () => {
- props.userAcknowledgedGasMissing = false;
- props.renderSimulationFailureWarning = true;
const { queryByText, getByText, getAllByText, getByTestId } =
- renderComponent(props);
+ renderComponent({
+ ...props,
+ userAcknowledgedGasMissing: false,
+ renderSimulationFailureWarning: true,
+ });
expect(
queryByText('https://metamask.github.io/test-dapp/'),
).toBeInTheDocument();
@@ -216,4 +222,63 @@ describe('ConfirmApproveContent Component', () => {
),
).toBeInTheDocument();
});
+
+ it('should render Confirm approve page correctly when the fiat conversion is OFF', () => {
+ const { queryByText, getByText, getAllByText, getByTestId } =
+ renderComponent({ ...props, useCurrencyRateCheck: false });
+ expect(
+ queryByText('https://metamask.github.io/test-dapp/'),
+ ).toBeInTheDocument();
+ expect(getByTestId('confirm-approve-title').textContent).toStrictEqual(
+ ' Allow access to and transfer of your TestDappCollectibles (#1)? ',
+ );
+ expect(
+ queryByText(
+ 'This allows a third party to access and transfer the following NFTs without further notice until you revoke its access.',
+ ),
+ ).toBeInTheDocument();
+ expect(queryByText('Verify contract details')).toBeInTheDocument();
+ expect(
+ queryByText(
+ 'We were not able to estimate gas. There might be an error in the contract and this transaction may fail.',
+ ),
+ ).not.toBeInTheDocument();
+ expect(queryByText('I want to proceed anyway')).not.toBeInTheDocument();
+ expect(queryByText('View full transaction details')).toBeInTheDocument();
+
+ const editButtons = getAllByText('Edit');
+
+ expect(queryByText('Transaction fee')).toBeInTheDocument();
+ expect(
+ queryByText('A fee is associated with this request.'),
+ ).toBeInTheDocument();
+ expect(queryByText(`${props.ethTransactionTotal} ETH`)).toBeInTheDocument();
+ expect(queryByText(`$10.00`)).not.toBeInTheDocument();
+ fireEvent.click(editButtons[0]);
+ expect(props.showCustomizeGasModal).toHaveBeenCalledTimes(4);
+
+ expect(queryByText('Nonce')).toBeInTheDocument();
+ expect(queryByText('2')).toBeInTheDocument();
+ fireEvent.click(editButtons[1]);
+ expect(props.showCustomizeNonceModal).toHaveBeenCalledTimes(4);
+
+ const showViewTxDetails = getByText('View full transaction details');
+ expect(queryByText('Permission request')).not.toBeInTheDocument();
+ expect(queryByText('Approved asset:')).not.toBeInTheDocument();
+ expect(queryByText('Granted to:')).not.toBeInTheDocument();
+ expect(queryByText('Data')).not.toBeInTheDocument();
+ fireEvent.click(showViewTxDetails);
+ expect(getByText('Hide full transaction details')).toBeInTheDocument();
+ expect(getByText('Permission request')).toBeInTheDocument();
+ expect(getByText('Approved asset:')).toBeInTheDocument();
+ expect(getByText('Granted to:')).toBeInTheDocument();
+ expect(getByText('Contract (0x9bc5baF8...fEF4)')).toBeInTheDocument();
+ expect(getByText('Data')).toBeInTheDocument();
+ expect(getByText('Function: Approve')).toBeInTheDocument();
+ expect(
+ getByText(
+ '0x095ea7b30000000000000000000000009bc5baf874d2da8d216ae9f137804184ee5afef40000000000000000000000000000000000000000000000000000000000011170',
+ ),
+ ).toBeInTheDocument();
+ });
});
diff --git a/ui/pages/confirm-approve/confirm-approve.js b/ui/pages/confirm-approve/confirm-approve.js
index 493deef9f..6980d4862 100644
--- a/ui/pages/confirm-approve/confirm-approve.js
+++ b/ui/pages/confirm-approve/confirm-approve.js
@@ -27,6 +27,7 @@ import {
getRpcPrefsForCurrentProvider,
getIsMultiLayerFeeNetwork,
checkNetworkAndAccountSupports1559,
+ getUseCurrencyRateCheck,
} from '../../selectors';
import { useApproveTransaction } from '../../hooks/useApproveTransaction';
import { useSimulationFailureWarning } from '../../hooks/useSimulationFailureWarning';
@@ -81,6 +82,7 @@ export default function ConfirmApprove({
const fromAddressIsLedger = useSelector(
isAddressLedgerByFromAddress(userAddress),
);
+ const useCurrencyRateCheck = useSelector(getUseCurrencyRateCheck);
const [customPermissionAmount, setCustomPermissionAmount] = useState('');
const [submitWarning, setSubmitWarning] = useState('');
const [isContract, setIsContract] = useState(false);
@@ -287,6 +289,7 @@ export default function ConfirmApprove({
isContract={isContract}
isMultiLayerFeeNetwork={isMultiLayerFeeNetwork}
supportsEIP1559={supportsEIP1559}
+ useCurrencyRateCheck={useCurrencyRateCheck}
/>
{showCustomizeGasPopover && !supportsEIP1559 && (
{
return inputValue.replace(/,/gu, '.');
@@ -436,6 +438,7 @@ export default function TokenAllowance({
hexTransactionTotal={hexTransactionTotal}
fiatTransactionTotal={fiatTransactionTotal}
currentCurrency={currentCurrency}
+ useCurrencyRateCheck={useCurrencyRateCheck}
/>
)}
@@ -483,6 +486,7 @@ export default function TokenAllowance({
renderSimulationFailureWarning={renderSimulationFailureWarning}
isApprovalOrRejection={isApprovalOrRejection}
data={customTxParamsData || data}
+ useCurrencyRateCheck={useCurrencyRateCheck}
/>