fix: user should be able to increase fee for stacks with ledger, closes

#4503

src/app/features/increase-fee-drawer/components/increase-stx-fee-form.tsx

@@ -13,15 +13,13 @@ import { useRefreshAllAccountData } from '@app/common/hooks/account/use-refresh-
 import { useStxBalance } from '@app/common/hooks/balance/stx/use-stx-balance';
 import { microStxToStx, stxToMicroStx } from '@app/common/money/unit-conversion';
 import { stacksValue } from '@app/common/stacks-utils';
-import { useWalletType } from '@app/common/use-wallet-type';
 import { safelyFormatHexTxid } from '@app/common/utils/safe-handle-txid';
 import { stxFeeValidator } from '@app/common/validation/forms/fee-validators';
 import { LoadingSpinner } from '@app/components/loading-spinner';
 import { StacksTransactionItem } from '@app/components/stacks-transaction-item/stacks-transaction-item';
-import { useLedgerNavigate } from '@app/features/ledger/hooks/use-ledger-navigate';
+import { useStacksBroadcastTransaction } from '@app/features/stacks-transaction-request/hooks/use-stacks-broadcast-transaction';
 import { useCurrentStacksAccountBalances } from '@app/query/stacks/balance/stx-balance.hooks';
 import { useSubmittedTransactionsActions } from '@app/store/submitted-transactions/submitted-transactions.hooks';
-import { useReplaceByFeeSoftwareWalletSubmitCallBack } from '@app/store/transactions/fees.hooks';
 import { useRawDeserializedTxState, useRawTxIdState } from '@app/store/transactions/raw.hooks';
 import { Caption } from '@app/ui/components/typography/caption';
 
@@ -34,13 +32,11 @@ export function IncreaseStxFeeForm() {
   const tx = useSelectedTx();
   const navigate = useNavigate();
   const [, setTxId] = useRawTxIdState();
-  const replaceByFee = useReplaceByFeeSoftwareWalletSubmitCallBack();
   const { data: balances } = useCurrentStacksAccountBalances();
   const { availableBalance } = useStxBalance();
   const submittedTransactionsActions = useSubmittedTransactionsActions();
   const rawTx = useRawDeserializedTxState();
-  const { whenWallet } = useWalletType();
-  const ledgerNavigate = useLedgerNavigate();
+  const { stacksBroadcastTransaction } = useStacksBroadcastTransaction('STX');
 
   const fee = Number(rawTx?.auth.spendingCondition?.fee);
 
@@ -58,24 +54,9 @@ export function IncreaseStxFeeForm() {
       const txId = tx.tx_id || safelyFormatHexTxid(rawTx.txid());
       await refreshAccountData();
       submittedTransactionsActions.transactionReplacedByFee(txId);
-      await whenWallet({
-        software: async () => {
-          await replaceByFee(rawTx);
-        },
-        ledger: () => {
-          ledgerNavigate.toConnectAndSignStacksTransactionStep(rawTx);
-        },
-      })();
+      await stacksBroadcastTransaction(rawTx);
     },
-    [
-      tx,
-      rawTx,
-      refreshAccountData,
-      submittedTransactionsActions,
-      whenWallet,
-      replaceByFee,
-      ledgerNavigate,
-    ]
+    [tx, rawTx, refreshAccountData, submittedTransactionsActions, stacksBroadcastTransaction]
   );
 
   if (!tx || !fee) return <LoadingSpinner />;

src/app/pages/send/send-crypto-asset-form/family/stacks/hooks/use-stacks-broadcast-transaction.tsx → src/app/features/stacks-transaction-request/hooks/use-stacks-broadcast-transaction.tsx

@@ -2,7 +2,7 @@ import { useMemo, useState } from 'react';
 import toast from 'react-hot-toast';
 import { useNavigate } from 'react-router-dom';
 
-import { StacksTransaction, deserializeTransaction } from '@stacks/transactions';
+import { StacksTransaction } from '@stacks/transactions';
 
 import { logger } from '@shared/logger';
 import { CryptoCurrencies } from '@shared/models/currencies.model';
@@ -15,11 +15,7 @@ import { useSignStacksTransaction } from '@app/store/transactions/transaction.ho
 
 import { useStacksTransactionSummary } from './use-stacks-transaction-summary';
 
-export function useStacksBroadcastTransaction(
-  unsignedTx: string,
-  token: CryptoCurrencies,
-  decimals?: number
-) {
+export function useStacksBroadcastTransaction(token: CryptoCurrencies, decimals?: number) {
   const signStacksTransaction = useSignStacksTransaction();
   const [isBroadcasting, setIsBroadcasting] = useState(false);
   const { formSentSummaryTxState } = useStacksTransactionSummary(token);
@@ -76,18 +72,14 @@ export function useStacksBroadcastTransaction(
       } catch (e) {}
     }
 
-    const deserializedTransaction = deserializeTransaction(unsignedTx);
-
     return {
-      stacksDeserializedTransaction: deserializedTransaction,
       stacksBroadcastTransaction: broadcastTransaction,
       isBroadcasting,
     };
   }, [
     broadcastTransactionFn,
     navigate,
     signStacksTransaction,
-    unsignedTx,
     isBroadcasting,
     token,
     formSentSummaryTxState,

src/app/pages/send/send-crypto-asset-form/form/stacks/stacks-send-form-confirmation.tsx

@@ -1,17 +1,18 @@
 import { Outlet, useNavigate, useParams } from 'react-router-dom';
 
+import { deserializeTransaction } from '@stacks/transactions';
 import { Box, Stack } from 'leather-styles/jsx';
 
 import { CryptoCurrencies } from '@shared/models/currencies.model';
 
 import { useLocationStateWithCache } from '@app/common/hooks/use-location-state';
 import { useRouteHeader } from '@app/common/hooks/use-route-header';
 import { ModalHeader } from '@app/components/modal-header';
+import { useStacksBroadcastTransaction } from '@app/features/stacks-transaction-request/hooks/use-stacks-broadcast-transaction';
+import { useStacksTransactionSummary } from '@app/features/stacks-transaction-request/hooks/use-stacks-transaction-summary';
 import { InfoIcon } from '@app/ui/components/icons/info-icon';
 import { BasicTooltip } from '@app/ui/components/tooltip/basic-tooltip';
 
-import { useStacksBroadcastTransaction } from '../../family/stacks/hooks/use-stacks-broadcast-transaction';
-import { useStacksTransactionSummary } from '../../family/stacks/hooks/use-stacks-transaction-summary';
 import { SendFormConfirmation } from '../send-form-confirmation';
 
 function useStacksSendFormConfirmationState() {
@@ -27,8 +28,12 @@ export function StacksSendFormConfirmation() {
   const { symbol = 'STX' } = useParams();
   const navigate = useNavigate();
 
-  const { stacksDeserializedTransaction, stacksBroadcastTransaction, isBroadcasting } =
-    useStacksBroadcastTransaction(tx, symbol.toUpperCase() as CryptoCurrencies, decimals);
+  const { stacksBroadcastTransaction, isBroadcasting } = useStacksBroadcastTransaction(
+    symbol.toUpperCase() as CryptoCurrencies,
+    decimals
+  );
+
+  const stacksDeserializedTransaction = deserializeTransaction(tx);
 
   const { formReviewTxSummary } = useStacksTransactionSummary(
     symbol.toUpperCase() as CryptoCurrencies