Docs Icon ChevronRight For Developers Icon ChevronRight Reference

API Reference

Methods

Connect

async connect(): Promise<boolean>
Request permission to start a connection between the project and the wallet

Fuel.test.ts Icon Link
1const isConnected = await fuel.connect();
2expect(isConnected).toBeTruthy();

Disconnect

async disconnect(): Promise<boolean>
Disconnect your project

Fuel.test.ts Icon Link
1const isConnected = await fuel.disconnect();
2expect(isConnected).toBeTruthy();

Get connection status

async isConnected(): Promise<boolean>
Return the state of the application connection.

Fuel.test.ts Icon Link
1const isConnected = await fuel.isConnected();
2expect(isConnected).toBeTruthy();

List Accounts

async accounts(): Promise<Array<string>>
List accounts in the wallet

Fuel.test.ts Icon Link
1const accounts = await fuel.accounts();
2expect(accounts).toEqual([
3  mocks.backgroundService.state.wallet.address.toAddress(),
4]);

Current Account

async currentAccount(): Promise<string>
Return the current account being used in the wallet application.

Fuel.test.ts Icon Link
1const currentAccount = await fuel.currentAccount();
2expect(currentAccount).toEqual(
3  mocks.backgroundService.state.wallet.address.toAddress()
4);

List Networks

async networks(): Promise<Array<Network>>
Return the list of networks in the current wallet.

Fuel.test.ts Icon Link
1const networks = await fuel.networks();
2expect(networks).toStrictEqual([
3  { url: process.env.PUBLIC_PROVIDER_URL! },
4  FUEL_NETWORK,
5]);

Current Network

async network(): Promise<Network>
Return the current network being used in the wallet application.

Fuel.test.ts Icon Link
1const network = await fuel.network();
2expect(network).toStrictEqual({ url: process.env.PUBLIC_PROVIDER_URL! });

Add Network

async addNetwork(network: Network): Promise<boolean>
Add network to the wallet.

Fuel.test.ts Icon Link
1const isNetworkAdded = await fuel.addNetwork(FUEL_NETWORK);
2expect(isNetworkAdded).toEqual(true);

List Assets

async assets(): Promise<Array<Asset>>
Return the list of assets in the current wallet.

Fuel.test.ts Icon Link
1const assets = await fuel.assets();
2expect(assets.length).toEqual(0);

Add Asset

async addAsset(asset: Asset): Promise<boolean>
Add asset to the wallet.

Fuel.test.ts Icon Link
1const asset = { assetId: NativeAssetId };
2const isAdded = await fuel.addAsset(asset);
3expect(isAdded).toEqual(true);

Add Assets

async addAssets(asset: Asset[]): Promise<boolean>
Add assets to the wallet.

Fuel.test.ts Icon Link
1const asset = { assetId: NativeAssetId };
2const isAdded = await fuel.addAssets([asset]);
3expect(isAdded).toEqual(true);

Get ABI

async getAbi(contractId: string): Promise<JsonFlatAbi>
Get ABI of contractId given.

Fuel.test.ts Icon Link
1const abiMap = {
2  [AbiContractId]: FlatAbi,
3};
4await fuel.addAbi(abiMap);
5const abi = await fuel.getAbi(AbiContractId);
6
7expect(abi).toStrictEqual(FlatAbi);

Has ABI

async hasAbi(contractId: string): Promise<boolean>
Check if has ABI for contractId given.

Fuel.test.ts Icon Link
1const abiMap = {
2  [AbiContractId]: FlatAbi,
3};
4await fuel.addAbi(abiMap);
5const hasAbi = await fuel.hasAbi(AbiContractId);
6
7expect(hasAbi).toBeTruthy();

Add ABI

async addAbi(abiMap: AbiMap): Promise<boolean>
Add ABI to the wallet.

Fuel.test.ts Icon Link
1const abiMap = {
2  [AbiContractId]: FlatAbi,
3};
4const isAdded = await fuel.addAbi(abiMap);
5expect(isAdded).toEqual(true);

Request signature message

async signMessage(address: string, message: string): Promise<string>
Request a message signature for one specific account

Fuel.test.ts Icon Link
1const accounts = await fuel.accounts();
2const account = accounts[0];
3
4// Test example like docs
5const signedMessage = await fuel.signMessage(account, "test");
6const signedMessageSpec =
7  await mocks.backgroundService.state.wallet.signMessage("test");
8expect(signedMessage).toEqual(signedMessageSpec);

