From 27b79957d4a205ea141a87117fbd3874e3f1848f Mon Sep 17 00:00:00 2001 From: Bill Date: Thu, 19 Oct 2023 11:01:12 -0700 Subject: [PATCH] Bump v4 clients (#89) * Have tokens be configurable, bump v4-client * bump * chain -> chaintoken * use cancelRawOrder * address comments * add TODO --- package.json | 4 +- pnpm-lock.yaml | 41 +++++++-------- public/configs/env.json | 28 +++++----- src/App.tsx | 11 +++- src/constants/routes.ts | 1 - src/constants/wallets.ts | 14 +---- src/hooks/index.ts | 2 + src/hooks/useAccountBalance.ts | 20 +++----- src/hooks/useAccounts.tsx | 13 +---- src/hooks/useSubaccount.tsx | 39 +++++++------- src/hooks/useTokenConfigs.ts | 34 +++++++++++++ src/layout/Header/HeaderDesktop.tsx | 10 ++-- src/lib/abacus/dydxChainTransactions.ts | 51 +++++++++++++------ src/pages/rewards/DYDXBalancePanel.tsx | 14 +++-- .../AccountInfo/AccountInfoConnectedState.tsx | 18 +++---- src/views/dialogs/DepositDialog.tsx | 9 ++-- src/views/dialogs/ReceiveDialog.tsx | 12 +++-- src/views/forms/TransferForm.tsx | 22 ++++---- .../TransferForm/TransferButtonAndReceipt.tsx | 9 ++-- src/views/menus/AccountMenu.tsx | 21 ++++++-- 20 files changed, 218 insertions(+), 155 deletions(-) create mode 100644 src/hooks/useTokenConfigs.ts diff --git a/package.json b/package.json index ae82166..c1682d3 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": "^0.40.3", "@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..7a386c0 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: ^0.40.3 + version: 0.40.3 '@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,12 +979,12 @@ packages: resolution: {integrity: sha512-RpfLEtTlyIxeNPGKcokS+p3BZII/Q3bYxryFRglh5H3A3T8q9fsLYm72VYAMEOOIBLEa8o93kFLiBDUWKrwXZA==} dev: true - /@dydxprotocol/v4-abacus@0.7.0: - resolution: {integrity: sha512-XheqfIpOODfQFG860oH0fneVgp9qQKPMDTwrvFXaM/JtKH9ekOUUO6De72EsJ7qOuxWwl1WgoALA8b4tRs0tiw==} + /@dydxprotocol/v4-abacus@0.7.2: + resolution: {integrity: sha512-5foamomN82FH6ko3EuzwFlSoAEY6Sal8fDgvZo2RsB19Ks6SFgFDeeOcEDdfoa3DNwvl8yW0C9cfxeQ+BfU8uA==} dev: false - /@dydxprotocol/v4-client-js@0.36.1: - resolution: {integrity: sha512-KJ3MtWI61wmm+xZtXQd7/hYKIoVFG32TRdyyVaXXO8vpW9Oqd0JD8QSM/wuegkciAh5YmP/BrDzYuu77zHO6yg==} + /@dydxprotocol/v4-client-js@0.40.3: + resolution: {integrity: sha512-nMQd6tYisKDKIbfx0BGJSYEOSt+I+t5SsaBSmlgTdso+w2rCRO9vyxS+u6MF9h4w5FsVRfhHo3e6uTWX48WpGQ==} dependencies: '@cosmjs/amino': 0.30.1 '@cosmjs/encoding': 0.31.1 @@ -993,14 +993,15 @@ packages: '@cosmjs/stargate': 0.30.1 '@cosmjs/tendermint-rpc': 0.30.1 '@cosmjs/utils': 0.31.1 - '@dydxprotocol/v4-proto': 0.2.1 + '@dydxprotocol/v4-proto': 0.4.1 '@osmonauts/lcd': 0.6.0 - '@scure/bip32': 1.3.1 + '@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) @@ -1014,8 +1015,8 @@ packages: 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 +4709,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 +4732,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 +4746,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 +7145,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: diff --git a/public/configs/env.json b/public/configs/env.json index 0b2ef9d..2ecdc0b 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,8 +789,8 @@ "tokens": { "comment": "Change according to mainnet release", "chain": { - "name": "DYDX", - "denom": "adv4tnt", + "name": "TokenName", + "denom": "tokenDenom", "decimals": 18, "image": "/currencies/dydx.png" }, diff --git a/src/App.tsx b/src/App.tsx index 95ef909..0de3dda 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 { chainTokenLabel } = useTokenConfigs(); return ( @@ -71,7 +78,7 @@ const Content = () => { } /> - } /> + } /> {isTablet && ( <> } /> 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..5a0c3c5 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', + CHAINTOKEN = '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..c4a84b5 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'; @@ -18,6 +16,7 @@ import { getBalances, getStakingBalances } from '@/state/accountSelectors'; import { getSelectedNetwork } from '@/state/appSelectors'; import { useAccounts } from './useAccounts'; +import { useTokenConfigs } from './useTokenConfigs'; type UseAccountBalanceProps = { // Token Items @@ -52,6 +51,7 @@ export const useAccountBalance = ({ const selectedNetwork = useSelector(getSelectedNetwork); const balances = useSelector(getBalances, shallowEqual); + const { chainTokenDenom, usdcDenom } = useTokenConfigs(); const evmChainId = Number(ENVIRONMENT_CONFIG_MAP[selectedNetwork].ethereumChainId); const stakingBalances = useSelector(getStakingBalances, shallowEqual); @@ -93,18 +93,14 @@ export const useAccountBalance = ({ const { formatted: evmBalance } = evmQuery.data || {}; const balance = !assetSymbol ? '0' : isCosmosChain ? cosmosQuery.data : evmBalance; - const nativeTokenCoinBalance = balances?.[DYDX_DENOM]; - const nativeTokenBalance = MustBigNumber(nativeTokenCoinBalance?.amount) - .div(QUANTUM_MULTIPLIER) - .toNumber(); + const nativeTokenCoinBalance = balances?.[chainTokenDenom]; + const nativeTokenBalance = MustBigNumber(nativeTokenCoinBalance?.amount); - const usdcCoinBalance = balances?.[USDC_DENOM]; - const usdcBalance = MustBigNumber(usdcCoinBalance?.amount).div(QUANTUM_MULTIPLIER).toNumber(); + const usdcCoinBalance = balances?.[usdcDenom]; + const usdcBalance = MustBigNumber(usdcCoinBalance?.amount).toNumber(); - const nativeStakingCoinBalanace = stakingBalances?.[DYDX_DENOM]; - const nativeStakingBalance = MustBigNumber(nativeStakingCoinBalanace?.amount) - .div(QUANTUM_MULTIPLIER) - .toNumber(); + const nativeStakingCoinBalanace = stakingBalances?.[chainTokenDenom]; + const nativeStakingBalance = MustBigNumber(nativeStakingCoinBalanace?.amount).toNumber(); return { balance, 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..a529fbe 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,12 +131,21 @@ 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?.validatorClient.post.send( + subaccountClient.wallet, + () => + new Promise((resolve) => { + const msg = compositeClient?.sendTokenMessage( + subaccountClient.wallet, + amount.toString(), + recipient, + ); + + resolve([msg]); + }), false, + compositeClient?.validatorClient?.post.defaultDydxGasPrice, + undefined, Method.BroadcastTxCommit ), @@ -156,7 +162,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 +216,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 +253,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..d99b3e5 --- /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: { + [DydxChainAsset.USDC]: { + denom: string; + name: string; + decimals: number; + }, + [DydxChainAsset.CHAINTOKEN]: { + denom: string; + name: string; + decimals: number; + }, + }; + usdcDenom: string; + usdcLabel: string; + chainTokenDenom: string; + chainTokenLabel: string; +} => { + const { selectedNetwork } = useSelectedNetwork(); + const tokensConfigs = ENVIRONMENT_CONFIG_MAP[selectedNetwork].tokens; + + return { + tokensConfigs, + usdcDenom: tokensConfigs[DydxChainAsset.USDC].denom, + usdcLabel: tokensConfigs[DydxChainAsset.USDC].name, + chainTokenDenom: tokensConfigs[DydxChainAsset.CHAINTOKEN].denom, + chainTokenLabel: tokensConfigs[DydxChainAsset.CHAINTOKEN].name, + }; +}; diff --git a/src/layout/Header/HeaderDesktop.tsx b/src/layout/Header/HeaderDesktop.tsx index 8105465..de92dfd 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 { chainTokenLabel } = useTokenConfigs(); const navItems = [ { @@ -43,9 +45,9 @@ export const HeaderDesktop = () => { href: AppRoute.Trade, }, { - value: 'Dv4TNT', - label: 'Dv4TNT', - href: AppRoute.Rewards, + value: chainTokenLabel, + label: chainTokenLabel, + href: `/${chainTokenLabel}`, }, { value: 'PORTFOLIO', diff --git a/src/lib/abacus/dydxChainTransactions.ts b/src/lib/abacus/dydxChainTransactions.ts index 45fc8a4..c3c5062 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, + } + ) ) ); @@ -204,13 +223,13 @@ class DydxChainTransactions implements AbacusDYDXChainTransactionsProtocol { params ?? {}; try { - const tx = await this.compositeClient?.cancelOrder( + const tx = await this.compositeClient?.cancelRawOrder( new SubaccountClient(this.localWallet, subaccountNumber), clientId, orderFlags, clobPairId, - goodTilBlock ?? undefined, - goodTilBlockTime ?? undefined + 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..f2c055e 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 { chainTokenLabel } = useTokenConfigs(); return ( { {/* */} - Dv4TNT + {chainTokenLabel} {!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..423569f 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.CHAINTOKEN, setIsOpen }: ElementProps) => { const stringGetter = useStringGetter(); const { dydxAddress } = useAccounts(); + const { chainTokenLabel, usdcLabel } = useTokenConfigs(); const [asset, setAsset] = useState(selectedAsset); @@ -35,16 +36,17 @@ export const ReceiveDialog = ({ selectedAsset = DydxChainAsset.DYDX, setIsOpen } value: DydxChainAsset.USDC, label: ( - USDC + {usdcLabel} ), }, { - value: DydxChainAsset.DYDX, + value: DydxChainAsset.CHAINTOKEN, label: ( + {/* TODO: conditionally display the native token assetIcon */} {/* */} - Dv4TNT + {chainTokenLabel} ), }, diff --git a/src/views/forms/TransferForm.tsx b/src/views/forms/TransferForm.tsx index 1af5694..71b3d40 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.CHAINTOKEN, onDone, className, }: TransferFormProps) => { @@ -72,6 +69,7 @@ export const TransferForm = ({ const { transfer } = useSubaccount(); const { nativeTokenBalance, usdcBalance } = useAccountBalance(); const { selectedNetwork } = useSelectedNetwork(); + const { tokensConfigs, usdcLabel, chainTokenLabel } = 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.CHAINTOKEN ? 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.CHAINTOKEN, label: ( {/* */} - {DYDX_CHAIN_ASSET_TAGS[DydxChainAsset.DYDX]} + {chainTokenLabel} ), }, @@ -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..a91b013 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'; @@ -39,6 +45,7 @@ export const AccountMenu = () => { const onboardingState = useSelector(getOnboardingState); const { freeCollateral } = useSelector(getSubaccount, shallowEqual) || {}; const { nativeTokenBalance } = useAccountBalance(); + const { usdcLabel, chainTokenLabel } = useTokenConfigs(); const { evmAddress, walletType, dydxAddress, hdKey } = useAccounts(); @@ -107,17 +114,23 @@ export const AccountMenu = () => {
- {stringGetter({ key: STRING_KEYS.ASSET_BALANCE, params: { ASSET: 'Dv4TNT' } })} + {stringGetter({ + key: STRING_KEYS.ASSET_BALANCE, + params: { ASSET: chainTokenLabel }, + })} {/* */}
- +
- {stringGetter({ key: STRING_KEYS.ASSET_BALANCE, params: { ASSET: 'USDC' } })} + {stringGetter({ + key: STRING_KEYS.ASSET_BALANCE, + params: { ASSET: usdcLabel }, + })}