Update Abacus v0.6.0 (#55)

* Abacus 6: New init, deprecate asset.symbol

* deprecate asset.symbol

* Update networks constants

* filesystem

* Update networks.ts

* 0.6.0 -> 0.6.3

* Remove Market filter

src/hooks/useAccountBalance.ts

@@ -7,7 +7,7 @@ import { formatUnits } from 'viem';
 
 import { USDC_DENOM, DYDX_DENOM } from '@dydxprotocol/v4-client-js';
 
-import { CLIENT_NETWORK_CONFIGS } from '@/constants/networks';
+import { ENVIRONMENT_CONFIG_MAP } from '@/constants/networks';
 import { QUANTUM_MULTIPLIER } from '@/constants/numbers';
 import { EvmAddress } from '@/constants/wallets';
 
@@ -52,16 +52,14 @@ export const useAccountBalance = ({
 
   const selectedNetwork = useSelector(getSelectedNetwork);
   const balances = useSelector(getBalances, shallowEqual);
-  const evmChainId = Number(CLIENT_NETWORK_CONFIGS[selectedNetwork].ethereumChainId);
+  const evmChainId = Number(ENVIRONMENT_CONFIG_MAP[selectedNetwork].ethereumChainId);
 
   const evmQuery = useBalance({
     enabled: Boolean(!isCosmosChain && addressOrDenom?.startsWith('0x')),
     address: evmAddress,
     chainId: typeof chainId === 'number' ? chainId : Number(evmChainId),
     token:
-      addressOrDenom === CHAIN_DEFAULT_TOKEN_ADDRESS
-        ? undefined
-        : (addressOrDenom as EvmAddress),
+      addressOrDenom === CHAIN_DEFAULT_TOKEN_ADDRESS ? undefined : (addressOrDenom as EvmAddress),
     watch: true,
   });
 
@@ -98,7 +96,7 @@ export const useAccountBalance = ({
   const nativeTokenBalance = MustBigNumber(nativeTokenCoinBalance?.amount)
     .div(QUANTUM_MULTIPLIER)
     .toNumber();
-  
+
   const usdcCoinBalance = balances?.[USDC_DENOM];
   const usdcBalance = MustBigNumber(usdcCoinBalance?.amount).div(QUANTUM_MULTIPLIER).toNumber();
 

src/hooks/useDisplayedWallets.ts

@@ -1,4 +1,3 @@
-import { isDydxV4Network } from '@/constants/networks';
 import { WalletType } from '@/constants/wallets';
 
 import { isTruthy } from '@/lib/isTruthy';
@@ -11,7 +10,7 @@ export const useDisplayedWallets = () => {
   return [
     WalletType.MetaMask,
 
-    import.meta.env.MODE !== 'production' && isDydxV4Network(selectedNetwork) && WalletType.Keplr,
+    import.meta.env.MODE !== 'production' && WalletType.Keplr,
 
     WalletType.WalletConnect2,
     WalletType.WalletConnect,

src/hooks/useInitializePage.ts

@@ -3,7 +3,7 @@ import { useDispatch } from 'react-redux';
 
 import { LocalStorageKey } from '@/constants/localStorage';
 
-import { DEFAULT_APP_ENVIRONMENT, DydxNetwork, isValidDydxNetwork } from '@/constants/networks';
+import { DEFAULT_APP_ENVIRONMENT, type DydxNetwork } from '@/constants/networks';
 
 import { useLocalStorage } from '@/hooks';
 
@@ -18,7 +18,6 @@ export const useInitializePage = () => {
   const [localStorageNetwork] = useLocalStorage<DydxNetwork>({
     key: LocalStorageKey.SelectedNetwork,
     defaultValue: DEFAULT_APP_ENVIRONMENT,
-    validateFn: isValidDydxNetwork, // backwards compatibility
   });
 
   useEffect(() => {

src/hooks/useMarketsData.ts

@@ -28,15 +28,13 @@ export const useMarketsData = (
   const allAssets = useSelector(getAssets, shallowEqual) || {};
 
   const markets = useMemo(() => {
-    return Object.values(allPerpetualMarkets)
-      .filter((market) => allAssets[market?.assetId]) // Filter out markets with no asset information
-      .map((marketData) => ({
-        asset: allAssets[marketData.assetId],
-        tickSizeDecimals: marketData.configs?.tickSizeDecimals,
-        ...marketData,
-        ...marketData.perpetual,
-        ...marketData.configs,
-      })) as MarketData[];
+    return Object.values(allPerpetualMarkets).map((marketData) => ({
+      asset: allAssets[marketData.assetId],
+      tickSizeDecimals: marketData.configs?.tickSizeDecimals,
+      ...marketData,
+      ...marketData.perpetual,
+      ...marketData.configs,
+    })) as MarketData[];
   }, [allPerpetualMarkets, allAssets]);
 
   const filteredMarkets = useMemo(() => {
@@ -45,8 +43,8 @@ export const useMarketsData = (
     if (searchFilter) {
       return filtered.filter(
         ({ asset }) =>
-          asset.name?.toLocaleLowerCase().includes(searchFilter.toLowerCase()) ||
-          asset.symbol?.toLocaleLowerCase().includes(searchFilter.toLowerCase())
+          asset?.name?.toLocaleLowerCase().includes(searchFilter.toLowerCase()) ||
+          asset?.id?.toLocaleLowerCase().includes(searchFilter.toLowerCase())
       );
     }
     return filtered;

src/hooks/useSquid.tsx

@@ -2,11 +2,11 @@ import { createContext, useContext, useEffect, useMemo, useState } from 'react';
 import { useSelector } from 'react-redux';
 import { Squid } from '@0xsquid/sdk';
 
-import { CLIENT_NETWORK_CONFIGS, isDydxV4Network } from '@/constants/networks';
+import { ENVIRONMENT_CONFIG_MAP } from '@/constants/networks';
 
 import { getSelectedNetwork } from '@/state/appSelectors';
 
-export const NATIVE_TOKEN_ADDRESS = "0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE";
+export const NATIVE_TOKEN_ADDRESS = '0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE';
 
 export const STATUS_ERROR_GRACE_PERIOD = 120_000;
 
@@ -22,10 +22,7 @@ const useSquidContext = () => {
   };
 
   const squid = useMemo(
-    () =>
-      isDydxV4Network(selectedNetwork)
-        ? new Squid({ baseUrl: CLIENT_NETWORK_CONFIGS[selectedNetwork]?.endpoints['0xsquid'] })
-        : undefined,
+    () => new Squid({ baseUrl: ENVIRONMENT_CONFIG_MAP[selectedNetwork]?.endpoints['0xsquid'] }),
     [selectedNetwork]
   );
 
@@ -39,7 +36,7 @@ const useSquidContext = () => {
 };
 
 type SquidContextType = ReturnType<typeof useSquidContext>;
-const SquidContext = createContext<SquidContextType>(undefined);
+const SquidContext = createContext<SquidContextType | undefined>(undefined);
 SquidContext.displayName = '0xSquid';
 
 export const SquidProvider = ({ ...props }) => (