Merge branch 'main' into style(frontend)/fix-token-balances

.github/workflows/deploy-to-environment.yml

@@ -154,14 +154,17 @@ jobs:
 
       - name: Deploy Backend to Environment
         run: |
+          DFX_DEPLOY_FLAGS=() # Arguments to be added to the dfx deploy command.
+          [[ "${{ github.event.inputs.force-backend }}" != "true" ]] || DFX_DEPLOY_FLAGS+=('--yes' '--upgrade-unchanged') # Corresponds to: dfx deploy --yes --upgrade-unchanged
+
           if [ "$CANISTER" == "backend" ] || [ "${{ github.event_name }}" == "push" ]; then
             if git diff --quiet HEAD~1 HEAD -- Cargo.toml Cargo.lock rust-toolchain.toml src/backend/**/* src/shared/**/*; then
               if [ "${{ github.event.inputs.force-backend }}" == "false" ]; then
                 echo "No changes in specified files/folders detected, skipping backend deployment."
               else
-                ENV=$NETWORK ./scripts/deploy.backend.sh
+                ENV=$NETWORK ./scripts/deploy.backend.sh "${DFX_DEPLOY_FLAGS[@]}"
               fi
             else            
-              ENV=$NETWORK ./scripts/deploy.backend.sh
+              ENV=$NETWORK ./scripts/deploy.backend.sh "${DFX_DEPLOY_FLAGS[@]}"
             fi
           fi

.github/workflows/e2e-tests.yml

@@ -61,7 +61,7 @@ jobs:
       - name: Test
         run: npm run e2e:ci
 
-      - uses: actions/upload-artifact@v3
+      - uses: actions/upload-artifact@v4
         if: failure()
         with:
           name: playwright-report

scripts/deploy.backend.sh

@@ -60,7 +60,7 @@ if [ -n "${ENV+1}" ]; then
          };
          ic_root_key_der = $ic_root_key_der;
      }
-  })" --network "$ENV"
+  })" --network "$ENV" "${@}"
 else
   DEFAULT_CANISTER_ID="$(dfx canister id --network staging backend)"
   dfx deploy backend --argument "(variant {
@@ -79,5 +79,5 @@ else
          };
          ic_root_key_der = $ic_root_key_der;
      }
-  })" --specified-id "$DEFAULT_CANISTER_ID"
+  })" --specified-id "$DEFAULT_CANISTER_ID" "${@}"
 fi

src/frontend/src/btc/components/fee/UtxosFeeContext.svelte

@@ -0,0 +1,52 @@
+<script lang="ts">
+	import { debounce, isNullish, nonNullish } from '@dfinity/utils';
+	import { getContext } from 'svelte';
+	import { selectUtxosFee as selectUtxosFeeApi } from '$btc/services/btc-send.services';
+	import { UTXOS_FEE_CONTEXT_KEY, type UtxosFeeContext } from '$btc/stores/utxos-fee.store';
+	import { authIdentity } from '$lib/derived/auth.derived';
+	import { nullishSignOut } from '$lib/services/auth.services';
+	import type { NetworkId } from '$lib/types/network';
+	import { mapNetworkIdToBitcoinNetwork } from '$lib/utils/network.utils';
+
+	export let amount: number | undefined = undefined;
+	export let networkId: NetworkId | undefined = undefined;
+
+	const { store } = getContext<UtxosFeeContext>(UTXOS_FEE_CONTEXT_KEY);
+
+	const loadEstimatedFee = async () => {
+		if (isNullish($authIdentity)) {
+			await nullishSignOut();
+			return;
+		}
+
+		if (isNullish(networkId) || isNullish(amount) || amount === 0) {
+			store.reset();
+			return;
+		}
+
+		const network = mapNetworkIdToBitcoinNetwork(networkId);
+
+		const utxosFee = nonNullish(network)
+			? await selectUtxosFeeApi({
+					amount,
+					network,
+					identity: $authIdentity
+				})
+			: undefined;
+
+		if (isNullish(utxosFee)) {
+			store.reset();
+			return;
+		}
+
+		store.setUtxosFee({
+			utxosFee
+		});
+	};
+
+	const debounceEstimateFee = debounce(loadEstimatedFee);
+
+	$: amount, networkId, debounceEstimateFee();
+</script>
+
+<slot />

