import * as Select from '@radix-ui/react-select' import './TokenSelect.css' import { Token } from './Token' import { ChevronDown, ChevronsDown, ChevronsUp } from '@images/components/react' import { TokenLoading } from './TokenLoading' import { useTokens } from '@features/Web3/hooks/useTokens' import { useStore } from '@nanostores/react' import { $selectedToken, $setSelectedToken } from '@features/Web3/stores/selectedToken' export function TokenSelect() { const { data: tokens, isLoading } = useTokens() const selectedToken = useStore($selectedToken) const items = tokens?.map((token) => ( )) function handleValueChange(value: `0x${string}`) { const token = tokens?.find((token) => token.address === value) if (!token) return $setSelectedToken(token) } return ( handleValueChange(value)} disabled={!tokens || isLoading} value={selectedToken?.address} > {isLoading ? : } In Your Wallet {items} ) }