diff --git a/package.json b/package.json index ae82166..4e03bdb 100644 --- a/package.json +++ b/package.json @@ -38,8 +38,8 @@ "@cosmjs/proto-signing": "^0.31.0", "@cosmjs/stargate": "^0.31.0", "@cosmjs/tendermint-rpc": "^0.31.0", - "@dydxprotocol/v4-abacus": "^0.7.0", - "@dydxprotocol/v4-client-js": "^0.36.1", + "@dydxprotocol/v4-abacus": "^0.7.2", + "@dydxprotocol/v4-client-js": "file:/Users/zhenqianhe/workspace/v4-clients/v4-client-js/dydxprotocol-v4-client-js-0.40.1.tgz", "@dydxprotocol/v4-localization": "^0.1.30", "@ethersproject/providers": "^5.7.2", "@js-joda/core": "^5.5.3", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 541ef18..c96c775 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -27,11 +27,11 @@ dependencies: specifier: ^0.31.0 version: 0.31.0 '@dydxprotocol/v4-abacus': - specifier: ^0.7.0 - version: 0.7.0 + specifier: ^0.7.2 + version: 0.7.2 '@dydxprotocol/v4-client-js': - specifier: ^0.36.1 - version: 0.36.1 + specifier: file:/Users/zhenqianhe/workspace/v4-clients/v4-client-js/dydxprotocol-v4-client-js-0.40.1.tgz + version: file:../v4-clients/v4-client-js/dydxprotocol-v4-client-js-0.40.1.tgz '@dydxprotocol/v4-localization': specifier: ^0.1.30 version: 0.1.30 @@ -645,7 +645,7 @@ packages: /@confio/ics23@0.6.8: resolution: {integrity: sha512-wB6uo+3A50m0sW/EWcU64xpV/8wShZ6bMTa7pF8eYsTrSkQA7oLUIJcs/wb8g4y2Oyq701BaGiO6n/ak5WXO1w==} dependencies: - '@noble/hashes': 1.3.1 + '@noble/hashes': 1.3.2 protobufjs: 6.11.4 dev: false @@ -717,7 +717,7 @@ packages: '@cosmjs/encoding': 0.30.1 '@cosmjs/math': 0.30.1 '@cosmjs/utils': 0.30.1 - '@noble/hashes': 1.3.1 + '@noble/hashes': 1.3.2 bn.js: 5.2.1 elliptic: 6.5.4 libsodium-wrappers: 0.7.11 @@ -979,43 +979,16 @@ packages: resolution: {integrity: sha512-RpfLEtTlyIxeNPGKcokS+p3BZII/Q3bYxryFRglh5H3A3T8q9fsLYm72VYAMEOOIBLEa8o93kFLiBDUWKrwXZA==} dev: true - /@dydxprotocol/v4-abacus@0.7.0: - resolution: {integrity: sha512-XheqfIpOODfQFG860oH0fneVgp9qQKPMDTwrvFXaM/JtKH9ekOUUO6De72EsJ7qOuxWwl1WgoALA8b4tRs0tiw==} - dev: false - - /@dydxprotocol/v4-client-js@0.36.1: - resolution: {integrity: sha512-KJ3MtWI61wmm+xZtXQd7/hYKIoVFG32TRdyyVaXXO8vpW9Oqd0JD8QSM/wuegkciAh5YmP/BrDzYuu77zHO6yg==} - dependencies: - '@cosmjs/amino': 0.30.1 - '@cosmjs/encoding': 0.31.1 - '@cosmjs/math': 0.31.1 - '@cosmjs/proto-signing': 0.30.1 - '@cosmjs/stargate': 0.30.1 - '@cosmjs/tendermint-rpc': 0.30.1 - '@cosmjs/utils': 0.31.1 - '@dydxprotocol/v4-proto': 0.2.1 - '@osmonauts/lcd': 0.6.0 - '@scure/bip32': 1.3.1 - '@scure/bip39': 1.2.1 - axios: 1.1.3 - bech32: 1.1.4 - bignumber.js: 9.1.1 - ethereum-cryptography: 2.1.2 - long: 4.0.0 - protobufjs: 6.11.4 - ws: 8.13.0(bufferutil@4.0.7)(utf-8-validate@5.0.10) - transitivePeerDependencies: - - bufferutil - - debug - - utf-8-validate + /@dydxprotocol/v4-abacus@0.7.2: + resolution: {integrity: sha512-5foamomN82FH6ko3EuzwFlSoAEY6Sal8fDgvZo2RsB19Ks6SFgFDeeOcEDdfoa3DNwvl8yW0C9cfxeQ+BfU8uA==} dev: false /@dydxprotocol/v4-localization@0.1.30: resolution: {integrity: sha512-xTlQuQmPz7wfGkjd07giYMAxRrolDbJE3DryJSIMB6R1MBq1wLzAcwp/iR/nELRwilRX9c44Tap0gGt+oAajiQ==} dev: false - /@dydxprotocol/v4-proto@0.2.1: - resolution: {integrity: sha512-Q5b/g331DoyMjBpO2/jtrxUX3WF5UaIKZp/unK332xuefHNFnkMYtZ05p0V71iSdO35tBdz8yt0VYP2WtUsp+w==} + /@dydxprotocol/v4-proto@0.4.1: + resolution: {integrity: sha512-2pBkokufWcxfIpiXE6QuQOBXUe154OTp6ojCIdOPW9TFLxzchoygxXnb5dL6rAQVNj9Qbg+hhXBllutt4m99dw==} dependencies: protobufjs: 6.11.4 dev: false @@ -4708,8 +4681,8 @@ packages: resolution: {integrity: sha512-osvveYtyzdEVbt3OfwwXFr4P2iVBL5u1Q3q4ONBfDY/UpOuXmOlbgwc1xECEboY8wIays8Yt6onaWMUdUbfl0A==} dependencies: '@noble/curves': 1.1.0 - '@noble/hashes': 1.3.1 - '@scure/base': 1.1.1 + '@noble/hashes': 1.3.2 + '@scure/base': 1.1.3 dev: false /@scure/bip32@1.3.2: @@ -4731,7 +4704,7 @@ packages: resolution: {integrity: sha512-Z3/Fsz1yr904dduJD0NpiyRHhRYHdcnyh73FZWiV+/qhWi83wNJ3NWolYqCEN+ZWsUz2TWwajJggcRE9r1zUYg==} dependencies: '@noble/hashes': 1.3.2 - '@scure/base': 1.1.1 + '@scure/base': 1.1.3 dev: false /@solana/buffer-layout@4.0.1: @@ -4745,8 +4718,8 @@ packages: resolution: {integrity: sha512-up5VG1dK+GPhykmuMIozJZBbVqpm77vbOG6/r5dS7NBGZonwHfTLdBbsYc3rjmaQ4DpCXUa3tUc4RZHRORvZrw==} dependencies: '@babel/runtime': 7.22.10 - '@noble/curves': 1.1.0 - '@noble/hashes': 1.3.1 + '@noble/curves': 1.2.0 + '@noble/hashes': 1.3.2 '@solana/buffer-layout': 4.0.1 agentkeepalive: 4.5.0 bigint-buffer: 1.1.5 @@ -7144,7 +7117,7 @@ packages: /bip39@3.1.0: resolution: {integrity: sha512-c9kiwdk45Do5GL0vJMe7tS95VjCii65mYAH7DfWl3uW8AVzXKQVUm64i3hzVybBDMp9r7j9iNxR85+ul8MdN/A==} dependencies: - '@noble/hashes': 1.3.1 + '@noble/hashes': 1.3.2 dev: false /bl@5.1.0: @@ -14099,3 +14072,33 @@ packages: /zwitch@2.0.4: resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==} dev: true + + file:../v4-clients/v4-client-js/dydxprotocol-v4-client-js-0.40.1.tgz: + resolution: {integrity: sha512-QMWMKM/DC2/1lDa7pvQKIrTpXYv5mq9Ixjs3I1KCxgMcdi8WFVxFwJicmH00B7VCPcvHGdfoXGj6Szs+Ug+u7w==, tarball: file:../v4-clients/v4-client-js/dydxprotocol-v4-client-js-0.40.1.tgz} + name: '@dydxprotocol/v4-client-js' + version: 0.40.1 + dependencies: + '@cosmjs/amino': 0.30.1 + '@cosmjs/encoding': 0.31.1 + '@cosmjs/math': 0.31.1 + '@cosmjs/proto-signing': 0.30.1 + '@cosmjs/stargate': 0.30.1 + '@cosmjs/tendermint-rpc': 0.30.1 + '@cosmjs/utils': 0.31.1 + '@dydxprotocol/v4-proto': 0.4.1 + '@osmonauts/lcd': 0.6.0 + '@scure/bip32': 1.3.2 + '@scure/bip39': 1.2.1 + axios: 1.1.3 + bech32: 1.1.4 + bignumber.js: 9.1.1 + ethereum-cryptography: 2.1.2 + ethers: 6.6.1 + long: 4.0.0 + protobufjs: 6.11.4 + ws: 8.13.0(bufferutil@4.0.7)(utf-8-validate@5.0.10) + transitivePeerDependencies: + - bufferutil + - debug + - utf-8-validate + dev: false diff --git a/public/configs/env.json b/public/configs/env.json index 0b2ef9d..e5312c1 100644 --- a/public/configs/env.json +++ b/public/configs/env.json @@ -40,7 +40,7 @@ "isMainNet": false, "tokens": { "chain": { - "name": "DYDX", + "name": "Dv4TNT", "denom": "adv4tnt", "decimals": 18, "image": "/currencies/dydx.png" @@ -100,7 +100,7 @@ "isMainNet": false, "tokens": { "chain": { - "name": "DYDX", + "name": "Dv4TNT", "denom": "adv4tnt", "decimals": 18, "image": "/currencies/dydx.png" @@ -159,7 +159,7 @@ "isMainNet": false, "tokens": { "chain": { - "name": "DYDX", + "name": "Dv4TNT", "denom": "adv4tnt", "decimals": 18, "image": "/currencies/dydx.png" @@ -218,7 +218,7 @@ "isMainNet": false, "tokens": { "chain": { - "name": "DYDX", + "name": "Dv4TNT", "denom": "adv4tnt", "decimals": 18, "image": "/currencies/dydx.png" @@ -277,7 +277,7 @@ "isMainNet": false, "tokens": { "chain": { - "name": "DYDX", + "name": "Dv4TNT", "denom": "adv4tnt", "decimals": 18, "image": "/currencies/dydx.png" @@ -340,7 +340,7 @@ "isMainNet": false, "tokens": { "chain": { - "name": "DYDX", + "name": "Dv4TNT", "denom": "adv4tnt", "decimals": 18, "image": "/currencies/dydx.png" @@ -403,7 +403,7 @@ "isMainNet": false, "tokens": { "chain": { - "name": "DYDX", + "name": "Dv4TNT", "denom": "adv4tnt", "decimals": 18, "image": "/currencies/dydx.png" @@ -468,7 +468,7 @@ "isMainNet": false, "tokens": { "chain": { - "name": "DYDX", + "name": "Dv4TNT", "denom": "adv4tnt", "decimals": 18, "image": "/currencies/dydx.png" @@ -532,7 +532,7 @@ "isMainNet": false, "tokens": { "chain": { - "name": "DYDX", + "name": "Dv4TNT", "denom": "adv4tnt", "decimals": 18, "image": "/currencies/dydx.png" @@ -596,7 +596,7 @@ "isMainNet": false, "tokens": { "chain": { - "name": "DYDX", + "name": "Dv4TNT", "denom": "adv4tnt", "decimals": 18, "image": "/currencies/dydx.png" @@ -660,7 +660,7 @@ "isMainNet": false, "tokens": { "chain": { - "name": "DYDX", + "name": "Dv4TNT", "denom": "adv4tnt", "decimals": 18, "image": "/currencies/dydx.png" @@ -724,7 +724,7 @@ "isMainNet": false, "tokens": { "chain": { - "name": "DYDX", + "name": "Dv4TNT", "denom": "adv4tnt", "decimals": 18, "image": "/currencies/dydx.png" @@ -789,7 +789,7 @@ "tokens": { "comment": "Change according to mainnet release", "chain": { - "name": "DYDX", + "name": "Dv4TNT", "denom": "adv4tnt", "decimals": 18, "image": "/currencies/dydx.png" diff --git a/src/App.tsx b/src/App.tsx index 95ef909..7f11814 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -7,7 +7,13 @@ import { GrazProvider } from 'graz'; import { AppRoute, DEFAULT_TRADE_ROUTE } from '@/constants/routes'; -import { useBreakpoints, useInitializePage, useShouldShowFooter, useAnalytics } from '@/hooks'; +import { + useBreakpoints, + useTokenConfigs, + useInitializePage, + useShouldShowFooter, + useAnalytics, +} from '@/hooks'; import { DydxProvider } from '@/hooks/useDydxClient'; import { AccountsProvider } from '@/hooks/useAccounts'; import { DialogAreaProvider, useDialogArea } from '@/hooks/useDialogArea'; @@ -57,6 +63,7 @@ const Content = () => { const { isTablet, isNotTablet } = useBreakpoints(); const isShowingHeader = isNotTablet; const isShowingFooter = useShouldShowFooter(); + const { chainLabel } = useTokenConfigs(); return ( @@ -71,7 +78,7 @@ const Content = () => { } /> - } /> + } /> {isTablet && ( <> } /> diff --git a/src/constants/networks.ts b/src/constants/networks.ts index b2c8b47..687e521 100644 --- a/src/constants/networks.ts +++ b/src/constants/networks.ts @@ -1,3 +1,4 @@ +import { env } from 'process'; import environments from '../../public/configs/env.json'; // TODO: Update for Mainnet deployment diff --git a/src/constants/routes.ts b/src/constants/routes.ts index ff30df3..23a2940 100644 --- a/src/constants/routes.ts +++ b/src/constants/routes.ts @@ -7,7 +7,6 @@ export enum AppRoute { Profile = '/profile', Alerts = '/alerts', Settings = '/settings', - Rewards = '/DV4TNT', Terms = '/terms', Privacy = '/privacy', } diff --git a/src/constants/wallets.ts b/src/constants/wallets.ts index 5bc125f..ab94cda 100644 --- a/src/constants/wallets.ts +++ b/src/constants/wallets.ts @@ -1,5 +1,5 @@ import type { ExternalProvider } from '@ethersproject/providers'; -import { USDC_DENOM, type onboarding, DYDX_DENOM } from '@dydxprotocol/v4-client-js'; +import { type onboarding } from '@dydxprotocol/v4-client-js'; import type { suggestChain } from 'graz'; import { STRING_KEYS } from '@/constants/localization'; @@ -352,15 +352,5 @@ export const DYDX_CHAIN_INFO: Parameters[0] = { // TODO: export this type from abacus instead export enum DydxChainAsset { USDC = 'usdc', - DYDX = 'dydx', + CHAIN = 'chain', } - -export const DYDX_CHAIN_ASSET_COIN_DENOM: Record = { - [DydxChainAsset.USDC]: USDC_DENOM, - [DydxChainAsset.DYDX]: DYDX_DENOM, -}; - -export const DYDX_CHAIN_ASSET_TAGS: Record = { - [DydxChainAsset.USDC]: 'USDC', - [DydxChainAsset.DYDX]: 'Dv4TNT', -}; diff --git a/src/hooks/index.ts b/src/hooks/index.ts index 6908601..c374d1c 100644 --- a/src/hooks/index.ts +++ b/src/hooks/index.ts @@ -1,5 +1,6 @@ import { useApiState } from './useApiState'; import { useBreakpoints } from './useBreakpoints'; +import { useTokenConfigs } from './useTokenConfigs'; import { useCommandMenu } from './useCommandMenu'; import { useCurrentMarketId } from './useCurrentMarketId'; import { useDebounce } from './useDebounce'; @@ -25,6 +26,7 @@ import { useSubaccount } from './useSubaccount'; export { useApiState, useBreakpoints, + useTokenConfigs, useCommandMenu, useCurrentMarketId, useDebounce, diff --git a/src/hooks/useAccountBalance.ts b/src/hooks/useAccountBalance.ts index 64f8334..474c72f 100644 --- a/src/hooks/useAccountBalance.ts +++ b/src/hooks/useAccountBalance.ts @@ -5,8 +5,6 @@ import { StargateClient } from '@cosmjs/stargate'; import { useQuery } from 'react-query'; import { formatUnits } from 'viem'; -import { USDC_DENOM, DYDX_DENOM } from '@dydxprotocol/v4-client-js'; - import { ENVIRONMENT_CONFIG_MAP } from '@/constants/networks'; import { QUANTUM_MULTIPLIER } from '@/constants/numbers'; import { EvmAddress } from '@/constants/wallets'; @@ -53,6 +51,8 @@ export const useAccountBalance = ({ const selectedNetwork = useSelector(getSelectedNetwork); const balances = useSelector(getBalances, shallowEqual); const evmChainId = Number(ENVIRONMENT_CONFIG_MAP[selectedNetwork].ethereumChainId); + const chainDenom = ENVIRONMENT_CONFIG_MAP[selectedNetwork].tokens['chain'].denom; + const usdcDenom = ENVIRONMENT_CONFIG_MAP[selectedNetwork].tokens['usdc'].denom; const stakingBalances = useSelector(getStakingBalances, shallowEqual); const evmQuery = useBalance({ @@ -93,15 +93,15 @@ export const useAccountBalance = ({ const { formatted: evmBalance } = evmQuery.data || {}; const balance = !assetSymbol ? '0' : isCosmosChain ? cosmosQuery.data : evmBalance; - const nativeTokenCoinBalance = balances?.[DYDX_DENOM]; + const nativeTokenCoinBalance = balances?.[chainDenom]; const nativeTokenBalance = MustBigNumber(nativeTokenCoinBalance?.amount) .div(QUANTUM_MULTIPLIER) .toNumber(); - const usdcCoinBalance = balances?.[USDC_DENOM]; + const usdcCoinBalance = balances?.[usdcDenom]; const usdcBalance = MustBigNumber(usdcCoinBalance?.amount).div(QUANTUM_MULTIPLIER).toNumber(); - const nativeStakingCoinBalanace = stakingBalances?.[DYDX_DENOM]; + const nativeStakingCoinBalanace = stakingBalances?.[chainDenom]; const nativeStakingBalance = MustBigNumber(nativeStakingCoinBalanace?.amount) .div(QUANTUM_MULTIPLIER) .toNumber(); diff --git a/src/hooks/useAccounts.tsx b/src/hooks/useAccounts.tsx index 34a6b03..bf1df08 100644 --- a/src/hooks/useAccounts.tsx +++ b/src/hooks/useAccounts.tsx @@ -2,7 +2,7 @@ import { useCallback, useContext, createContext, useEffect, useState, useMemo } import { useDispatch } from 'react-redux'; import { AES, enc } from 'crypto-js'; -import { LocalWallet, USDC_DENOM, type Subaccount } from '@dydxprotocol/v4-client-js'; +import { LocalWallet, type Subaccount } from '@dydxprotocol/v4-client-js'; import { OnboardingGuard, OnboardingState, type EvmDerivedAddresses } from '@/constants/account'; import { DialogTypes } from '@/constants/dialogs'; @@ -130,16 +130,8 @@ const useAccountsContext = () => { // dYdX subaccounts const [dydxSubaccounts, setDydxSubaccounts] = useState(); - const { getAccountBalance, getSubaccounts } = useMemo( + const { getSubaccounts } = useMemo( () => ({ - getAccountBalance: async ({ - dydxAddress, - denom = USDC_DENOM, - }: { - dydxAddress: DydxAddress; - denom?: string; - }) => await compositeClient?.validatorClient.get.getAccountBalance(dydxAddress, denom), - getSubaccounts: async ({ dydxAddress }: { dydxAddress: DydxAddress }) => { try { const response = await compositeClient?.indexerClient.account.getSubaccounts(dydxAddress); @@ -326,7 +318,6 @@ const useAccountsContext = () => { disconnect, // dydxClient Account methods - getAccountBalance, getSubaccounts, }; }; diff --git a/src/hooks/useSubaccount.tsx b/src/hooks/useSubaccount.tsx index 042a599..afe9cf9 100644 --- a/src/hooks/useSubaccount.tsx +++ b/src/hooks/useSubaccount.tsx @@ -3,15 +3,10 @@ import { shallowEqual, useSelector, useDispatch } from 'react-redux'; import type { Nullable } from '@dydxprotocol/v4-abacus'; import Long from 'long'; import type { IndexedTx } from '@cosmjs/stargate'; -import type { EncodeObject, Coin } from '@cosmjs/proto-signing'; +import type { EncodeObject } from '@cosmjs/proto-signing'; import { Method } from '@cosmjs/tendermint-rpc'; -import { - type LocalWallet, - SubaccountClient, - DYDX_DENOM, - USDC_DENOM, -} from '@dydxprotocol/v4-client-js'; +import { type LocalWallet, SubaccountClient } from '@dydxprotocol/v4-client-js'; import type { AccountBalance, @@ -34,6 +29,7 @@ import { MustBigNumber } from '@/lib/numbers'; import { log } from '@/lib/telemetry'; import { useAccounts } from './useAccounts'; +import { useTokenConfigs } from './useTokenConfigs'; import { useDydxClient } from './useDydxClient'; type SubaccountContextType = ReturnType; @@ -52,6 +48,7 @@ export const useSubaccount = () => useContext(SubaccountContext); export const useSubaccountContext = ({ localDydxWallet }: { localDydxWallet?: LocalWallet }) => { const dispatch = useDispatch(); + const { usdcDenom } = useTokenConfigs(); const { compositeClient, faucetClient } = useDydxClient(); const { getFaucetFunds } = useMemo( @@ -91,7 +88,7 @@ export const useSubaccountContext = ({ localDydxWallet }: { localDydxWallet?: Lo }: { subaccountClient: SubaccountClient; amount: number; - }) => await compositeClient?.withdrawFromSubaccount(subaccountClient, amount), + }) => await compositeClient?.withdrawFromSubaccount(subaccountClient, amount.toString()), transferFromSubaccountToAddress: async ({ subaccountClient, @@ -134,13 +131,20 @@ export const useSubaccountContext = ({ localDydxWallet }: { localDydxWallet?: Lo amount: number; recipient: string; }) => - await compositeClient?.validatorClient.post.sendToken( - subaccountClient, - recipient, - DYDX_DENOM, - Long.fromNumber(amount * QUANTUM_MULTIPLIER), + await compositeClient?.send( + subaccountClient.wallet, + () => + new Promise((resolve) => { + const msg = compositeClient?.sendTokenMessage( + subaccountClient.wallet, + amount.toString(), + recipient, + ); + + resolve([msg]); + }), false, - Method.BroadcastTxCommit + compositeClient?.validatorClient?.post.defaultDydxGasPrice, ), sendSquidWithdrawFromSubaccount: async ({ @@ -156,7 +160,7 @@ export const useSubaccountContext = ({ localDydxWallet }: { localDydxWallet?: Lo const transaction = JSON.parse(payload); - const msg = compositeClient.withdrawFromSubaccountMessage(subaccountClient, amount); + const msg = compositeClient.withdrawFromSubaccountMessage(subaccountClient, amount.toString()); const ibcMsg: EncodeObject = { typeUrl: transaction.msgTypeUrl, value: transaction.msg, @@ -210,7 +214,7 @@ export const useSubaccountContext = ({ localDydxWallet }: { localDydxWallet?: Lo ); const balances = useSelector(getBalances, shallowEqual); - const usdcCoinBalance = balances?.[USDC_DENOM]; + const usdcCoinBalance = balances?.[usdcDenom]; useEffect(() => { if (usdcCoinBalance) { @@ -247,8 +251,7 @@ export const useSubaccountContext = ({ localDydxWallet }: { localDydxWallet?: Lo if (!subaccountClient) { return; } - - return (await (coinDenom === USDC_DENOM + return (await (coinDenom === usdcDenom ? transferFromSubaccountToAddress : transferNativeToken)({ subaccountClient, amount, recipient })) as IndexedTx; }, diff --git a/src/hooks/useTokenConfigs.ts b/src/hooks/useTokenConfigs.ts new file mode 100644 index 0000000..4ecbd09 --- /dev/null +++ b/src/hooks/useTokenConfigs.ts @@ -0,0 +1,34 @@ +import { ENVIRONMENT_CONFIG_MAP } from '@/constants/networks'; +import { DydxChainAsset } from '@/constants/wallets'; + +import { useSelectedNetwork } from '@/hooks'; + +export const useTokenConfigs = (): { + tokensConfigs: { + ['usdc']: { + denom: string; + name: string; + decimals: number; + }, + ['chain']: { + denom: string; + name: string; + decimals: number; + }, + }; + usdcDenom: string; + usdcLabel: string; + chainDenom: string; + chainLabel: string; +} => { + const { selectedNetwork } = useSelectedNetwork(); + const tokensConfigs = ENVIRONMENT_CONFIG_MAP[selectedNetwork].tokens; + + return { + tokensConfigs, + usdcDenom: tokensConfigs[DydxChainAsset.USDC].denom, + usdcLabel: tokensConfigs[DydxChainAsset.USDC].name, + chainDenom: tokensConfigs[DydxChainAsset.CHAIN].denom, + chainLabel: tokensConfigs[DydxChainAsset.CHAIN].name, + }; +}; diff --git a/src/layout/Header/HeaderDesktop.tsx b/src/layout/Header/HeaderDesktop.tsx index 8105465..0fba874 100644 --- a/src/layout/Header/HeaderDesktop.tsx +++ b/src/layout/Header/HeaderDesktop.tsx @@ -6,9 +6,10 @@ import { ButtonShape } from '@/constants/buttons'; import { DialogTypes } from '@/constants/dialogs'; import { STRING_KEYS } from '@/constants/localization'; import { AppRoute } from '@/constants/routes'; -import { useStringGetter } from '@/hooks'; import { LogoShortIcon, BellStrokeIcon } from '@/icons'; +import { useTokenConfigs, useStringGetter } from '@/hooks'; + import { Icon, IconName } from '@/components/Icon'; import { IconButton } from '@/components/IconButton'; import { NavigationMenu } from '@/components/NavigationMenu'; @@ -27,6 +28,7 @@ import { layoutMixins } from '@/styles/layoutMixins'; export const HeaderDesktop = () => { const stringGetter = useStringGetter(); const dispatch = useDispatch(); + const { chainLabel } = useTokenConfigs(); const navItems = [ { @@ -43,9 +45,9 @@ export const HeaderDesktop = () => { href: AppRoute.Trade, }, { - value: 'Dv4TNT', - label: 'Dv4TNT', - href: AppRoute.Rewards, + value: chainLabel, + label: chainLabel, + href: `/${chainLabel}`, }, { value: 'PORTFOLIO', diff --git a/src/lib/abacus/dydxChainTransactions.ts b/src/lib/abacus/dydxChainTransactions.ts index 45fc8a4..5080bdf 100644 --- a/src/lib/abacus/dydxChainTransactions.ts +++ b/src/lib/abacus/dydxChainTransactions.ts @@ -14,8 +14,6 @@ import { OrderSide, OrderTimeInForce, OrderExecution, - DYDX_DENOM, - GAS_PRICE_DYDX_DENOM, } from '@dydxprotocol/v4-client-js'; import { @@ -66,16 +64,37 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol { ): Promise { try { const parsedParams = paramsInJson ? JSON.parse(paramsInJson) : {}; - const { indexerUrl, websocketUrl, validatorUrl, chainId } = parsedParams; + const { + indexerUrl, + websocketUrl, + validatorUrl, + chainId, + USDC_DENOM, + USDC_DECIMALS, + USDC_GAS_DENOM, + CHAINTOKEN_DENOM, + CHAINTOKEN_DECIMALS, + } = parsedParams; const compositeClient = await CompositeClient.connect( new Network( chainId, new IndexerConfig(indexerUrl, websocketUrl), - new ValidatorConfig(validatorUrl, chainId, { - broadcastPollIntervalMs: 3_000, - broadcastTimeoutMs: 60_000, - }) + new ValidatorConfig( + validatorUrl, + chainId, + { + USDC_DENOM, + USDC_DECIMALS, + USDC_GAS_DENOM, + CHAINTOKEN_DENOM, + CHAINTOKEN_DECIMALS, + }, + { + broadcastPollIntervalMs: 3_000, + broadcastTimeoutMs: 60_000, + } + ) ) ); @@ -208,9 +227,9 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol { new SubaccountClient(this.localWallet, subaccountNumber), clientId, orderFlags, - clobPairId, - goodTilBlock ?? undefined, - goodTilBlockTime ?? undefined + clobPairId.toString(), + goodTilBlock || undefined, + goodTilBlockTime || undefined, ); const parsedTx = this.parseToPrimitives(tx); @@ -273,16 +292,18 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol { this.localWallet, () => new Promise((resolve) => { - const msg = compositeClient?.validatorClient.post.composer.composeMsgSendToken( - subaccountClient.address, + if (!this.localWallet) { + throw new Error('Missing compositeClient or localWallet'); + } + const msg = compositeClient?.sendTokenMessage( + this.localWallet, + amount, recipient, - DYDX_DENOM, - Long.fromNumber(amount * QUANTUM_MULTIPLIER) ); resolve([msg]); }), - GAS_PRICE_DYDX_DENOM + this.compositeClient?.validatorClient?.post.defaultDydxGasPrice, ); const parsedTx = this.parseToPrimitives(tx); diff --git a/src/pages/rewards/DYDXBalancePanel.tsx b/src/pages/rewards/DYDXBalancePanel.tsx index 93bba51..ca2ee7c 100644 --- a/src/pages/rewards/DYDXBalancePanel.tsx +++ b/src/pages/rewards/DYDXBalancePanel.tsx @@ -3,7 +3,7 @@ import styled, { AnyStyledComponent } from 'styled-components'; import { shallowEqual, useDispatch, useSelector } from 'react-redux'; import { layoutMixins } from '@/styles/layoutMixins'; -import { useAccountBalance, useAccounts, useStringGetter } from '@/hooks'; +import { useAccountBalance, useAccounts, useTokenConfigs, useStringGetter } from '@/hooks'; import { ButtonAction, ButtonSize } from '@/constants/buttons'; import { DialogTypes } from '@/constants/dialogs'; @@ -30,6 +30,7 @@ export const DYDXBalancePanel = () => { const { walletType } = useAccounts(); const canAccountTrade = useSelector(calculateCanAccountTrade, shallowEqual); const { nativeTokenBalance, nativeStakingBalance } = useAccountBalance(); + const { chainLabel } = useTokenConfigs(); return ( { {/* */} - Dv4TNT + {chainLabel} {!canAccountTrade ? ( @@ -106,7 +107,13 @@ export const DYDXBalancePanel = () => { { key: 'totalBalance', label: 'Total balance', - value: , + value: ( + + ), }, ]} /> @@ -174,7 +181,6 @@ Styled.WalletAndStakedBalance = styled(Details)` grid-template-columns: 1fr 1fr; gap: 0.5rem; - > div { gap: 1rem; diff --git a/src/views/AccountInfo/AccountInfoConnectedState.tsx b/src/views/AccountInfo/AccountInfoConnectedState.tsx index f639724..495e808 100644 --- a/src/views/AccountInfo/AccountInfoConnectedState.tsx +++ b/src/views/AccountInfo/AccountInfoConnectedState.tsx @@ -75,16 +75,14 @@ export const AccountInfoConnectedState = () => { {stringGetter({ key: STRING_KEYS.ACCOUNT })} - {import.meta.env.MODE !== 'production' && ( - dispatch(openDialog({ type: DialogTypes.Withdraw }))} - shape={ButtonShape.Pill} - size={ButtonSize.XSmall} - > - {stringGetter({ key: STRING_KEYS.WITHDRAW })} - - )} + dispatch(openDialog({ type: DialogTypes.Withdraw }))} + shape={ButtonShape.Pill} + size={ButtonSize.XSmall} + > + {stringGetter({ key: STRING_KEYS.WITHDRAW })} + dispatch(openDialog({ type: DialogTypes.Deposit }))} diff --git a/src/views/dialogs/DepositDialog.tsx b/src/views/dialogs/DepositDialog.tsx index 9baa069..c79d7d0 100644 --- a/src/views/dialogs/DepositDialog.tsx +++ b/src/views/dialogs/DepositDialog.tsx @@ -32,12 +32,9 @@ export const DepositDialog = ({ setIsOpen }: ElementProps) => { > {showTestDeposit ? : } - {/* TODO TRCL-1693 - uncomment when deposit form is ready */} - {import.meta.env.MODE !== 'production' && ( - setShowTestDeposit(!showTestDeposit)}> - {showTestDeposit ? 'Show deposit form (Under Construction)' : 'Show test faucet'} - - )} + setShowTestDeposit(!showTestDeposit)}> + {showTestDeposit ? 'Show deposit form (Under Construction)' : 'Show test faucet'} + ); diff --git a/src/views/dialogs/ReceiveDialog.tsx b/src/views/dialogs/ReceiveDialog.tsx index b9546fa..68ae2a4 100644 --- a/src/views/dialogs/ReceiveDialog.tsx +++ b/src/views/dialogs/ReceiveDialog.tsx @@ -6,7 +6,7 @@ import { DydxChainAsset } from '@/constants/wallets'; import { formMixins } from '@/styles/formMixins'; import { layoutMixins } from '@/styles/layoutMixins'; -import { useAccounts, useStringGetter } from '@/hooks'; +import { useAccounts, useTokenConfigs, useStringGetter } from '@/hooks'; import { AssetIcon } from '@/components/AssetIcon'; import { CopyButton } from '@/components/CopyButton'; @@ -24,9 +24,10 @@ type ElementProps = { setIsOpen: (open: boolean) => void; }; -export const ReceiveDialog = ({ selectedAsset = DydxChainAsset.DYDX, setIsOpen }: ElementProps) => { +export const ReceiveDialog = ({ selectedAsset = DydxChainAsset.CHAIN, setIsOpen }: ElementProps) => { const stringGetter = useStringGetter(); const { dydxAddress } = useAccounts(); + const { chainLabel, usdcLabel } = useTokenConfigs(); const [asset, setAsset] = useState(selectedAsset); @@ -35,16 +36,16 @@ export const ReceiveDialog = ({ selectedAsset = DydxChainAsset.DYDX, setIsOpen } value: DydxChainAsset.USDC, label: ( - USDC + {usdcLabel} ), }, { - value: DydxChainAsset.DYDX, + value: DydxChainAsset.CHAIN, label: ( {/* */} - Dv4TNT + {chainLabel} ), }, diff --git a/src/views/forms/TransferForm.tsx b/src/views/forms/TransferForm.tsx index 1af5694..12318ad 100644 --- a/src/views/forms/TransferForm.tsx +++ b/src/views/forms/TransferForm.tsx @@ -11,11 +11,7 @@ import { ButtonShape, ButtonSize } from '@/constants/buttons'; import { STRING_KEYS } from '@/constants/localization'; import { ENVIRONMENT_CONFIG_MAP } from '@/constants/networks'; import { NumberSign } from '@/constants/numbers'; -import { - DYDX_CHAIN_ASSET_COIN_DENOM, - DYDX_CHAIN_ASSET_TAGS, - DydxChainAsset, -} from '@/constants/wallets'; +import { DydxChainAsset } from '@/constants/wallets'; import { useAccountBalance, @@ -25,6 +21,7 @@ import { useSelectedNetwork, useStringGetter, useSubaccount, + useTokenConfigs, } from '@/hooks'; import { formMixins } from '@/styles/formMixins'; @@ -57,7 +54,7 @@ type TransferFormProps = { }; export const TransferForm = ({ - selectedAsset = DydxChainAsset.DYDX, + selectedAsset = DydxChainAsset.CHAIN, onDone, className, }: TransferFormProps) => { @@ -72,6 +69,7 @@ export const TransferForm = ({ const { transfer } = useSubaccount(); const { nativeTokenBalance, usdcBalance } = useAccountBalance(); const { selectedNetwork } = useSelectedNetwork(); + const { tokensConfigs, usdcLabel, chainLabel } = useTokenConfigs(); // User Input const [asset, setAsset] = useState(selectedAsset); @@ -138,7 +136,7 @@ export const TransferForm = ({ try { // Subtract fees from amount if sending native tokens const amountToTransfer = ( - asset === DydxChainAsset.DYDX ? amountBN.minus(fee) : amountBN + asset === DydxChainAsset.CHAIN ? amountBN.minus(fee) : amountBN ).toNumber(); const screenResults = await screenAddresses({ @@ -161,7 +159,7 @@ export const TransferForm = ({ const txResponse = await transfer( amountToTransfer, recipientAddress as string, - DYDX_CHAIN_ASSET_COIN_DENOM[asset] + tokensConfigs[asset].denom, ); if (txResponse?.code === 0) { @@ -220,16 +218,16 @@ export const TransferForm = ({ value: DydxChainAsset.USDC, label: ( - {DYDX_CHAIN_ASSET_TAGS[DydxChainAsset.USDC]} + {usdcLabel} ), }, { - value: DydxChainAsset.DYDX, + value: DydxChainAsset.CHAIN, label: ( {/* */} - {DYDX_CHAIN_ASSET_TAGS[DydxChainAsset.DYDX]} + {chainLabel} ), }, @@ -251,7 +249,7 @@ export const TransferForm = ({ key: 'amount', label: ( - {stringGetter({ key: STRING_KEYS.AVAILABLE })} {DYDX_CHAIN_ASSET_TAGS[asset]} + {stringGetter({ key: STRING_KEYS.AVAILABLE })} {tokensConfigs[asset].name} ), value: ( diff --git a/src/views/forms/TransferForm/TransferButtonAndReceipt.tsx b/src/views/forms/TransferForm/TransferButtonAndReceipt.tsx index a9dd149..7e8c415 100644 --- a/src/views/forms/TransferForm/TransferButtonAndReceipt.tsx +++ b/src/views/forms/TransferForm/TransferButtonAndReceipt.tsx @@ -3,9 +3,9 @@ import { shallowEqual, useSelector } from 'react-redux'; import { ButtonAction, ButtonSize, ButtonType } from '@/constants/buttons'; import { STRING_KEYS } from '@/constants/localization'; import { NumberSign } from '@/constants/numbers'; -import { DYDX_CHAIN_ASSET_TAGS, DydxChainAsset } from '@/constants/wallets'; +import { DydxChainAsset } from '@/constants/wallets'; -import { useAccountBalance, useStringGetter } from '@/hooks'; +import { useAccountBalance, useTokenConfigs, useStringGetter } from '@/hooks'; import { Button } from '@/components/Button'; import { DiffOutput } from '@/components/DiffOutput'; @@ -37,6 +37,7 @@ export const TransferButtonAndReceipt = ({ const stringGetter = useStringGetter(); const canAccountTrade = useSelector(calculateCanAccountTrade, shallowEqual); const { size } = useSelector(getTransferInputs, shallowEqual) || {}; + const { tokensConfigs } = useTokenConfigs(); const { equity: equityInfo, leverage: leverageInfo } = useSelector(getSubaccount, shallowEqual) || {}; @@ -60,7 +61,7 @@ export const TransferButtonAndReceipt = ({ key: 'fees', label: ( - {stringGetter({ key: STRING_KEYS.FEES })} {DYDX_CHAIN_ASSET_TAGS[selectedAsset]} + {stringGetter({ key: STRING_KEYS.FEES })} {tokensConfigs[selectedAsset].name} ), value: , @@ -69,7 +70,7 @@ export const TransferButtonAndReceipt = ({ key: 'balance', label: ( - {stringGetter({ key: STRING_KEYS.BALANCE })} {DYDX_CHAIN_ASSET_TAGS[selectedAsset]} + {stringGetter({ key: STRING_KEYS.BALANCE })} {tokensConfigs[selectedAsset].name} ), value: ( diff --git a/src/views/menus/AccountMenu.tsx b/src/views/menus/AccountMenu.tsx index cbbfd62..3818655 100644 --- a/src/views/menus/AccountMenu.tsx +++ b/src/views/menus/AccountMenu.tsx @@ -9,7 +9,13 @@ import { DialogTypes } from '@/constants/dialogs'; import { STRING_KEYS, TOOLTIP_STRING_KEYS } from '@/constants/localization'; import { DydxChainAsset, wallets } from '@/constants/wallets'; -import { useAccounts, useBreakpoints, useStringGetter, useAccountBalance } from '@/hooks'; +import { + useAccounts, + useBreakpoints, + useTokenConfigs, + useStringGetter, + useAccountBalance, +} from '@/hooks'; import { OnboardingTriggerButton } from '@/views/dialogs/OnboardingTriggerButton'; @@ -18,6 +24,7 @@ import { DropdownMenu } from '@/components/DropdownMenu'; import { Output, OutputType } from '@/components/Output'; import { Icon, IconName } from '@/components/Icon'; import { IconButton } from '@/components/IconButton'; +import { ENVIRONMENT_CONFIG_MAP } from '@/constants/networks'; import { WithTooltip } from '@/components/WithTooltip'; import { openDialog } from '@/state/dialogs'; @@ -39,6 +46,7 @@ export const AccountMenu = () => { const onboardingState = useSelector(getOnboardingState); const { freeCollateral } = useSelector(getSubaccount, shallowEqual) || {}; const { nativeTokenBalance } = useAccountBalance(); + const { usdcLabel, chainLabel } = useTokenConfigs(); const { evmAddress, walletType, dydxAddress, hdKey } = useAccounts(); @@ -107,17 +115,23 @@ export const AccountMenu = () => {
- {stringGetter({ key: STRING_KEYS.ASSET_BALANCE, params: { ASSET: 'Dv4TNT' } })} + {stringGetter({ + key: STRING_KEYS.ASSET_BALANCE, + params: { ASSET: chainLabel }, + })} {/* */}
- +
- {stringGetter({ key: STRING_KEYS.ASSET_BALANCE, params: { ASSET: 'USDC' } })} + {stringGetter({ + key: STRING_KEYS.ASSET_BALANCE, + params: { ASSET: usdcLabel }, + })}