5ire Wallet Extension - Generic Web3 Injection
This guide will show you how to use the 5ireChain wallet extension to interact with your decentralized application (dApp) that is deployed on 5ireChain - both the native and EVM chains.
Usage 1: Native chain dApp interaction (WASM-based)
The 5ire Wallet extension provides an injected provider to every dApp running on Chrome and Mozilla Firefox.
Steps to connect your dApp with 5ire Wallet Extension:
-
The first step is to install the latest version of the 5ire Wallet extension from the Chrome Store.
-
Check for
window.fire
object, it will be available in your application context. -
Call
window.fire.connect()
method, which is promise based and returns the object with the following values:-
EVM Address: 0xB231a3CFd95ACDDDC92d8c60c405E66A3575d5cc
-
Native Address: 5FUv2eCn2VG6tG4WGptP644kHmjWFXXUe9Rnsfv8ss426Y9Z
-
-
You are now successfully connected to the 5ire Wallet extension.
-
To verify the connection, cross-check the radio icon on the top bar of the extension - the green colour indicates Connected status.
Events
You can subscribe to the following events after connecting the 5ire Wallet extension.
window.fire.on(EVENT_NAME, CALLBACK_FUNCTION);
-
accountChanged
This event triggers when a user tries to change an account and create a new account in wallet extension, and provides the latest address to the connected dApp.
-
networkChanged
This event provides the current selected RPC endpoint (e.g. Testnet, Mainnet)
-
connect
This event is triggered when the user is successfully connected to the 5ire Wallet extension.
-
disconnect
This event is triggered when the user is successfully disconnected from the 5ire Wallet extension.
Signing Method
The 5ire Wallet extension provides a native signer, which works with every polka.js library or SDK.
const { HttpProvider, WsProvider } = require("@polkadot/rpc-provider");const { ApiPromise } = require("@polkadot/api");const network='https://rpc-testnet.5ire.network';const api = await ApiPromise.create({ provider: new HttpProvider(network) });
api.tx.balances .transfer('5C5555yEXUcmEJ5kkcCMvdZjUo7NGJiQJMS7vZXEeoMhj3VQ', 123456) .signAndSend(SENDER, { signer: window.fire }, (status) => { ... });
-
Sign Payload
const signPayload = window?.fire?.signPayload;if (!!signPayload) {const { signature } = await signPayload({address: account.address,data: stringToHex('message to sign'),type: 'bytes'});} -
signRaw
const signRaw = window?.fire?.signRaw;if (!!signRaw) {const { signature } = await signRaw({address: account.address,data: stringToHex('message to sign'),type: 'bytes'});}
Usage 2: EVM chain dApp interaction (EVM-based)
The 5ire Wallet extension provides an injected provider to every dApp running on Chrome and Mozilla Firefox browser.
Steps to connect your dApp with 5ire Wallet Extension:
-
Check if you have installed the latest version of the 5ire Wallet extension from the Chrome Store.
-
Check for
window.fire
object, it will be available in your application context. -
Call
window.fire.request({method:”eth_requestAccounts”})
method, which is promise-based and returns an array with the following values:- EVM Address:
0xB231a3CFd95ACDDDC92d8c60c405E66A3575d5cc
- EVM Address:
-
You are now successfully connected to the 5ire Wallet extension.
-
To verify the connection, cross-check the radio icon on the top bar of the extension - the green colour indicates “connected” status.
Methods
-
window.ethereum.isfire
-
This property is true if the user has the 5ire Wallet Extension installed. You can also use the 5ire provider with the web3 library.
-
Example: const web3 = new Web3(window.fire);
-
Properties
-
window.fire.request(args)
interface RequestArguments {method: string;params?: unknown[] | object;}window.ethereum.request(args: RequestArguments): Promise<unknown>; -
Use this method to submit RPC API requests to 5ireChain using the 5ire Wallet extension. It returns a promise that resolves to the result of the RPC method call.
-
The parameters and return value vary by RPC method. In practice, if a method has parameters, they’re almost always of type
Array{any}
. -
If the request fails, the promise is rejected with an error. The following is an example of using
window.fire.request(args)
to calleth_sendTransaction
:params: [{from: '0xb60e8dd61c5d32be8058bb8eb970870f07233155',to: '0xd46e8dd67c5d32be8058bb8eb970870f07244567',gas: '0x76c0', // 30400gasPrice: '0x9184e72a000', // 10000000000000value: '0x9184e72a', // 2441406250data:'0xd46e8dd67c5d32be8d46e8dd67c5d32be8058bb8eb970870f072445675058bb8eb970870f072445675',},];window.fire.request({method: 'eth_sendTransaction',params,}).then((result) => {// The result varies by RPC method.// For example, this method returns a transaction hash hexadecimal string upon success.}).catch((error) => {// If the request fails, the Promise rejects with an error.});
Events
The 5ire Wallet extension emits events using the Node.js EventEmitter API. The following is an example of listening to the accountChanged
event.
-
accountChanged
window.fire.on('accountChanged', handler: (accounts: object) => void); -
connect
interface ConnectInfo {chainId: string;}window.fire.on('connect', handler: (connectInfo: ConnectInfo) => void);- The provider emits this event when it’s first able to submit RPC requests to a chain.
-
disconnect
window.fire.on('disconnect', handler: (error: ProviderRpcError) => void);-
The provider emits this event if it becomes unable to submit RPC requests to a chain. In general, this only happens due to network connectivity issues or some unforeseen error.
-
When the provider emits this event, it doesn’t accept new requests until the connection to the chain is re-established, which requires reloading the page.
-