From 9d30b6c703464f4a7382f51d6f1ecb86f2459f22 Mon Sep 17 00:00:00 2001
From: isstuev <isstuev@gmail.com>
Date: Fri, 31 Jan 2025 17:29:44 +0100
Subject: [PATCH 1/2] Create new Type to show DEX tag in summary header

---
 types/api/txInterpretation.ts                 | 16 +++++++--
 .../tx/interpretation/TxInterpretation.tsx    | 35 ++++++++++++++++++-
 2 files changed, 48 insertions(+), 3 deletions(-)

diff --git a/types/api/txInterpretation.ts b/types/api/txInterpretation.ts
index 062dc03cc0..4287d1f8c6 100644
--- a/types/api/txInterpretation.ts
+++ b/types/api/txInterpretation.ts
@@ -19,9 +19,10 @@ export type TxInterpretationVariable =
   TxInterpretationVariableToken |
   TxInterpretationVariableAddress |
   TxInterpretationVariableDomain |
-  TxInterpretationVariableMethod;
+  TxInterpretationVariableMethod |
+  TxInterpretationVariableDex;
 
-export type TxInterpretationVariableType = 'string' | 'currency' | 'timestamp' | 'token' | 'address' | 'domain' | 'method';
+export type TxInterpretationVariableType = 'string' | 'currency' | 'timestamp' | 'token' | 'address' | 'domain' | 'method' | 'dexTag';
 
 export type TxInterpretationVariableString = {
   type: 'string';
@@ -57,3 +58,14 @@ export type TxInterpretationVariableMethod = {
   type: 'method';
   value: string;
 };
+
+export type TxInterpretationVariableDex = {
+  type: 'dexTag';
+  value: {
+    name: string;
+    icon: string;
+    url: string;
+    app_id?: string;
+    app_icon?: string;
+  };
+};
diff --git a/ui/shared/tx/interpretation/TxInterpretation.tsx b/ui/shared/tx/interpretation/TxInterpretation.tsx
index e00322f9a3..4eaa2d2326 100644
--- a/ui/shared/tx/interpretation/TxInterpretation.tsx
+++ b/ui/shared/tx/interpretation/TxInterpretation.tsx
@@ -1,4 +1,4 @@
-import { Tooltip, chakra } from '@chakra-ui/react';
+import { Tooltip, Image, chakra } from '@chakra-ui/react';
 import BigNumber from 'bignumber.js';
 import React from 'react';
 
@@ -9,6 +9,8 @@ import type {
   TxInterpretationVariableString,
 } from 'types/api/txInterpretation';
 
+import { route } from 'nextjs-routes';
+
 import config from 'configs/app';
 import dayjs from 'lib/date/dayjs';
 import * as mixpanel from 'lib/mixpanel/index';
@@ -19,6 +21,8 @@ import AddressEntity from 'ui/shared/entities/address/AddressEntity';
 import EnsEntity from 'ui/shared/entities/ens/EnsEntity';
 import TokenEntity from 'ui/shared/entities/token/TokenEntity';
 import IconSvg from 'ui/shared/IconSvg';
+import LinkExternal from 'ui/shared/links/LinkExternal';
+import LinkInternal from 'ui/shared/links/LinkInternal';
 
 import {
   extractVariables,
@@ -134,6 +138,35 @@ const TxInterpretationElementByType = (
         </Tag>
       );
     }
+    case 'dexTag': {
+      const icon = value.app_icon || value.icon;
+      const name = (() => {
+        if (value.app_id && config.features.marketplace.isEnabled) {
+          return (
+            <LinkInternal
+              href={ route({ pathname: '/apps/[id]', query: { id: value.app_id } }) }
+            >
+              { value.name }
+            </LinkInternal>
+          );
+        }
+        if (value.url) {
+          return (
+            <LinkExternal href={ value.url }>
+              { value.name }
+            </LinkExternal>
+          );
+        }
+        return value.name;
+      })();
+
+      return (
+        <chakra.span display="inline-flex" alignItems="center" verticalAlign="top" _notFirst={{ marginLeft: 1 }} gap={ 1 }>
+          { icon && <Image src={ icon } alt={ value.name } width={ 5 } height={ 5 }/> }
+          { name }
+        </chakra.span>
+      );
+    }
   }
 };
 

From 4c18d747cd1b2ae1ff04dd699f7ec44949f3e1d0 Mon Sep 17 00:00:00 2001
From: isstuev <isstuev@gmail.com>
Date: Fri, 31 Jan 2025 17:45:20 +0100
Subject: [PATCH 2/2] Add new response variable for interpreter

---
 types/api/txInterpretation.ts                 | 20 ++++++++++++++++++-
 .../tx/interpretation/TxInterpretation.tsx    |  3 +++
 2 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/types/api/txInterpretation.ts b/types/api/txInterpretation.ts
index 4287d1f8c6..06d92f584f 100644
--- a/types/api/txInterpretation.ts
+++ b/types/api/txInterpretation.ts
@@ -16,13 +16,23 @@ export type TxInterpretationVariable =
   TxInterpretationVariableString |
   TxInterpretationVariableCurrency |
   TxInterpretationVariableTimestamp |
+  TxInterpretationVariableExternalLink |
   TxInterpretationVariableToken |
   TxInterpretationVariableAddress |
   TxInterpretationVariableDomain |
   TxInterpretationVariableMethod |
   TxInterpretationVariableDex;
 
-export type TxInterpretationVariableType = 'string' | 'currency' | 'timestamp' | 'token' | 'address' | 'domain' | 'method' | 'dexTag';
+export type TxInterpretationVariableType =
+  'string' |
+  'currency' |
+  'timestamp' |
+  'external_link' |
+  'token' |
+  'address' |
+  'domain' |
+  'method' |
+  'dexTag';
 
 export type TxInterpretationVariableString = {
   type: 'string';
@@ -39,6 +49,14 @@ export type TxInterpretationVariableTimestamp = {
   value: string;
 };
 
+export type TxInterpretationVariableExternalLink = {
+  type: 'external_link';
+  value: {
+    name: string;
+    link: string;
+  };
+};
+
 export type TxInterpretationVariableToken = {
   type: 'token';
   value: TokenInfo;
diff --git a/ui/shared/tx/interpretation/TxInterpretation.tsx b/ui/shared/tx/interpretation/TxInterpretation.tsx
index 4eaa2d2326..aec4c14147 100644
--- a/ui/shared/tx/interpretation/TxInterpretation.tsx
+++ b/ui/shared/tx/interpretation/TxInterpretation.tsx
@@ -125,6 +125,9 @@ const TxInterpretationElementByType = (
     case 'timestamp': {
       return <chakra.span color="text_secondary" whiteSpace="pre">{ dayjs(Number(value) * 1000).format('MMM DD YYYY') }</chakra.span>;
     }
+    case 'external_link': {
+      return <LinkExternal href={ value.link }>{ value.name }</LinkExternal>;
+    }
     case 'method': {
       return (
         <Tag