account diffs

dydxprotocol · Jan 14, 2025 · 71c863b · 71c863b
1 parent a8f621b
commit 71c863b
Show file tree

Hide file tree

Showing 3 changed files with 53 additions and 8 deletions.
diff --git 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
@@ -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<DepositDialog2Props>)
     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
@@ -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<SkipRouteSpeed>('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: (
             <DiffOutput
-              withDiff
+              withDiff={!freeCollateral?.eq(updatedFreeCollateral ?? 0)}
               type={OutputType.Fiat}
               value={freeCollateral}
-              newValue={MustBigNumber(freeCollateral).minus(
-                formatUnits(BigInt(selectedRoute.amountOut), USDC_DECIMALS)
-              )}
+              newValue={updatedFreeCollateral}
+            />
+          ),
+        },
+        {
+          key: 'marginUsage',
+          label: stringGetter({ key: STRING_KEYS.MARGIN_USAGE }),
+          value: (
+            <DiffOutput
+              withDiff={!marginUsage?.eq(updatedMarginUsage ?? 0)}
+              type={OutputType.Percent}
+              value={marginUsage}
+              newValue={updatedMarginUsage}
+            />
+          ),
+        },
+        {
+          key: 'equity',
+          label: stringGetter({ key: STRING_KEYS.EQUITY }),
+          value: (
+            <DiffOutput
+              withDiff={!equity?.eq(updatedEquity ?? 0)}
+              type={OutputType.Fiat}
+              value={equity}
+              newValue={updatedEquity}
             />
           ),
         },