useGaslessTransaction

1
import { useGaslessTransaction, useGlacier } from '@avalabs/avacloud-waas-react';
2
3
function CounterExample() {
4
  // Retrieve the current subnet RPC URL from Glacier
5
  const { blockchain } = useGlacier();
6
7
  const gaslessConfig = {
8
    relayerUrl: 'https://gas-relayer.avax-test.network/printedapr/testnet/rpc', // AvaCloud relayer RPC
9
    subnetRpcUrl: blockchain?.rpcUrl || '',                                    // Target subnet RPC
10
    forwarderAddress: '0x52ec85e43d09889b2bf9e431935356e06f023680',            // AvaCloud forwarder
11
    domainName: 'Counter',
12
    domainVersion: '1',
13
    requestType: 'Message',
14
    suffixType: 'bytes32',  // Optional – request suffix type
15
    suffixName: 'XMKUCJONOFSUSFCYHTYHCLX', // Optional – request suffix name
16
  } as const;
17
18
  // Counter contract information
19
  const COUNTER_CONTRACT_ADDRESS = '0xe4bB5F15dc278197FcE9B21e5aC0442a95e25b5f';
20
  const COUNTER_INCREMENT_ABI = [
21
    {
22
      inputs: [],
23
      name: 'increment',
24
      outputs: [],
25
      stateMutability: 'nonpayable',
26
      type: 'function',
27
    },
28
  ] as const;
29
30
  const {
31
    sendGaslessTransaction,
32
    isLoading,
33
    error,
34
    txHash,
35
    reset,
36
  } = useGaslessTransaction({
37
    gaslessConfig,
38
    contractAddress: COUNTER_CONTRACT_ADDRESS,
39
    abi: COUNTER_INCREMENT_ABI,
40
  });
41
42
  const handleIncrement = () =>
43
    sendGaslessTransaction({ functionName: 'increment' });
44
45
  return (
46
    <div>
47
      <button onClick={handleIncrement} disabled={isLoading}>
48
        Increment counter (no gas)
49
      </button>
50
51
      {isLoading && <p>Sending transaction…</p>}
52
      {txHash && <p>Transaction hash: {txHash}</p>}
53
      {error && <p style={{ color: 'red' }}>{error}</p>}
54
55
      <button onClick={reset}>Reset</button>
56
    </div>
57
  );
58
}