Watch Assets
Arcana wallet is an embedded Web3 wallet available to all the dApps that integrate with the Arcana Auth SDK.
In this guide, you will learn how dApps can use the JSON RPC calls supported by the Arcana wallet to watch native and custom tokens associated with a specified wallet address.
Prerequisites
Register and configure your application using the Arcana Developer Dashboard. Next, install the @arcana/auth
package. Integrate the Auth SDK with your dApp. For details, see Arcana Auth Quick Start Guide.
const { AuthProvider } = window.arcana.auth // From CDN
//or
import { AuthProvider, CHAIN } from '@arcana/auth' //From npm
//clientId : Arcana Unique App Identifier via Dashboard
const clientId = 'xar_test_445007f942f9Ba718953094BbeeeeeB9484cAfd2'
const auth = new AuthProvider(`${clientId}`, { //required
network: 'testnet', //defaults to 'testnet'
position: 'left', //defaults to right
theme: 'light', //defaults to dark
alwaysVisible: false, //defaults to true, wallet always visible
chainConfig: {
chainId: CHAIN.POLYGON_MAINNET, //defaults to CHAIN.ETHEREUM_MAINNET
rpcUrl: 'https://polygon-rpc.com', //defaults to 'https://rpc.ankr.com/eth'
},
})
try {
await auth.init()
} catch (e) {
// Handle exception case
}
Make sure you have already initialized the wallet before invoking any JSON RPC calls for watching token assets using the Arcana wallet.
// Assuming Auth SDK is integrated and initialized
try {
provider = auth.provider
const connected = await auth.isLoggedIn()
console.log({ connected })
setHooks()
} catch (e) {
// Handle exception case
}
// setHooks: Manage chain or account switch in Arcana wallet
function setHooks() {
provider.on('connect', async (params) => {
console.log({ type: 'connect', params: params })
const isLoggedIn = await auth.isLoggedIn()
console.log({ isLoggedIn })
})
provider.on('accountsChanged', (params) => {
//Handle
console.log({ type: 'accountsChanged', params: params })
})
provider.on('chainChanged', async (params) => {
console.log({ type: 'chainChanged', params: params })
})
}
Watch Assets
Once the application is registered, configured and integrated with the Auth SDK, you can build functionality in the dApp for watching token assets associated with the logged in user's wallet address by implementing a 'watchAssets' function as shown in the following code sample:
async function watchAsset() {
setRequest('eth_sendTransaction')
const hash = await provider.request({
method: 'wallet_watchAsset',
params: {
type: 'ERC20',
options: {
address: '0xB983E01458529665007fF7E0CDdeCDB74B967Eb6',
symbol: 'FOO',
decimals: 18,
image: 'https://foo.io/token-image.svg',
},
},
})
console.log({ hash })
}
When a new asset is bought or shared with the authenticated user's wallet address, the dApp that has plugged in code to watch assets can add the newly added asset into the Arcana wallet. When the user checks the assets section of the wallet, they can see the newly added asset.
Similarly, if a dApp has plugged in code to watch assets can remove the newly sold asset from the associated Arcana wallet. When the user checks the assets section of the wallet, they can see that the asset that was sold is removed as they no longer own it.
That is all! You are all set to watch assets associated with the specified Arcana wallet.
What's Next?
For a complete list of other JSON RPC calls supported by Arcana wallet, JSON-RPC Specifications.
See also
- Arcana wallet capabilities
- Configure Arcana wallet Visibility
- Sign transactions
- Send transaction
- Check account balance
- Auth SDK Reference Guide