src/frontend/src/btc/components/transactions/BtcTransaction.svelte

@@ -6,8 +6,10 @@
 	import Transaction from '$lib/components/transactions/Transaction.svelte';
 	import { i18n } from '$lib/stores/i18n.store';
 	import { modalStore } from '$lib/stores/modal.store';
+	import type { OptionToken } from '$lib/types/token';
 
 	export let transaction: BtcTransactionUi;
+	export let token: OptionToken = undefined;
 
 	let value: bigint | undefined;
 	let timestamp: bigint | undefined;
@@ -26,6 +28,7 @@
 	{type}
 	timestamp={Number(timestamp)}
 	{status}
+	{token}
 >
 	{label}
 </Transaction>

src/frontend/src/btc/schedulers/btc-wallet.scheduler.ts

@@ -1,4 +1,5 @@
 import { BTC_BALANCE_MIN_CONFIRMATIONS } from '$btc/constants/btc.constants';
+import type { BtcPostMessageDataResponseWallet } from '$btc/types/btc-post-message';
 import { mapBtcTransaction } from '$btc/utils/btc-transactions.utils';
 import type { BitcoinNetwork } from '$declarations/signer/signer.did';
 import { getBtcBalance } from '$lib/api/signer.api';
@@ -9,10 +10,7 @@ import { SchedulerTimer, type Scheduler, type SchedulerJobData } from '$lib/sche
 import type { BtcAddress } from '$lib/types/address';
 import type { BitcoinTransaction } from '$lib/types/blockchain';
 import type { OptionIdentity } from '$lib/types/identity';
-import type {
-	PostMessageDataRequestBtc,
-	PostMessageDataResponseWallet
-} from '$lib/types/post-message';
+import type { PostMessageDataRequestBtc } from '$lib/types/post-message';
 import type { CertifiedData } from '$lib/types/store';
 import { assertNonNullish, isNullish, jsonReplacer, nonNullish } from '@dfinity/utils';
 
@@ -146,8 +144,8 @@ export class BtcWalletScheduler implements Scheduler<PostMessageDataRequestBtc>
 		});
 	};
 
