fix: remove bignumber from the redux store (#610)

* Update btcbalance to string and fix some typing issues * stx balances to string * btc fiat rate to string and fix all typings related to it * stx fiat rate to string * update state sync settings * Remove restore btc screen --------- Co-authored-by: Tim Man <[email protected]>
secretkeylabs · Nov 20, 2023 · 306be06 · 306be06
1 parent 719d00b
commit 306be06
Show file tree

Hide file tree

Showing 34 changed files with 209 additions and 396 deletions.
diff --git a/src/app/components/confirmBtcTransactionComponent/index.tsx b/src/app/components/confirmBtcTransactionComponent/index.tsx
@@ -10,7 +10,6 @@ import useOrdinalsByAddress from '@hooks/useOrdinalsByAddress';
 import useSeedVault from '@hooks/useSeedVault';
 import useWalletSelector from '@hooks/useWalletSelector';
 import {
-  BtcUtxoDataResponse,
   ErrorCodes,
   getBtcFiatEquivalent,
   ResponseError,
@@ -130,7 +129,7 @@ interface Props {
   assetDetail?: string;
   assetDetailValue?: string;
   isRestoreFundFlow?: boolean;
-  nonOrdinalUtxos?: BtcUtxoDataResponse[];
+  nonOrdinalUtxos?: UTXO[];
   isBtcSendBrowserTx?: boolean;
   currencyType?: CurrencyTypes;
   isPartOfBundle?: boolean;
@@ -318,7 +317,7 @@ function ConfirmBtcTransactionComponent({
     const newFee = new BigNumber(modifiedFee);
     setCurrentFee(newFee);
     const seed = await getSeed();
-    setCurrentFeeRate(new BigNumber(feeRate ?? ''));
+    setCurrentFeeRate(new BigNumber(feeRate!));
     if (ordinalTxUtxo) ordinalMutate({ txFee: modifiedFee, seedPhrase: seed });
     else if (isRestoreFundFlow) {
       mutateSignNonOrdinalBtcTransaction({ txFee: modifiedFee, seedPhrase: seed });
@@ -439,7 +438,7 @@ function ConfirmBtcTransactionComponent({
             <TransactionDetailComponent
               title={t('CONFIRM_TRANSACTION.TOTAL')}
               value={getAmountString(satsToBtc(total), t('BTC'))}
-              subValue={getBtcFiatEquivalent(total, btcFiatRate)}
+              subValue={getBtcFiatEquivalent(total, BigNumber(btcFiatRate))}
               subTitle={t('CONFIRM_TRANSACTION.AMOUNT_PLUS_FEES')}
             />
           )}

diff --git a/src/app/components/confirmBtcTransactionComponent/inputOutputComponent.tsx b/src/app/components/confirmBtcTransactionComponent/inputOutputComponent.tsx
@@ -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/confirmStxTransactionComponent/index.tsx b/src/app/components/confirmStxTransactionComponent/index.tsx
@@ -12,16 +12,17 @@ import useNetworkSelector from '@hooks/useNetwork';
 import useSeedVault from '@hooks/useSeedVault';
 import useWalletSelector from '@hooks/useWalletSelector';
 import Transport from '@ledgerhq/hw-transport-webusb';
+import type { StacksTransaction } from '@secretkeylabs/xverse-core';
 import {
   getNonce,
+  microstacksToStx,
   setFee,
   setNonce,
   signLedgerStxTransaction,
   signMultiStxTransactions,
   signTransaction,
+  stxToMicrostacks,
 } from '@secretkeylabs/xverse-core';
-import { microstacksToStx, stxToMicrostacks } from '@secretkeylabs/xverse-core/currency';
-import { StacksTransaction } from '@secretkeylabs/xverse-core/types';
 import { isHardwareAccount } from '@utils/helper';
 import BigNumber from 'bignumber.js';
 import { ReactNode, useEffect, useState } from 'react';

diff --git a/src/app/components/recipientComponent/index.tsx b/src/app/components/recipientComponent/index.tsx
@@ -146,8 +146,8 @@ function RecipientComponent({
       amountInCurrency = getFiatEquivalent(
         Number(value),
         currencyType,
-        stxBtcRate,
-        btcFiatRate,
+        BigNumber(stxBtcRate),
+        BigNumber(btcFiatRate),
         fungibleToken,
       );
     }

diff --git a/src/app/components/sendForm/index.tsx b/src/app/components/sendForm/index.tsx
@@ -5,9 +5,12 @@ import { useBnsName, useBNSResolver } from '@hooks/queries/useBnsName';
 import useDebounce from '@hooks/useDebounce';
 import useNetworkSelector from '@hooks/useNetwork';
 import useWalletSelector from '@hooks/useWalletSelector';
-import { getBtcEquivalent, getStxTokenEquivalent } from '@secretkeylabs/xverse-core';
-import { getFiatEquivalent } from '@secretkeylabs/xverse-core/transactions';
-import { FungibleToken } from '@secretkeylabs/xverse-core/types';
+import type { FungibleToken } from '@secretkeylabs/xverse-core';
+import {
+  getBtcEquivalent,
+  getFiatEquivalent,
+  getStxTokenEquivalent,
+} from '@secretkeylabs/xverse-core';
 import InputFeedback from '@ui-library/inputFeedback';
 import { CurrencyTypes } from '@utils/constants';
 import { getCurrencyFlag } from '@utils/currency';
@@ -257,8 +260,8 @@ function SendForm({
     const amountInCurrency = getFiatEquivalent(
       Number(amountToSend),
       currencyType,
-      stxBtcRate,
-      btcFiatRate,
+      BigNumber(stxBtcRate),
+      BigNumber(btcFiatRate),
       fungibleToken,
     );
     setFiatAmount(amountInCurrency);
@@ -293,8 +296,8 @@ function SendForm({
     const amountInCurrency = getFiatEquivalent(
       Number(newValue),
       currencyType,
-      stxBtcRate,
-      btcFiatRate,
+      BigNumber(stxBtcRate),
+      BigNumber(btcFiatRate),
       fungibleToken,
     );
     setFiatAmount(amountInCurrency);
@@ -307,11 +310,17 @@ function SendForm({
     if (!tokenAmount) return '0';
     switch (currencyType) {
       case 'STX':
-        return getStxTokenEquivalent(new BigNumber(tokenAmount), stxBtcRate, btcFiatRate)
+        return getStxTokenEquivalent(
+          new BigNumber(tokenAmount),
+          BigNumber(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/tokenTile/index.tsx b/src/app/components/tokenTile/index.tsx
@@ -1,6 +1,6 @@
 import { BetterBarLoader } from '@components/barLoader';
-import { microstacksToStx, satsToBtc } from '@secretkeylabs/xverse-core/currency';
-import { FungibleToken } from '@secretkeylabs/xverse-core/types';
+import type { FungibleToken } from '@secretkeylabs/xverse-core';
+import { microstacksToStx, satsToBtc } from '@secretkeylabs/xverse-core';
 import { currencySymbolMap } from '@secretkeylabs/xverse-core/types/currency';
 import { StoreState } from '@stores/index';
 import { CurrencyTypes } from '@utils/constants';
@@ -347,7 +347,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/editFee.tsx b/src/app/components/transactionSetting/editFee.tsx
@@ -1,12 +1,13 @@
 import useDebounce from '@hooks/useDebounce';
 import useOrdinalsByAddress from '@hooks/useOrdinalsByAddress';
 import useWalletSelector from '@hooks/useWalletSelector';
-import { BtcUtxoDataResponse, ErrorCodes, UTXO } from '@secretkeylabs/xverse-core';
 import {
+  ErrorCodes,
   getBtcFiatEquivalent,
   getStxFiatEquivalent,
   stxToMicrostacks,
-} from '@secretkeylabs/xverse-core/currency';
+  UTXO,
+} from '@secretkeylabs/xverse-core';
 import {
   getBtcFees,
   getBtcFeesForNonOrdinalBtcSend,
@@ -146,7 +147,7 @@ interface Props {
   btcRecipients?: Recipient[];
   ordinalTxUtxo?: UTXO;
   isRestoreFlow?: boolean;
-  nonOrdinalUtxos?: BtcUtxoDataResponse[];
+  nonOrdinalUtxos?: UTXO[];
   feeMode: string;
   error: string;
   setIsLoading: () => void;
@@ -185,7 +186,7 @@ function EditFee({
   } = useWalletSelector();
   const [totalFee, setTotalFee] = useState(fee);
   const [feeRateInput, setFeeRateInput] = useState(feeRate?.toString() ?? '');
-  const inputRef = useRef(null);
+  const inputRef = useRef<HTMLInputElement>(null);
   const debouncedFeeRateInput = useDebounce(feeRateInput, 500);
   const isBtcOrOrdinals = type === 'BTC' || type === 'Ordinals';
   const isStx = type === 'STX';
@@ -292,7 +293,7 @@ function EditFee({
             feeMode,
             feeRateInput,
           );
-          setFeeRateInput(selectedFeeRate?.toString());
+          setFeeRateInput(selectedFeeRate!.toString());
           setTotalFee(modifiedFee.toString());
         } else if (btcRecipients && selectedAccount) {
           const { fee: modifiedFee, selectedFeeRate } = await getBtcFees(
@@ -302,7 +303,7 @@ function EditFee({
             feeMode,
             feeRateInput,
           );
-          setFeeRateInput(selectedFeeRate?.toString());
+          setFeeRateInput(selectedFeeRate!.toString());
           setTotalFee(modifiedFee.toString());
         }
       } catch (err: any) {
@@ -328,7 +329,7 @@ function EditFee({
           feeMode,
           feeRateInput,
         );
-        setFeeRateInput(selectedFeeRate?.toString());
+        setFeeRateInput(selectedFeeRate!.toString());
         setTotalFee(modifiedFee.toString());
       } catch (err: any) {
         if (Number(err) === ErrorCodes.InSufficientBalance) {
@@ -356,8 +357,12 @@ function EditFee({
 
   function getFiatEquivalent() {
     return isStx
-      ? getStxFiatEquivalent(stxToMicrostacks(new BigNumber(totalFee)), stxBtcRate, btcFiatRate)
-      : getBtcFiatEquivalent(new BigNumber(totalFee), btcFiatRate);
+      ? getStxFiatEquivalent(
+          stxToMicrostacks(new BigNumber(totalFee)),
+          BigNumber(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
@@ -3,7 +3,7 @@ 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 BigNumber from 'bignumber.js';
@@ -64,7 +64,7 @@ interface Props {
   btcRecipients?: Recipient[];
   ordinalTxUtxo?: UTXO;
   isRestoreFlow?: boolean;
-  nonOrdinalUtxos?: BtcUtxoDataResponse[];
+  nonOrdinalUtxos?: UTXO[];
   showFeeSettings: boolean;
   setShowFeeSettings: (value: boolean) => void;
 }
@@ -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/components/transactionsRequests/ContractCallRequest.tsx b/src/app/components/transactionsRequests/ContractCallRequest.tsx
@@ -134,8 +134,9 @@ export default function ContractCallRequest(props: ContractCallRequestProps) {
 
   const functionArgsView = () => {
     const args = getFunctionArgs();
-    return args.map((arg, index) => (
+    return args.map((arg) => (
       <TransactionDetailComponent
+        key={arg.name}
         title={arg.name}
         value={arg.value.length > 20 ? truncateFunctionArgsView(arg.value) : arg.value}
         description={arg.type}
@@ -224,20 +225,18 @@ export default function ContractCallRequest(props: ContractCallRequestProps) {
       switch (postCondition.conditionType) {
         case PostConditionType.STX:
           return <StxPostConditionCard key={key} postCondition={postCondition} />;
-        case PostConditionType.Fungible:
+        case PostConditionType.Fungible: {
+          const coinInfo = coinsMetaData?.find(
+            (coin: Coin) =>
+              coin.contract ===
+              `${addressToString(postCondition.assetInfo.address)}.${
+                postCondition.assetInfo.contractName.content
+              }`,
+          );
           return (
-            <FtPostConditionCard
-              key={key}
-              postCondition={postCondition}
-              ftMetaData={coinsMetaData?.find(
-                (coin: Coin) =>
-                  coin.contract ===
-                  `${addressToString(postCondition.assetInfo.address)}.${
-                    postCondition.assetInfo.contractName.content
-                  }`,
-              )}
-            />
+            <FtPostConditionCard key={key} postCondition={postCondition} ftMetaData={coinInfo} />
           );
+        }
         case PostConditionType.NonFungible:
           return <NftPostConditionCard key={key} postCondition={postCondition} />;
         default:

diff --git a/src/app/components/transferFeeView/index.tsx b/src/app/components/transferFeeView/index.tsx
@@ -56,7 +56,12 @@ 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,
+    BigNumber(stxBtcRate),
+    BigNumber(btcFiatRate),
+  );
   const getFiatAmountString = (fiatAmount: BigNumber) => {
     if (!fiatAmount) {
       return '';
@@ -103,7 +108,7 @@ function TransferFeeView({ feePerVByte, fee, currency, title }: Props) {
         <FiatAmountText>
           {getFiatAmountString(
             currency === 'sats'
-              ? getBtcFiatEquivalent(new BigNumber(fee), btcFiatRate)
+              ? getBtcFiatEquivalent(new BigNumber(fee), BigNumber(btcFiatRate))
               : new BigNumber(fiatRate!),
           )}
         </FiatAmountText>

diff --git a/src/app/hooks/queries/useBtcWalletData.ts b/src/app/hooks/queries/useBtcWalletData.ts
@@ -2,7 +2,6 @@ import useBtcClient from '@hooks/useBtcClient';
 import type { BtcAddressData } from '@secretkeylabs/xverse-core';
 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/useDetectOrdinalInSignPsbt.ts b/src/app/hooks/useDetectOrdinalInSignPsbt.ts
@@ -4,7 +4,7 @@ import { isAxiosError } from 'axios';
 import { useEffect, useState } from 'react';
 import useWalletSelector from './useWalletSelector';
 
-const useDetectOrdinalInSignPsbt = (parsedPsbt: '' | ParsedPSBT) => {
+const useDetectOrdinalInSignPsbt = (parsedPsbt?: ParsedPSBT) => {
   const [loading, setLoading] = useState(false);
   const [userReceivesOrdinal, setUserReceivesOrdinal] = useState(false);
   const [bundleItemsData, setBundleItemsData] = useState<BundleItem[]>([]);

diff --git a/src/app/routes/index.tsx b/src/app/routes/index.tsx
@@ -43,7 +43,6 @@ import RareSatsBundle from '@screens/rareSatsBundle';
 import RareSatsDetailScreen from '@screens/rareSatsDetail/rareSatsDetail';
 import Receive from '@screens/receive';
 import RestoreFunds from '@screens/restoreFunds';
-import RestoreBtc from '@screens/restoreFunds/restoreBtc';
 import RestoreOrdinals from '@screens/restoreFunds/restoreOrdinals';
 import RestoreWallet from '@screens/restoreWallet';
 import SendBrc20Screen from '@screens/sendBrc20';
@@ -301,10 +300,6 @@ const router = createHashRouter([
         path: 'restore-funds',
         element: <RestoreFunds />,
       },
-      {
-        path: 'recover-btc',
-        element: <RestoreBtc />,
-      },
       {
         path: 'recover-ordinals',
         element: <RestoreOrdinals />,

diff --git a/src/app/screens/btcSendScreen/index.tsx b/src/app/screens/btcSendScreen/index.tsx
@@ -109,9 +109,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/coinDashboard/coinHeader.tsx b/src/app/screens/coinDashboard/coinHeader.tsx
@@ -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 (
         <>
           <HeaderSeparator />

diff --git a/src/app/screens/confirmBrc20Transaction/editFees.tsx b/src/app/screens/confirmBrc20Transaction/editFees.tsx
@@ -228,7 +228,7 @@ export function EditFees({
     onClose();
   };
 
-  const fiatFee = getBtcFiatEquivalent(new BigNumber(fee), btcFiatRate);
+  const fiatFee = getBtcFiatEquivalent(new BigNumber(fee), BigNumber(btcFiatRate));
 
   return (
     <BottomModal