Skip to content

Watch Assets

In this guide, you will learn how Web3 apps that integrate with the Arcana Auth SDK can use the standard Ethereum JSON RPC calls supported by the Arcana wallet and programmatically allow authenticated users to watch crypto assets such as the native and custom tokens associated with a specified wallet address.

Prerequisites

  • Use the Arcana Developer Dashboard to register the app and obtain a unique Client ID required for integrating the app with the Arcana Auth SDK.

  • Follow the instructions to configure authentication providers before integrating the app with the Arcana Auth SDK.

  • Use the appropriate integration method as per the app type and integrate the app with the Arcana Auth SDK.

  • Add code in the integrated app to onboard users. The Web3 wallet operations can be invoked programmatically in an app only in the context of an authenticated user.

Steps

Make sure you have addressed the prerequisites before adding code to invoke any Web3 wallet operations supported by the Arcana wallet. After that, plug in the necessary code to set up requisite hooks for JSON/RPC standard Ethereum calls.

// 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

Add code for watching token assets associated with the logged in user's wallet address by calling the wallet_watchAssets JSON RPC method 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, sold or shared using the authenticated user's wallet address, the app can track the change in asset values and prompt the user to display the wallet with the updated values.

That is all!

The Web3 app is all set to programmatically watch assets associated with the Arcana wallet.

What's Next?

After registering the app, configuring authentication providers, integrating the Arcana Auth SDK with the app and onboarding users, developers can further add code in the app to sign blockchain transactions, send and receive native, ERC20, or custom tokens, and other Web3 wallet operations.

For a complete list of other JSON RPC calls supported by the Arcana wallet, see JSON-RPC Specifications.

See also

Last update: March 15, 2024 by shaloo, shaloo