@naculus/connect-appkit-react 0.1.9 → 0.2.0

package/src/hooks/useERC20Approve.ts

@@ -1,220 +0,0 @@
-import { useState, useCallback, useRef } from "react";
-import { useWeb3 } from "../provider/Web3ConnectProvider";
-import { useAccount } from "./useAccount";
-import { useViemClient } from "./useViemClient";
-import { useSendTransaction } from "./useSendTransaction";
-import { getClient } from "../client";
-import { WalletError, ERC20_MIN_ABI, parseUnits } from "@naculus/connect-core";
-import type { TokenConfig } from "@naculus/connect-core";
-import type { Address, Hex } from "viem";
-import { encodeFunctionData } from "viem";
-
-// ── Helpers ───────────────────────────────────────────────────────
-
-function toBareAddress(addr: string): Address {
-  return (addr.includes(":") ? addr.split(":").pop()! : addr) as Address;
-}
-
-function encodeApproveCalldata(spender: Address, amount: bigint): Hex {
-  return encodeFunctionData({
-    abi: ERC20_MIN_ABI,
-    functionName: "approve",
-    args: [spender, amount],
-  });
-}
-
-// ── Constants ─────────────────────────────────────────────────────
-
-const MAX_UINT256 = 2n ** 256n - 1n;
-
-// ── Types ─────────────────────────────────────────────────────────
-
-export interface UseERC20ApproveOptions {
-  token: TokenConfig;
-  spender: Address;
-}
-
-export interface UseERC20ApproveReturn {
-  /** Approve a specific amount */
-  approve: (amount: string) => Promise<`0x${string}`>;
-  /** Approve max (type(uint256).max — infinite approval) */
-  approveMax: () => Promise<`0x${string}`>;
-  /** Current allowance as raw bigint */
-  allowanceRaw: bigint | null;
-  /** Current allowance as human-readable string */
-  allowance: string | null;
-  /** Check if allowance >= required amount */
-  hasAllowance: (required: string) => Promise<boolean>;
-  isApproving: boolean;
-  isFetchingAllowance: boolean;
-  error: Error | null;
-  refetchAllowance: () => Promise<void>;
-}
-
-// ── Hook ──────────────────────────────────────────────────────────
-
-export function useERC20Approve(
-  options: UseERC20ApproveOptions,
-): UseERC20ApproveReturn {
-  const { publicClient, walletClient } = useViemClient();
-  const { evmAccount, isConnected } = useAccount();
-  const { session } = useWeb3();
-  const { sendTransaction, isSending, error: sendTxError, reset } = useSendTransaction();
-  const [localError, setLocalError] = useState<Error | null>(null);
-  const [allowanceRaw, setAllowanceRaw] = useState<bigint | null>(null);
-  const [isFetchingAllowance, setIsFetchingAllowance] = useState(false);
-
-  const decimalsRef = useRef<number | undefined>(options.token.decimals);
-  const error = localError ?? sendTxError;
-
-  const ownerAddress = (() => {
-    if (!evmAccount) return null;
-    return toBareAddress(evmAccount);
-  })();
-
-  const fetchAllowance = useCallback(async () => {
-    if (!publicClient || !ownerAddress) return;
-
-    setIsFetchingAllowance(true);
-    try {
-      const raw = await publicClient.readContract({
-        address: options.token.address,
-        abi: ERC20_MIN_ABI,
-        functionName: "allowance",
-        args: [ownerAddress, options.spender],
-      });
-      setAllowanceRaw(raw as bigint);
-    } catch {
-      setAllowanceRaw(null);
-    } finally {
-      setIsFetchingAllowance(false);
-    }
-  }, [publicClient, ownerAddress, options.token.address, options.spender]);
-
-  const allowance = (() => {
-    if (allowanceRaw === null) return null;
-    const decimals = decimalsRef.current ?? options.token.decimals ?? 18;
-    const str = allowanceRaw.toString();
-    const padded = str.padStart(decimals + 1, "0");
-    const dotPos = padded.length - decimals;
-    let intPart = padded.slice(0, dotPos).replace(/^0+/, "") || "0";
-    let fracPart = padded.slice(dotPos).replace(/0+$/, "");
-    return fracPart ? `${intPart}.${fracPart}` : intPart;
-  })();
-
-  const doApprove = useCallback(
-    async (rawAmount: bigint): Promise<`0x${string}`> => {
-      setLocalError(null);
-      reset();
-
-      if (!isConnected || !evmAccount) {
-        const err = new WalletError("wallet_unavailable", "No connected account");
-        setLocalError(err);
-        throw err;
-      }
-
-      if (!publicClient) {
-        const err = new WalletError("wallet_unavailable", "No public client");
-        setLocalError(err);
-        throw err;
-      }
-
-      const data = encodeApproveCalldata(options.spender, rawAmount);
-
-      try {
-        if (session) {
-          const client = getClient();
-          if (client) {
-            const txHash = await sendTransaction({
-              to: options.token.address,
-              data,
-              value: "0",
-            });
-            fetchAllowance();
-            return txHash as `0x${string}`;
-          }
-        }
-
-        if (walletClient) {
-          const { request } = await publicClient.simulateContract({
-            address: options.token.address,
-            abi: ERC20_MIN_ABI,
-            functionName: "approve",
-            args: [options.spender, rawAmount],
-            account: ownerAddress!,
-          });
-          const txHash = await walletClient.writeContract(request);
-          fetchAllowance();
-          return txHash;
-        }
-
-        const txHash = await sendTransaction({
-          to: options.token.address,
-          data,
-          value: "0",
-        });
-        fetchAllowance();
-        return txHash as `0x${string}`;
-      } catch (err) {
-        const error = err instanceof Error ? err : new Error("Approve failed");
-        setLocalError(error);
-        throw error;
-      }
-    },
-    [options, publicClient, walletClient, evmAccount, isConnected, session, ownerAddress, sendTransaction, reset, fetchAllowance],
-  );
-
-  const approveAmount = useCallback(
-    async (amount: string): Promise<`0x${string}`> => {
-      if (!publicClient) throw new WalletError("wallet_unavailable", "No public client");
-
-      let decimals = decimalsRef.current;
-      if (decimals === undefined) {
-        decimals = await publicClient.readContract({
-          address: options.token.address,
-          abi: ERC20_MIN_ABI,
-          functionName: "decimals",
-        }) as number;
-        decimalsRef.current = decimals;
-      }
-
-      const rawAmount = parseUnits(amount, decimals);
-      return doApprove(rawAmount);
-    },
-    [options.token.address, publicClient, doApprove],
-  );
-
-  const approveMaxAmount = useCallback(async (): Promise<`0x${string}`> => {
-    return doApprove(MAX_UINT256);
-  }, [doApprove]);
-
-  const checkAllowance = useCallback(
-    async (required: string): Promise<boolean> => {
-      if (allowanceRaw === null) {
-        await fetchAllowance();
-      }
-      if (allowanceRaw === null) return false;
-
-      let decimals = decimalsRef.current ?? options.token.decimals;
-      if (decimals === undefined) {
-        decimals = 18; // safe fallback
-      }
-
-      const requiredRaw = parseUnits(required, decimals);
-      return allowanceRaw >= requiredRaw;
-    },
-    [allowanceRaw, fetchAllowance, options.token.decimals],
-  );
-
-  return {
-    approve: approveAmount,
-    approveMax: approveMaxAmount,
-    allowance,
-    allowanceRaw,
-    hasAllowance: checkAllowance,
-    isApproving: isSending,
-    isFetchingAllowance,
-    error,
-    refetchAllowance: fetchAllowance,
-  };
-}

