Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.crefy.xyz/llms.txt

Use this file to discover all available pages before exploring further.

useSendEth Hook

The useSendEth hook allows you to send native ETH on any supported chain through the Crefy Connect API.

Usage

import { useSendEth } from "crefy-connect";
import { useState } from "react";

export default function SendEthExample() {
  const { sendEth, loading, error, data } = useSendEth();
  const [address, setAddress] = useState("");
  const [amount, setAmount] = useState("");

  const handleSend = async () => {
    try {
      await sendEth({
        to: address,
        value: amount,
        chain: "sepolia",
        mode: "fast",
      });
    } catch (err) {
      console.error("Send ETH failed:", err);
    }
  };

  return (
    <div>
      <h2>Send ETH</h2>
      <input
        type="text"
        placeholder="Recipient address"
        value={address}
        onChange={(e) => setAddress(e.target.value)}
      />
      <input
        type="text"
        placeholder="Amount in ETH"
        value={amount}
        onChange={(e) => setAmount(e.target.value)}
      />
      <button onClick={handleSend} disabled={loading}>
        {loading ? "Sending..." : "Send ETH"}
      </button>

      {error && <p style={{ color: "red" }}>Error: {error}</p>}
      {data && <p>Transaction sent! Hash: {data.txHash}</p>}
    </div>
  );
}

Hook Returns

PropertyTypeDescription
sendEth(params: SendEthParams) => Promise<void>Function to send ETH transaction
loadingbooleanWhether a transaction is currently in progress
errorstring | nullError message if transaction failed
dataSendEthResponse | nullTransaction response data

SendEthParams

ParameterTypeRequiredDescription
tostringRecipient wallet address
valuestringAmount to send in ETH (as string, e.g., “0.1”)
chainstringBlockchain network (“sepolia” or “mainnet”)
mode”slow” | “standard” | “fast”Transaction speed mode (default: “standard”)

SendEthResponse

interface SendEthResponse {
  txHash: string;
  // ... other response fields
}

Examples

Basic Send Transaction

import { useSendEth } from "crefy-connect";

export default function SendButton() {
  const { sendEth, loading } = useSendEth();

  const handleSend = async () => {
    await sendEth({
      to: "0x742d35Cc6634C0532925a3b844Bc9e7595f0bEb",
      value: "0.1",
      chain: "sepolia",
    });
  };

  return (
    <button onClick={handleSend} disabled={loading}>
      {loading ? "Sending..." : "Send 0.1 ETH"}
    </button>
  );
}

With Error Handling

import { useSendEth } from "crefy-connect";
import { useState } from "react";

export default function SendForm() {
  const { sendEth, loading, error } = useSendEth();
  const [recipient, setRecipient] = useState("");
  const [amount, setAmount] = useState("");

  const handleSubmit = async (e: React.FormEvent) => {
    e.preventDefault();

    try {
      await sendEth({
        to: recipient,
        value: amount,
        chain: "sepolia",
        mode: "fast",
      });
      // Reset form on success
      setRecipient("");
      setAmount("");
    } catch (err) {
      console.error("Transaction failed:", err);
    }
  };

  return (
    <form onSubmit={handleSubmit}>
      <input
        type="text"
        placeholder="Recipient address"
        value={recipient}
        onChange={(e) => setRecipient(e.target.value)}
        required
      />
      <input
        type="text"
        placeholder="Amount (ETH)"
        value={amount}
        onChange={(e) => setAmount(e.target.value)}
        required
      />
      <button type="submit" disabled={loading}>
        {loading ? "Sending..." : "Send ETH"}
      </button>
      {error && <p style={{ color: "red" }}>{error}</p>}
    </form>
  );
}

Display Transaction Hash

import { useSendEth } from "crefy-connect";

export default function TransactionTracker() {
  const { sendEth, loading, data } = useSendEth();

  const handleSend = async () => {
    await sendEth({
      to: "0x742d35Cc6634C0532925a3b844Bc9e7595f0bEb",
      value: "0.1",
      chain: "sepolia",
    });
  };

  return (
    <div>
      <button onClick={handleSend} disabled={loading}>
        Send Transaction
      </button>
      {data && (
        <div>
          <p>Transaction successful!</p>
          <p>
            Hash: <a href={`https://sepolia.etherscan.io/tx/${data.txHash}`}>
              {data.txHash}
            </a>
          </p>
        </div>
      )}
    </div>
  );
}

Transaction Speed Modes

import { useSendEth } from "crefy-connect";

export default function SpeedSelector() {
  const { sendEth, loading } = useSendEth();
  const [mode, setMode] = useState<"slow" | "standard" | "fast">("standard");

  const handleSend = async () => {
    await sendEth({
      to: "0x742d35Cc6634C0532925a3b844Bc9e7595f0bEb",
      value: "0.1",
      chain: "sepolia",
      mode: mode,
    });
  };

  return (
    <div>
      <select value={mode} onChange={(e) => setMode(e.target.value as any)}>
        <option value="slow">Slow (Lower fee)</option>
        <option value="standard">Standard</option>
        <option value="fast">Fast (Higher fee)</option>
      </select>
      <button onClick={handleSend} disabled={loading}>
        Send with {mode} mode
      </button>
    </div>
  );
}

Important Notes

Authentication Required: The user must be authenticated via CrefyConnectProvider before sending transactions. The hook will use the authenticated user’s wallet.
Value Format: The value parameter should be a string representing the amount in ETH (e.g., “0.1” for 0.1 ETH, not “100000000000000000”).
Chain Support: Currently supports “sepolia” and “mainnet”. More chains coming soon!