Send transaction

async sendTransaction(transaction: TransactionRequestLike): Promise<string>
Send a transaction, this will request the user selected account to review, sign, and send the transaction.

Fuel.test.ts Icon Link
1const accounts = await fuel.accounts();
2const account = accounts[0];
3const toAccount = toWallet.address.toAddress();
4
5// Seed wallet with funds
6await seedWallet(account, bn.parseUnits("1"));
7
8// Test example like docs
9const transactionRequest = new ScriptTransactionRequest({
10  gasLimit: 50_000,
11  gasPrice: 1,
12});
13
14const toAddress = Address.fromString(toAccount);
15const amount = bn.parseUnits("0.1");
16transactionRequest.addCoinOutput(toAddress, amount);
17
18const wallet = await fuel.getWallet(account);
19const resources = await wallet.getResourcesToSpend([[amount, NativeAssetId]]);
20
21transactionRequest.addResources(resources);
22const response = await wallet.sendTransaction(transactionRequest);
23
24// wait for transaction to be completed
25await response.wait();
26
27// query the balance of the destination wallet
28const addrWallet = await fuel.getWallet(toAddress);
29const balance = await addrWallet.getBalance(NativeAssetId);
30expect(balance.toNumber()).toBeGreaterThanOrEqual(amount.toNumber());

Get Wallet

getWallet(address: string | AbstractAddress): Promise<FuelWalletLocked>
Return FuelWalletLocked using a FuelWalletProvider on the connection point to request signed actions.

Fuel.test.ts Icon Link
1const accounts = await fuel.accounts();
2const account = accounts[0];
3const toAccount = toWallet.address.toString();
4
5// Test example like docs
6const wallet = await fuel.getWallet(account);
7const toAddress = Address.fromString(toAccount);
8const amount = bn.parseUnits("0.1");
9const response = await wallet.transfer(toAddress, amount, NativeAssetId, {
10  gasPrice: 1,
11});
12
13// wait for transaction to be completed
14await response.wait();
15
16// query the balance of the destination wallet
17const addrWallet = await fuel.getWallet(toAddress);
18const balance = await addrWallet.getBalance(NativeAssetId);
19expect(balance.toNumber()).toBeGreaterThanOrEqual(amount.toNumber());

Get Provider

getProvider(): Promise<FuelWalletProvider>
Return a FuelWalletProvider. This class extends the fuels-ts SDK's Provider, enabling all of the methods available for Provider while using the FuelSDK on signature points to request user permissions.

Note: The provider returned is tied to the current network selected by the user in their wallet. This means that if the user changes the network within their wallet, the DApp will also switch to that network. Support for specific DApp networks will be available in the future.

Using provider to query node info

Fuel.test.ts Icon Link
1const provider = await fuel.getProvider();
2const nodeInfo = await provider.getNodeInfo();
3expect(nodeInfo.nodeVersion).toBeTruthy();

Using provider on a fuels-ts Wallet

Fuel.test.ts Icon Link
1const accounts = await fuel.accounts();
2const account = accounts[0];
3const toAccount = toWallet.address.toString();
4
5// Test example like docs
6const provider = await fuel.getProvider();
7const walletLocked = Wallet.fromAddress(account, provider);
8const toAddress = Address.fromString(toAccount);
9const response = await walletLocked.transfer(
10  toAddress,
11  bn.parseUnits("0.1"),
12  NativeAssetId,
13  { gasPrice: 1 }
14);
15
16// wait for transaction to be completed
17await response.wait();

Listing connectors

To list all available connectors you can use the listConnectors(): Array<FuelWalletConnector> method.

FuelWalletConnectors.test.ts Icon Link
1const connectors = fuel.listConnectors();
2expect(connectors.map((c) => c.name)).toEqual(["Fuel Wallet", "Third Wallet"]);

Has connector

To check if a connector is on the connectors list use the hasConnector(connectorName: string): boolean method.

FuelWalletConnectors.test.ts Icon Link
1expect(fuel.hasConnector("Fuel Wallet")).toBeTruthy();
2expect(fuel.hasConnector("Third Wallet")).toBeTruthy();

Selecting connector

For selecting a different Wallet Connector use the async selectConnector(connectorName: string): Promise<boolean> method. This method will check if the desired connector is installed. If it is not detected in 1 second, the method throws an error.

