diff --git a/README.md b/README.md
index 7bce20e0..60955e52 100644
--- a/README.md
+++ b/README.md
@@ -18,7 +18,7 @@
- [🎉 Features](#-features)
- [🌅 Image handling](#-image-handling)
- [🎆 EXIF extraction](#-exif-extraction)
- - [💰 Cryptocurrency donation via Web3/MetaMask](#-cryptocurrency-donation-via-web3metamask)
+ - [💰 Cryptocurrency donation via Web3 browser wallets](#-cryptocurrency-donation-via-web3-browser-wallets)
- [🔍 Search](#-search)
- [🕸 Related Posts](#-related-posts)
- [📝 GitHub Changelog Rendering](#-github-changelog-rendering)
@@ -75,9 +75,9 @@ If you want to know how this works, have a look at the respective files:
- the `loadAndFormatCollection()` helper in [`src/lib/astro.ts`](src/lib/astro.ts)
- output through [`src/components/Exif/`](src/components/Exif/)
-### 💰 Cryptocurrency donation via Web3/MetaMask
+### 💰 Cryptocurrency donation via Web3 browser wallets
-Lets visitors say thanks with Ether, any ERC-20, or Bitcoin. The Web3 wallet integration uses [RainbowKit](https://www.rainbowkit.com) for wallet connection & [wagmi](https://wagmi.sh) for sending transactions.
+Lets visitors say thanks with Ether, any ERC-20, or Bitcoin. The Web3 wallet integration uses [RainbowKit](https://www.rainbowkit.com) for wallet connection, my own custom web3 API to fetch wallet token balances and metadata, and [wagmi](https://wagmi.sh) for sending transactions.
diff --git a/src/features/Web3/components/TokenSelect/TokenSelect.tsx b/src/features/Web3/components/TokenSelect/TokenSelect.tsx
index c5a46861..ec987ac6 100644
--- a/src/features/Web3/components/TokenSelect/TokenSelect.tsx
+++ b/src/features/Web3/components/TokenSelect/TokenSelect.tsx
@@ -16,7 +16,7 @@ import { useAccount } from 'wagmi'
import { useEffect } from 'react'
export function TokenSelect() {
- const { address } = useAccount()
+ const { address, isConnecting } = useAccount()
const { isLoading } = useFetchTokens()
const tokens = useStore($tokens)
const selectedToken = useStore($selectedToken)
@@ -37,14 +37,14 @@ export function TokenSelect() {
$tokens.set(undefined)
$setSelectedToken(undefined)
}
- }, [address])
+ }, [address, tokens, selectedToken])
// Auto-select native token
useEffect(() => {
- if (tokens && !selectedToken) {
+ if (tokens && !selectedToken && !isConnecting) {
$setSelectedToken(tokens[0])
}
- }, [tokens])
+ }, [tokens, isConnecting, selectedToken])
return tokens ? (