From ffa31ff945fb3a24ac99f6960a3c37e74e038516 Mon Sep 17 00:00:00 2001 From: Mahmoud Aboelenein Date: Mon, 22 Jul 2024 13:31:17 +0300 Subject: [PATCH 1/2] fix screen not correctly updating on fee rate change --- .../SendInscriptionsRequest.tsx | 15 ++-------- .../useSendInscriptions.ts | 28 +++++++++++-------- 2 files changed, 18 insertions(+), 25 deletions(-) diff --git a/src/app/screens/confirmOrdinalTransaction/SendInscriptionsRequest.tsx b/src/app/screens/confirmOrdinalTransaction/SendInscriptionsRequest.tsx index 1a2957eba..1e34a7895 100644 --- a/src/app/screens/confirmOrdinalTransaction/SendInscriptionsRequest.tsx +++ b/src/app/screens/confirmOrdinalTransaction/SendInscriptionsRequest.tsx @@ -2,7 +2,6 @@ import ConfirmBtcTransaction from '@components/confirmBtcTransaction'; import RequestError from '@components/requests/requestError'; import { type Transport } from '@secretkeylabs/xverse-core'; import Spinner from '@ui-library/spinner'; -import { useCallback, useEffect } from 'react'; import { useTranslation } from 'react-i18next'; import { useNavigate } from 'react-router-dom'; import styled from 'styled-components'; @@ -19,11 +18,10 @@ function SendInscriptionsRequest() { const { t } = useTranslation('translation', { keyPrefix: 'CONFIRM_TRANSACTION' }); const navigate = useNavigate(); const { - buildTx, cancelOrdinalsTransferRequest, confirmOrdinalsTransferRequest, setFeeRate, - changeFeeRate, + getFeeForFeeRate, feeRate, isExecuting, isLoading, @@ -32,15 +30,6 @@ function SendInscriptionsRequest() { txError, } = useSendInscriptions(); - const createOrdinalsTransferTx = useCallback(async () => { - await buildTx(); - // eslint-disable-next-line react-hooks/exhaustive-deps - }, []); - - useEffect(() => { - createOrdinalsTransferTx(); - }, [createOrdinalsTransferTx]); - const onClickCancel = async () => { await cancelOrdinalsTransferRequest(); window.close(); @@ -80,7 +69,7 @@ function SendInscriptionsRequest() { cancelText={t('CANCEL')} onCancel={onClickCancel} onConfirm={onClickConfirm} - getFeeForFeeRate={changeFeeRate} + getFeeForFeeRate={getFeeForFeeRate} onFeeRateSet={(newFeeRate) => setFeeRate(newFeeRate.toString())} feeRate={+feeRate} isSubmitting={isExecuting} diff --git a/src/app/screens/confirmOrdinalTransaction/useSendInscriptions.ts b/src/app/screens/confirmOrdinalTransaction/useSendInscriptions.ts index c8a2ba0a4..5f9246e34 100644 --- a/src/app/screens/confirmOrdinalTransaction/useSendInscriptions.ts +++ b/src/app/screens/confirmOrdinalTransaction/useSendInscriptions.ts @@ -6,7 +6,7 @@ import useTransactionContext from '@hooks/useTransactionContext'; import { RpcErrorCode, sendInscriptionsSchema } from '@sats-connect/core'; import { type TransactionSummary } from '@screens/sendBtc/helpers'; import { btcTransaction, type Transport } from '@secretkeylabs/xverse-core'; -import { useCallback, useState } from 'react'; +import { useCallback, useEffect, useState } from 'react'; import * as v from 'valibot'; const useSendInscriptionsRequest = () => { @@ -53,10 +53,7 @@ const useSendInscriptions = () => { Number(desiredFeeRate), ); const txSummary = await tx.getSummary(); - setFeeRate(desiredFeeRate.toString()); - setTransaction(tx); - setSummary(txSummary); - return { transaction: tx, summary: txSummary }; + return { tx, txSummary }; }, [transfers, txContext], ); @@ -66,7 +63,10 @@ const useSendInscriptions = () => { setIsLoading(true); const initialFeeRate = +feeRate || btcFeeRates?.priority; if (!initialFeeRate) return; - await generateTransferTxAndSummary(initialFeeRate); + const { tx, txSummary } = await generateTransferTxAndSummary(initialFeeRate); + setFeeRate(initialFeeRate.toString()); + setTransaction(tx); + setSummary(txSummary); } catch (e) { setTransaction(undefined); setSummary(undefined); @@ -77,15 +77,20 @@ const useSendInscriptions = () => { } finally { setIsLoading(false); } - }, [feeRate, generateTransferTxAndSummary, btcFeeRates]); + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [feeRate]); - const changeFeeRate = async (desiredFeeRate: number): Promise => { - const { summary: tempSummary } = await generateTransferTxAndSummary(desiredFeeRate); - if (tempSummary) return Number(tempSummary.fee); + const getFeeForFeeRate = async (desiredFeeRate: number): Promise => { + const { txSummary } = await generateTransferTxAndSummary(desiredFeeRate); + if (txSummary) return Number(txSummary.fee); return undefined; }; + useEffect(() => { + buildTx(); + }, [buildTx]); + const confirmOrdinalsTransferRequest = async (ledgerTransport?: Transport) => { try { setIsExecuting(true); @@ -129,9 +134,8 @@ const useSendInscriptions = () => { feeRate, isLoading, isExecuting, - buildTx, setFeeRate, - changeFeeRate, + getFeeForFeeRate, confirmOrdinalsTransferRequest, cancelOrdinalsTransferRequest, }; From d6a6444eb096caa5571278865750549f95ddef8c Mon Sep 17 00:00:00 2001 From: Mahmoud Aboelenein Date: Mon, 22 Jul 2024 15:58:40 +0300 Subject: [PATCH 2/2] refactor --- .../useSendInscriptions.ts | 51 ++++++++++--------- 1 file changed, 26 insertions(+), 25 deletions(-) diff --git a/src/app/screens/confirmOrdinalTransaction/useSendInscriptions.ts b/src/app/screens/confirmOrdinalTransaction/useSendInscriptions.ts index 5f9246e34..711513577 100644 --- a/src/app/screens/confirmOrdinalTransaction/useSendInscriptions.ts +++ b/src/app/screens/confirmOrdinalTransaction/useSendInscriptions.ts @@ -6,7 +6,7 @@ import useTransactionContext from '@hooks/useTransactionContext'; import { RpcErrorCode, sendInscriptionsSchema } from '@sats-connect/core'; import { type TransactionSummary } from '@screens/sendBtc/helpers'; import { btcTransaction, type Transport } from '@secretkeylabs/xverse-core'; -import { useCallback, useEffect, useState } from 'react'; +import { useEffect, useState } from 'react'; import * as v from 'valibot'; const useSendInscriptionsRequest = () => { @@ -42,29 +42,25 @@ const useSendInscriptions = () => { const { data: btcFeeRates } = useBtcFeeRate(); const txContext = useTransactionContext(); - const generateTransferTxAndSummary = useCallback( - async (desiredFeeRate: number) => { - const tx = await btcTransaction.sendOrdinalsWithSplit( - txContext, - transfers.map((transfer) => ({ - toAddress: transfer.address, - inscriptionId: transfer.inscriptionId, - })), - Number(desiredFeeRate), - ); - const txSummary = await tx.getSummary(); - return { tx, txSummary }; - }, - [transfers, txContext], - ); + const generateTransferTxAndSummary = async (desiredFeeRate: number) => { + const tx = await btcTransaction.sendOrdinalsWithSplit( + txContext, + transfers.map((transfer) => ({ + toAddress: transfer.address, + inscriptionId: transfer.inscriptionId, + })), + Number(desiredFeeRate), + ); + const txSummary = await tx.getSummary(); + return { tx, txSummary }; + }; - const buildTx = useCallback(async () => { + const buildTx = async (desiredFeeRate: number | undefined) => { try { + if (!desiredFeeRate) return; setIsLoading(true); - const initialFeeRate = +feeRate || btcFeeRates?.priority; - if (!initialFeeRate) return; - const { tx, txSummary } = await generateTransferTxAndSummary(initialFeeRate); - setFeeRate(initialFeeRate.toString()); + const { tx, txSummary } = await generateTransferTxAndSummary(desiredFeeRate); + setFeeRate(desiredFeeRate.toString()); setTransaction(tx); setSummary(txSummary); } catch (e) { @@ -77,8 +73,7 @@ const useSendInscriptions = () => { } finally { setIsLoading(false); } - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [feeRate]); + }; const getFeeForFeeRate = async (desiredFeeRate: number): Promise => { const { txSummary } = await generateTransferTxAndSummary(desiredFeeRate); @@ -88,8 +83,14 @@ const useSendInscriptions = () => { }; useEffect(() => { - buildTx(); - }, [buildTx]); + let initialFeeRate: number | undefined = Number.parseInt(feeRate, 10); + if (Number.isNaN(initialFeeRate)) { + initialFeeRate = btcFeeRates?.priority; + } + + buildTx(initialFeeRate); + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [feeRate, btcFeeRates?.priority]); const confirmOrdinalsTransferRequest = async (ledgerTransport?: Transport) => { try {