fix(tooling-wallet): Fix staking with ledger (#4296)

* feat(wallet): Fix speculos default port

* feat(wallet): Update outdated comment

* feat(wallet): Replace one useDryRunTransaction with new hook to estimate gas budget in StakeForm. Make useDryRunTransaction in StakeForm not trigger a ledger wallet interaction

* feat(wallet): Revert speculos default port change

apps/core/src/hooks/stake/index.ts

@@ -6,3 +6,4 @@ export * from './useTotalDelegatedRewards';
 export * from './useTotalDelegatedStake';
 export * from './useValidatorInfo';
 export * from './useStakeTxnInfo';
+export * from './useStakingGasBudgetEstimation';

apps/core/src/hooks/stake/useStakingGasBudgetEstimation.ts

@@ -0,0 +1,46 @@
+// Copyright (c) 2024 IOTA Stiftung
+// SPDX-License-Identifier: Apache-2.0
+
+import { useMemo } from 'react';
+import { useIotaClient } from '@iota/dapp-kit';
+import { useQuery } from '@tanstack/react-query';
+import { createStakeTransaction } from '../../utils';
+
+interface UseStakingGasBudgetEstimationOptions {
+    senderAddress: string | null;
+    validatorAddress: string;
+    amount: bigint;
+}
+
+export function useStakingGasBudgetEstimation({
+    senderAddress,
+    validatorAddress,
+    amount,
+}: UseStakingGasBudgetEstimationOptions) {
+    const client = useIotaClient();
+
+    const transaction = useMemo(() => {
+        return createStakeTransaction(amount, validatorAddress);
+    }, [amount, validatorAddress]);
+
+    return useQuery({
+        // eslint-disable-next-line @tanstack/query/exhaustive-deps
+        queryKey: [
+            'staking-tx-gas-budget-estimate',
+            senderAddress,
+            validatorAddress,
+            transaction.getData(),
+        ],
+        queryFn: async () => {
+            if (!senderAddress || !transaction) {
+                return null;
+            }
+
+            transaction.setSender(senderAddress);
+
+            await transaction.build({ client });
+
+            return transaction.getData().gasData.budget;
+        },
+    });
+}

apps/wallet/src/ui/app/WalletSigner.ts

@@ -52,7 +52,10 @@ export abstract class WalletSigner {
         if (isTransaction(transaction)) {
             // If the sender has not yet been set on the transaction, then set it.
             // NOTE: This allows for signing transactions with mismatched senders, which is important for sponsored transactions.
-            transaction.setSenderIfNotSet(await this.getAddress());
+            if (!transaction.getData().sender) {
+                transaction.setSender(await this.getAddress());
+            }
+
             return await transaction.build({
                 client: this.client,
             });
@@ -84,13 +87,12 @@ export abstract class WalletSigner {
         transactionBlock: Uint8Array | Transaction;
         options?: IotaTransactionBlockResponseOptions;
     }): Promise<IotaTransactionBlockResponse> {
-        const bytes = await this.prepareTransaction(input.transactionBlock);
         const signed = await this.signTransaction({
-            transaction: bytes,
+            transaction: input.transactionBlock,
         });
 
         return this.client.executeTransactionBlock({
-            transactionBlock: bytes,
+            transactionBlock: signed.bytes,
             signature: signed.signature,
             options: input.options,
         });

apps/wallet/src/ui/app/staking/stake/StakeForm.tsx

@@ -9,6 +9,7 @@ import {
     parseAmount,
     useCoinMetadata,
     useFormatCoin,
+    useStakingGasBudgetEstimation,
 } from '@iota/core';
 import { Field, type FieldProps, Form, useFormikContext } from 'formik';
 import { memo, useEffect, useMemo } from 'react';
@@ -36,7 +37,12 @@ function StakeForm({ validatorAddress, coinBalance, coinType, epoch }: StakeFrom
         if (!values.amount || !decimals) return null;
         if (Number(values.amount) < 0) return null;
         const amountWithoutDecimals = parseAmount(values.amount, decimals);
-        return createStakeTransaction(amountWithoutDecimals, validatorAddress);
+        const transaction = createStakeTransaction(amountWithoutDecimals, validatorAddress);
+        if (activeAddress) {
+            transaction.setSender(activeAddress);
+        }
+
+        return transaction;
     }, [values.amount, validatorAddress, decimals]);
 
     const { data: txDryRunResponse } = useTransactionDryRun(
@@ -46,18 +52,15 @@ function StakeForm({ validatorAddress, coinBalance, coinType, epoch }: StakeFrom
 
     const gasSummary = txDryRunResponse ? getGasSummary(txDryRunResponse) : undefined;
 
-    const stakeAllTransaction = useMemo(() => {
-        return createStakeTransaction(coinBalance, validatorAddress);
-    }, [coinBalance, validatorAddress]);
-
-    const { data: stakeAllTransactionDryRun } = useTransactionDryRun(
-        activeAddress ?? undefined,
-        stakeAllTransaction,
-    );
+    const { data: stakeAllGasBudget } = useStakingGasBudgetEstimation({
+        senderAddress: activeAddress,
+        amount: coinBalance,
+        validatorAddress,
+    });
 
-    const gasBudget = BigInt(stakeAllTransactionDryRun?.input.gasData.budget ?? 0);
+    const gasBudget = BigInt(stakeAllGasBudget ?? 0);
 
-    // do not remove: gasBudget field is used in the validation schema apps/wallet/src/ui/app/staking/stake/utils/validation.ts
+    // do not remove: gasBudget field is used in the validation schema apps/core/src/utils/stake/createValidationSchema.ts
     useEffect(() => {
         setFieldValue('gasBudget', gasBudget);
     }, [gasBudget]);