How-to: Grant USDC Allowance to Permit2

import { createPublicClient, http, encodeFunctionData, erc20Abi } from "viem";
import { sepolia } from "viem/chains";
import dotenv from "dotenv";

dotenv.config();

/**
 * Signs a transaction using a developer-controlled wallet managed by Circle.
 *
 * For EVM chains, accepts a transaction object in JSON format.
 * The transaction object will be automatically stringified if needed.
 *
 * @async
 * @function signTransaction
 * @param {object} transaction - Transaction object for EVM chains
 * @returns {Promise<object>} The signature response data returned by Circle's API
 *
 * @example
 * const signature = await signTransaction({
 *   to: '0x...',
 *   value: '0x0',
 *   data: '0x...',
 *   nonce: 1,
 *   gasLimit: '0x5208',
 *   maxFeePerGas: '0x...',
 *   maxPriorityFeePerGas: '0x...',
 *   chainId: 1
 * });
 */
export async function signTransaction(transaction) {
  const client = initiateDeveloperControlledWalletsClient({
    apiKey: process.env.CIRCLE_WALLETS_API_KEY,
    entitySecret: process.env.ENTITY_SECRET,
  });

  const transactionJson = JSON.stringify(
    transaction,
    (_, value) => (typeof value === "bigint" ? value.toString() : value),
    2,
  );

  const response = await client.signTransaction({
    walletId: process.env.CIRCLE_WALLET_ID,
    transaction: transactionJson,
  });

  return response.data;
}

/**
 * Composes a raw unsigned EIP-1559 transaction for approving USDC for the Permit2 contract.
 * This transaction can then be signed using Circle Wallets' raw transaction signing API.
 *
 * @async
 * @function composeUSDCApprovalTransaction
 * @returns {Promise<object>} The unsigned EIP-1559 transaction object.
 */
export async function composeUSDCApprovalTransaction() {
  const publicClient = createPublicClient({
    chain: sepolia,
    transport: http(process.env.RPC_URL),
  });

  // Step 1: Encode the function call data
  const data = encodeFunctionData({
    abi: erc20Abi,
    functionName: "approve",
    args: [
      process.env.PERMIT2_CONTRACT_ADDRESS,
      BigInt(process.env.APPROVAL_AMOUNT),
    ],
  });

  // Step 2: Estimate gas fees (viem handles the calculation)
  const fees = await publicClient.estimateFeesPerGas();

  // Step 3: Prepare the transaction request (viem auto-fills nonce, gas, etc.)
  const transaction = await publicClient.prepareTransactionRequest({
    account: process.env.SENDER_WALLET_ADDRESS,
    to: process.env.USDC_CONTRACT_ADDRESS,
    value: 0n,
    data,
    ...fees,
  });

  return transaction;
}

/**
 * Broadcasts an signed transaction to the network.
 *
 * @async
 * @function broadcastSignedTransaction
 * @param {string} signedTransaction - The signed transaction as a hex string (with 0x prefix)
 * @returns {Promise<string>} The transaction hash
 */
export async function broadcastSignedTransaction(signedTransaction) {
  const publicClient = createPublicClient({
    chain: sepolia, // use the correct chain for your wallet
    transport: http(process.env.RPC_URL),
  });

  // Send the raw signed transaction
  const txHash = await publicClient.sendRawTransaction({
    serializedTransaction: signedTransaction,
  });

  return txHash;
}

/* -------- Example usage with Circle ---------

// For auth and wallet creation, see: https://developers.circle.com/interactive-quickstarts/dev-controlled-wallets
const tx = await composeUSDCApprovalTransaction();
const signature = await signTransaction(tx);
const txHash = await broadcastSignedTransaction(signature.signedTransaction);

---------------------------------- */

import {
  createWalletClient,
  createPublicClient,
  http,
  custom,
  erc20Abi,
} from "viem";
import { sepolia } from "viem/chains";
import dotenv from "dotenv";

dotenv.config();

/**
 * Approves a specified amount of USDC for the Permit2 contract using
 * a custom wallet with an EIP-1193 provider (like MetaMask).
 *
 * This function sends an on-chain transaction to call the ERC-20 `approve`
 * method on the USDC contract, allowing the Permit2 contract to spend
 * the specified amount on behalf of the wallet.
 *
 * @async
 * @function approveUSDCWithEIP1193Wallet
 * @param {any} [provider] - EIP-1193 provider.
 * @returns {Promise<object>} The transaction hash and receipt.
 */
export async function approveUSDCWithEIP1193Wallet(provider) {
  const publicClient = createPublicClient({
    chain: sepolia,
    transport: http(process.env.RPC_URL),
  });

  const walletClient = createWalletClient({
    account: process.env.WALLET_ADDRESS,
    chain: sepolia,
    transport: custom(provider),
  });

  const hash = await walletClient.writeContract({
    address: process.env.USDC_CONTRACT_ADDRESS,
    abi: erc20Abi,
    functionName: "approve",
    args: [
      process.env.PERMIT2_CONTRACT_ADDRESS,
      BigInt(process.env.APPROVAL_AMOUNT),
    ],
  });

  const receipt = await publicClient.waitForTransactionReceipt({ hash });
  return { hash, receipt };
}

/* -------- Example usage with EIP-1193 wallet ---------

// Refer to https://viem.sh/docs/clients/transports/custom and your wallet provider's documentation for the provider object. 
const {hash, receipt} = await approveUSDCWithEIP1193Wallet({provider: window.ethereum});
console.log('Hash:', hash);
console.log('Receipt:', receipt);

---------------------------------- */