async connect(): Promise<boolean>
Request permission to start a connection between the project and the wallet
1const isConnected = await fuel.connect();
2expect(isConnected).toBeTruthy();
async disconnect(): Promise<boolean>
Disconnect your project
1const isConnected = await fuel.disconnect();
2expect(isConnected).toBeTruthy();
async isConnected(): Promise<boolean>
Return the state of the application connection.
1const isConnected = await fuel.isConnected();
2expect(isConnected).toBeTruthy();
async accounts(): Promise<Array<string>>
List accounts in the wallet
1const accounts = await fuel.accounts();
2expect(accounts).toEqual([
3 mocks.backgroundService.state.wallet.address.toAddress(),
4]);
async currentAccount(): Promise<string>
Return the current account being used in the wallet application.
1const currentAccount = await fuel.currentAccount();
2expect(currentAccount).toEqual(
3 mocks.backgroundService.state.wallet.address.toAddress()
4);
async networks(): Promise<Array<Network>>
Return the list of networks in the current wallet.
1const networks = await fuel.networks();
2expect(networks).toStrictEqual([
3 { url: process.env.PUBLIC_PROVIDER_URL! },
4 FUEL_NETWORK,
5]);
async network(): Promise<Network>
Return the current network being used in the wallet application.
1const network = await fuel.network();
2expect(network).toStrictEqual({ url: process.env.PUBLIC_PROVIDER_URL! });
async addNetwork(network: Network): Promise<boolean>
Add network to the wallet.
1const isNetworkAdded = await fuel.addNetwork(FUEL_NETWORK);
2expect(isNetworkAdded).toEqual(true);
async assets(): Promise<Array<Asset>>
Return the list of assets in the current wallet.
1const assets = await fuel.assets();
2expect(assets.length).toEqual(0);
async addAsset(asset: Asset): Promise<boolean>
Add asset to the wallet.
1const asset = { assetId: NativeAssetId };
2const isAdded = await fuel.addAsset(asset);
3expect(isAdded).toEqual(true);
async addAssets(asset: Asset[]): Promise<boolean>
Add assets to the wallet.
1const asset = { assetId: NativeAssetId };
2const isAdded = await fuel.addAssets([asset]);
3expect(isAdded).toEqual(true);
async getAbi(contractId: string): Promise<JsonFlatAbi>
Get ABI of contractId given.
1const abiMap = {
2 [AbiContractId]: FlatAbi,
3};
4await fuel.addAbi(abiMap);
5const abi = await fuel.getAbi(AbiContractId);
6
7expect(abi).toStrictEqual(FlatAbi);
async hasAbi(contractId: string): Promise<boolean>
Check if has ABI for contractId given.
1const abiMap = {
2 [AbiContractId]: FlatAbi,
3};
4await fuel.addAbi(abiMap);
5const hasAbi = await fuel.hasAbi(AbiContractId);
6
7expect(hasAbi).toBeTruthy();
async addAbi(abiMap: AbiMap): Promise<boolean>
Add ABI to the wallet.
1const abiMap = {
2 [AbiContractId]: FlatAbi,
3};
4const isAdded = await fuel.addAbi(abiMap);
5expect(isAdded).toEqual(true);
async signMessage(address: string, message: string): Promise<string>
Request a message signature for one specific account
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);
async sendTransaction(transaction: TransactionRequestLike): Promise<string>
Send a transaction, this will request the user selected account to review,
sign, and send the transaction.
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());
getWallet(address: string | AbstractAddress): Promise<FuelWalletLocked>
Return FuelWalletLocked
using a FuelWalletProvider on the connection point to request signed actions.
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());
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.
1const provider = await fuel.getProvider();
2const nodeInfo = await provider.getNodeInfo();
3expect(nodeInfo.nodeVersion).toBeTruthy();
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();
To list all available connectors you can use the listConnectors(): Array<FuelWalletConnector>
method.
1const connectors = fuel.listConnectors();
2expect(connectors.map((c) => c.name)).toEqual(["Fuel Wallet", "Third Wallet"]);
To check if a connector is on the connectors list use the hasConnector(connectorName: string): boolean
method.
1expect(fuel.hasConnector("Fuel Wallet")).toBeTruthy();
2expect(fuel.hasConnector("Third Wallet")).toBeTruthy();
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.
1expect(await fuel.selectConnector("Fuel Wallet")).toBeTruthy();
2expect(await fuel.selectConnector("Third Wallet")).toBeTruthy();
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.
1const connectorName = "Second Wallet";
2fuel.addConnector({ name: connectorName });
3expect(fuel.hasConnector(connectorName)).toBeTruthy();
To remove a Wallet Connector use the removeConnector(connectorName: string): boolean
method.
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();
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.
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.
This event is triggered when the connection status change between the Wallet and the application. The callback function receives the connection
object.
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}
This event is triggered when the list of connected accounts to the application change. The callback function receives the account
string.
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]);
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.
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]);
This event is triggered when the client connects to a different network. The callback function receives the network
object.
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]);
This event is triggered when the Current Connector is updated. The callback function receives the FuelWalletConnector
object.
1fuel.on(fuel.events.currentConnector, onCurrentConnector);
2return () => {
3 fuel.off(fuel.events.currentConnector, onCurrentConnector);
4};
This event is triggered when the Connectors list is updated. The callback function receives the list of connectors, Array<FuelWalletConnector>
.
1fuel.on(fuel.events.connectors, onConnectors);
2return () => {
3 fuel.off(fuel.events.connectors, onConnectors);
4};