diff --git a/src/components/Account/AssetsTable/AssetsTable.js b/src/components/Account/AssetsTable/AssetsTable.js index f85f9600..f1628185 100644 --- a/src/components/Account/AssetsTable/AssetsTable.js +++ b/src/components/Account/AssetsTable/AssetsTable.js @@ -2,9 +2,12 @@ import classNames from "classnames/bind"; import { memo, useMemo } from "react"; import ThemedTable from "src/components/common/ThemedTable"; import { tableThemes } from "src/constants/tableThemes"; -import { amountDecimal18, formatOrai } from "src/helpers/helper"; +import { amountDecimal18, formatOrai, numberWithCommas, toFixedIfNecessary } from "src/helpers/helper"; import { reduceStringAssets, _ } from "src/lib/scripts"; import styles from "./AssetsTable.module.scss"; +import { useSelector } from "react-redux"; +import { oraichainTokens } from "@oraichain/oraidex-common/build/token"; +import { toDisplay } from "@oraichain/oraidex-common/build/helper"; const cx = classNames.bind(styles); @@ -27,6 +30,7 @@ export const getHeaderRow = () => { }; const AssetsTable = memo(({ data = [] }) => { + const priceTokens = useSelector(state => state.blockchain.priceTokens); const getDataRows = data => { if (!Array.isArray(data)) { return []; @@ -35,6 +39,12 @@ const AssetsTable = memo(({ data = [] }) => { return data.map(item => { const validatorAddressSplit = item?.validator_address?.split("/")?.[0] || item?.validator_address; let tokenInfo = amountDecimal18.find(e => e.address?.toLowerCase() == validatorAddressSplit?.toLowerCase()); + const tokenInOraichain = oraichainTokens.find(token => { + const arrIncludes = [token?.denom?.toLowerCase(), token?.name?.toLowerCase()]; + return arrIncludes.includes(validatorAddressSplit?.toLowerCase()) || arrIncludes.includes(token?.denom?.toLowerCase()); + }); + + const tokenUsd = priceTokens[tokenInOraichain?.coinGeckoId] || 0; if (!tokenInfo && item.validator_address.includes("erc20")) { tokenInfo = { name: "ERC20", @@ -53,6 +63,7 @@ const AssetsTable = memo(({ data = [] }) => { decimal: 18, }; } + const decimalOfToken = tokenInfo?.decimal || tokenInOraichain?.decimals || 6; const validatorDataCell = _.isNil(item?.validator_address) ? (
-
) : ( @@ -65,7 +76,7 @@ const AssetsTable = memo(({ data = [] }) => { ) : (
- {formatOrai(item.amount, Math.pow(10, tokenInfo ? tokenInfo.decimal : 6))} + {formatOrai(item.amount, Math.pow(10, decimalOfToken))} {tokenInfo ? tokenInfo?.name : reduceStringAssets(item.denom, 7, 3)}
@@ -77,8 +88,9 @@ const AssetsTable = memo(({ data = [] }) => { ) : (
- {/* {formatOrai(item.reward)} */} - {formatOrai(item.reward, Math.pow(10, tokenInfo ? tokenInfo.decimal : 6))} + + {numberWithCommas(toFixedIfNecessary((tokenUsd * toDisplay(item.amount, decimalOfToken)).toString(), 6))} + {item.denom_reward}
diff --git a/src/containers/Account/Account.js b/src/containers/Account/Account.js index bf0479bc..53344b56 100644 --- a/src/containers/Account/Account.js +++ b/src/containers/Account/Account.js @@ -37,6 +37,7 @@ import CwToken from "src/components/Wallet/CwToken"; import { formatOrai } from "src/helpers/helper"; import styles from "./Account.module.scss"; import NFTToken from "../../components/Wallet/NFTToken"; +import { flattenTokens } from "@oraichain/oraidex-common/build/token"; export const typeExport = { cw20: "cw20", @@ -84,22 +85,7 @@ const Account = props => { }, [balanceData]); const fetchData = async () => { - let arrayCoin = ""; - if (arrayAssetSearch[assetSearch] === "cw20") { - if (balanceData.length > 0) { - arrayCoin = balanceData.reduce((acc, cur) => { - const denomName = cur?.base_denom?.toLowerCase(); - const token = priceBalance[denomName]; - return acc === "" ? token : acc + "," + token; - }, ""); - } - } else { - arrayCoin = balanceData?.balances?.reduce((acc, cur) => { - const denom = cur?.denom?.split("/"); - let coin = denom?.[0]?.slice(0, 1) === "u" ? priceBalance[denom?.[0]?.slice(1, denom?.[0]?.length)] : priceBalance[denom?.[0]]; - return acc === "" ? coin : acc + "," + coin; - }, ""); - } + const arrayCoin = flattenTokens.map(e => e.coinGeckoId).join(","); let price = await api.getGeckoMarketBalance(arrayCoin); setArrayPriceBalance(price?.data); }; diff --git a/src/helpers/helper.js b/src/helpers/helper.js index afce5f22..f6e3e149 100644 --- a/src/helpers/helper.js +++ b/src/helpers/helper.js @@ -90,6 +90,18 @@ export const checkTokenCW20 = value => { }; }; +export const toFixedIfNecessary = (value, dp) => { + return +parseFloat(value).toFixed(dp); +}; + +// add `,` when split thounsand value. +export const numberWithCommas = (x, locales = undefined, options = {}) => { + if (isNegative(x)) return "0"; + return x.toLocaleString(locales, options); +}; + +export const isNegative = number => number <= 0; + /* Add commas after every 3 digits in large numbers */ export const commafy = num => { var str = num.toString().split("."); diff --git a/src/lib/config/bridgeTokens.js b/src/lib/config/bridgeTokens.js index bc68a3c7..f17bca04 100644 --- a/src/lib/config/bridgeTokens.js +++ b/src/lib/config/bridgeTokens.js @@ -8,7 +8,8 @@ // import { ReactComponent as AIRI } from 'assets/icons/airi.svg'; import { network, NetworkKey } from "./networks"; import _ from "lodash"; -import { AIRI_BSC_CONTRACT, BEP20_ORAI, BSC_CHAIN_ID, BSC_RPC, ERC20_ORAI, ETHEREUM_CHAIN_ID, ORAI_BSC_CONTRACT, ORAI_ETH_CONTRACT } from "./constants"; +import { BEP20_ORAI, BSC_CHAIN_ID, BSC_RPC, ERC20_ORAI, ETHEREUM_CHAIN_ID } from "./constants"; +import { WETH_CONTRACT, OCH_CONTRACT, NEUTARO_ORAICHAIN_DENOM, ORAI_ETH_CONTRACT, AIRI_BSC_CONTRACT, ORAI_BSC_CONTRACT } from "@oraichain/oraidex-common"; const tokensMap = { [NetworkKey.TESTNET]: [[], []], @@ -238,6 +239,44 @@ const tokensMap = { cosmosBased: true, // Icon: ORAI }, + { + name: "wETH", + org: "Oraichain", + prefix: "orai", + denom: "weth", + coinType: 118, + contractAddress: WETH_CONTRACT, + coingeckoId: "eth", + decimals: 6, + chainId: "Oraichain", + rpc: "https://rpc.orai.io", + lcd: "https://lcd.orai.io", + cosmosBased: true, + }, + { + name: "OCH", + org: "Oraichain", + prefix: "orai", + denom: "och", + coinType: 118, + coingeckoId: "och", + contractAddress: OCH_CONTRACT, + rpc: "https://rpc.orai.io", + lcd: "https://lcd.orai.io", + coinDecimals: 6, + }, + { + name: "NTMPI", + org: "Oraichain", + prefix: "orai", + denom: "ntmpi", + coinDenom: "NTMPI", + coinGeckoId: "neutaro", + coinMinimalDenom: NEUTARO_ORAICHAIN_DENOM, + rpc: "https://rpc.orai.io", + lcd: "https://lcd.orai.io", + coinDecimals: 6, + }, ], ], }; diff --git a/src/lib/config/constants.js b/src/lib/config/constants.js index fde6967a..9bb16662 100644 --- a/src/lib/config/constants.js +++ b/src/lib/config/constants.js @@ -34,7 +34,3 @@ export const GITHUB = "https://github.com/oraichain/oraiscan-frontend"; export const ETHEREUM_CHAIN_ID = "0x1"; export const BSC_CHAIN_ID = "0x38"; export const BSC_RPC = "https://bsc-dataseed.binance.org"; - -export const ORAI_ETH_CONTRACT = "0x4c11249814f11b9346808179cf06e71ac328c1b5"; -export const ORAI_BSC_CONTRACT = "0xA325Ad6D9c92B55A3Fc5aD7e412B1518F96441C0"; -export const AIRI_BSC_CONTRACT = "0x7e2a35c746f2f7c240b664f1da4dd100141ae71f"; diff --git a/yarn.lock b/yarn.lock index 7ce123d1..62760347 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1357,22 +1357,7 @@ dependencies: xstream "^11.14.0" -"@cosmjs/tendermint-rpc@^0.24.1": - version "0.24.1" - resolved "https://registry.yarnpkg.com/@cosmjs/tendermint-rpc/-/tendermint-rpc-0.24.1.tgz#625b650c774cb507f48b582b95727d0d26436db9" - integrity sha512-2s7SmoLjLY9Bq6D4/CkOnwm4WZBSHo6T3oTTKE6NLD+2A8BLcjdDnA49eLe3XzkMtVyfLvfrmoEXkCadfDFPOw== - dependencies: - "@cosmjs/crypto" "^0.24.1" - "@cosmjs/encoding" "^0.24.1" - "@cosmjs/json-rpc" "^0.24.1" - "@cosmjs/math" "^0.24.1" - "@cosmjs/socket" "^0.24.1" - "@cosmjs/stream" "^0.24.1" - axios "^0.21.1" - readonly-date "^1.0.0" - xstream "^11.14.0" - -"@cosmjs/tendermint-rpc@^0.31.0": +"@cosmjs/tendermint-rpc@0.31.0", "@cosmjs/tendermint-rpc@^0.31.0": version "0.31.0" resolved "https://registry.yarnpkg.com/@cosmjs/tendermint-rpc/-/tendermint-rpc-0.31.0.tgz#df82f634ff08fc377dfdccea43a31d92b5b0eaf1" integrity sha512-yo9xbeuI6UoEKIhFZ9g0dvUKLqnBzwdpEc/uldQygQc51j38gQVwFko+6sjmhieJqRYYvrYumcbJMiV6GFM9aA== @@ -1388,6 +1373,21 @@ readonly-date "^1.0.0" xstream "^11.14.0" +"@cosmjs/tendermint-rpc@^0.24.1": + version "0.24.1" + resolved "https://registry.yarnpkg.com/@cosmjs/tendermint-rpc/-/tendermint-rpc-0.24.1.tgz#625b650c774cb507f48b582b95727d0d26436db9" + integrity sha512-2s7SmoLjLY9Bq6D4/CkOnwm4WZBSHo6T3oTTKE6NLD+2A8BLcjdDnA49eLe3XzkMtVyfLvfrmoEXkCadfDFPOw== + dependencies: + "@cosmjs/crypto" "^0.24.1" + "@cosmjs/encoding" "^0.24.1" + "@cosmjs/json-rpc" "^0.24.1" + "@cosmjs/math" "^0.24.1" + "@cosmjs/socket" "^0.24.1" + "@cosmjs/stream" "^0.24.1" + axios "^0.21.1" + readonly-date "^1.0.0" + xstream "^11.14.0" + "@cosmjs/utils@^0.20.0": version "0.20.1" resolved "https://registry.yarnpkg.com/@cosmjs/utils/-/utils-0.20.1.tgz#4d239b7d93c15523cdf109f225cbf61326fb69cd" @@ -3218,14 +3218,28 @@ secp256k1 "^4.0.2" "@oraichain/oraidex-common@^1.0.43": - version "1.0.43" - resolved "https://registry.yarnpkg.com/@oraichain/oraidex-common/-/oraidex-common-1.0.43.tgz#3ce40dfd1cc33c129253fd59c8e227c05837c7fa" - integrity sha512-Xtp00JnVUl1Z4QarJE+Gw02TrHcxUmXzuynGN9g/x7HVL5NymzbB//PShlJ2VFhJfZXHCBaSBqDniIBLPoQ+GQ== + version "1.0.70" + resolved "https://registry.yarnpkg.com/@oraichain/oraidex-common/-/oraidex-common-1.0.70.tgz#ec68f38b43b25affcec684183bc6514e86520aa1" + integrity sha512-DZY5M/4JGwhEZJULHE+rfoET7dAw8FpnS/M3404xZ/GV1q9t6935M0qSzNiy2yk4PHJaWq+DxN8hPAYiiSTe9Q== dependencies: + "@cosmjs/amino" "^0.31.0" + "@cosmjs/cosmwasm-stargate" "^0.31.0" + "@cosmjs/crypto" "^0.31.0" + "@cosmjs/proto-signing" "^0.31.0" + "@cosmjs/stargate" "^0.31.0" + "@cosmjs/tendermint-rpc" "0.31.0" "@ethersproject/providers" "^5.0.10" "@keplr-wallet/types" "^0.11.38" + "@oraichain/oraidex-contracts-sdk" "^1.0.30" + bignumber.js "^9.0.1" + cosmjs-types "^0.8.0" ethers "^5.0.15" +"@oraichain/oraidex-contracts-sdk@^1.0.30": + version "1.0.35" + resolved "https://registry.yarnpkg.com/@oraichain/oraidex-contracts-sdk/-/oraidex-contracts-sdk-1.0.35.tgz#d8231d3af62172bd488d364c7ced238393f26695" + integrity sha512-c4qyt6CUEdI4+NgX4vWmVVctcQqEle0S6ExKp+d94C5UsRBELxvmJWkCZczvtTtLEvSsydv+7PKwrPoROgV2BA== + "@pmmmwh/react-refresh-webpack-plugin@^0.5.3": version "0.5.8" resolved "https://registry.yarnpkg.com/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.8.tgz#da3383761e2c0c440610819f3204769022a38d12"