diff --git a/wormhole-connect/src/hooks/useAmountValidation.ts b/wormhole-connect/src/hooks/useAmountValidation.ts index dff144eda..47ccf469c 100644 --- a/wormhole-connect/src/hooks/useAmountValidation.ts +++ b/wormhole-connect/src/hooks/useAmountValidation.ts @@ -17,6 +17,7 @@ type Props = { quotesMap: Record; tokenSymbol: string; isLoading: boolean; + disabled?: boolean; }; export const useAmountValidation = (props: Props): HookReturn => { @@ -57,7 +58,7 @@ export const useAmountValidation = (props: Props): HookReturn => { const numAmount = Number.parseFloat(amount); // Don't show errors when no amount is set or it's loading - if (!amount || !numAmount || props.isLoading) { + if (!amount || !numAmount || props.isLoading || props.disabled) { return {}; } diff --git a/wormhole-connect/src/views/v2/Bridge/AssetPicker/TokenList.tsx b/wormhole-connect/src/views/v2/Bridge/AssetPicker/TokenList.tsx index d1f6493de..ce7ebca2d 100644 --- a/wormhole-connect/src/views/v2/Bridge/AssetPicker/TokenList.tsx +++ b/wormhole-connect/src/views/v2/Bridge/AssetPicker/TokenList.tsx @@ -83,6 +83,11 @@ const TokenList = (props: Props) => { return; } + // Exclude tokens with no balance on source list + if (props.isSource && !balance && props.wallet?.address) { + return; + } + // Exclude wormhole-wrapped tokens with no balance if ( props.isSource && @@ -159,14 +164,30 @@ const TokenList = (props: Props) => { return tokens; }, [balances, props.tokenList, props.sourceToken]); + const noTokensMessage = useMemo( + () => ( + + No supported tokens found in wallet + + ), + [], + ); + + const shouldShowEmptyMessage = + sortedTokens.length === 0 && !isFetchingTokenBalances && !props.isFetching; + const searchList = ( searchPlaceholder="Search for a token" className={classes.tokenList} listTitle={ - - Tokens on {props.selectedChainConfig.displayName} - + shouldShowEmptyMessage ? ( + noTokensMessage + ) : ( + + Tokens on {props.selectedChainConfig.displayName} + + ) } loading={ props.isFetching && ( diff --git a/wormhole-connect/src/views/v2/Bridge/Routes/index.tsx b/wormhole-connect/src/views/v2/Bridge/Routes/index.tsx index c232397db..d90d9ea47 100644 --- a/wormhole-connect/src/views/v2/Bridge/Routes/index.tsx +++ b/wormhole-connect/src/views/v2/Bridge/Routes/index.tsx @@ -8,7 +8,6 @@ import { makeStyles } from 'tss-react/mui'; import config from 'config'; import { RoutesConfig } from 'config/routes'; import SingleRoute from 'views/v2/Bridge/Routes/SingleRoute'; -import AlertBannerV2 from 'components/v2/AlertBanner'; import type { RootState } from 'store'; import { RouteState } from 'store/transferInput'; @@ -130,14 +129,8 @@ const Routes = ({ ...props }: Props) => { }, [routes, props.quotes]); if (walletsConnected && supportedRoutes.length === 0 && Number(amount) > 0) { - return ( - - ); + // Errors are displayed in AmountInput + return; } if (supportedRoutes.length === 0 || !walletsConnected || props.hasError) { diff --git a/wormhole-connect/src/views/v2/Bridge/index.tsx b/wormhole-connect/src/views/v2/Bridge/index.tsx index 1600ad011..ba3cf3031 100644 --- a/wormhole-connect/src/views/v2/Bridge/index.tsx +++ b/wormhole-connect/src/views/v2/Bridge/index.tsx @@ -199,6 +199,14 @@ const Bridge = () => { sourceTokenArray, ); + const disableValidation = + !sendingWallet.address || + !receivingWallet.address || + !sourceChain || + !sourceToken || + !destChain || + !destToken; + // Validate amount const amountValidation = useAmountValidation({ balance: balances[sourceToken]?.balance, @@ -206,6 +214,7 @@ const Bridge = () => { quotesMap, tokenSymbol: config.tokens[sourceToken]?.symbol ?? '', isLoading: isFetchingBalances || isFetchingQuotes, + disabled: disableValidation, }); // Get input validation result