diff --git a/src/constants/chains.ts b/src/constants/chains.ts index cfbfa69c0..0591ac3cf 100644 --- a/src/constants/chains.ts +++ b/src/constants/chains.ts @@ -2,48 +2,59 @@ import { arbitrum, base, mainnet, optimism, polygon } from 'viem/chains'; import { CosmosChainId } from './graz'; import { SOLANA_MAINNET_ID } from './solana'; +import { WalletNetworkType } from './wallets'; type Chain = { name: string; icon: string; + walletNetworkType: WalletNetworkType; }; export const CHAIN_INFO: { [chainId: string]: Chain } = { [mainnet.id]: { name: 'Ethereum', icon: '/chains/ethereum.png', + walletNetworkType: WalletNetworkType.Evm, }, [arbitrum.id]: { name: 'Arbitrum', icon: '/chains/arbitrum.png', + walletNetworkType: WalletNetworkType.Evm, }, [optimism.id]: { name: 'Optimism', icon: '/chains/optimism.png', + walletNetworkType: WalletNetworkType.Evm, }, [base.id]: { name: 'Base', icon: '/chains/base.png', + walletNetworkType: WalletNetworkType.Evm, }, [polygon.id]: { name: 'Polygon', icon: '/chains/polygon.png', + walletNetworkType: WalletNetworkType.Evm, }, [SOLANA_MAINNET_ID]: { name: 'Solana', icon: '/chains/solana.png', + walletNetworkType: WalletNetworkType.Solana, }, [CosmosChainId.Neutron]: { name: 'Neutron', icon: '/chains/neutron.png', + walletNetworkType: WalletNetworkType.Cosmos, }, [CosmosChainId.Noble]: { name: 'Noble', icon: '/chains/noble.png', + walletNetworkType: WalletNetworkType.Cosmos, }, [CosmosChainId.Osmosis]: { name: 'Osmosis', icon: '/chains/osmosis.png', + walletNetworkType: WalletNetworkType.Cosmos, }, }; diff --git a/src/views/dialogs/WithdrawDialog2/WithdrawDialog2.tsx b/src/views/dialogs/WithdrawDialog2/WithdrawDialog2.tsx index e96aa2830..82677d659 100644 --- a/src/views/dialogs/WithdrawDialog2/WithdrawDialog2.tsx +++ b/src/views/dialogs/WithdrawDialog2/WithdrawDialog2.tsx @@ -1,8 +1,9 @@ -import { useRef, useState } from 'react'; +import { useEffect, useRef, useState } from 'react'; import styled from 'styled-components'; import { mainnet } from 'viem/chains'; +import { CHAIN_INFO } from '@/constants/chains'; import { DepositDialog2Props, DialogProps } from '@/constants/dialogs'; import { CosmosChainId } from '@/constants/graz'; import { STRING_KEYS } from '@/constants/localization'; @@ -47,6 +48,12 @@ export const WithdrawDialog2 = ({ setIsOpen }: DialogProps) chainSelectRef.current?.scroll({ top: 0 }); }; + useEffect(() => { + if (CHAIN_INFO[destinationChain]?.walletNetworkType !== sourceAccount.chain) { + setDestinationAddress(''); + } + }, [sourceAccount, destinationChain]); + return ( <$Dialog isOpen diff --git a/src/views/dialogs/WithdrawDialog2/WithdrawForm.tsx b/src/views/dialogs/WithdrawDialog2/WithdrawForm.tsx index cbfe1c699..c9e369e7f 100644 --- a/src/views/dialogs/WithdrawDialog2/WithdrawForm.tsx +++ b/src/views/dialogs/WithdrawDialog2/WithdrawForm.tsx @@ -20,13 +20,12 @@ import { Output, OutputType } from '@/components/Output'; import { useAppSelector } from '@/state/appTypes'; -import { MustBigNumber } from '@/lib/numbers'; import { orEmptyObj } from '@/lib/typeUtils'; import { RouteOptions } from '../DepositDialog2/RouteOptions'; import { AddressInput } from './AddressInput'; import { AmountInput } from './AmountInput'; -import { useWithdrawalRoutes } from './queries'; +import { useWithdrawalDeltas, useWithdrawalRoutes } from './queries'; export const WithdrawForm = ({ amount, @@ -47,7 +46,7 @@ export const WithdrawForm = ({ const [selectedSpeed, setSelectedSpeed] = useState('fast'); const debouncedAmount = useDebounce(amount); const selectedToken = WITHDRAWABLE_ASSETS.find((token) => token.chainId === destinationChain); - const { freeCollateral } = orEmptyObj( + const { freeCollateral, marginUsage, equity } = orEmptyObj( useAppSelector(BonsaiCore.account.parentSubaccountSummary.data) ); @@ -60,6 +59,12 @@ export const WithdrawForm = ({ amount: debouncedAmount, }); + const { + freeCollateral: updatedFreeCollateral, + marginUsage: updatedMarginUsage, + equity: updatedEquity, + } = orEmptyObj(useWithdrawalDeltas({ withdrawAmount: debouncedAmount })); + useEffect(() => { if (debouncedAmount && !isFetching && !routes?.fast) setSelectedSpeed('slow'); }, [isFetching, routes, debouncedAmount]); @@ -86,12 +91,34 @@ export const WithdrawForm = ({ label: stringGetter({ key: STRING_KEYS.FREE_COLLATERAL }), value: ( + ), + }, + { + key: 'marginUsage', + label: stringGetter({ key: STRING_KEYS.MARGIN_USAGE }), + value: ( + + ), + }, + { + key: 'equity', + label: stringGetter({ key: STRING_KEYS.EQUITY }), + value: ( + ), },