FuelWalletConnectors.test.ts Icon Link
1expect(await fuel.selectConnector("Fuel Wallet")).toBeTruthy();
2expect(await fuel.selectConnector("Third Wallet")).toBeTruthy();

Add connector

For adding a Wallet Connector use the addConnector(connector: FuelWalletConnector): boolean method. This method does not trigger any errors if the target Connector is not installed.

FuelWalletConnectors.test.ts Icon Link
1const connectorName = "Second Wallet";
2fuel.addConnector({ name: connectorName });
3expect(fuel.hasConnector(connectorName)).toBeTruthy();

Remove connector

To remove a Wallet Connector use the removeConnector(connectorName: string): boolean method.

FuelWalletConnectors.test.ts Icon Link
1const connectorName = "Another Wallet";
2expect(
3  fuel.listConnectors().find((i) => i.name === connectorName)
4).toBeTruthy();
5fuel.removeConnector(connectorName);
6expect(fuel.listConnectors().find((i) => i.name === connectorName)).toBeFalsy();

Events

Fuel emits events when certain actions occur. These events can be listened to by using the on method.

The events API follows the native Node.js EventEmitter enabling, on, once, and off. The events enum FuelWalletEvents can be imported from the @fuel-wallet/sdk package.

Usage

The fuel object has an events property which is an enum of all the events that can be listened to.
The on method takes two arguments, the event name and a callback function. The callback function receives data associated with the event.

Connection

This event is triggered when the connection status change between the Wallet and the application. The callback function receives the connection object.

useIsConnected.tsx Icon Link
1import { useEffect, useState } from "react";
2
3import { useFuel } from "./useFuel";
4
5export function useIsConnected() {
6  const [fuel] = useFuel();
7  const [isConnected, setIsConnected] = useState(false);
8
9  useEffect(() => {
10    async function handleConnection() {
11      const isConnected = await fuel.isConnected();
12      setIsConnected(isConnected);
13    }
14
15    if (fuel) {
16      handleConnection();
17    }
18
19    /* eventConnection:start */
20    fuel?.on(fuel.events.connection, handleConnection);
21    return () => {
22      fuel?.off(fuel.events.connection, handleConnection);
23    };
24    /* eventConnection:end */
25  }, [fuel]);
26
27  return [isConnected];
28}

Accounts

This event is triggered when the list of connected accounts to the application change. The callback function receives the account string.

Accounts.tsx Icon Link
1const handleAccountsEvent = (accounts: string[]) => {
2  setAccounts(accounts);
3};
4
5useEffect(() => {
6  fuel?.on(fuel.events.accounts, handleAccountsEvent);
7  return () => {
8    fuel?.off(fuel.events.accounts, handleAccountsEvent);
9  };
10}, [fuel]);

Current Account

This event is triggered when the current account is changed in the Fuel Wallet Extension. The callback function receives the account address.

This event is only triggered if the application has access to the current account address. Otherwise, it is not triggered.

CurrentAccount.tsx Icon Link
1const handleAccountEvent = (account: string) => {
2  setCurrentAccount(account);
3};
4
5useEffect(() => {
6  // listen to the current event account, and call the handleAccountEvent
7  fuel?.on(fuel.events.currentAccount, handleAccountEvent);
8  return () => {
9    // remove the listener when the component is unmounted
10    fuel?.off(fuel.events.currentAccount, handleAccountEvent);
11  };
12}, [fuel]);

Network

This event is triggered when the client connects to a different network. The callback function receives the network object.

Network.tsx Icon Link
1const handleNetworkChange = (network: FuelProviderConfig) => {
2  setNetwork(network);
3};
4
5useEffect(() => {
6  fuel?.on(fuel.events.network, handleNetworkChange);
7
8  return () => {
9    fuel?.off(fuel.events.network, handleNetworkChange);
10  };
11}, [fuel]);

CurrentConnector

This event is triggered when the Current Connector is updated. The callback function receives the FuelWalletConnector object.

Connectors.tsx Icon Link
1fuel.on(fuel.events.currentConnector, onCurrentConnector);
2return () => {
3  fuel.off(fuel.events.currentConnector, onCurrentConnector);
4};

Connectors

This event is triggered when the Connectors list is updated. The callback function receives the list of connectors, Array<FuelWalletConnector>.

Connectors.tsx Icon Link
1fuel.on(fuel.events.connectors, onConnectors);
2return () => {
3  fuel.off(fuel.events.connectors, onConnectors);
4};