- {#if symbolToIconMap[value.symbol]}
+
+ {#if symbolToIconMap[value.symbol] && !value.imported}
diff --git a/packages/bridge-ui-v2/src/components/TokenDropdown/symbolToIconMap.ts b/packages/bridge-ui-v2/src/components/TokenDropdown/symbolToIconMap.ts
index 0e580602bf8..f65cc874706 100644
--- a/packages/bridge-ui-v2/src/components/TokenDropdown/symbolToIconMap.ts
+++ b/packages/bridge-ui-v2/src/components/TokenDropdown/symbolToIconMap.ts
@@ -1,9 +1,24 @@
import type { ComponentType } from 'svelte';
-import { BllIcon, EthIcon, HorseIcon } from '$components/Icon';
+import { BllIcon, EthIcon, HorseIcon, TTKOIcon } from '$components/Icon';
-export const symbolToIconMap: Record = {
+export const baseSymbolToIconMap: Record = {
ETH: EthIcon,
BLL: BllIcon,
HORSE: HorseIcon,
};
+
+/**
+ * The TTKO symbol changes depending on the layer or testnet, we intercept it
+ * As we will only match configured tokens we don't need to worry
+ * about other tokens that might start with TTKO
+ * TODO: Remove once we are on mainnet?
+ */
+export const symbolToIconMap = new Proxy(baseSymbolToIconMap, {
+ get(target, prop: string) {
+ if (prop.startsWith('TTKO')) {
+ return TTKOIcon;
+ }
+ return target[prop] || null;
+ },
+});