From 46290652eab7504e3f7cfdde3219163bcda78791 Mon Sep 17 00:00:00 2001 From: victorkirov Date: Thu, 5 Oct 2023 12:51:35 +0300 Subject: [PATCH 1/6] Update btcbalance to string and fix some typing issues --- src/app/components/tokenTile/index.tsx | 18 +++++++++--------- .../components/transactionSetting/index.tsx | 16 ++++++++-------- src/app/hooks/queries/useBtcWalletData.ts | 4 +--- src/app/hooks/queries/useFeeMultipliers.ts | 16 ++++++---------- .../createInscription/CompleteScreen.tsx | 6 ------ src/app/screens/createInscription/index.tsx | 2 +- .../stores/wallet/actions/actionCreators.ts | 19 ++++++++++++++----- src/app/stores/wallet/actions/types.ts | 7 +++---- src/app/stores/wallet/reducer.ts | 6 +++--- 9 files changed, 45 insertions(+), 49 deletions(-) diff --git a/src/app/components/tokenTile/index.tsx b/src/app/components/tokenTile/index.tsx index 21715c80a..2408f9931 100644 --- a/src/app/components/tokenTile/index.tsx +++ b/src/app/components/tokenTile/index.tsx @@ -1,16 +1,16 @@ -import BigNumber from 'bignumber.js'; -import styled from 'styled-components'; -import { NumericFormat } from 'react-number-format'; -import { CurrencyTypes, LoaderSize } from '@utils/constants'; import BarLoader from '@components/barLoader'; -import { getTicker } from '@utils/helper'; -import stc from 'string-to-color'; +import { microstacksToStx, satsToBtc } from '@secretkeylabs/xverse-core/currency'; import { FungibleToken } from '@secretkeylabs/xverse-core/types'; import { currencySymbolMap } from '@secretkeylabs/xverse-core/types/currency'; import { StoreState } from '@stores/index'; -import { useSelector } from 'react-redux'; -import { microstacksToStx, satsToBtc } from '@secretkeylabs/xverse-core/currency'; +import { CurrencyTypes, LoaderSize } from '@utils/constants'; +import { getTicker } from '@utils/helper'; import { getFtBalance, getFtTicker } from '@utils/tokens'; +import BigNumber from 'bignumber.js'; +import { NumericFormat } from 'react-number-format'; +import { useSelector } from 'react-redux'; +import stc from 'string-to-color'; +import styled from 'styled-components'; interface TileProps { margin?: number; @@ -335,7 +335,7 @@ function TokenTile({ onPress({ coin: currency as CurrencyTypes, ft: fungibleToken && fungibleToken.principal, - brc20Ft: !fungibleToken?.principal && fungibleToken?.name, + brc20Ft: !fungibleToken?.principal ? fungibleToken?.name : undefined, }); }; diff --git a/src/app/components/transactionSetting/index.tsx b/src/app/components/transactionSetting/index.tsx index 674cc19db..4fdfcbf2d 100644 --- a/src/app/components/transactionSetting/index.tsx +++ b/src/app/components/transactionSetting/index.tsx @@ -1,17 +1,17 @@ /* eslint-disable no-nested-ternary */ +import ArrowIcon from '@assets/img/settings/arrow.svg'; import BottomModal from '@components/bottomModal'; +import ActionButton from '@components/button'; +import useWalletSelector from '@hooks/useWalletSelector'; +import { BtcUtxoDataResponse, UTXO } from '@secretkeylabs/xverse-core'; +import { stxToMicrostacks } from '@secretkeylabs/xverse-core/currency'; +import { isCustomFeesAllowed, Recipient } from '@secretkeylabs/xverse-core/transactions/btc'; import BigNumber from 'bignumber.js'; import { useState } from 'react'; import { useTranslation } from 'react-i18next'; import styled from 'styled-components'; -import ArrowIcon from '@assets/img/settings/arrow.svg'; -import ActionButton from '@components/button'; -import { stxToMicrostacks } from '@secretkeylabs/xverse-core/currency'; -import { isCustomFeesAllowed, Recipient } from '@secretkeylabs/xverse-core/transactions/btc'; -import { BtcUtxoDataResponse, UTXO } from '@secretkeylabs/xverse-core'; -import useWalletSelector from '@hooks/useWalletSelector'; -import EditNonce from './editNonce'; import EditFee from './editFee'; +import EditNonce from './editNonce'; const ButtonContainer = styled.div((props) => ({ display: 'flex', @@ -123,7 +123,7 @@ function TransactionSettingAlert({ const applyClickForBtc = async () => { const currentFee = new BigNumber(feeInput); - if (btcBalance && currentFee.gt(btcBalance)) { + if (currentFee.gt(btcBalance)) { // show fee exceeds total balance error setError(t('TRANSACTION_SETTING.GREATER_FEE_ERROR')); return; diff --git a/src/app/hooks/queries/useBtcWalletData.ts b/src/app/hooks/queries/useBtcWalletData.ts index 64d92ac70..a7ca7cd6d 100644 --- a/src/app/hooks/queries/useBtcWalletData.ts +++ b/src/app/hooks/queries/useBtcWalletData.ts @@ -2,7 +2,6 @@ import useBtcClient from '@hooks/useBtcClient'; import { BtcAddressData } from '@secretkeylabs/xverse-core/types'; import { SetBtcWalletDataAction } from '@stores/wallet/actions/actionCreators'; import { useQuery } from '@tanstack/react-query'; -import BigNumber from 'bignumber.js'; import { useDispatch } from 'react-redux'; import useWalletSelector from '../useWalletSelector'; @@ -13,8 +12,7 @@ export const useBtcWalletData = () => { const fetchBtcWalletData = async () => { const btcData: BtcAddressData = await btcClient.getBalance(btcAddress); - const btcBalance = new BigNumber(btcData.finalBalance); - dispatch(SetBtcWalletDataAction(btcBalance)); + dispatch(SetBtcWalletDataAction(btcData.finalBalance)); return btcData; }; diff --git a/src/app/hooks/queries/useFeeMultipliers.ts b/src/app/hooks/queries/useFeeMultipliers.ts index 5aa1ba085..f670fdcd6 100644 --- a/src/app/hooks/queries/useFeeMultipliers.ts +++ b/src/app/hooks/queries/useFeeMultipliers.ts @@ -1,20 +1,16 @@ -import { useDispatch } from 'react-redux'; -import { useQuery } from '@tanstack/react-query'; -import { AppInfo } from '@secretkeylabs/xverse-core/types'; import { fetchAppInfo } from '@secretkeylabs/xverse-core/api'; +import { AppInfo } from '@secretkeylabs/xverse-core/types'; import { setFeeMultiplierAction } from '@stores/wallet/actions/actionCreators'; +import { useQuery } from '@tanstack/react-query'; +import { useDispatch } from 'react-redux'; export const useFeeMultipliers = () => { const dispatch = useDispatch(); const fetchFeeMultiplierData = async (): Promise => { - try { - const response: AppInfo = await fetchAppInfo(); - dispatch(setFeeMultiplierAction(response)); - return response; - } catch (err) { - return Promise.reject(err); - } + const response: AppInfo = await fetchAppInfo(); + dispatch(setFeeMultiplierAction(response)); + return response; }; return useQuery({ diff --git a/src/app/screens/createInscription/CompleteScreen.tsx b/src/app/screens/createInscription/CompleteScreen.tsx index 8a080bd34..3d41793c4 100644 --- a/src/app/screens/createInscription/CompleteScreen.tsx +++ b/src/app/screens/createInscription/CompleteScreen.tsx @@ -71,12 +71,6 @@ const CopyButtonContainer = styled.div({ padding: 2, }); -const InfoMessageContainer = styled.div({ - marginLeft: 8, - marginRight: 8, - marginTop: 20, -}); - const Image = styled.img({ alignSelf: 'center', transform: 'all', diff --git a/src/app/screens/createInscription/index.tsx b/src/app/screens/createInscription/index.tsx index 5710a0c84..c451d0f1f 100644 --- a/src/app/screens/createInscription/index.tsx +++ b/src/app/screens/createInscription/index.tsx @@ -328,7 +328,7 @@ function CreateInscription() { isError={!!errorCode} > - + {t('TITLE')} {t('SUBTITLE')} diff --git a/src/app/stores/wallet/actions/actionCreators.ts b/src/app/stores/wallet/actions/actionCreators.ts index 84dfed15d..f9ed5c4b8 100644 --- a/src/app/stores/wallet/actions/actionCreators.ts +++ b/src/app/stores/wallet/actions/actionCreators.ts @@ -1,10 +1,9 @@ import { PostGuardPing } from '@components/guards/singleTab'; -import { AccountType } from '@secretkeylabs/xverse-core'; +import { AccountType, AppInfo } from '@secretkeylabs/xverse-core'; import { Account, BaseWallet, Coin, - FeesMultipliers, FungibleToken, SettingsNetwork, SupportedCurrency, @@ -13,6 +12,16 @@ import { import BigNumber from 'bignumber.js'; import * as actions from './types'; +type NumberLike = string | number | bigint | BigNumber; + +function numberLikeToStringOrThrow(value: NumberLike, name: string): string { + if (typeof value !== 'bigint' && BigNumber(value).isNaN()) { + throw new Error(`Invalid value for ${name}: ${value}`); + } + + return `${value}`; +} + export function setWalletAction(wallet: BaseWallet): actions.SetWallet { return { type: actions.SetWalletKey, @@ -117,7 +126,7 @@ export function selectAccount( }; } -export function setFeeMultiplierAction(feeMultipliers: FeesMultipliers): actions.SetFeeMultiplier { +export function setFeeMultiplierAction(feeMultipliers: AppInfo): actions.SetFeeMultiplier { return { type: actions.SetFeeMultiplierKey, feeMultipliers, @@ -152,10 +161,10 @@ export function setStxWalletDataAction( }; } -export function SetBtcWalletDataAction(balance: BigNumber): actions.SetBtcWalletData { +export function SetBtcWalletDataAction(balance: NumberLike): actions.SetBtcWalletData { return { type: actions.SetBtcWalletDataKey, - balance, + balance: numberLikeToStringOrThrow(balance, 'bitcoin balance'), }; } diff --git a/src/app/stores/wallet/actions/types.ts b/src/app/stores/wallet/actions/types.ts index 77e775835..e635c9fa5 100644 --- a/src/app/stores/wallet/actions/types.ts +++ b/src/app/stores/wallet/actions/types.ts @@ -4,7 +4,6 @@ import { AppInfo, BaseWallet, Coin, - FeesMultipliers, FungibleToken, SettingsNetwork, SupportedCurrency, @@ -74,7 +73,7 @@ export interface WalletState { stxAvailableBalance: BigNumber; stxLockedBalance: BigNumber; stxNonce: number; - btcBalance: BigNumber; + btcBalance: string; coinsList: FungibleToken[] | null; coins: Coin[]; brcCoinsList: FungibleToken[] | null; @@ -111,7 +110,7 @@ export interface UnlockWallet { export interface SetFeeMultiplier { type: typeof SetFeeMultiplierKey; - feeMultipliers: FeesMultipliers; + feeMultipliers: AppInfo; } export interface LockWallet { @@ -168,7 +167,7 @@ export interface SetStxWalletData { export interface SetBtcWalletData { type: typeof SetBtcWalletDataKey; - balance: BigNumber; + balance: string; } export interface SetCoinData { diff --git a/src/app/stores/wallet/reducer.ts b/src/app/stores/wallet/reducer.ts index 1c8c6bb1b..2abbdfff6 100644 --- a/src/app/stores/wallet/reducer.ts +++ b/src/app/stores/wallet/reducer.ts @@ -6,8 +6,8 @@ import { ChangeHasActivatedOrdinalsKey, ChangeNetworkKey, ChangeShowBtcReceiveAlertKey, + ChangeShowDataCollectionAlertKey, ChangeShowOrdinalReceiveAlertKey, - UpdateLedgerAccountsKey, FetchAccountKey, GetActiveAccountsKey, LockWalletKey, @@ -24,11 +24,11 @@ import { SetWalletSeedPhraseKey, StoreEncryptedSeedKey, UnlockWalletKey, + UpdateLedgerAccountsKey, UpdateVisibleCoinListKey, WalletActions, WalletSessionPeriods, WalletState, - ChangeShowDataCollectionAlertKey, } from './actions/types'; const initialWalletState: WalletState = { @@ -52,7 +52,7 @@ const initialWalletState: WalletState = { stxAvailableBalance: new BigNumber(0), stxLockedBalance: new BigNumber(0), stxNonce: 0, - btcBalance: new BigNumber(0), + btcBalance: '0', coinsList: null, coins: [], brcCoinsList: [], From 62b56c78e22c1f7879134c1230046b1b1195e054 Mon Sep 17 00:00:00 2001 From: victorkirov Date: Thu, 5 Oct 2023 13:17:38 +0300 Subject: [PATCH 2/6] stx balances to string --- src/app/screens/coinDashboard/coinHeader.tsx | 24 +++++++++---------- .../stores/wallet/actions/actionCreators.ts | 12 +++++----- src/app/stores/wallet/actions/types.ts | 12 +++++----- src/app/stores/wallet/reducer.ts | 6 ++--- 4 files changed, 27 insertions(+), 27 deletions(-) diff --git a/src/app/screens/coinDashboard/coinHeader.tsx b/src/app/screens/coinDashboard/coinHeader.tsx index c10f2c275..fd5424128 100644 --- a/src/app/screens/coinDashboard/coinHeader.tsx +++ b/src/app/screens/coinDashboard/coinHeader.tsx @@ -1,23 +1,23 @@ -import TokenImage from '@components/tokenImage'; import ArrowDown from '@assets/img/dashboard/arrow_down.svg'; import ArrowUp from '@assets/img/dashboard/arrow_up.svg'; -import Lock from '@assets/img/transactions/Lock.svg'; import Buy from '@assets/img/dashboard/black_plus.svg'; +import Lock from '@assets/img/transactions/Lock.svg'; +import BottomModal from '@components/bottomModal'; +import ActionButton from '@components/button'; +import SmallActionButton from '@components/smallActionButton'; +import TokenImage from '@components/tokenImage'; import useWalletSelector from '@hooks/useWalletSelector'; import { FungibleToken, microstacksToStx, satsToBtc } from '@secretkeylabs/xverse-core'; import { currencySymbolMap } from '@secretkeylabs/xverse-core/types/currency'; -import BigNumber from 'bignumber.js'; -import { NumericFormat } from 'react-number-format'; -import styled from 'styled-components'; import { CurrencyTypes } from '@utils/constants'; -import { getFtBalance, getFtTicker } from '@utils/tokens'; -import { useNavigate } from 'react-router-dom'; -import { useTranslation } from 'react-i18next'; import { isLedgerAccount } from '@utils/helper'; -import SmallActionButton from '@components/smallActionButton'; +import { getFtBalance, getFtTicker } from '@utils/tokens'; +import BigNumber from 'bignumber.js'; import { useState } from 'react'; -import BottomModal from '@components/bottomModal'; -import ActionButton from '@components/button'; +import { useTranslation } from 'react-i18next'; +import { NumericFormat } from 'react-number-format'; +import { useNavigate } from 'react-router-dom'; +import styled from 'styled-components'; interface CoinBalanceProps { coin: CurrencyTypes; @@ -231,7 +231,7 @@ export default function CoinHeader(props: CoinBalanceProps) { } const renderStackingBalances = () => { - if (stxLockedBalance && !new BigNumber(stxLockedBalance).eq(0, 10) && coin === 'STX') { + if (!new BigNumber(stxLockedBalance).eq(0) && coin === 'STX') { return ( <> diff --git a/src/app/stores/wallet/actions/actionCreators.ts b/src/app/stores/wallet/actions/actionCreators.ts index f9ed5c4b8..3391495d8 100644 --- a/src/app/stores/wallet/actions/actionCreators.ts +++ b/src/app/stores/wallet/actions/actionCreators.ts @@ -145,17 +145,17 @@ export function setCoinRatesAction( } export function setStxWalletDataAction( - stxBalance: BigNumber, - stxAvailableBalance: BigNumber, - stxLockedBalance: BigNumber, + stxBalance: NumberLike, + stxAvailableBalance: NumberLike, + stxLockedBalance: NumberLike, stxTransactions: TransactionData[], stxNonce: number, ): actions.SetStxWalletData { return { type: actions.SetStxWalletDataKey, - stxBalance, - stxAvailableBalance, - stxLockedBalance, + stxBalance: numberLikeToStringOrThrow(stxBalance, 'stx balance'), + stxAvailableBalance: numberLikeToStringOrThrow(stxAvailableBalance, 'stx available'), + stxLockedBalance: numberLikeToStringOrThrow(stxLockedBalance, 'stx locked'), stxTransactions, stxNonce, }; diff --git a/src/app/stores/wallet/actions/types.ts b/src/app/stores/wallet/actions/types.ts index e635c9fa5..22f847f7e 100644 --- a/src/app/stores/wallet/actions/types.ts +++ b/src/app/stores/wallet/actions/types.ts @@ -69,9 +69,9 @@ export interface WalletState { fiatCurrency: SupportedCurrency; btcFiatRate: BigNumber; stxBtcRate: BigNumber; - stxBalance: BigNumber; - stxAvailableBalance: BigNumber; - stxLockedBalance: BigNumber; + stxBalance: string; + stxAvailableBalance: string; + stxLockedBalance: string; stxNonce: number; btcBalance: string; coinsList: FungibleToken[] | null; @@ -158,9 +158,9 @@ export interface SetCoinRates { export interface SetStxWalletData { type: typeof SetStxWalletDataKey; - stxBalance: BigNumber; - stxAvailableBalance: BigNumber; - stxLockedBalance: BigNumber; + stxBalance: string; + stxAvailableBalance: string; + stxLockedBalance: string; stxTransactions: TransactionData[]; stxNonce: number; } diff --git a/src/app/stores/wallet/reducer.ts b/src/app/stores/wallet/reducer.ts index 2abbdfff6..80aeae806 100644 --- a/src/app/stores/wallet/reducer.ts +++ b/src/app/stores/wallet/reducer.ts @@ -48,9 +48,9 @@ const initialWalletState: WalletState = { fiatCurrency: 'USD', btcFiatRate: new BigNumber(0), stxBtcRate: new BigNumber(0), - stxBalance: new BigNumber(0), - stxAvailableBalance: new BigNumber(0), - stxLockedBalance: new BigNumber(0), + stxBalance: '0', + stxAvailableBalance: '0', + stxLockedBalance: '0', stxNonce: 0, btcBalance: '0', coinsList: null, From 0ea4bea83adaff4f63646a68c5fbfdf4ef805d9a Mon Sep 17 00:00:00 2001 From: victorkirov Date: Thu, 5 Oct 2023 14:06:17 +0300 Subject: [PATCH 3/6] btc fiat rate to string and fix all typings related to it --- .../confirmBtcTransactionComponent/index.tsx | 11 ++-- .../inputOutputComponent.tsx | 18 +++--- .../components/recipientComponent/index.tsx | 18 +++--- src/app/components/sendForm/index.tsx | 38 ++++++------ .../components/transactionSetting/editFee.tsx | 40 +++++++------ .../components/transactionSetting/index.tsx | 6 +- src/app/components/transferFeeView/index.tsx | 4 +- src/app/hooks/useDetectOrdinalInSignPsbt.ts | 6 +- src/app/screens/btcSendScreen/index.tsx | 4 +- .../confirmBrc20Transaction/editFees.tsx | 16 ++--- .../screens/confirmBrc20Transaction/index.tsx | 4 +- .../confirmBrc20Transaction/recipientCard.tsx | 2 +- .../screens/confirmBtcTransaction/index.tsx | 37 ++++++------ .../confirmInscriptionRequest/index.tsx | 60 +++++++++---------- .../screens/confirmStxTransaction/index.tsx | 44 +++++++------- .../screens/restoreFunds/restoreBtc/index.tsx | 60 ++++++++++--------- .../restoreFunds/restoreOrdinals/index.tsx | 5 +- src/app/screens/sendBrc20/index.tsx | 23 +++---- src/app/screens/sendBtc/index.tsx | 30 +++++----- src/app/screens/sendOrdinal/index.tsx | 7 ++- src/app/screens/signPsbtRequest/index.tsx | 25 ++++---- .../screens/swap/useCurrencyConversion.tsx | 17 +++++- .../stores/wallet/actions/actionCreators.ts | 4 +- src/app/stores/wallet/actions/types.ts | 4 +- src/app/stores/wallet/reducer.ts | 2 +- 25 files changed, 256 insertions(+), 229 deletions(-) diff --git a/src/app/components/confirmBtcTransactionComponent/index.tsx b/src/app/components/confirmBtcTransactionComponent/index.tsx index e4fc3a82c..2639dfbac 100644 --- a/src/app/components/confirmBtcTransactionComponent/index.tsx +++ b/src/app/components/confirmBtcTransactionComponent/index.tsx @@ -1,13 +1,14 @@ import SettingIcon from '@assets/img/dashboard/faders_horizontal.svg'; import AssetIcon from '@assets/img/transactions/Assets.svg'; import ActionButton from '@components/button'; +import InfoContainer from '@components/infoContainer'; import RecipientComponent from '@components/recipientComponent'; import TopRow from '@components/topRow'; import TransactionSettingAlert from '@components/transactionSetting'; import TransferFeeView from '@components/transferFeeView'; import useOrdinalsByAddress from '@hooks/useOrdinalsByAddress'; +import useWalletSelector from '@hooks/useWalletSelector'; import { - BtcUtxoDataResponse, ErrorCodes, ResponseError, UTXO, @@ -27,8 +28,6 @@ import { ReactNode, useEffect, useState } from 'react'; import { useTranslation } from 'react-i18next'; import { NumericFormat } from 'react-number-format'; import styled from 'styled-components'; -import InfoContainer from '@components/infoContainer'; -import useWalletSelector from '@hooks/useWalletSelector'; import TransactionDetailComponent from '../transactionDetailComponent'; const OuterContainer = styled.div` @@ -121,7 +120,7 @@ interface Props { children?: ReactNode; assetDetail?: string; isRestoreFundFlow?: boolean; - nonOrdinalUtxos?: BtcUtxoDataResponse[]; + nonOrdinalUtxos?: UTXO[]; isBtcSendBrowserTx?: boolean; currentFeeRate: BigNumber; setCurrentFee: (feeRate: BigNumber) => void; @@ -294,7 +293,7 @@ function ConfirmBtcTransactionComponent({ const newFee = new BigNumber(modifiedFee); setCurrentFee(newFee); - setCurrentFeeRate(new BigNumber(feeRate)); + setCurrentFeeRate(new BigNumber(feeRate!)); if (ordinalTxUtxo) ordinalMutate(modifiedFee); else if (isRestoreFundFlow) { mutateSignNonOrdinalBtcTransaction(modifiedFee); @@ -404,7 +403,7 @@ function ConfirmBtcTransactionComponent({ )} diff --git a/src/app/components/confirmBtcTransactionComponent/inputOutputComponent.tsx b/src/app/components/confirmBtcTransactionComponent/inputOutputComponent.tsx index 96d6eb96e..879bb398c 100644 --- a/src/app/components/confirmBtcTransactionComponent/inputOutputComponent.tsx +++ b/src/app/components/confirmBtcTransactionComponent/inputOutputComponent.tsx @@ -1,16 +1,16 @@ -import styled from 'styled-components'; -import DropDownIcon from '@assets/img/transactions/dropDownIcon.svg'; -import OutputIcon from '@assets/img/transactions/output.svg'; import IconBitcoin from '@assets/img/dashboard/bitcoin_icon.svg'; import ScriptIcon from '@assets/img/transactions/ScriptIcon.svg'; -import { useTranslation } from 'react-i18next'; -import { useSelector } from 'react-redux'; -import BigNumber from 'bignumber.js'; +import DropDownIcon from '@assets/img/transactions/dropDownIcon.svg'; +import OutputIcon from '@assets/img/transactions/output.svg'; +import TransferDetailView from '@components/transferDetailView'; import { animated, config, useSpring } from '@react-spring/web'; +import { PSBTInput, PSBTOutput, ParsedPSBT, satsToBtc } from '@secretkeylabs/xverse-core'; import { StoreState } from '@stores/index'; -import TransferDetailView from '@components/transferDetailView'; -import { ParsedPSBT, PSBTInput, PSBTOutput, satsToBtc } from '@secretkeylabs/xverse-core'; import { getTruncatedAddress } from '@utils/helper'; +import BigNumber from 'bignumber.js'; +import { useTranslation } from 'react-i18next'; +import { useSelector } from 'react-redux'; +import styled from 'styled-components'; const Container = styled.div((props) => ({ display: 'flex', @@ -97,7 +97,7 @@ const Button = styled.button((props) => ({ interface Props { address: string[]; - parsedPsbt: ParsedPSBT; + parsedPsbt: ParsedPSBT | undefined; isExpanded: boolean; onArrowClick: () => void; } diff --git a/src/app/components/recipientComponent/index.tsx b/src/app/components/recipientComponent/index.tsx index 0b4ac2995..ab5bec79a 100644 --- a/src/app/components/recipientComponent/index.tsx +++ b/src/app/components/recipientComponent/index.tsx @@ -1,18 +1,18 @@ -import TransferDetailView from '@components/transferDetailView'; -import OutputIcon from '@assets/img/transactions/output.svg'; import ArrowIcon from '@assets/img/transactions/ArrowDown.svg'; +import OutputIcon from '@assets/img/transactions/output.svg'; import WalletIcon from '@assets/img/transactions/wallet.svg'; +import TokenImage from '@components/tokenImage'; +import TransferDetailView from '@components/transferDetailView'; +import useWalletSelector from '@hooks/useWalletSelector'; +import { FungibleToken, getFiatEquivalent } from '@secretkeylabs/xverse-core'; import { currencySymbolMap } from '@secretkeylabs/xverse-core/types/currency'; +import { CurrencyTypes } from '@utils/constants'; +import { getTicker } from '@utils/helper'; import BigNumber from 'bignumber.js'; +import { useEffect, useState } from 'react'; import { useTranslation } from 'react-i18next'; import { NumericFormat } from 'react-number-format'; import styled from 'styled-components'; -import { FungibleToken, getFiatEquivalent } from '@secretkeylabs/xverse-core'; -import TokenImage from '@components/tokenImage'; -import { CurrencyTypes } from '@utils/constants'; -import useWalletSelector from '@hooks/useWalletSelector'; -import { useEffect, useState } from 'react'; -import { getTicker } from '@utils/helper'; const Container = styled.div((props) => ({ display: 'flex', @@ -132,7 +132,7 @@ function RecipientComponent({ Number(value), currencyType, stxBtcRate, - btcFiatRate, + BigNumber(btcFiatRate), fungibleToken, ); } diff --git a/src/app/components/sendForm/index.tsx b/src/app/components/sendForm/index.tsx index 6138d6d24..a4feaf040 100644 --- a/src/app/components/sendForm/index.tsx +++ b/src/app/components/sendForm/index.tsx @@ -1,23 +1,23 @@ -import { CurrencyTypes } from '@utils/constants'; -import { FungibleToken } from '@secretkeylabs/xverse-core/types'; -import { useTranslation } from 'react-i18next'; -import styled from 'styled-components'; -import { ReactNode, SetStateAction, useEffect, useState } from 'react'; -import { getTicker } from '@utils/helper'; import ActionButton from '@components/button'; -import { useNavigate } from 'react-router-dom'; -import { useBnsName, useBNSResolver } from '@hooks/queries/useBnsName'; -import { getFiatEquivalent } from '@secretkeylabs/xverse-core/transactions'; import InfoContainer from '@components/infoContainer'; -import useNetworkSelector from '@hooks/useNetwork'; import TokenImage from '@components/tokenImage'; -import { getBtcEquivalent, getStxTokenEquivalent } from '@secretkeylabs/xverse-core'; -import BigNumber from 'bignumber.js'; -import { getCurrencyFlag } from '@utils/currency'; +import { useBNSResolver, useBnsName } from '@hooks/queries/useBnsName'; import useDebounce from '@hooks/useDebounce'; +import useNetworkSelector from '@hooks/useNetwork'; import useWalletSelector from '@hooks/useWalletSelector'; -import useClearFormOnAccountSwitch from './useClearFormOnAccountSwitch'; +import { getBtcEquivalent, getStxTokenEquivalent } from '@secretkeylabs/xverse-core'; +import { getFiatEquivalent } from '@secretkeylabs/xverse-core/transactions'; +import { FungibleToken } from '@secretkeylabs/xverse-core/types'; +import { CurrencyTypes } from '@utils/constants'; +import { getCurrencyFlag } from '@utils/currency'; +import { getTicker } from '@utils/helper'; +import BigNumber from 'bignumber.js'; +import { ReactNode, SetStateAction, useEffect, useState } from 'react'; +import { useTranslation } from 'react-i18next'; +import { useNavigate } from 'react-router-dom'; +import styled from 'styled-components'; import { FiatRow } from './fiatRow'; +import useClearFormOnAccountSwitch from './useClearFormOnAccountSwitch'; interface ContainerProps { error: boolean; @@ -255,7 +255,7 @@ function SendForm({ Number(amountToSend), currencyType, stxBtcRate, - btcFiatRate, + BigNumber(btcFiatRate), fungibleToken, ); setFiatAmount(amountInCurrency); @@ -291,7 +291,7 @@ function SendForm({ Number(newValue), currencyType, stxBtcRate, - btcFiatRate, + BigNumber(btcFiatRate), fungibleToken, ); setFiatAmount(amountInCurrency); @@ -304,11 +304,13 @@ function SendForm({ if (!tokenAmount) return '0'; switch (currencyType) { case 'STX': - return getStxTokenEquivalent(new BigNumber(tokenAmount), stxBtcRate, btcFiatRate) + return getStxTokenEquivalent(new BigNumber(tokenAmount), stxBtcRate, BigNumber(btcFiatRate)) .toFixed(6) .toString(); case 'BTC': - return getBtcEquivalent(new BigNumber(tokenAmount), btcFiatRate).toFixed(8).toString(); + return getBtcEquivalent(new BigNumber(tokenAmount), BigNumber(btcFiatRate)) + .toFixed(8) + .toString(); case 'FT': if (fungibleToken?.tokenFiatRate) { return new BigNumber(tokenAmount) diff --git a/src/app/components/transactionSetting/editFee.tsx b/src/app/components/transactionSetting/editFee.tsx index bc3a67b8e..c8cb2a058 100644 --- a/src/app/components/transactionSetting/editFee.tsx +++ b/src/app/components/transactionSetting/editFee.tsx @@ -1,24 +1,24 @@ -import BigNumber from 'bignumber.js'; -import { currencySymbolMap } from '@secretkeylabs/xverse-core/types/currency'; +import useDebounce from '@hooks/useDebounce'; +import useOrdinalsByAddress from '@hooks/useOrdinalsByAddress'; +import useWalletSelector from '@hooks/useWalletSelector'; +import { ErrorCodes, UTXO } from '@secretkeylabs/xverse-core'; import { getBtcFiatEquivalent, getStxFiatEquivalent, stxToMicrostacks, } from '@secretkeylabs/xverse-core/currency'; -import { useEffect, useMemo, useRef, useState } from 'react'; -import { useTranslation } from 'react-i18next'; -import styled from 'styled-components'; -import useWalletSelector from '@hooks/useWalletSelector'; -import { NumericFormat } from 'react-number-format'; import { + Recipient, getBtcFees, getBtcFeesForNonOrdinalBtcSend, getBtcFeesForOrdinalSend, - Recipient, } from '@secretkeylabs/xverse-core/transactions/btc'; -import { BtcUtxoDataResponse, ErrorCodes, UTXO } from '@secretkeylabs/xverse-core'; -import useDebounce from '@hooks/useDebounce'; -import useOrdinalsByAddress from '@hooks/useOrdinalsByAddress'; +import { currencySymbolMap } from '@secretkeylabs/xverse-core/types/currency'; +import BigNumber from 'bignumber.js'; +import { useEffect, useMemo, useRef, useState } from 'react'; +import { useTranslation } from 'react-i18next'; +import { NumericFormat } from 'react-number-format'; +import styled from 'styled-components'; const Container = styled.div((props) => ({ display: 'flex', @@ -150,7 +150,7 @@ interface Props { btcRecipients?: Recipient[]; ordinalTxUtxo?: UTXO; isRestoreFlow?: boolean; - nonOrdinalUtxos?: BtcUtxoDataResponse[]; + nonOrdinalUtxos?: UTXO[]; feeMode: string; error: string; setIsLoading: () => void; @@ -189,7 +189,7 @@ function EditFee({ } = useWalletSelector(); const [totalFee, setTotalFee] = useState(fee); const [feeRateInput, setFeeRateInput] = useState(feeRate?.toString() ?? ''); - const inputRef = useRef(null); + const inputRef = useRef(null); const debouncedFeeRateInput = useDebounce(feeRateInput, 500); const isBtcOrOrdinals = type === 'BTC' || type === 'Ordinals'; const isStx = type === 'STX'; @@ -296,7 +296,7 @@ function EditFee({ feeMode, feeRateInput, ); - setFeeRateInput(selectedFeeRate?.toString()); + setFeeRateInput(selectedFeeRate!.toString()); setTotalFee(modifiedFee.toString()); } else if (btcRecipients && selectedAccount) { const { fee: modifiedFee, selectedFeeRate } = await getBtcFees( @@ -306,7 +306,7 @@ function EditFee({ feeMode, feeRateInput, ); - setFeeRateInput(selectedFeeRate?.toString()); + setFeeRateInput(selectedFeeRate!.toString()); setTotalFee(modifiedFee.toString()); } } catch (err: any) { @@ -332,7 +332,7 @@ function EditFee({ feeMode, feeRateInput, ); - setFeeRateInput(selectedFeeRate?.toString()); + setFeeRateInput(selectedFeeRate!.toString()); setTotalFee(modifiedFee.toString()); } catch (err: any) { if (Number(err) === ErrorCodes.InSufficientBalance) { @@ -360,8 +360,12 @@ function EditFee({ function getFiatEquivalent() { return isStx - ? getStxFiatEquivalent(stxToMicrostacks(new BigNumber(totalFee)), stxBtcRate, btcFiatRate) - : getBtcFiatEquivalent(new BigNumber(totalFee), btcFiatRate); + ? getStxFiatEquivalent( + stxToMicrostacks(new BigNumber(totalFee)), + stxBtcRate, + BigNumber(btcFiatRate), + ) + : getBtcFiatEquivalent(new BigNumber(totalFee), BigNumber(btcFiatRate)); } const getFiatAmountString = (fiatAmount: BigNumber) => { diff --git a/src/app/components/transactionSetting/index.tsx b/src/app/components/transactionSetting/index.tsx index 4fdfcbf2d..beba1902e 100644 --- a/src/app/components/transactionSetting/index.tsx +++ b/src/app/components/transactionSetting/index.tsx @@ -3,9 +3,9 @@ import ArrowIcon from '@assets/img/settings/arrow.svg'; import BottomModal from '@components/bottomModal'; import ActionButton from '@components/button'; import useWalletSelector from '@hooks/useWalletSelector'; -import { BtcUtxoDataResponse, UTXO } from '@secretkeylabs/xverse-core'; +import { UTXO } from '@secretkeylabs/xverse-core'; import { stxToMicrostacks } from '@secretkeylabs/xverse-core/currency'; -import { isCustomFeesAllowed, Recipient } from '@secretkeylabs/xverse-core/transactions/btc'; +import { Recipient, isCustomFeesAllowed } from '@secretkeylabs/xverse-core/transactions/btc'; import BigNumber from 'bignumber.js'; import { useState } from 'react'; import { useTranslation } from 'react-i18next'; @@ -64,7 +64,7 @@ interface Props { btcRecipients?: Recipient[]; ordinalTxUtxo?: UTXO; isRestoreFlow?: boolean; - nonOrdinalUtxos?: BtcUtxoDataResponse[]; + nonOrdinalUtxos?: UTXO[]; showFeeSettings: boolean; setShowFeeSettings: (value: boolean) => void; } diff --git a/src/app/components/transferFeeView/index.tsx b/src/app/components/transferFeeView/index.tsx index 586662a89..85a6dae7f 100644 --- a/src/app/components/transferFeeView/index.tsx +++ b/src/app/components/transferFeeView/index.tsx @@ -56,7 +56,7 @@ function TransferFeeView({ feePerVByte, fee, currency, title }: Props) { const { btcFiatRate, stxBtcRate, fiatCurrency } = useSelector( (state: StoreState) => state.walletState, ); - const fiatRate = getFiatEquivalent(Number(fee), currency, stxBtcRate, btcFiatRate); + const fiatRate = getFiatEquivalent(Number(fee), currency, stxBtcRate, BigNumber(btcFiatRate)); const getFiatAmountString = (fiatAmount: BigNumber) => { if (!fiatAmount) { return ''; @@ -103,7 +103,7 @@ function TransferFeeView({ feePerVByte, fee, currency, title }: Props) { {getFiatAmountString( currency === 'sats' - ? getBtcFiatEquivalent(new BigNumber(fee), btcFiatRate) + ? getBtcFiatEquivalent(new BigNumber(fee), BigNumber(btcFiatRate)) : new BigNumber(fiatRate!), )} diff --git a/src/app/hooks/useDetectOrdinalInSignPsbt.ts b/src/app/hooks/useDetectOrdinalInSignPsbt.ts index 98779e567..25c392c46 100644 --- a/src/app/hooks/useDetectOrdinalInSignPsbt.ts +++ b/src/app/hooks/useDetectOrdinalInSignPsbt.ts @@ -3,7 +3,7 @@ import { useEffect, useState } from 'react'; import useOrdinalsApi from './useOrdinalsApi'; import useWalletSelector from './useWalletSelector'; -const useDetectOrdinalInSignPsbt = (parsedPsbt: '' | ParsedPSBT) => { +const useDetectOrdinalInSignPsbt = (parsedPsbt?: ParsedPSBT) => { const [loading, setLoading] = useState(false); const [userReceivesOrdinal, setUserReceivesOrdinal] = useState(false); const [ordinalInfoData, setOrdinalInfoData] = useState>([]); @@ -11,7 +11,7 @@ const useDetectOrdinalInSignPsbt = (parsedPsbt: '' | ParsedPSBT) => { const OrdinalsApi = useOrdinalsApi(); const getOrdinalId = async (utxoHash: string, index: number) => { - const utxo: UTXO = { + const utxo = { txid: utxoHash, vout: index, status: { @@ -19,7 +19,7 @@ const useDetectOrdinalInSignPsbt = (parsedPsbt: '' | ParsedPSBT) => { }, value: 0, }; - const data = await getOrdinalIdFromUtxo(utxo); + const data = await getOrdinalIdFromUtxo(utxo as UTXO); return data; }; diff --git a/src/app/screens/btcSendScreen/index.tsx b/src/app/screens/btcSendScreen/index.tsx index 0957b58d6..3bf997ace 100644 --- a/src/app/screens/btcSendScreen/index.tsx +++ b/src/app/screens/btcSendScreen/index.tsx @@ -110,9 +110,9 @@ function BtcSendScreen() { recipient, fee: signedTx.fee, feePerVByte: signedTx.feePerVByte, - fiatFee: getBtcFiatEquivalent(signedTx.fee, btcFiatRate), + fiatFee: getBtcFiatEquivalent(signedTx.fee, BigNumber(btcFiatRate)), total: signedTx.total, - fiatTotal: getBtcFiatEquivalent(signedTx.total, btcFiatRate), + fiatTotal: getBtcFiatEquivalent(signedTx.total, BigNumber(btcFiatRate)), btcSendBrowserTx: true, requestToken, tabId, diff --git a/src/app/screens/confirmBrc20Transaction/editFees.tsx b/src/app/screens/confirmBrc20Transaction/editFees.tsx index 0f1d75780..e0a6b1961 100644 --- a/src/app/screens/confirmBrc20Transaction/editFees.tsx +++ b/src/app/screens/confirmBrc20Transaction/editFees.tsx @@ -1,16 +1,16 @@ -import ActionButton from '@components/button'; -import BigNumber from 'bignumber.js'; +import { BetterBarLoader } from '@components/barLoader'; import BottomModal from '@components/bottomModal'; -import styled from 'styled-components'; +import ActionButton from '@components/button'; +import FiatAmountText from '@components/fiatAmountText'; import useBtcFeeRate from '@hooks/useBtcFeeRate'; import useWalletSelector from '@hooks/useWalletSelector'; -import { BetterBarLoader } from '@components/barLoader'; -import { NumericFormat } from 'react-number-format'; import { getBtcFiatEquivalent } from '@secretkeylabs/xverse-core/currency'; +import InputFeedback from '@ui-library/inputFeedback'; +import BigNumber from 'bignumber.js'; import { useEffect, useRef, useState } from 'react'; import { useTranslation } from 'react-i18next'; -import FiatAmountText from '@components/fiatAmountText'; -import InputFeedback from '@ui-library/inputFeedback'; +import { NumericFormat } from 'react-number-format'; +import styled from 'styled-components'; const Container = styled.div((props) => ({ display: 'flex', @@ -232,7 +232,7 @@ export function EditFees({ onClose(); }; - const fiatFee = getBtcFiatEquivalent(new BigNumber(fee), btcFiatRate); + const fiatFee = getBtcFiatEquivalent(new BigNumber(fee), BigNumber(btcFiatRate)); return ( } diff --git a/src/app/screens/confirmBtcTransaction/index.tsx b/src/app/screens/confirmBtcTransaction/index.tsx index 4c2b6ef70..c25fd8dc6 100644 --- a/src/app/screens/confirmBtcTransaction/index.tsx +++ b/src/app/screens/confirmBtcTransaction/index.tsx @@ -1,24 +1,24 @@ -import { useNavigate, useLocation } from 'react-router-dom'; -import { useEffect, useState } from 'react'; -import { useMutation } from '@tanstack/react-query'; -import { BtcTransactionBroadcastResponse } from '@secretkeylabs/xverse-core/types'; -import BottomBar from '@components/tabBar'; -import useBtcWalletData from '@hooks/queries/useBtcWalletData'; -import useWalletSelector from '@hooks/useWalletSelector'; +import { ConfirmBtcTransactionState, LedgerTransactionType } from '@common/types/ledger'; +import { ExternalSatsMethods, MESSAGE_SOURCE } from '@common/types/message-types'; +import AccountHeaderComponent from '@components/accountHeader'; +import AlertMessage from '@components/alertMessage'; import ConfirmBtcTransactionComponent from '@components/confirmBtcTransactionComponent'; -import styled from 'styled-components'; -import { saveTimeForNonOrdinalTransferTransaction } from '@utils/localStorage'; import InfoContainer from '@components/infoContainer'; -import { useTranslation } from 'react-i18next'; +import BottomBar from '@components/tabBar'; +import useBtcWalletData from '@hooks/queries/useBtcWalletData'; +import useBtcClient from '@hooks/useBtcClient'; import useOrdinalsByAddress from '@hooks/useOrdinalsByAddress'; -import AlertMessage from '@components/alertMessage'; +import { useResetUserFlow } from '@hooks/useResetUserFlow'; +import useWalletSelector from '@hooks/useWalletSelector'; import { Recipient } from '@secretkeylabs/xverse-core/transactions/btc'; -import useBtcClient from '@hooks/useBtcClient'; +import { BtcTransactionBroadcastResponse } from '@secretkeylabs/xverse-core/types'; +import { useMutation } from '@tanstack/react-query'; import { isLedgerAccount } from '@utils/helper'; -import { ConfirmBtcTransactionState, LedgerTransactionType } from '@common/types/ledger'; -import { useResetUserFlow } from '@hooks/useResetUserFlow'; -import { ExternalSatsMethods, MESSAGE_SOURCE } from '@common/types/message-types'; -import AccountHeaderComponent from '@components/accountHeader'; +import { saveTimeForNonOrdinalTransferTransaction } from '@utils/localStorage'; +import { useEffect, useState } from 'react'; +import { useTranslation } from 'react-i18next'; +import { useLocation, useNavigate } from 'react-router-dom'; +import styled from 'styled-components'; const BottomBarContainer = styled.h1((props) => ({ marginTop: props.theme.spacing(5), @@ -219,11 +219,8 @@ function ConfirmBtcTransaction() { isWarningAlert /> )} - {btcSendBrowserTx && ( - - )} + {btcSendBrowserTx && } { - setCurrentFeeRate(new BigNumber(feeRate)); + setCurrentFeeRate(new BigNumber(feeRate!)); mutateTxFee({ recipients: recipient, txFee: modifiedFee }); }; @@ -387,7 +387,7 @@ function ConfirmInscriptionRequest() {