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
| Property | Type | Description |
|---|
sendEth | (params: SendEthParams) => Promise<void> | Function to send ETH transaction |
loading | boolean | Whether a transaction is currently in progress |
error | string | null | Error message if transaction failed |
data | SendEthResponse | null | Transaction response data |
SendEthParams
| Parameter | Type | Required | Description |
|---|
to | string | ✅ | Recipient wallet address |
value | string | ✅ | Amount to send in ETH (as string, e.g., “0.1”) |
chain | string | ✅ | Blockchain 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!