token select fixes

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.
 
 <img width="700" alt="screen shot 2018-10-14 at 22 03 57" src="https://user-images.githubusercontent.com/90316/46921544-1a512080-cffd-11e8-919f-d3e86dbd5cc5.png" />
 

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 ? (
     <Select.Root