From 2265990573302f5ebe7a566e30f27edb3661748f Mon Sep 17 00:00:00 2001 From: Korbinian Kasberger Date: Wed, 20 Sep 2023 09:21:08 +0200 Subject: [PATCH 1/2] add ttko symbol matching --- .../src/components/Icon/TTKO.svelte | 21 +++++++++++++++++++ .../bridge-ui-v2/src/components/Icon/index.ts | 1 + .../TokenDropdown/DialogView.svelte | 12 ++++++++--- .../TokenDropdown/DropdownView.svelte | 3 ++- .../TokenDropdown/TokenDropdown.svelte | 3 ++- .../TokenDropdown/symbolToIconMap.ts | 20 ++++++++++++++++-- 6 files changed, 53 insertions(+), 7 deletions(-) create mode 100644 packages/bridge-ui-v2/src/components/Icon/TTKO.svelte diff --git a/packages/bridge-ui-v2/src/components/Icon/TTKO.svelte b/packages/bridge-ui-v2/src/components/Icon/TTKO.svelte new file mode 100644 index 00000000000..19867f9c771 --- /dev/null +++ b/packages/bridge-ui-v2/src/components/Icon/TTKO.svelte @@ -0,0 +1,21 @@ + + + + + + + diff --git a/packages/bridge-ui-v2/src/components/Icon/index.ts b/packages/bridge-ui-v2/src/components/Icon/index.ts index 8916c451589..06a1af8f9b9 100644 --- a/packages/bridge-ui-v2/src/components/Icon/index.ts +++ b/packages/bridge-ui-v2/src/components/Icon/index.ts @@ -2,3 +2,4 @@ export { default as BllIcon } from './BLL.svelte'; export { default as EthIcon } from './ETH.svelte'; export { default as HorseIcon } from './HORSE.svelte'; export { default as Icon, type IconType } from './Icon.svelte'; +export { default as TTKOIcon } from './TTKO.svelte'; diff --git a/packages/bridge-ui-v2/src/components/TokenDropdown/DialogView.svelte b/packages/bridge-ui-v2/src/components/TokenDropdown/DialogView.svelte index 24556803cb2..de82f7765ca 100644 --- a/packages/bridge-ui-v2/src/components/TokenDropdown/DialogView.svelte +++ b/packages/bridge-ui-v2/src/components/TokenDropdown/DialogView.svelte @@ -77,9 +77,15 @@ class:bg-tertiary-interactive-accent={selected} on:click={() => selectToken(token)}>
- - - + {#if symbolToIconMap[token.symbol] && !token.imported} + + + + {:else} + + + + {/if} {token.symbol}
diff --git a/packages/bridge-ui-v2/src/components/TokenDropdown/DropdownView.svelte b/packages/bridge-ui-v2/src/components/TokenDropdown/DropdownView.svelte index f6d4f3d409d..993c0740edb 100644 --- a/packages/bridge-ui-v2/src/components/TokenDropdown/DropdownView.svelte +++ b/packages/bridge-ui-v2/src/components/TokenDropdown/DropdownView.svelte @@ -69,7 +69,8 @@ on:click={() => selectToken(t)} on:keydown={getTokenKeydownHandler(t)}>
- {#if symbolToIconMap[t.symbol]} + + {#if symbolToIconMap[t.symbol] && !t.imported} diff --git a/packages/bridge-ui-v2/src/components/TokenDropdown/TokenDropdown.svelte b/packages/bridge-ui-v2/src/components/TokenDropdown/TokenDropdown.svelte index 8f66fc22534..afd9269088d 100644 --- a/packages/bridge-ui-v2/src/components/TokenDropdown/TokenDropdown.svelte +++ b/packages/bridge-ui-v2/src/components/TokenDropdown/TokenDropdown.svelte @@ -132,7 +132,8 @@ {/if} {#if value}
- {#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..7322135ca10 100644 --- a/packages/bridge-ui-v2/src/components/TokenDropdown/symbolToIconMap.ts +++ b/packages/bridge-ui-v2/src/components/TokenDropdown/symbolToIconMap.ts @@ -1,9 +1,25 @@ + 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; + } +}); \ No newline at end of file From 36d73f929253d3a7483649fcbfe21194ce888bae Mon Sep 17 00:00:00 2001 From: Korbinian Kasberger Date: Wed, 20 Sep 2023 09:27:18 +0200 Subject: [PATCH 2/2] linting --- .../src/components/TokenDropdown/symbolToIconMap.ts | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/packages/bridge-ui-v2/src/components/TokenDropdown/symbolToIconMap.ts b/packages/bridge-ui-v2/src/components/TokenDropdown/symbolToIconMap.ts index 7322135ca10..f65cc874706 100644 --- a/packages/bridge-ui-v2/src/components/TokenDropdown/symbolToIconMap.ts +++ b/packages/bridge-ui-v2/src/components/TokenDropdown/symbolToIconMap.ts @@ -1,4 +1,3 @@ - import type { ComponentType } from 'svelte'; import { BllIcon, EthIcon, HorseIcon, TTKOIcon } from '$components/Icon'; @@ -9,10 +8,10 @@ export const baseSymbolToIconMap: Record = { 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 + * about other tokens that might start with TTKO * TODO: Remove once we are on mainnet? */ export const symbolToIconMap = new Proxy(baseSymbolToIconMap, { @@ -21,5 +20,5 @@ export const symbolToIconMap = new Proxy(baseSymbolToIconMap, { return TTKOIcon; } return target[prop] || null; - } -}); \ No newline at end of file + }, +});