getTransaction

import { getTransaction } from '@silentswap/vue';

<script setup lang="ts">
import { getTransaction, getQuote } from '@silentswap/vue';
import { useAccount, useWalletClient } from 'wagmi';
 
const { address, connector } = useAccount();
const { data: walletClient } = useWalletClient();
 
const { getQuote: getBridgeQuote } = getQuote({ address });
const {
  executeTransaction,
  getStatus,
  isLoading,
  currentStep,
  error,
} = getTransaction({
  address: address.value!,
  walletClient: walletClient.value as any,
  connector,
});
 
const handleBridge = async () => {
  // Get quote first
  const quote = await getBridgeQuote(
    1, // Ethereum
    '0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48', // USDC
    '1000000', // 1 USDC
    43114, // Avalanche
    '0xB97EF9Ef8734C71904D8002F8b6Bc66Dd9c48a6E' // USDC.e
  );
 
  if (!quote) return;
 
  // Execute the bridge transaction
  const result = await executeTransaction(quote);
 
  if (result?.requestId) {
    // Check status
    const status = await getStatus(result.requestId, quote.provider);
    console.log('Bridge status:', status);
  }
};
</script>
 
<template>
  <div>
    <button @click="handleBridge" :disabled="isLoading">
      {{ isLoading ? currentStep || 'Executing...' : 'Execute Bridge' }}
    </button>
    <div v-if="error">Error: {{ error.message }}</div>
  </div>
</template>

interface GetTransactionOptions {
  /** User's EVM address */
  address: `0x${string}`;
  /** Wallet client for signing operations */
  walletClient?: WalletClient;
  /** Wagmi connector */
  connector?: Connector;
}

interface GetTransactionReturn {
  // State (reactive)
  isLoading: Readonly<Ref<boolean>>;
  currentStep: Readonly<Ref<string>>;
  error: Readonly<Ref<Error | null>>;
 
  // Methods
  executeTransaction: (quote: BridgeQuote) => Promise<BridgeStatus | null>;
  getStatus: (requestId: string, provider: BridgeProvider) => Promise<BridgeStatus | null>;
}

<script setup lang="ts">
import { watch } from 'vue';
 
const { executeTransaction, currentStep } = getTransaction({
  address: address.value!,
  walletClient,
  connector,
});
 
// Watch for status updates
watch(currentStep, (step) => {
  if (step) {
    console.log('Current step:', step);
  }
});
</script>

<script setup lang="ts">
const { executeTransaction, error } = getTransaction({
  address: address.value!,
  walletClient,
  connector,
});
 
const handleBridge = async () => {
  try {
    const quote = await getBridgeQuote(/* ... */);
    if (!quote) throw new Error('Failed to get quote');
 
    const result = await executeTransaction(quote);
    
    if (!result) {
      throw new Error('Transaction execution failed');
    }
 
    if (result.status === 'failed') {
      throw new Error(result.error || 'Bridge transaction failed');
    }
 
    console.log('Bridge completed:', result);
  } catch (err) {
    console.error('Bridge error:', err);
  }
};
</script>