From cb4ce104cc22e0371669cbc441f8546f6701dfc0 Mon Sep 17 00:00:00 2001 From: Francis Rodriguez <39339295+Freshenext@users.noreply.github.com> Date: Mon, 12 Feb 2024 10:46:27 -0400 Subject: [PATCH] feature/BEV-2131 Will now select medium fee rate or blockbook recommended fee when sending bitcoin. (#879) --- .../BitcoinMiningFeeContainer.tsx | 32 ++++++++++++---- .../ReviewBitcoinTransactionContainer.tsx | 37 ++++++++++++++++--- 2 files changed, 56 insertions(+), 13 deletions(-) diff --git a/src/ux/requestsModal/BitcoinMiningFeeContainer.tsx b/src/ux/requestsModal/BitcoinMiningFeeContainer.tsx index 99834660c..81c95ae1e 100644 --- a/src/ux/requestsModal/BitcoinMiningFeeContainer.tsx +++ b/src/ux/requestsModal/BitcoinMiningFeeContainer.tsx @@ -6,18 +6,29 @@ import { selectBitcoin } from 'store/slices/settingsSlice' import { Typography } from 'src/components' import { sharedStyles } from 'shared/styles' -export const BitcoinMiningFeeContainer = () => { +export interface FeeRecord { + feeName: string + feeRate: string +} + +interface BitcoinMiningFeeContainerProps { + onFeeRatesLoaded?: (rates: FeeRecord[]) => void +} + +export const BitcoinMiningFeeContainer = ({ + onFeeRatesLoaded, +}: BitcoinMiningFeeContainerProps) => { const bitcoinCore = useAppSelector(selectBitcoin) - const [suggestedBitcoinFees, setSuggestedBitcoinFees] = useState< - { feeName: string; feeRate: string }[] - >([]) + const [suggestedBitcoinFees, setSuggestedBitcoinFees] = useState( + [], + ) useEffect(() => { // Fetch the bitcoin fees bitcoinCore?.networksArr[0].bips[0].fetcher .fetchBitcoinMiningFeeRates('cypher') .then(cypherResponse => { - setSuggestedBitcoinFees([ + const suggestedBitcoinFeesData = [ { feeName: 'low', feeRate: cypherResponse.low_fee_per_kb.toString(), @@ -30,7 +41,9 @@ export const BitcoinMiningFeeContainer = () => { feeName: 'high', feeRate: cypherResponse.high_fee_per_kb.toString(), }, - ]) + ] + setSuggestedBitcoinFees(suggestedBitcoinFeesData) + onFeeRatesLoaded?.(suggestedBitcoinFeesData) }) .catch(() => { // Fetch from blockbook if cypher fails @@ -38,16 +51,19 @@ export const BitcoinMiningFeeContainer = () => { bitcoinCore?.networksArr[0].bips[0].fetcher .fetchBitcoinMiningFeeRates('blockbook') .then(blockbookResponse => { - setSuggestedBitcoinFees([ + const suggestedBitcoinFeesData = [ { feeName: 'low', feeRate: convertBtcToSatoshi( blockbookResponse.result, ).toString(), }, - ]) + ] + setSuggestedBitcoinFees(suggestedBitcoinFeesData) + onFeeRatesLoaded?.(suggestedBitcoinFeesData) }) }) + // eslint-disable-next-line react-hooks/exhaustive-deps }, [bitcoinCore]) return ( diff --git a/src/ux/requestsModal/ReviewBitcoinTransactionContainer.tsx b/src/ux/requestsModal/ReviewBitcoinTransactionContainer.tsx index 15efd4a3b..21dacfdb2 100644 --- a/src/ux/requestsModal/ReviewBitcoinTransactionContainer.tsx +++ b/src/ux/requestsModal/ReviewBitcoinTransactionContainer.tsx @@ -1,11 +1,10 @@ -import { useContext, useMemo, useState } from 'react' +import { useContext, useMemo, useState, useCallback } from 'react' import { convertSatoshiToBtcHuman, SendBitcoinRequest, } from '@rsksmart/rif-wallet-bitcoin' import { useTranslation } from 'react-i18next' import { StyleSheet, View } from 'react-native' -import { useCallback } from 'react' import { useSafeAreaInsets } from 'react-native-safe-area-context' import { FormProvider, useForm } from 'react-hook-form' @@ -22,7 +21,10 @@ import { WalletContext } from 'shared/wallet' import { useAddress } from 'shared/hooks' import { formatTokenValues } from 'shared/utils' -import { BitcoinMiningFeeContainer } from './BitcoinMiningFeeContainer' +import { + BitcoinMiningFeeContainer, + FeeRecord, +} from './BitcoinMiningFeeContainer' interface ReviewBitcoinTransactionContainerProps { request: SendBitcoinRequest @@ -179,7 +181,32 @@ const MiningFeeInput = ({ }, }) - const handleFeeChange = (text: string) => onChange(text) + const { setValue } = methods + + const handleFeeChange = useCallback( + (text: string) => onChange(text), + [onChange], + ) + + const onFeeRatesLoaded = useCallback( + (feeRates: FeeRecord[]) => { + let newFee + // If length > 1 then it's fetching the fee from cypher + if (feeRates.length > 1) { + newFee = feeRates[1].feeRate + } + // If length === 1 then it's fetching the fee from blockbook + if (feeRates.length === 1) { + newFee = feeRates[0].feeRate + } + + if (newFee) { + handleFeeChange(newFee) + setValue('miningFee', Number(newFee)) + } + }, + [handleFeeChange, setValue], + ) return ( @@ -188,7 +215,7 @@ const MiningFeeInput = ({ inputName="miningFee" onChangeText={handleFeeChange} /> - + ) }