package/src/hooks/useERC20Transfer.ts

@@ -1,134 +0,0 @@
-import { useState, useCallback, useRef } from "react";
-import { useWeb3 } from "../provider/Web3ConnectProvider";
-import { useAccount } from "./useAccount";
-import { useViemClient } from "./useViemClient";
-import { useSendTransaction } from "./useSendTransaction";
-import { getClient } from "../client";
-import { WalletError, ERC20_MIN_ABI, parseUnits } from "@naculus/connect-core";
-import type { TokenConfig } from "@naculus/connect-core";
-import type { Address, Hex } from "viem";
-import { encodeFunctionData } from "viem";
-
-// ── Helpers ───────────────────────────────────────────────────────
-
-function toBareAddress(addr: string): Address {
-  return (addr.includes(":") ? addr.split(":").pop()! : addr) as Address;
-}
-
-function encodeTransferCalldata(to: Address, amount: bigint): Hex {
-  return encodeFunctionData({
-    abi: ERC20_MIN_ABI,
-    functionName: "transfer",
-    args: [to, amount],
-  });
-}
-
-// ── Types ─────────────────────────────────────────────────────────
-
-export interface UseERC20TransferOptions {
-  token: TokenConfig;
-}
-
-export interface UseERC20TransferReturn {
-  /** Send a transfer. Returns tx hash on success. */
-  sendTransfer: (to: Address, amount: string) => Promise<`0x${string}`>;
-  isSending: boolean;
-  error: Error | null;
-}
-
-// ── Hook ──────────────────────────────────────────────────────────
-
-export function useERC20Transfer(
-  options: UseERC20TransferOptions,
-): UseERC20TransferReturn {
-  const { publicClient, walletClient } = useViemClient();
-  const { evmAccount, isConnected } = useAccount();
-  const { session } = useWeb3();
-  const { sendTransaction, isSending, error: sendTxError, reset } = useSendTransaction();
-  const [localError, setLocalError] = useState<Error | null>(null);
-
-  const decimalsRef = useRef<number | undefined>(options.token.decimals);
-  const error = localError ?? sendTxError;
-
-  const sendTransfer = useCallback(
-    async (to: Address, amount: string): Promise<`0x${string}`> => {
-      setLocalError(null);
-      reset();
-
-      if (!isConnected || !evmAccount) {
-        const err = new WalletError("wallet_unavailable", "No connected account");
-        setLocalError(err);
-        throw err;
-      }
-
-      if (!publicClient) {
-        const err = new WalletError("wallet_unavailable", "No public client available");
-        setLocalError(err);
-        throw err;
-      }
-
-      const address = toBareAddress(evmAccount);
-
-      // Fetch decimals if not cached
-      let decimals = decimalsRef.current;
-      if (decimals === undefined) {
-        decimals = await publicClient.readContract({
-          address: options.token.address,
-          abi: ERC20_MIN_ABI,
-          functionName: "decimals",
-        }) as number;
-        decimalsRef.current = decimals;
-      }
-
-      const rawAmount = parseUnits(amount, decimals);
-      const data = encodeTransferCalldata(to, rawAmount);
-
-      try {
-        // Strategy 1: session-based connector
-        if (session) {
-          const client = getClient();
-          if (client) {
-            const txHash = await sendTransaction({
-              to: options.token.address,
-              data,
-              value: "0",
-            });
-            return txHash as `0x${string}`;
-          }
-        }
-
-        // Strategy 2: embedded wallet via viem wallet client
-        if (walletClient) {
-          const { request } = await publicClient.simulateContract({
-            address: options.token.address,
-            abi: ERC20_MIN_ABI,
-            functionName: "transfer",
-            args: [to, rawAmount],
-            account: address,
-          });
-          const txHash = await walletClient.writeContract(request);
-          return txHash;
-        }
-
-        // Strategy 3: fallback to sendTransaction hook
-        const txHash = await sendTransaction({
-          to: options.token.address,
-          data,
-          value: "0",
-        });
-        return txHash as `0x${string}`;
-      } catch (err) {
-        const error = err instanceof Error ? err : new Error("Transfer failed");
-        setLocalError(error);
-        throw error;
-      }
-    },
-    [options.token, publicClient, walletClient, evmAccount, isConnected, session, sendTransaction, reset],
-  );
-
-  return {
-    sendTransfer,
-    isSending,
-    error,
-  };
-}