-	private postMessageWallet(data: PostMessageDataResponseWallet) {
-		this.timer.postMsg<PostMessageDataResponseWallet>({
+	private postMessageWallet(data: BtcPostMessageDataResponseWallet) {
+		this.timer.postMsg<BtcPostMessageDataResponseWallet>({
 			msg: 'syncBtcWallet',
 			data
 		});

src/frontend/src/btc/schema/btc-post-message.schema.ts

@@ -0,0 +1,13 @@
+import {
+	JsonTransactionsTextSchema,
+	PostMessageDataResponseSchema,
+	PostMessageWalletDataSchema
+} from '$lib/schema/post-message.schema';
+
+const BtcPostMessageWalletDataSchema = PostMessageWalletDataSchema.extend({
+	newTransactions: JsonTransactionsTextSchema
+});
+
+export const BtcPostMessageDataResponseWalletSchema = PostMessageDataResponseSchema.extend({
+	wallet: BtcPostMessageWalletDataSchema
+});

src/frontend/src/btc/services/btc-listener.services.ts

@@ -1,6 +1,6 @@
 import { btcTransactionsStore } from '$btc/stores/btc-transactions.store';
+import type { BtcPostMessageDataResponseWallet } from '$btc/types/btc-post-message';
 import { balancesStore } from '$lib/stores/balances.store';
-import type { PostMessageDataResponseWallet } from '$lib/types/post-message';
 import type { TokenId } from '$lib/types/token';
 import { jsonReviver } from '@dfinity/utils';
 import { BigNumber } from '@ethersproject/bignumber';
@@ -9,7 +9,7 @@ export const syncWallet = ({
 	data,
 	tokenId
 }: {
-	data: PostMessageDataResponseWallet;
+	data: BtcPostMessageDataResponseWallet;
 	tokenId: TokenId;
 }) => {
 	const {
@@ -27,10 +27,8 @@ export const syncWallet = ({
 		}
 	});
 
-	// TODO(OISY-296): set nullish if newTransactions is null
-	// TODO: also verify why we have a particular implementation here?
 	btcTransactionsStore.prepend({
 		tokenId,
-		transactions: JSON.parse(newTransactions ?? '[]', jsonReviver)
+		transactions: JSON.parse(newTransactions, jsonReviver)
 	});
 };

src/frontend/src/btc/services/btc-send.services.ts

@@ -20,7 +20,7 @@ interface BtcSendServiceParams {
 	progress: (step: ProgressStepsSendBtc) => void;
 }
 
-type SendBtcParams = BtcSendServiceParams & {
+export type SendBtcParams = BtcSendServiceParams & {
 	destination: BtcAddress;
 	source: BtcAddress;
 	utxosFee: UtxosFee;
@@ -55,7 +55,6 @@ export const sendBtc = async ({
 	identity,
 	...rest
 }: SendBtcParams): Promise<void> => {
-	// TODO: use txid returned by this method to register it as a pending transaction in BE
 	const { txid } = await send({ progress, utxosFee, network, identity, ...rest });
 
 	progress(ProgressStepsSendBtc.RELOAD);

src/frontend/src/btc/services/worker.btc-wallet.services.ts

@@ -1,11 +1,12 @@
 import { syncWallet } from '$btc/services/btc-listener.services';
+import type { BtcPostMessageDataResponseWallet } from '$btc/types/btc-post-message';
 import {
 	btcAddressMainnetStore,
 	btcAddressRegtestStore,
 	btcAddressTestnetStore
 } from '$lib/stores/address.store';
 import type { WalletWorker } from '$lib/types/listener';
-import type { PostMessage, PostMessageDataResponseWallet } from '$lib/types/post-message';
+import type { PostMessage } from '$lib/types/post-message';
 import type { Token } from '$lib/types/token';
 import {
 	isNetworkIdBTCMainnet,
@@ -22,14 +23,14 @@ export const initBtcWalletWorker = async ({
 	const WalletWorker = await import('$btc/workers/btc-wallet.worker?worker');
 	const worker: Worker = new WalletWorker.default();
 
-	worker.onmessage = ({ data }: MessageEvent<PostMessage<PostMessageDataResponseWallet>>) => {
+	worker.onmessage = ({ data }: MessageEvent<PostMessage<BtcPostMessageDataResponseWallet>>) => {
 		const { msg } = data;
 
 		switch (msg) {
 			case 'syncBtcWallet':
 				syncWallet({
 					tokenId,
-					data: data.data as PostMessageDataResponseWallet
+					data: data.data as BtcPostMessageDataResponseWallet
 				});
 				return;
 		}

src/frontend/src/btc/stores/utxos-fee.store.ts

@@ -0,0 +1,34 @@
+import type { UtxosFee } from '$btc/types/btc-send';
+import type { Option } from '$lib/types/utils';
+import { writable, type Readable } from 'svelte/store';
+
+export type UtxosFeeStoreData = Option<{
+	utxosFee?: UtxosFee;
+}>;
+
+export interface UtxosFeeStore extends Readable<UtxosFeeStoreData> {
+	setUtxosFee: (data: UtxosFeeStoreData) => void;
+	reset: () => void;
+}
+
+export const initUtxosFeeStore = (): UtxosFeeStore => {
+	const { subscribe, set } = writable<UtxosFeeStoreData>(undefined);
+
+	return {
+		subscribe,
+
+		reset() {
+			set(null);
+		},
+
+		setUtxosFee(data: UtxosFeeStoreData) {
+			set(data);
+		}
+	};
+};
+
+export interface UtxosFeeContext {
+	store: UtxosFeeStore;
+}
+
+export const UTXOS_FEE_CONTEXT_KEY = Symbol('utxos-fee');

src/frontend/src/btc/types/btc-post-message.ts

@@ -0,0 +1,6 @@
+import { BtcPostMessageDataResponseWalletSchema } from '$btc/schema/btc-post-message.schema';
+import { z } from 'zod';
+
+export type BtcPostMessageDataResponseWallet = z.infer<
+	typeof BtcPostMessageDataResponseWalletSchema
+>;

src/frontend/src/eth/components/loaders/LoaderMultipleEthTransactions.svelte

@@ -0,0 +1,34 @@
+<script lang="ts">
+	import { erc20UserTokensNotInitialized } from '$eth/derived/erc20.derived';
+	import { enabledEthereumTokens } from '$eth/derived/tokens.derived';
+	import { loadTransactions } from '$eth/services/transactions.services';
+	import { enabledErc20Tokens } from '$lib/derived/tokens.derived';
+	import type { TokenId } from '$lib/types/token';
+
+	// TODO: make it more functional
+	let tokensLoaded: TokenId[] = [];
+
+	const load = async () => {
+		if ($erc20UserTokensNotInitialized) {
+			return;
+		}
+
+		await Promise.allSettled(
+			[...$enabledEthereumTokens, ...$enabledErc20Tokens].map(
+				async ({ network: { id: networkId }, id: tokenId }) => {
+					if (tokensLoaded.includes(tokenId)) {
+						return;
+					}
+
+					await loadTransactions({ tokenId, networkId });
+
+					tokensLoaded.push(tokenId);
+				}
+			)
+		);
+	};
+
+	$: $enabledEthereumTokens, $enabledErc20Tokens, $erc20UserTokensNotInitialized, load();
+</script>
+
+<slot />

src/frontend/src/eth/components/transactions/EthTransaction.svelte

@@ -5,14 +5,14 @@
 	import { isSupportedEthToken } from '$eth/utils/eth.utils';
 	import { isTransactionPending } from '$eth/utils/transactions.utils';
 	import Transaction from '$lib/components/transactions/Transaction.svelte';
-	import { tokenSymbol } from '$lib/derived/token.derived';
 	import { i18n } from '$lib/stores/i18n.store';
 	import { modalStore } from '$lib/stores/modal.store';
-	import { token } from '$lib/stores/token.store';
+	import type { OptionToken } from '$lib/types/token';
 	import type { TransactionStatus } from '$lib/types/transaction';
 	import { replacePlaceholders } from '$lib/utils/i18n.utils';
 
 	export let transaction: EthTransactionUi;
+	export let token: OptionToken = undefined;
 
 	let value: BigNumber;
 	let timestamp: number | undefined;
@@ -28,10 +28,10 @@
 	$: ({ value, timestamp, displayTimestamp, uiType: type } = transaction);
 
 	let ckTokenSymbol: string;
-	$: ckTokenSymbol = isSupportedEthToken($token)
-		? $token.twinTokenSymbol
+	$: ckTokenSymbol = isSupportedEthToken(token)
+		? token.twinTokenSymbol
 		: // TODO: $token could be undefined, that's why we cast as `Erc20Token | undefined`; adjust the cast once we're sure that $token is never undefined
-			(($token as Erc20Token | undefined)?.twinTokenSymbol ?? '');
+			((token as Erc20Token | undefined)?.twinTokenSymbol ?? '');
 
 	let label: string;
 	$: label =
@@ -41,7 +41,7 @@
 						? $i18n.transaction.label.converting_ck_token
 						: $i18n.transaction.label.ck_token_converted,
 					{
-						$twinToken: $tokenSymbol ?? '',
+						$twinToken: token?.symbol ?? '',
 						$ckToken: ckTokenSymbol
 					}
 				)
@@ -51,7 +51,7 @@
 							? $i18n.transaction.label.converting_twin_token
 							: $i18n.transaction.label.ck_token_sent,
 						{
-							$twinToken: $tokenSymbol ?? '',
+							$twinToken: token?.symbol ?? '',
 							$ckToken: ckTokenSymbol
 						}
 					)
@@ -72,6 +72,7 @@
 	{type}
 	timestamp={transactionDate}
 	{status}
+	{token}
 >
 	{label}
 </Transaction>

src/frontend/src/eth/components/transactions/EthTransactions.svelte

@@ -19,6 +19,7 @@
 	import { modalToken, modalEthTransaction } from '$lib/derived/modal.derived';
 	import { i18n } from '$lib/stores/i18n.store';
 	import { modalStore } from '$lib/stores/modal.store';
+	import { token } from '$lib/stores/token.store';
 	import type { OptionEthAddress } from '$lib/types/address';
 	import type { Transaction as TransactionType } from '$lib/types/transaction';
 
@@ -49,7 +50,7 @@
 	<EthTransactionsSkeletons>
 		{#each sortedTransactionsUi as transaction (transaction.hash)}
 			<div transition:slide={SLIDE_DURATION}>
-				<EthTransaction {transaction} />
+				<EthTransaction {transaction} token={$token} />
 			</div>
 		{/each}