Merge branch 'main' into refactor/extracting-save-service-from-add-er…

…c20-token
dfinity · Jun 21, 2024 · 37317dc · 37317dc
2 parents 85c70bb + 881f651
commit 37317dc
Show file tree

Hide file tree

Showing 7 changed files with 86 additions and 6 deletions.
diff --git a/scripts/build.tokens.ckerc20.mjs b/scripts/build.tokens.ckerc20.mjs
@@ -24,7 +24,10 @@ const orchestratorInfo = async ({ orchestratorId: canisterId }) => {
 const buildOrchestratorInfo = async (orchestratorId) => {
 	const { managed_canisters } = await orchestratorInfo({ orchestratorId });
 
-	const mapManagedCanisters = (acc, { ledger, index, ckerc20_token_symbol }) => {
+	const mapManagedCanisters = (
+		acc,
+		{ ledger, index, ckerc20_token_symbol, erc20_contract: { address: erc20ContractAddress } }
+	) => {
 		const ledgerCanister = fromNullable(ledger);
 		const indexCanister = fromNullable(index);
 
@@ -44,7 +47,8 @@ const buildOrchestratorInfo = async (orchestratorId) => {
 				...(acc[ckerc20_token_symbol] ?? []),
 				{
 					ledgerCanisterId: ledgerCanisterId.toText(),
-					indexCanisterId: indexCanisterId.toText()
+					indexCanisterId: indexCanisterId.toText(),
+					erc20ContractAddress
 				}
 			]
 		};

diff --git a/src/frontend/src/env/tokens.ckerc20.json b/src/frontend/src/env/tokens.ckerc20.json
@@ -1 +1 @@
-{"production":{"ckLINK":{"ledgerCanisterId":"g4tto-rqaaa-aaaar-qageq-cai","indexCanisterId":"gvqys-hyaaa-aaaar-qagfa-cai"},"ckUSDC":{"ledgerCanisterId":"xevnm-gaaaa-aaaar-qafnq-cai","indexCanisterId":"xrs4b-hiaaa-aaaar-qafoa-cai"}},"staging":{"ckSepoliaUSDC":{"ledgerCanisterId":"yfumr-cyaaa-aaaar-qaela-cai","indexCanisterId":"ycvkf-paaaa-aaaar-qaelq-cai"},"ckSepoliaPEPE":{"ledgerCanisterId":"hw4ru-taaaa-aaaar-qagdq-cai","indexCanisterId":"g3sv2-4iaaa-aaaar-qagea-cai"},"ckSepoliaLINK":{"ledgerCanisterId":"r52mc-qaaaa-aaaar-qafzq-cai","indexCanisterId":"ri55p-riaaa-aaaar-qaf2a-cai"}}}
+{"production":{"ckLINK":{"ledgerCanisterId":"g4tto-rqaaa-aaaar-qageq-cai","indexCanisterId":"gvqys-hyaaa-aaaar-qagfa-cai","erc20ContractAddress":"0x514910771AF9Ca656af840dff83E8264EcF986CA"},"ckUSDC":{"ledgerCanisterId":"xevnm-gaaaa-aaaar-qafnq-cai","indexCanisterId":"xrs4b-hiaaa-aaaar-qafoa-cai","erc20ContractAddress":"0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48"}},"staging":{"ckSepoliaUSDC":{"ledgerCanisterId":"yfumr-cyaaa-aaaar-qaela-cai","indexCanisterId":"ycvkf-paaaa-aaaar-qaelq-cai","erc20ContractAddress":"0x1c7D4B196Cb0C7B01d743Fbc6116a902379C7238"},"ckSepoliaPEPE":{"ledgerCanisterId":"hw4ru-taaaa-aaaar-qagdq-cai","indexCanisterId":"g3sv2-4iaaa-aaaar-qagea-cai","erc20ContractAddress":"0x560eF9F39E4B08f9693987cad307f6FBfd97B2F6"},"ckSepoliaLINK":{"ledgerCanisterId":"r52mc-qaaaa-aaaar-qafzq-cai","indexCanisterId":"ri55p-riaaa-aaaar-qaf2a-cai","erc20ContractAddress":"0x779877A7B0D9E8603169DdbD7836e478b4624789"}}}
diff --git a/src/frontend/src/icp-eth/components/tokens/AddTokenByNetwork.svelte b/src/frontend/src/icp-eth/components/tokens/AddTokenByNetwork.svelte
@@ -0,0 +1,66 @@
+<script lang="ts">
+	import { i18n } from '$lib/stores/i18n.store';
+	import { Dropdown, DropdownItem } from '@dfinity/gix-components';
+	import { networks } from '$lib/derived/networks.derived';
+	import IcAddTokenForm from '$icp/components/tokens/IcAddTokenForm.svelte';
+	import AddTokenForm from '$eth/components/tokens/AddTokenForm.svelte';
+	import { fade } from 'svelte/transition';
+	import type { Network } from '$lib/types/network';
+	import { nonNullish } from '@dfinity/utils';
+	import { isNetworkIdICP } from '$lib/utils/network.utils';
+	import { isNetworkIdEthereum } from '$lib/utils/network.utils.js';
+
+	export let network: Network | undefined;
+	export let tokenData: Record<string, string>;
+
+	let networkName: string | undefined = network?.name;
+	$: networkName,
+		(network = nonNullish(networkName)
+			? $networks.find(({ name }) => name === networkName)
+			: undefined);
+
+	let ledgerCanisterId: string;
+	let indexCanisterId: string;
+	let erc20ContractAddress: string;
+
+	$: tokenData = {
+		ledgerCanisterId,
+		indexCanisterId,
+		erc20ContractAddress
+	};
+</script>
+
+<div class="stretch pt-8">
+	<label for="network" class="font-bold px-4.5">{$i18n.tokens.manage.text.network}:</label>
+
+	<div id="network" class="mb-4 mt-1 pt-0.5">
+		<Dropdown name="network" bind:selectedValue={networkName}>
+			<option disabled selected value={undefined} class="hidden"
+				><span class="description">{$i18n.tokens.manage.placeholder.select_network}</span></option
+			>
+			{#each $networks as network}
+				<DropdownItem value={network.name}>{network.name}</DropdownItem>
+			{/each}
+		</Dropdown>
+	</div>
+
+	{#if nonNullish(network)}
+		<div class="mt-8">
+			{#if isNetworkIdICP(network?.id)}
+				<div in:fade>
+					<IcAddTokenForm on:icBack on:icNext bind:ledgerCanisterId bind:indexCanisterId />
+				</div>
+			{:else if isNetworkIdEthereum(network?.id)}
+				<div in:fade>
+					<AddTokenForm on:icBack on:icNext bind:contractAddress={erc20ContractAddress} />
+				</div>
+			{/if}
+		</div>
+	{/if}
+</div>
+
+<style lang="scss">
+	.hidden {
+		display: none;
+	}
+</style>
diff --git a/src/frontend/src/icp-eth/components/tokens/ManageTokens.svelte b/src/frontend/src/icp-eth/components/tokens/ManageTokens.svelte
@@ -191,7 +191,7 @@
 					{#if icTokenContainsEnabled(token)}
 						<IcManageTokenToggle {token} on:icToken={onToggle} />
 					{:else}
-						<ManageTokenToggle {token} />
+						<ManageTokenToggle {token} on:icShowOrHideToken={onToggle} />
 					{/if}
 				</svelte:fragment>
 			</Card>

diff --git a/src/frontend/src/icp/types/env-token-ckerc20.ts b/src/frontend/src/icp/types/env-token-ckerc20.ts
@@ -1,8 +1,12 @@
+import { isEthAddress } from '$lib/utils/account.utils';
 import { z } from 'zod';
 
+const envErc20ContractAddress = z.custom<string>(isEthAddress, 'Invalid ERC20 Contract Address');
+
 const envTokenData = z.object({
 	ledgerCanisterId: z.string(),
-	indexCanisterId: z.string()
+	indexCanisterId: z.string(),
+	erc20ContractAddress: envErc20ContractAddress
 });
 
 const envTokenSymbol = z.string();

diff --git a/src/frontend/src/lib/i18n/en.json b/src/frontend/src/lib/i18n/en.json
@@ -317,7 +317,11 @@
 				"title": "Add and hide tokens",
 				"do_not_see_import": "Don’t see your token? Import",
 				"clear_filter": "Clear filter",
-				"manage_for_network": "Managing tokens for $network"
+				"manage_for_network": "Managing tokens for $network",
+				"network": "Network"
+			},
+			"placeholder": {
+				"select_network": "Select network"
 			},
 			"info": {
 				"outdated_index_canister": "$token Index canister is outdated and incompatible with Oisy Wallet. Contact the project team to propose an upgrade."

diff --git a/src/frontend/src/lib/types/i18n.d.ts b/src/frontend/src/lib/types/i18n.d.ts
@@ -292,7 +292,9 @@ interface I18nTokens {
 			do_not_see_import: string;
 			clear_filter: string;
 			manage_for_network: string;
+			network: string;
 		};
+		placeholder: { select_network: string };
 		info: { outdated_index_canister: string };
 		error: { unexpected_build: string; empty: string };
 	};