split balance and tx loading into independent processes

apps/desktop/src/lib/components/EvmDashboard.svelte

@@ -332,6 +332,11 @@
 					</div>
 				{/if}
 
+		{#if w.loadingBalance && w.address}
+			<div class="flex justify-center py-4">
+				<Loader />
+			</div>
+		{/if}
 		{#if w.error}
 					<p class="mb-3 text-red-500">{w.error}</p>
 				{/if}
@@ -371,7 +376,7 @@
 				<CardTitle>Transactions</CardTitle>
 			</CardHeader>
 			<CardContent>
-				{#if w.loading}
+				{#if w.loadingTransactions}
 					<div class="flex justify-center py-4">
 						<Loader />
 					</div>

apps/desktop/src/lib/states/evm-wallet.svelte.ts

@@ -53,7 +53,8 @@ export const EvmWallet = () => {
 	let network = $state<NetworkId>('eth')
 	let apiKey = $state('')
 	let transactions = $state<TxEntry[]>([])
-	let loading = $state(false)
+	let loadingBalance = $state(false)
+	let loadingTransactions = $state(false)
 	let error = $state('')
 	let wallets = $state<EvmWalletInfo[]>([])
 	let currentWalletId = $state<string | null>(null)
@@ -279,29 +280,31 @@ export const EvmWallet = () => {
 
 	const refresh = async () => {
 		if (!seed || !electrobun.rpc) return
-		loading = true
+		loadingBalance = true
+		loadingTransactions = true
 		error = ''
-		tokenBalances = []
 		const account = mnemonicToAccount(seed)
 		address = account.address
 		const client = createPublicClient({ transport: http(net().rpc) })
-		const [nativeBal, nativeBalError] = await tryCatch(
+
+		;(async () => {
+			const [nativeBal] = await tryCatch(
 				client.getBalance({ address: account.address }),
 			)
-		if (nativeBalError) {
+			if (nativeBal) balance = formatEther(nativeBal)
-			loading = false
+			const [bals] = await tryCatch(
-			return
-		}
-		balance = formatEther(nativeBal)
-		const [bals, balsError] = await tryCatch(
 				electrobun.rpc.request.fetchTokenBalances({
 					address, chainid: net().chainid,
 				}),
 			)
-		if (balsError) error = balsError.message
+			if (bals) tokenBalances = bals
-		tokenBalances = bals ?? []
+			loadingBalance = false
+		})()
+
+		;(async () => {
 			await fetchTxHistory()
-		loading = false
+			loadingTransactions = false
+		})()
 	}
 
 	const saveApiKey = async (key: string) => {
@@ -358,7 +361,9 @@ export const EvmWallet = () => {
 		get networks() { return networks },
 		get apiKey() { return apiKey },
 		get transactions() { return transactions },
-		get loading() { return loading },
+		get loading() { return loadingBalance || loadingTransactions },
+		get loadingBalance() { return loadingBalance },
+		get loadingTransactions() { return loadingTransactions },
 		get error() { return error },
 		get wallets() { return wallets },
 		get currentWalletId() { return currentWalletId },