From 11c154dfb92114c55fd67586ffc8220a0e696223 Mon Sep 17 00:00:00 2001 From: Josh Date: Fri, 5 Mar 2021 11:34:26 -0800 Subject: [PATCH] Explorer: support uiAmountString api updates (#15742) * fix: support uiAmountString api updates * fix: remove this uiAmount * fix: change owned account section and token account section to support BigNumber uiAmountString * fix: update web3 to latest --- explorer/package-lock.json | 6 ++--- explorer/package.json | 2 +- .../components/account/OwnedTokensCard.tsx | 11 ++++---- .../account/TokenAccountSection.tsx | 13 +++++----- .../transaction/TokenBalancesCard.tsx | 25 +++++++++++++++---- explorer/src/validators/accounts/token.ts | 2 +- 6 files changed, 37 insertions(+), 22 deletions(-) diff --git a/explorer/package-lock.json b/explorer/package-lock.json index 07cae721b7..f4da14d997 100644 --- a/explorer/package-lock.json +++ b/explorer/package-lock.json @@ -2607,9 +2607,9 @@ } }, "@solana/web3.js": { - "version": "0.94.0", - "resolved": "https://registry.npmjs.org/@solana/web3.js/-/web3.js-0.94.0.tgz", - "integrity": "sha512-uyRbhugCbRg3nBdQQo40Fv2prK7CMzCYTxiKkEBkYxl2hRbj1kmC2itXVTUICiXjgE7DS4KY5y9X+xRuYDMCxw==", + "version": "0.94.1", + "resolved": "https://registry.npmjs.org/@solana/web3.js/-/web3.js-0.94.1.tgz", + "integrity": "sha512-ikITz8a5JYpJwup5NESJtZYYJ+86SHqmglhlREVhlPkMfYyOsuWhnW3fd8vKCTze1AhUKMjo35BrYTbi6p2ImQ==", "requires": { "@babel/runtime": "^7.12.5", "bn.js": "^5.0.0", diff --git a/explorer/package.json b/explorer/package.json index d733c6300a..2d0e5cd498 100644 --- a/explorer/package.json +++ b/explorer/package.json @@ -7,7 +7,7 @@ "@react-hook/debounce": "^3.0.0", "@sentry/react": "^6.2.0", "@solana/spl-token-registry": "^0.1.9", - "@solana/web3.js": "^0.94.0", + "@solana/web3.js": "^0.94.1", "@testing-library/jest-dom": "^5.11.9", "@testing-library/react": "^11.2.5", "@testing-library/user-event": "^12.8.0", diff --git a/explorer/src/components/account/OwnedTokensCard.tsx b/explorer/src/components/account/OwnedTokensCard.tsx index 492b88f3ce..560da2ac8d 100644 --- a/explorer/src/components/account/OwnedTokensCard.tsx +++ b/explorer/src/components/account/OwnedTokensCard.tsx @@ -13,6 +13,7 @@ import { useQuery } from "utils/url"; import { Link } from "react-router-dom"; import { Location } from "history"; import { useTokenRegistry } from "providers/mints/token-registry"; +import { BigNumber } from "bignumber.js"; type Display = "summary" | "detail" | null; @@ -117,7 +118,7 @@ function HoldingsDetailTable({ tokens }: { tokens: TokenInfoWithPubkey[] }) {
- {tokenAccount.info.tokenAmount.uiAmount}{" "} + {tokenAccount.info.tokenAmount.uiAmountString}{" "} {tokenDetails && tokenDetails.tokenSymbol} @@ -145,17 +146,17 @@ function HoldingsDetailTable({ tokens }: { tokens: TokenInfoWithPubkey[] }) { function HoldingsSummaryTable({ tokens }: { tokens: TokenInfoWithPubkey[] }) { const { tokenRegistry } = useTokenRegistry(); - const mappedTokens = new Map(); + const mappedTokens = new Map(); for (const { info: token } of tokens) { const mintAddress = token.mint.toBase58(); const totalByMint = mappedTokens.get(mintAddress); - let amount = token.tokenAmount.uiAmount; + let amount = new BigNumber(token.tokenAmount.uiAmountString); if (totalByMint !== undefined) { - amount += totalByMint; + amount.plus(totalByMint); } - mappedTokens.set(mintAddress, amount); + mappedTokens.set(mintAddress, amount.toString()); } const detailsList: React.ReactNode[] = []; diff --git a/explorer/src/components/account/TokenAccountSection.tsx b/explorer/src/components/account/TokenAccountSection.tsx index 8ee8bf475b..522c684de5 100644 --- a/explorer/src/components/account/TokenAccountSection.tsx +++ b/explorer/src/components/account/TokenAccountSection.tsx @@ -15,6 +15,7 @@ import { normalizeTokenAmount } from "utils"; import { addressLabel } from "utils/tx"; import { reportError } from "utils/sentry"; import { useTokenRegistry } from "providers/mints/token-registry"; +import { BigNumber } from "bignumber.js"; export function TokenAccountSection({ account, @@ -153,14 +154,12 @@ function TokenAccountCard({ <> ◎ - {new Intl.NumberFormat("en-US", { maximumFractionDigits: 9 }).format( - info.tokenAmount.uiAmount - )} + {new BigNumber(info.tokenAmount.uiAmountString).toFormat(9)} ); } else { - balance = <>{info.tokenAmount.uiAmount}; + balance = <>{info.tokenAmount.uiAmountString}; unit = tokenRegistry.get(info.mint.toBase58())?.tokenSymbol || "tokens"; } @@ -221,9 +220,9 @@ function TokenAccountCard({ <> ◎ - {new Intl.NumberFormat("en-US", { - maximumFractionDigits: 9, - }).format(info.rentExemptReserve.uiAmount)} + {new BigNumber( + info.rentExemptReserve.uiAmountString + ).toFormat(9)} diff --git a/explorer/src/components/transaction/TokenBalancesCard.tsx b/explorer/src/components/transaction/TokenBalancesCard.tsx index 375b5d9f9b..c207afe3a9 100644 --- a/explorer/src/components/transaction/TokenBalancesCard.tsx +++ b/explorer/src/components/transaction/TokenBalancesCard.tsx @@ -109,8 +109,18 @@ function generateTokenBalanceRows( const preBalance = preBalanceMap[accountIndex]; const account = accounts[accountIndex].pubkey; + if (!uiTokenAmount.uiAmountString) { + // uiAmount deprecation + return; + } + // case where mint changes if (preBalance && preBalance.mint !== mint) { + if (!preBalance.uiTokenAmount.uiAmountString) { + // uiAmount deprecation + return; + } + rows.push({ account: accounts[accountIndex].pubkey, accountIndex, @@ -119,7 +129,7 @@ function generateTokenBalanceRows( amount: "0", uiAmount: 0, }, - delta: new BigNumber(-preBalance.uiTokenAmount.uiAmount), + delta: new BigNumber(-preBalance.uiTokenAmount.uiAmountString), mint: preBalance.mint, }); @@ -127,7 +137,7 @@ function generateTokenBalanceRows( account: accounts[accountIndex].pubkey, accountIndex, balance: uiTokenAmount, - delta: new BigNumber(uiTokenAmount.uiAmount), + delta: new BigNumber(uiTokenAmount.uiAmountString), mint: mint, }); return; @@ -136,11 +146,16 @@ function generateTokenBalanceRows( let delta; if (preBalance) { - delta = new BigNumber(uiTokenAmount.uiAmount).minus( - preBalance.uiTokenAmount.uiAmount + if (!preBalance.uiTokenAmount.uiAmountString) { + // uiAmount deprecation + return; + } + + delta = new BigNumber(uiTokenAmount.uiAmountString).minus( + preBalance.uiTokenAmount.uiAmountString ); } else { - delta = new BigNumber(uiTokenAmount.uiAmount); + delta = new BigNumber(uiTokenAmount.uiAmountString); } rows.push({ diff --git a/explorer/src/validators/accounts/token.ts b/explorer/src/validators/accounts/token.ts index c3c0109d01..a53f69672d 100644 --- a/explorer/src/validators/accounts/token.ts +++ b/explorer/src/validators/accounts/token.ts @@ -22,7 +22,7 @@ const AccountState = enums(["initialized", "uninitialized", "frozen"]); const TokenAmount = pick({ decimals: number(), - uiAmount: number(), + uiAmountString: string(), amount: string(), });