diff --git a/public/assets/locales/fa/translation.json b/public/assets/locales/fa/translation.json index 034d07df..fa3ce4ba 100644 --- a/public/assets/locales/fa/translation.json +++ b/public/assets/locales/fa/translation.json @@ -384,6 +384,7 @@ "minWithdraw": "حداقل مقدار برداشت", "maxWithdrawal": "حداکثر مقدار برداشت", "minDeposit": "حداقل مقدار واریز", + "maxDeposit": "حداکثر مقدار واریز", "maxWithdraw": "سقف برداشت روزانه شما", "maxMonthWithdraw": "سقف برداشت ماهانه شما", "withdrawWarn": "لطفا دقت کنید! ورود اشتباه آدرس می تواند به از دست رفتن سرمایه منجر شود.", diff --git a/src/components/Popup/Popup.js b/src/components/Popup/Popup.js index b844d591..d3c7b011 100644 --- a/src/components/Popup/Popup.js +++ b/src/components/Popup/Popup.js @@ -1,18 +1,15 @@ -import React, {useEffect, useRef, useState} from "react"; +import React from "react"; import classes from "./Popup.module.css"; import {useTranslation} from "react-i18next"; import {useSelector} from "react-redux"; import Button from "../Button/Button"; -import {Link, Navigate} from "react-router-dom"; +import {Link} from "react-router-dom"; import * as Routes from "../../main/Browser/Routes/routes"; -import {Login} from "../../main/Browser/Routes/routes"; -import TextInput from "../TextInput/TextInput"; -import {useGetCurrencyInfo} from "../../queries"; -import Loading from "../Loading/Loading"; -import Error from "../Error/Error"; -import PopupAddress from "./PopupAddress/PopupAddress"; import i18n from "i18next"; import {getCurrencyNameOrAlias} from "../../utils/utils"; +import Deposit + from "../../main/Browser/Pages/UserPanel/Sections/Content/components/Wallet/components/DepositWithdraw/components/Deposit/Deposit"; +import {Login} from "../../main/Browser/Routes/routes"; const Popup = ({currency, closePopup}) => { @@ -23,57 +20,18 @@ const Popup = ({currency, closePopup}) => { const language = i18n.language const currencies = useSelector((state) => state.exchange.currencies) - const [networkName, setNetworkName] = useState({value: 0, error: []}); - - const selectRef = useRef() - const {data: currencyInfo, isLoading: CILoading, error: CIError, refetch: refetchCI} = useGetCurrencyInfo(currency) - - useEffect(() => { - setNetworkName({value: 0, error: []}) - - }, [currency]); - - - - useEffect(() => { - if (currency !== "IRT") { - refetchCI() - } - }, [currency]); - - const content = () => { + if(!isLogin) return
{t("pleaseLogin")}
+ return
+ +
- if(CILoading) return - if (CIError) return - if (currency === "IRT") return - - return <> - { - return {value: index, label: `${chain.network} - ${chain.currency}`} - })} - lead={t('DepositWithdraw.network')} - type="select" - value={currencyInfo?.chains[networkName.value] && { - value: networkName.value, - label: `${currencyInfo?.chains[networkName.value].network} - ${currencyInfo?.chains[networkName.value].currency}` - }} - onchange={(e) => setNetworkName({value: e?.value || 0, error: []})} - customRef={selectRef} - alerts={networkName.error} - customClass={`width-50 ${classes.thisInput}`} - /> - { currencyInfo && } - } return ( @@ -83,6 +41,8 @@ const Popup = ({currency, closePopup}) => {
{content()} + +
{isLogin ? diff --git a/src/components/Popup/Popup.module.css b/src/components/Popup/Popup.module.css index 5e06ffc3..230c297b 100644 --- a/src/components/Popup/Popup.module.css +++ b/src/components/Popup/Popup.module.css @@ -1,12 +1,12 @@ .container { position: absolute; top: 11vh; - width: 30%; + width: 40%; height: 50vh; background-color: var(--popupAlpha); z-index: 3; box-shadow: -1px 5px 8px -2px #101010ad; - right: 47.5%; + right: 43%; border-radius: 9px; } @@ -29,7 +29,7 @@ } .thisButton { - width: 30%; + width: 20%; } .walletButton { diff --git a/src/main/Browser/Pages/UserPanel/Sections/Content/components/History/components/DepositHistoryTable/DepositHistoryTable.js b/src/main/Browser/Pages/UserPanel/Sections/Content/components/History/components/DepositHistoryTable/DepositHistoryTable.js index 9d58a785..bd02a57e 100644 --- a/src/main/Browser/Pages/UserPanel/Sections/Content/components/History/components/DepositHistoryTable/DepositHistoryTable.js +++ b/src/main/Browser/Pages/UserPanel/Sections/Content/components/History/components/DepositHistoryTable/DepositHistoryTable.js @@ -4,7 +4,7 @@ import {useTranslation} from "react-i18next"; import {useSelector} from "react-redux"; import Date from "../../../../../../../../../../components/Date/Date"; import moment from "moment-jalaali"; -import {BN, getCurrencyNameOrAlias} from "../../../../../../../../../../utils/utils"; +import {formatWithPrecision, getCurrencyNameOrAlias} from "../../../../../../../../../../utils/utils"; import i18n from "i18next"; const DepositHistoryTable = ({txs, offset}) => { @@ -14,7 +14,6 @@ const DepositHistoryTable = ({txs, offset}) => { const language = i18n.language const currencies = useSelector((state) => state.exchange.currencies) - let head = (
{t("date")} @@ -32,7 +31,6 @@ const DepositHistoryTable = ({txs, offset}) => { {txs.map((tr, index) => { return (
-
@@ -40,19 +38,15 @@ const DepositHistoryTable = ({txs, offset}) => { {moment.utc(tr.createDate).local().format("HH:mm:ss")} - {getCurrencyNameOrAlias(currencies[tr.currency], language)} - {tr.network ?? "- - -"} - - {new BN(tr?.amount).decimalPlaces(currencies[tr.currency].precision).toFormat()} + {formatWithPrecision(tr?.amount, currencies[tr.currency].precision)} - {t("depositStatus." + tr.status )} diff --git a/src/main/Browser/Pages/UserPanel/Sections/Content/components/History/components/TransactionsTable/TransactionsTable.js b/src/main/Browser/Pages/UserPanel/Sections/Content/components/History/components/TransactionsTable/TransactionsTable.js index f82de9d5..b14ee184 100644 --- a/src/main/Browser/Pages/UserPanel/Sections/Content/components/History/components/TransactionsTable/TransactionsTable.js +++ b/src/main/Browser/Pages/UserPanel/Sections/Content/components/History/components/TransactionsTable/TransactionsTable.js @@ -3,7 +3,7 @@ import classes from './TransactionsTable.module.css'; import {useTranslation} from "react-i18next"; import Date from "../../../../../../../../../../components/Date/Date"; import moment from "moment-jalaali"; -import {BN, getCurrencyNameOrAlias} from "../../../../../../../../../../utils/utils"; +import {BN, formatWithPrecision, getCurrencyNameOrAlias} from "../../../../../../../../../../utils/utils"; import i18n from "i18next"; import {useSelector} from "react-redux"; @@ -43,12 +43,10 @@ const TransactionsTable = ({txs}) => { {getCurrencyNameOrAlias(currencies[tr.currency], language)} - {new BN(tr?.balanceChange).toFormat()} - {new BN(tr?.balanceChange).decimalPlaces(currencies[tr.currency].precision).toFormat()} + {formatWithPrecision(tr.balanceChange, currencies[tr.currency].precision)} - {new BN(tr?.balance).toFormat()} - {new BN(tr?.balance).decimalPlaces(currencies[tr.currency].precision).toFormat()} + {formatWithPrecision(tr.balance, currencies[tr.currency].precision)}
diff --git a/src/main/Browser/Pages/UserPanel/Sections/Content/components/History/components/WithdrawHistoryTable/WithdrawHistoryTable.js b/src/main/Browser/Pages/UserPanel/Sections/Content/components/History/components/WithdrawHistoryTable/WithdrawHistoryTable.js index 96b8fb76..629709de 100644 --- a/src/main/Browser/Pages/UserPanel/Sections/Content/components/History/components/WithdrawHistoryTable/WithdrawHistoryTable.js +++ b/src/main/Browser/Pages/UserPanel/Sections/Content/components/History/components/WithdrawHistoryTable/WithdrawHistoryTable.js @@ -3,7 +3,7 @@ import classes from './WithdrawHistoryTable.module.css' import {useTranslation} from "react-i18next"; import Date from "../../../../../../../../../../components/Date/Date"; import moment from "moment-jalaali"; -import {BN, getCurrencyNameOrAlias} from "../../../../../../../../../../utils/utils"; +import {BN, formatWithPrecision, getCurrencyNameOrAlias} from "../../../../../../../../../../utils/utils"; import Icon from "../../../../../../../../../../components/Icon/Icon"; import i18n from "i18next"; import {useSelector} from "react-redux"; @@ -14,11 +14,8 @@ const WithdrawHistoryTable = ({txs, offset}) => { const language = i18n.language const currencies = useSelector((state) => state.exchange.currencies) - const [isOpen, setIsOpen] = useState(false); - - let head = (
{t("date")} @@ -46,23 +43,18 @@ const WithdrawHistoryTable = ({txs, offset}) => { {moment.utc(tr.createDate).local().format("HH:mm:ss")} - {getCurrencyNameOrAlias(currencies[tr.currency], language)} - {tr.destNetwork} - - {new BN(tr?.amount).decimalPlaces(currencies[tr.currency].precision).toFormat()} + {formatWithPrecision(tr?.amount, currencies[tr.currency].precision)} - - {new BN(tr?.appliedFee).decimalPlaces(currencies[tr.currency].precision).toFormat()} + {formatWithPrecision(tr?.appliedFee, currencies[tr.currency].precision)} - {t("withdrawStatus." + tr.status )} @@ -73,11 +65,8 @@ const WithdrawHistoryTable = ({txs, offset}) => { {tr.withdrawId} isOpen === index ? setIsOpen(null) : setIsOpen(index)}> - + -
{isOpen === index &&
diff --git a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Market/components/MyOrders/components/Trades/Trades.js b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Market/components/MyOrders/components/Trades/Trades.js index 1033f6b8..d358d97f 100644 --- a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Market/components/MyOrders/components/Trades/Trades.js +++ b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Market/components/MyOrders/components/Trades/Trades.js @@ -9,7 +9,7 @@ import Icon from "../../../../../../../../../../../../components/Icon/Icon"; import Error from "../../../../../../../../../../../../components/Error/Error"; import {useMyTrades} from "../../../../../../../../../../../../queries"; import Date from "../../../../../../../../../../../../components/Date/Date"; -import {BN, getCurrencyNameOrAlias} from "../../../../../../../../../../../../utils/utils"; +import {BN, formatWithPrecision, getCurrencyNameOrAlias} from "../../../../../../../../../../../../utils/utils"; import i18n from "i18next"; const Trades = () => { @@ -92,7 +92,7 @@ const Trades = () => { {t("myOrders.orderId")} : {tr.orderId}

- {t("commission")} : {new BN(tr.commission).decimalPlaces(currencies[tr.commissionAsset.toUpperCase()].precision).toFormat()} + {t("commission")} : {formatWithPrecision(tr.commission, currencies[tr.commissionAsset.toUpperCase()].precision)} {getCurrencyNameOrAlias(currencies[tr.commissionAsset.toUpperCase()], language)}

diff --git a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Market/components/Order/components/BuyOrder/BuyOrder.js b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Market/components/Order/components/BuyOrder/BuyOrder.js index 0954ee66..1486e2ff 100644 --- a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Market/components/Order/components/BuyOrder/BuyOrder.js +++ b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Market/components/Order/components/BuyOrder/BuyOrder.js @@ -3,7 +3,12 @@ import {toast} from "react-hot-toast"; import classes from "../../Order.module.css"; import React, {useEffect, useState} from "react"; import {Trans, useTranslation} from "react-i18next"; -import {BN, getCurrencyNameOrAlias, parsePriceString} from "../../../../../../../../../../../../utils/utils"; +import { + BN, + formatWithPrecision, + getCurrencyNameOrAlias, + parsePriceString +} from "../../../../../../../../../../../../utils/utils"; import NumberInput from "../../../../../../../../../../../../components/NumberInput/NumberInput"; import Button from "../../../../../../../../../../../../components/Button/Button"; import {setLastTransaction} from "../../../../../../../../../../../../store/actions/auth"; @@ -293,7 +298,7 @@ const BuyOrder = () => { }}> {t("orders.bestOffer")}:{" "} - {new BN(bestBuyPrice).toFormat()}{" "}{getCurrencyNameOrAlias(currencies[activePair.quoteAsset], language)} + {formatWithPrecision(bestBuyPrice, currencies[activePair.quoteAsset]?.precision ?? 0)}{" "}{getCurrencyNameOrAlias(currencies[activePair.quoteAsset], language)}

@@ -376,7 +381,7 @@ const BuyOrder = () => {

{t("orders.tradeFee")}:{" "} - {order.tradeFee.toFormat()}{" "} + {formatWithPrecision(order.tradeFee, currencies[activePair.baseAsset]?.precision ?? 0)}{" "} {getCurrencyNameOrAlias(currencies[activePair.baseAsset], language)}

diff --git a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Market/components/Order/components/SellOrder/SellOrder.js b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Market/components/Order/components/SellOrder/SellOrder.js index 852a2a07..7f96b88e 100644 --- a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Market/components/Order/components/SellOrder/SellOrder.js +++ b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Market/components/Order/components/SellOrder/SellOrder.js @@ -3,7 +3,12 @@ import {Trans, useTranslation} from "react-i18next"; import classes from "../../Order.module.css"; import {useDispatch, useSelector} from "react-redux"; import {toast} from "react-hot-toast"; -import {BN, getCurrencyNameOrAlias, parsePriceString} from "../../../../../../../../../../../../utils/utils"; +import { + BN, + formatWithPrecision, + getCurrencyNameOrAlias, + parsePriceString +} from "../../../../../../../../../../../../utils/utils"; import NumberInput from "../../../../../../../../../../../../components/NumberInput/NumberInput"; import Button from "../../../../../../../../../../../../components/Button/Button"; import {setLastTransaction} from "../../../../../../../../../../../../store/actions/auth"; @@ -263,7 +268,7 @@ const SellOrder = () => {

fillSellByBestPrice()}> {t("orders.bestOffer")}:{" "} - {new BN(bestSellPrice).toFormat()}{" "}{getCurrencyNameOrAlias(currencies[activePair.quoteAsset], language)} + {formatWithPrecision(bestSellPrice, currencies[activePair.quoteAsset]?.precision ?? 0)}{" "}{getCurrencyNameOrAlias(currencies[activePair.quoteAsset], language)}

@@ -347,6 +352,7 @@ const SellOrder = () => {

{t("orders.tradeFee")}:{" "} {order.tradeFee.toFormat()}{" "} + {formatWithPrecision(order.tradeFee, currencies[activePair.quoteAsset]?.precision ?? 0)}{" "} {getCurrencyNameOrAlias(currencies[activePair.quoteAsset], language)}

diff --git a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Wallet/components/DepositTxTable/DepositTxTable.js b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Wallet/components/DepositTxTable/DepositTxTable.js index 47f90d83..fdaacb28 100644 --- a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Wallet/components/DepositTxTable/DepositTxTable.js +++ b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Wallet/components/DepositTxTable/DepositTxTable.js @@ -3,7 +3,7 @@ import classes from './DepositTxTable.module.css'; import {useTranslation} from "react-i18next"; import Date from "../../../../../../../../../../components/Date/Date"; import moment from "moment-jalaali"; -import {BN} from "../../../../../../../../../../utils/utils"; +import {BN, formatWithPrecision} from "../../../../../../../../../../utils/utils"; import Icon from "../../../../../../../../../../components/Icon/Icon"; import {useSelector} from "react-redux"; import i18n from "i18next"; @@ -47,7 +47,7 @@ const DepositTxTable = ({txs}) => { - {new BN(tr?.amount).decimalPlaces(currencies[tr.currency].precision).toFormat()} + {formatWithPrecision(tr?.amount, currencies[tr.currency].precision)} diff --git a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Wallet/components/DepositWithdraw/components/Deposit/Deposit.js b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Wallet/components/DepositWithdraw/components/Deposit/Deposit.js index ec156ae8..b36fdaad 100644 --- a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Wallet/components/DepositWithdraw/components/Deposit/Deposit.js +++ b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Wallet/components/DepositWithdraw/components/Deposit/Deposit.js @@ -7,10 +7,13 @@ import {useGetGatewaysByCurrency} from "../../../../../../../../../../../../quer import OnChainDeposit from "./Module/OnChainDeposit/OnChainDeposit"; import {useSelector} from "react-redux"; -const Deposit = () => { +const Deposit = ({currency}) => { const {t} = useTranslation(); - const {id} = useParams(); + let {id} = useParams(); + if (currency) { + id = currency; + } const currencies = useSelector((state) => state.exchange.currencies) const { data, isLoading, error } = useGetGatewaysByCurrency(id, { @@ -39,7 +42,7 @@ const Deposit = () => { {t("comingSoon")}

; case hasOnChain: - return ; + return ; case hasOffChain: return
{t("comingSoon")} diff --git a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Wallet/components/DepositWithdraw/components/Deposit/Module/OnChainDeposit/OnChainDeposit.js b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Wallet/components/DepositWithdraw/components/Deposit/Module/OnChainDeposit/OnChainDeposit.js index 7f96ef6f..92fb54fa 100644 --- a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Wallet/components/DepositWithdraw/components/Deposit/Module/OnChainDeposit/OnChainDeposit.js +++ b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Wallet/components/DepositWithdraw/components/Deposit/Module/OnChainDeposit/OnChainDeposit.js @@ -7,11 +7,17 @@ import {useParams} from "react-router-dom"; import Icon from "../../../../../../../../../../../../../../components/Icon/Icon"; import QRCode from "react-qr-code"; import {toast} from "react-hot-toast"; +import {BN, getCurrencyNameOrAlias} from "../../../../../../../../../../../../../../utils/utils"; +import {useSelector} from "react-redux"; +import i18n from "i18next"; -const OnChainDeposit = ({gateways}) => { +const OnChainDeposit = ({gateways, currency}) => { const {t} = useTranslation(); - const {id} = useParams(); + let {id} = useParams(); + if (currency) { + id = currency; + } const [networkName, setNetworkName] = useState({value: 0, error: []}) @@ -19,6 +25,13 @@ const OnChainDeposit = ({gateways}) => { const selectRef = useRef() + const language = i18n.language + const currencies = useSelector((state) => state.exchange.currencies) + + + const depositMin = new BN(gateways?.[networkName.value]?.depositMin).decimalPlaces(currencies[id]?.precision ?? 0).toFormat() + const depositMax = new BN(gateways?.[networkName.value]?.depositMax).decimalPlaces(currencies[id]?.precision ?? 0).toFormat() + useEffect(() => { refetchAddress() }, [gateways]); @@ -57,6 +70,17 @@ const OnChainDeposit = ({gateways}) => { value={address.address} customClass={`${classes.depositInput} width-80`} /> + +
+
+ {t('DepositWithdrawTx.minDeposit')}: + {new BN(depositMin).toString()} {getCurrencyNameOrAlias(currencies[id], language)} +
+
+ {t('DepositWithdrawTx.maxDeposit')}: + {new BN(depositMax).toString()} {getCurrencyNameOrAlias(currencies[id], language)} +
+
diff --git a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Wallet/components/WithdrawTxTable/WithdrawTxTable.js b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Wallet/components/WithdrawTxTable/WithdrawTxTable.js index b8296d17..cf6a0636 100644 --- a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Wallet/components/WithdrawTxTable/WithdrawTxTable.js +++ b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Wallet/components/WithdrawTxTable/WithdrawTxTable.js @@ -3,7 +3,7 @@ import classes from './WithdrawTxTable.module.css'; import {useTranslation} from "react-i18next"; import Date from "../../../../../../../../../../components/Date/Date"; import moment from "moment-jalaali"; -import {BN} from "../../../../../../../../../../utils/utils"; +import {BN, formatWithPrecision} from "../../../../../../../../../../utils/utils"; import Icon from "../../../../../../../../../../components/Icon/Icon"; import Button from "../../../../../../../../../../components/Button/Button"; import {images} from "../../../../../../../../../../assets/images"; @@ -95,7 +95,7 @@ const WithdrawTxTable = ({txs}) => { - {new BN(tr?.amount).decimalPlaces(currencies[tr.currency].precision).toFormat()} + {formatWithPrecision(tr?.amount, currencies[tr.currency].precision)} @@ -111,7 +111,7 @@ const WithdrawTxTable = ({txs}) => {
{t("history.fee")} - {new BN(tr?.appliedFee).decimalPlaces(currencies[tr.currency].precision).toFormat()} + {formatWithPrecision(tr?.appliedFee, currencies[tr.currency].precision)}
diff --git a/src/main/Browser/Pages/UserPanel/Sections/Header/components/WalletHeader/WalletHeader.js b/src/main/Browser/Pages/UserPanel/Sections/Header/components/WalletHeader/WalletHeader.js index 8a0cd742..bd1900ed 100644 --- a/src/main/Browser/Pages/UserPanel/Sections/Header/components/WalletHeader/WalletHeader.js +++ b/src/main/Browser/Pages/UserPanel/Sections/Header/components/WalletHeader/WalletHeader.js @@ -2,7 +2,7 @@ import React from "react"; import classes from "./WalletHeader.module.css"; import {useTranslation} from "react-i18next"; import {useParams} from "react-router-dom"; -import {BN, getCurrencyNameOrAlias} from "../../../../../../../../utils/utils"; +import {BN, formatWithPrecision, getCurrencyNameOrAlias} from "../../../../../../../../utils/utils"; import {useGetUserAccount} from "../../../../../../../../queries/hooks/useGetUserAccount"; import {useGetUserAssets} from "../../../../../../../../queries"; import {useSelector} from "react-redux"; @@ -31,21 +31,21 @@ const WalletHeader = () => { {t("header.free")} {new BN(userAccount?.wallets[id]?.free || 0).decimalPlaces(currencies[id]?.precision ?? 0).toFormat()} - ({ refCurrency === id ? new BN(userAccount?.wallets[id]?.free || 0).decimalPlaces(currencies[id]?.precision ?? 0).toFormat() : new BN(allEstimateValue?.free || 0).decimalPlaces(currencies[refCurrency]?.precision ?? 0).toFormat()} {refCurrency} ) + ({ refCurrency === id ? formatWithPrecision(userAccount?.wallets[id]?.free || 0, currencies[id]?.precision ?? 0) : formatWithPrecision(allEstimateValue?.free || 0, currencies[refCurrency]?.precision ?? 0)} {refCurrency} )
{t("header.locked")} {new BN(userAccount?.wallets[id]?.locked || 0).decimalPlaces(currencies[id]?.precision ?? 0).toFormat()} - ({ refCurrency === id ? new BN(userAccount?.wallets[id]?.locked || 0).decimalPlaces(currencies[id]?.precision ?? 0).toFormat() : new BN(allEstimateValue?.locked || 0).decimalPlaces(currencies[refCurrency]?.precision ?? 0).toFormat()} {refCurrency} ) + ({ refCurrency === id ? formatWithPrecision(userAccount?.wallets[id]?.locked || 0, currencies[id]?.precision ?? 0) : formatWithPrecision(allEstimateValue?.locked || 0, currencies[refCurrency]?.precision ?? 0)} {refCurrency} )
{t("header.inWithdrawalProcess")} {new BN(userAccount?.wallets[id]?.withdraw || 0).decimalPlaces(currencies[id]?.precision ?? 0).toFormat()} - ({ refCurrency === id ? new BN(userAccount?.wallets[id]?.withdraw || 0).decimalPlaces(currencies[id]?.precision ?? 0).toFormat() : new BN(allEstimateValue?.withdrawing || 0).decimalPlaces(currencies[refCurrency]?.precision ?? 0).toFormat()} {refCurrency} ) + ({ refCurrency === id ? formatWithPrecision(userAccount?.wallets[id]?.withdraw || 0, currencies[id]?.precision ?? 0) : formatWithPrecision(allEstimateValue?.withdrawing || 0, currencies[refCurrency]?.precision ?? 0)} {refCurrency} )
diff --git a/src/main/Browser/Pages/UserPanel/Sections/SubMenu/components/MarketSubMenu/components/MarketPairCard/MarketPairCard.js b/src/main/Browser/Pages/UserPanel/Sections/SubMenu/components/MarketSubMenu/components/MarketPairCard/MarketPairCard.js index 4fd9fe49..ec26ad8d 100644 --- a/src/main/Browser/Pages/UserPanel/Sections/SubMenu/components/MarketSubMenu/components/MarketPairCard/MarketPairCard.js +++ b/src/main/Browser/Pages/UserPanel/Sections/SubMenu/components/MarketSubMenu/components/MarketPairCard/MarketPairCard.js @@ -3,7 +3,7 @@ import classes from "./MarketCard.module.css"; import {useDispatch, useSelector} from "react-redux"; import {images} from "../../../../../../../../../../assets/images"; import Icon from "../../../../../../../../../../components/Icon/Icon"; -import {BN, getCurrencyNameOrAlias} from "../../../../../../../../../../utils/utils"; +import {BN, formatWithPrecision, getCurrencyNameOrAlias} from "../../../../../../../../../../utils/utils"; import {setActivePairInitiate} from "../../../../../../../../../../store/actions"; import {useGetLastPrices} from "../../../../../../../../../../queries/hooks/useGetLastPrices"; import i18n from "i18next"; @@ -44,7 +44,7 @@ const MarketPairCard = ({id, pair, favPair, addFav}) => { {pair?.baseAsset + " / " + pair?.quoteAsset }
- {new BN(prices[pair?.symbol] || 0).decimalPlaces(currencies[pair?.quoteAsset]?.precision ?? 0).toFormat()} + {formatWithPrecision(prices[pair?.symbol] || 0, currencies[pair?.quoteAsset]?.precision ?? 0)}
diff --git a/src/main/Browser/Pages/UserPanel/Sections/SubMenu/components/WalletSubMenu/components/WalletBalance/WalletBalance.js b/src/main/Browser/Pages/UserPanel/Sections/SubMenu/components/WalletSubMenu/components/WalletBalance/WalletBalance.js index 78f59625..91d21ea7 100644 --- a/src/main/Browser/Pages/UserPanel/Sections/SubMenu/components/WalletSubMenu/components/WalletBalance/WalletBalance.js +++ b/src/main/Browser/Pages/UserPanel/Sections/SubMenu/components/WalletSubMenu/components/WalletBalance/WalletBalance.js @@ -2,7 +2,7 @@ import React from 'react'; import classes from '../../WalletSubMenu.module.css' import {useTranslation} from "react-i18next"; import {images} from "../../../../../../../../../../assets/images"; -import {BN, getCurrencyNameOrAlias} from "../../../../../../../../../../utils/utils"; +import {BN, formatWithPrecision, getCurrencyNameOrAlias} from "../../../../../../../../../../utils/utils"; import {useGetUserAssetsEstimatedValue} from "../../../../../../../../../../queries"; import {useSelector} from "react-redux"; import i18n from "i18next"; @@ -33,7 +33,7 @@ const WalletBalance = () => { {t("WalletSubMenu.approximate")}
- {new BN(totalValue).decimalPlaces(currencies[refCurrency]?.precision ?? 0).toFormat()}{" "}{getCurrencyNameOrAlias(currencies[refCurrency], language)} + {formatWithPrecision(totalValue, currencies[refCurrency]?.precision ?? 0)}{" "}{getCurrencyNameOrAlias(currencies[refCurrency], language)}
diff --git a/src/main/Browser/Pages/UserPanel/Sections/SubMenu/components/WalletSubMenu/components/WalletListItem/WalletListItem.js b/src/main/Browser/Pages/UserPanel/Sections/SubMenu/components/WalletSubMenu/components/WalletListItem/WalletListItem.js index 039f7294..87313551 100644 --- a/src/main/Browser/Pages/UserPanel/Sections/SubMenu/components/WalletSubMenu/components/WalletListItem/WalletListItem.js +++ b/src/main/Browser/Pages/UserPanel/Sections/SubMenu/components/WalletSubMenu/components/WalletListItem/WalletListItem.js @@ -4,7 +4,7 @@ import {NavLink} from "react-router-dom"; import {useTranslation} from "react-i18next"; import {images} from "../../../../../../../../../../assets/images"; import * as Routes from "../../../../../../../../Routes/routes"; -import {BN, getCurrencyNameOrAlias} from "../../../../../../../../../../utils/utils"; +import {BN, formatWithPrecision, getCurrencyNameOrAlias} from "../../../../../../../../../../utils/utils"; import {useGetUserAccount} from "../../../../../../../../../../queries/hooks/useGetUserAccount"; import {useGetUserAssets} from "../../../../../../../../../../queries"; import {useSelector} from "react-redux"; @@ -49,7 +49,7 @@ const WalletListItem = ({symbol, data, assetName, freeWallet, showZero}) => {
{new BN(freeWallet).decimalPlaces(currencies[symbol]?.precision ?? 0).toFormat() + " "} {getCurrencyNameOrAlias(currencies[symbol], language)} - ~ {refCurrency === assetName ? new BN(free).decimalPlaces(currencies[refCurrency]?.precision ?? 0).toFormat() : new BN(freeEstimateValue).decimalPlaces(currencies[refCurrency]?.precision ?? 0).toFormat()} {t("currency."+refCurrency)} + ~ {refCurrency === assetName ? formatWithPrecision(free, currencies[refCurrency]?.precision ?? 0) : formatWithPrecision(freeEstimateValue, currencies[refCurrency]?.precision ?? 0)} {t("currency."+refCurrency)}
diff --git a/src/utils/utils.js b/src/utils/utils.js index 7888f187..c19a4e2f 100644 --- a/src/utils/utils.js +++ b/src/utils/utils.js @@ -92,3 +92,25 @@ export function getCurrencyNameOrAlias(currency, lang) { return langOption === 'alias' ? alias : name; } + +export const formatWithPrecision = (value, precision, maxAttempts = 2) => { + + if (!value || isNaN(value) || value === Infinity || value === -Infinity) { + return "0"; + } + + let bnValue = new BN(value); + if (bnValue.isNaN()) return "0"; + + let currentPrecision = precision; + let formatted = bnValue.decimalPlaces(currentPrecision).toNumber(); + + let attempts = 0; + while (formatted === 0 && attempts < maxAttempts) { + currentPrecision += 1; + formatted = bnValue.decimalPlaces(currentPrecision).toNumber(); + attempts++; + } + + return bnValue.decimalPlaces(currentPrecision).toFormat(); +};