Deposit

Interface

/**
 * Parameters required for preparing a deposit transaction
 * @interface PrepareDepositTransactionDataParams
 * @property {VaultKey} vaultKey - Unique identifier for the target vault
 * @property {Address} userAddress - Ethereum address of the user making the deposit
 * @property {string} depositTokenSymbol - Symbol of the token being deposited (e.g., 'WETH', 'USDC')
 * @property {string} depositAmount - Amount of assets to deposit as a decimal string (e.g., "1.5")
 * @property {number | string} chainId - ID of the chain where the deposit will occur
 * @property {number} [slippage] - Maximum acceptable slippage percentage as a decimal (e.g., 0.01 for 1%)
 */
interface PrepareDepositTransactionDataParams {
  vaultKey: VaultKey;
  userAddress: Address;
  depositTokenSymbol: string;
  depositAmount: string;
  chainId: number | string;
  slippage?: number;
}

/**
 * Result object containing transaction data for a deposit operation
 * @interface DepositTransactionData
 * @property {typeof TellerAbi} abi - ABI for the Teller contract
 * @property {Address} address - Address of the Teller contract
 * @property {'deposit'} functionName - Name of the function to call
 * @property {[Address, bigint, bigint]} args - Arguments for the deposit function:
 *   [depositAsset, depositAmount, minimumMint]
 * @property {number} chainId - ID of the chain where the transaction should be executed
 */
interface DepositTransactionData {
  abi: typeof TellerAbi;
  address: Address;
  functionName: 'deposit';
  args: [Address, bigint, bigint];
  chainId: number;
}

Function Overview

import { prepareDepositTransactionData, getVaultByKey, VaultKeys } from '@molecularlabs/nucleus-frontend';

const COOLVAULT_VAULT_KEY = VaultKeys.COOLVAULT;

// Prepare deposit transaction data
const depositTransactionData = await prepareDepositTransactionData({
  vaultKey: COOLVAULT_VAULT_KEY,
  userAddress: '0x1234...',
  depositTokenSymbol: 'WETH', // WETH address
  depositAmount: '1', // 1 WETH
  slippage: 0.01, // 1% slippage (optional)
});

const {
  abi,
  address,
  functionName,
  args,
  chainId
} = depositTransactionData;

Viem Example

import { createPublicClient, http, createWalletClient, custom } from 'viem';
import { mainnet } from 'viem/chains';
import { prepareDepositTransactionData, getVaultByKey, VaultKeys } from '@molecularlabs/nucleus-frontend';

// Example using Viem with MetaMask
const publicClient = createPublicClient({
  chain: mainnet,
  transport: http()
});

const walletClient = createWalletClient({
  chain: mainnet,
  transport: custom(window.ethereum)
});

const COOLVAULT_VAULT_KEY = VaultKeys.COOLVAULT;

async function depositToVault() {
  try {
    // Get user's address
    const [address] = await walletClient.requestAddresses();

    // Prepare deposit data
    const depositTxData = await prepareDepositTransactionData({
      vaultKey: COOLVAULT_VAULT_KEY,
      userAddress: address,
      depositTokenSymbol: 'WETH',
      depositAmount: '1.0', // Depositing 1 WETH
      chainId: 1, // Mainnet
      slippage: 0.01 // 1% slippage
    });

    // Send the transaction
    const hash = await walletClient.writeContract(depositTxData);
    
    // Wait for transaction
    const receipt = await publicClient.waitForTransactionReceipt({ hash });
    
    console.log('Deposit successful:', receipt);
  } catch (error) {
    console.error('Deposit failed:', error);
  }
}

Wagmi Example

import { useAccount, useContractWrite, usePrepareContractWrite, useNetwork } from 'wagmi';
import { useQuery } from '@tanstack/react-query';
import { prepareDepositTransactionData, getVaultByKey, VaultKeys } from '@molecularlabs/nucleus-frontend';
​
const COOLVAULT_VAULT_KEY = VaultKeys.COOLVAULT;
​
function DepositComponent() {
  const { address } = useAccount();
  const { chain } = useNetwork();
  const [amount, setAmount] = useState('');
​
  const isValidAmount = useMemo(() => {
    try {
      return parseFloat(amount) > 0;
    } catch {
      return false;
    }
  }, [amount]);
​
  const {
    data: depositTxData,
    isLoading: isPreparing,
    error: prepareError
  } = useQuery({
    queryKey: ['prepareDeposit', COOLVAULT_VAULT_KEY, amount],
    queryFn: async () => {
      return prepareDepositTransactionData({
        vaultKey: COOLVAULT_VAULT_KEY,
        userAddress: address,
        depositTokenSymbol: 'WETH',
        depositAmount: amount,
        chainId: chain.id,
        slippage: 0.01
      });
    },
    enabled: !!address && !!chain?.id && isValidAmount
  });
​
  const { config } = usePrepareContractWrite({
    address: depositData?.address,
    abi: depositData?.abi,
    functionName: depositData?.functionName,
    args: depositData?.args,
    chainId: depositData?.chainId,
    enabled: !!depositData && isValidAmount
  });
​
  const {
    write: deposit,
    data: depositHash,
    isLoading: isWriting,
    isSuccess,
    isError
  } = useContractWrite(config);
  
  // Handle transaction status
  const { isLoading: isTransactionPending, isSuccess } = useWaitForTransaction({
    hash: depositHash?.hash,
  });
​
  /**
  /* Additional Code...
  */
  return (
    <div>
      <input 
        type="number" 
        value={amount} 
        onChange={(e) => setAmount(e.target.value)}
        placeholder="Amount to deposit"
      />
      <button 
        onClick={() => deposit?.()} 
        disabled={!deposit || isWriting || isPreparing}
      >
        {isWriting ? 'Depositing...' : `Deposit ${amount} WETH`}
      </button>
      
      {isSuccess && (
        <div>
          Deposit successful! Transaction: {data?.hash}
        </div>
      )}
      
      {isError && prepareError && (
        <div>
          Error: {prepareError.message}
        </div>
      )}
    </div>
  );
}

export { DepositComponent };