diff --git a/ui/shared/tx/interpretation/TxInterpretation.tsx b/ui/shared/tx/interpretation/TxInterpretation.tsx
index 479bcee08b..4bce4e28f3 100644
--- a/ui/shared/tx/interpretation/TxInterpretation.tsx
+++ b/ui/shared/tx/interpretation/TxInterpretation.tsx
@@ -19,7 +19,14 @@ import EnsEntity from 'ui/shared/entities/ens/EnsEntity';
import TokenEntity from 'ui/shared/entities/token/TokenEntity';
import IconSvg from 'ui/shared/IconSvg';
-import { extractVariables, getStringChunks, fillStringVariables, checkSummary, NATIVE_COIN_SYMBOL_VAR_NAME } from './utils';
+import {
+ extractVariables,
+ getStringChunks,
+ fillStringVariables,
+ checkSummary,
+ NATIVE_COIN_SYMBOL_VAR_NAME,
+ WEI_VAR_NAME,
+} from './utils';
type Props = {
summary?: TxInterpretationSummary;
@@ -152,19 +159,23 @@ const TxInterpretation = ({ summary, isLoading, addressDataMap, className }: Pro
{ chunks.map((chunk, index) => {
+ let content = null;
+ if (variablesNames[index] === NATIVE_COIN_SYMBOL_VAR_NAME) {
+ content = { currencyUnits.ether + ' ' };
+ } else if (variablesNames[index] === WEI_VAR_NAME) {
+ content = { currencyUnits.wei + ' ' };
+ } else {
+ content = (
+
+ );
+ }
return (
{ chunk.trim() + (chunk.trim() && variablesNames[index] ? ' ' : '') }
- { index < variablesNames.length && (
- variablesNames[index] === NATIVE_COIN_SYMBOL_VAR_NAME ?
- { currencyUnits.ether + ' ' } :
- (
-
- )
- ) }
+ { index < variablesNames.length && content }
);
}) }
diff --git a/ui/shared/tx/interpretation/utils.test.ts b/ui/shared/tx/interpretation/utils.test.ts
index f60532cb12..f54357ec2f 100644
--- a/ui/shared/tx/interpretation/utils.test.ts
+++ b/ui/shared/tx/interpretation/utils.test.ts
@@ -13,7 +13,7 @@ it('split string without capturing variables', () => {
});
it('checks that summary is valid', () => {
- const result = checkSummary('{foo} {native} {bar}', { foo: { type: 'string', value: 'foo' }, bar: { type: 'string', value: 'bar' } });
+ const result = checkSummary('{foo} {native} {bar} {wei}', { foo: { type: 'string', value: 'foo' }, bar: { type: 'string', value: 'bar' } });
expect(result).toBe(true);
});
diff --git a/ui/shared/tx/interpretation/utils.ts b/ui/shared/tx/interpretation/utils.ts
index bf480f3f8b..28e3d4b71d 100644
--- a/ui/shared/tx/interpretation/utils.ts
+++ b/ui/shared/tx/interpretation/utils.ts
@@ -6,6 +6,7 @@ import type { TxInterpretationVariable } from 'types/api/txInterpretation';
export const VAR_REGEXP = /\{(?:[^}]+)\}/g;
export const NATIVE_COIN_SYMBOL_VAR_NAME = 'native';
+export const WEI_VAR_NAME = 'wei';
export function extractVariables(templateString: string) {
@@ -24,7 +25,7 @@ export function checkSummary(template: string, variables: Record