Skip to main content
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;
}