The account management hooks in Compound React allow you to interact with user accounts and manage permissions in the Compound III protocol.
Summary of Account Management Hooks
- useAllow: Allows or disallows another address to withdraw or transfer
- useAllowBySig: Allows or disallows using EIP-712 signatures for gasless approvals
- useUserNonce: Retrieves the current nonce for a user
- useVersion: Retrieves the current version of the Comet contract
- useHasPermission: Checks if an account has permission to act on behalf of another
- useTransfer: Transfers base tokens from the sender to another account
useAllow
The useAllow
hook allows or disallows another address to withdraw or transfer on behalf of the sender’s address.
Usage
import { useAllow } from 'compound-react';
function AllowComponent() {
const { allow, loading, error, txHash } = useAllow();
const handleAllow = async () => {
// Allow an address to act on behalf of the sender
const managerAddress = '0x1234...';
const isAllowed = true; // Set to false to disallow
const tx = await allow(managerAddress, isAllowed);
console.log('Allow transaction:', tx);
};
return (
<div>
<button onClick={handleAllow} disabled={loading}>
{loading ? 'Processing...' : 'Allow Manager'}
</button>
{error && <p>Error: {error.message}</p>}
{txHash && <p>Transaction: {txHash}</p>}
</div>
);
}
Return Value
{
allow: (manager: string, isAllowed: boolean) => Promise<string | null>; // Returns transaction hash
loading: boolean;
error: Error | null;
txHash: string | null;
}
useAllowBySig
The useAllowBySig
hook allows or disallows another address to withdraw or transfer on behalf of the sender’s address using EIP-712 signatures for gasless approvals.
Usage
import { useAllowBySig } from 'compound-react';
function AllowBySigComponent() {
const { allowBySig, loading, error, txHash } = useAllowBySig();
const handleAllowBySig = async () => {
// Allow an address to act on behalf of the sender using a signature
const owner = '0xOwner...';
const manager = '0xManager...';
const isAllowed = true;
const nonce = 1; // Get from useUserNonce
const expiry = Math.floor(Date.now() / 1000) + 3600; // 1 hour from now
const signature = '0xSignature...'; // EIP-712 signature
const tx = await allowBySig(owner, manager, isAllowed, nonce, expiry, signature);
console.log('AllowBySig transaction:', tx);
};
return (
<div>
<button onClick={handleAllowBySig} disabled={loading}>
{loading ? 'Processing...' : 'Allow By Signature'}
</button>
{error && <p>Error: {error.message}</p>}
{txHash && <p>Transaction: {txHash}</p>}
</div>
);
}
Return Value
{
allowBySig: (
owner: string,
manager: string,
isAllowed: boolean,
nonce: number,
expiry: number,
signature: string
) => Promise<string | null>; // Returns transaction hash
loading: boolean;
error: Error | null;
txHash: string | null;
}
useUserNonce
The useUserNonce
hook retrieves the current nonce for a user, which is used for signed transactions.
Usage
import { useUserNonce } from 'compound-react';
function UserNonceDisplay({ accountAddress }) {
const { nonce, loading, error } = useUserNonce(null, accountAddress);
if (loading) return <div>Loading...</div>;
if (error) return <div>Error: {error.message}</div>;
return (
<div>
<h2>User Nonce</h2>
<p>Nonce: {nonce?.toString()}</p>
</div>
);
}
Return Value
{
nonce: number | null;
loading: boolean;
error: Error | null;
refetch: () => Promise<number | null>;
}
useVersion
The useVersion
hook retrieves the current version of the Comet contract.
Usage
import { useVersion } from 'compound-react';
function VersionDisplay() {
const { version, loading, error } = useVersion();
if (loading) return <div>Loading...</div>;
if (error) return <div>Error: {error.message}</div>;
return (
<div>
<h2>Comet Version</h2>
<p>Version: {version}</p>
</div>
);
}
Return Value
{
version: string | null;
loading: boolean;
error: Error | null;
refetch: () => Promise<string | null>;
}
useHasPermission
The useHasPermission
hook checks if an account has permission to act on behalf of another account.
Usage
import { useHasPermission } from 'compound-react';
function PermissionCheckDisplay({ ownerAddress, managerAddress }) {
const {
hasPermission,
loading,
error
} = useHasPermission(null, ownerAddress, managerAddress);
if (loading) return <div>Loading...</div>;
if (error) return <div>Error: {error.message}</div>;
return (
<div>
<h2>Permission Check</h2>
<p>
{hasPermission
? 'Manager has permission to act on behalf of owner'
: 'Manager does not have permission to act on behalf of owner'}
</p>
</div>
);
}
Return Value
{
hasPermission: boolean | null;
loading: boolean;
error: Error | null;
refetch: () => Promise<boolean | null>;
}
useTransfer
The useTransfer
hook transfers base tokens from the sender to another account.
Usage
import { useTransfer } from 'compound-react';
function TransferComponent() {
const { transfer, loading, error, txHash } = useTransfer();
const handleTransfer = async () => {
// Transfer 100 USDC to recipient
const recipient = '0xRecipient...';
const amount = ethers.utils.parseUnits('100', 6); // 100 USDC with 6 decimals
const tx = await transfer(recipient, amount);
console.log('Transfer transaction:', tx);
};
return (
<div>
<button onClick={handleTransfer} disabled={loading}>
{loading ? 'Transferring...' : 'Transfer 100 USDC'}
</button>
{error && <p>Error: {error.message}</p>}
{txHash && <p>Transaction: {txHash}</p>}
</div>
);
}
Return Value
{
transfer: (dst: string, amount: BigNumber) => Promise<string | null>; // Returns transaction hash
loading: boolean;
error: Error | null;
txHash: string | null;
}