package/src/hooks/useERC20TransferSimulation.ts

@@ -1,147 +0,0 @@
-/**
- * useERC20TransferSimulation — React hook for simulating ERC-20 token
- *                              transfers before signing/submitting.
- *
- * Wraps useTransactionSimulation with ERC-20 transfer calldata building,
- * so callers only need the token, recipient, and amount.
- *
- * @see /docs/features/transaction-simulation.md
- */
-
-import { useMemo } from "react";
-import {
-  useTransactionSimulation,
-  type UseTransactionSimulationReturn,
-  type SimulationResult,
-} from "./useTransactionSimulation";
-import { useAccount } from "./useAccount";
-import { useChain } from "./useChain";
-import type { TokenConfig } from "@naculus/connect-core";
-import type { EvmTransaction } from "../types";
-
-// ── Constants ─────────────────────────────────────────────────────
-
-/**
- * ERC-20 transfer function selector (first 4 bytes of keccak256("transfer(address,uint256)"))
- * We use this to build minimal calldata without importing viem for this hook.
- */
-const ERC20_TRANSFER_SELECTOR = "0xa9059cbb";
-
-// ── Helper: Pad address to 32 bytes (left-padded zeros) ──────────
-
-function padAddress(addr: string): string {
-  const clean = addr.startsWith("0x") ? addr.slice(2) : addr;
-  return clean.padStart(64, "0");
-}
-
-/**
- * Pad a hex value (bigint as hex) to 32 bytes (left-padded zeros).
- */
-function padHex(value: string, bytes: number = 32): string {
-  const clean = value.startsWith("0x") ? value.slice(2) : value;
-  return clean.padStart(bytes * 2, "0");
-}
-
-/**
- * Convert a decimal-amount string to raw amount in smallest unit.
- * E.g. "1.50" with 6 decimals → "1500000" as decimal string.
- */
-function parseUnits(amount: string, decimals: number): bigint {
-  // Split on decimal point
-  const [whole = "0", fraction = ""] = amount.split(".");
-  const padded = fraction.padEnd(decimals, "0").slice(0, decimals);
-  return BigInt(whole + padded || "0");
-}
-
-// ── Build ERC-20 transfer calldata ────────────────────────────────
-
-/**
- * Build minimal ERC-20 transfer calldata without viem dependency.
- *
- * selector: 0xa9059cbb
- * args:     (address to, uint256 amount)
- * encoding: abi-encoded as two 32-byte words
- *
- * @param to   - Recipient address
- * @param amount - Raw transfer amount (smallest unit)
- */
-function buildTransferCalldata(
-  to: `0x${string}`,
-  amount: bigint,
-): `0x${string}` {
-  return `${ERC20_TRANSFER_SELECTOR}${padAddress(to)}${padHex(amount.toString(16))}` as `0x${string}`;
-}
-
-// ── Types ─────────────────────────────────────────────────────────
-
-export interface UseERC20TransferSimulationOptions {
-  /** Token configuration (address, decimals, chainId) */
-  token: TokenConfig;
-  /** Recipient address */
-  to: `0x${string}`;
-  /** Amount in human-readable units (e.g. "1.50" for 1.5 USDC) */
-  amount: string;
-}
-
-export interface UseERC20TransferSimulationReturn
-  extends Omit<UseTransactionSimulationReturn, "simulate"> {
-  /** Simulation result for the built ERC-20 transfer */
-  result: SimulationResult | undefined;
-  /** Whether a simulation is in progress */
-  isSimulating: boolean;
-  /** Error from the last simulation attempt */
-  error: Error | null;
-  /** Re-run the simulation with current parameters */
-  reSimulate: () => Promise<SimulationResult>;
-  /** Reset simulation state */
-  reset: () => void;
-}
-
-// ── Hook ──────────────────────────────────────────────────────────
-
-export function useERC20TransferSimulation(
-  options: UseERC20TransferSimulationOptions,
-): UseERC20TransferSimulationReturn {
-  const { evmAccount, isConnected } = useAccount();
-  const { currentChain } = useChain();
-  const chainId = options.token.chainId ?? currentChain?.id ?? 1;
-
-  // Build the transaction descriptor from ERC-20 transfer params
-  const tx: EvmTransaction | undefined = useMemo(() => {
-    if (!isConnected || !evmAccount) return undefined;
-
-    try {
-      const decimals = options.token.decimals ?? 18;
-      const rawAmount = parseUnits(options.amount, decimals);
-      const data = buildTransferCalldata(options.to, rawAmount);
-
-      return {
-        to: options.token.address,
-        data,
-        value: "0",
-      };
-    } catch {
-      // If amount parsing fails, return undefined
-      return undefined;
-    }
-  }, [
-    options.token.address,
-    options.token.decimals,
-    options.to,
-    options.amount,
-    evmAccount,
-    isConnected,
-  ]);
-
-  // Use the base transaction simulation hook
-  const sim = useTransactionSimulation(tx, chainId);
-
-  // Alias simulate → reSimulate for semantic clarity
-  return {
-    result: sim.result,
-    isSimulating: sim.isSimulating,
-    error: sim.error,
-    reSimulate: sim.simulate,
-    reset: sim.reset,
-  };
-}