Vatom™ Wallet SDK

This library allows you to embed a Vatom™ Wallet within your web app.

Installation

You can install this library by running npm install @vatom/wallet-sdk or yarn add @vatom/wallet-sdk

Basic Usage

After installing the library you can create a new instance and render the wallet to a div element by creating a new instance: new VatomWallet(divElem, accessToken)

If no accessToken is provided the user will be requested to log-in using Vatom's Login system. Please note that Vatom's Login system will only works if the user's privacy setting "Cross Site Tracking" is disabled.

In order to seamlessly integrate with your own identity system you would need to first obtain an accessToken by making a token exchange API call to Vatom. For more information about this please contact us at [email protected].

Advanced usage

In addition to the parameters specified in the Basic Usage section you can optionally add a businessId parameter to redirect users automatically to the given business page. For futher information on creating a custom business page, take a look at our Experience SDK.

Full parameter list

| Parameter | Description | Default Value | | ----------- | ----------------------------------------------------------------------- | :-----------: | | divElem | Element where the Vatom Wallet will be embedded | undefined | | accessToken | Access Token provided by Vatom when calling the token exchange API | "" | | businessId | Business ID where users should be redirected to when loading the wallet | "" |

Example Code using React

import './App.css';
import { VatomWallet } from "@vatom/wallet-sdk"
import { useEffect, useRef } from 'react';


function App() {
  const divRef = useRef(null)

  const accessToken = ""
  const businessId = ""
  // optional configs
  const config = { features: { business: { hideHeader: true }, inventory: { hideHeader: false } } }

  useEffect(() => {
    if(divRef.current){
      new VatomWallet(divRef.current, accessToken, businessId, config)
    }
  }, [divRef])

  return (
    <div className="App" ref={divRef}>

    </div>
  );
}

export default App;

VatomConfig Properties

hideNavigation: Set this property to false if you want to show the wallet navigation. The default value is true.

scanner: Configure the scanner feature with the following options:

enabled: Set to false to hide the scanner icon on the home page; The default value is true.

vatom: Configure Vatom-specific features with the following options:

hideTokenActions: Set to true to disable user access to token actions,

disableNewTokenToast: Set to true to disable notifications when users receive a new token.

navigateToTab()

The navigateToTab function allows navigation to a specific tab in the application, providing a tab route and optional parameters.

await vatomWallet.navigateToTab("Connect", {"paramKey": "paramValue"});

Parameters

Example

try {
  await vatomWallet.navigateToTab("Connect", {"paramKey": "paramValue"});
} catch (e) {
  console.error("Error:", e);
}

getTabs()

The getTabs function retrieves a list of available tabs for the current business.

let tabs = await vatomWallet.getTabs();

Return Value

A List of available tabs for the current business.

[Wallet, Map, Connect]

Example

try {
  let tabs = await vatomWallet.getTabs();
  console.log("Available Tabs:", tabs);
} catch (e) {
  console.error("Error:", e);
}

performAction()

The performAction function is intended to be called by the host application to initiate a specific action on a token within the wallet SDK.

Parameters:

tokenId (String): The unique identifier of the token on which the action will be performed.

actionName (String): The name of the action to be executed on the token.

payload (Object?): An optional payload containing additional data required for the specified action. It can be null if no additional data is needed.

Returns:

Future: A Future representing the result of the action. The host application can await this Future to handle the outcome of the performed action.

Usage:

await vatomWallet.performAction('tokenId123', 'activate', {'param': 'value'});

trashToken()

The trashToken function is designed to be called by the host application to initiate the removal or deletion of a specific token within the wallet SDK.

Parameters:

tokenId (String): The unique identifier of the token to be trashed or deleted.

Usage:

await vatomWallet.trashToken('tokenId123');

getToken()

The getToken function is intended to be called by the host application to retrieve information about a specific token within the wallet SDK.

Parameters:

tokenId (String): The unique identifier of the token for which information is requested.

Returns:

{
  "id":"320ca...",
  "type":"vatom",
  "parentId":".",
  "owner":"b02...",
  "author":"739f...",
  "lastOwner":"739f..."
  "modified":1697142415000,
  "shouldShowNotification":true,
  "created":1695758987000,
  ...
}

Usage:

let tokenInfo = await vatomWallet.getToken('tokenId123');

getPublicToken()

The getPublicToken function is designed to be called by the host application to retrieve public information about a specific token within the wallet SDK.

Parameters:

tokenId (String): The unique identifier of the token for which public information is requested.

{
  "id":"320ca...",
  "type":"vatom",
  "parentId":".",
  "owner":"b02...",
  "author":"739f...",
  "lastOwner":"739f..."
  "modified":1697142415000,
  "shouldShowNotification":true,
  "created":1695758987000,
  ...
}

Usage:

let publicTokenInfo = await vatomWallet.getPublicToken('tokenId123');

listTokens()

The listTokens function is intended to be called by the host application to retrieve a list of tokens owned by the user within the wallet SDK.

Usage:

let userTokens = await vatomWallet.listTokens();

isLoggedIn()

The isLoggedIn function allows the host application to check whether the user is currently logged in to the wallet SDK.

Usage:

let userLoggedIn = await vatomWallet.isLoggedIn();
if (userLoggedIn) {
  // User is logged in, perform actions accordingly.
} else {
  // User is not logged in, handle the scenario appropriately.
}

getCurrentUser()

The getCurrentUser function is used to retrieve the current user's data from the wallet SDK. It sends a message to the wallet SDK to fetch the user data and returns a Future containing a UserData object.

Returns:

{
  "default_business_id": "3D...",
  "default_space_id": null,
  "email": "[email protected]",
  "email_verified": true,
  "location": {
    "country": "USA",
    "latitude": 0.0000000,
    "locality": "Sample City",
    "longitude": 0.0000000,
    "postal_code": "12345",
    "region": "Sample Region"
  },
  "name": "John Doe",
  "phone_number": "+123456789",
  "phone_number_verified": false,
  "picture": "https://example.com/profile.jpg",
  "sub": "sample-sub-id",
  "updated_at": 9876543210,
  "wallet_address": "sample-wallet-address",
  "website": "https://example.com",
  "guest": false,
  "deferred_deeplink": null
}

Usage:

let currentUser = await vatomWallet.getCurrentUser();
if (currentUser != null) {
  // Use the user data for various purposes.
  console.log("User Name:", currentUser.name}");
  console.log("User Email:", currentUser.email);
} else {
  // Handle the scenario where user data retrieval fails.
  console.log("Error fetching user data.");
}

navigate()

The navigate function facilitates navigation within the wallet SDK by sending a message to trigger a specific route.

Parameters:

route (String): The route to navigate to within the wallet SDK.

params (Map<String, dynamic>) (optional): Additional parameters to be passed along with the navigation request.

Usage:

// Example 1: Navigate to a route without additional parameters.
vatomWallet.navigate("home");

// Example 2: Navigate to a route with additional parameters.
vatomWallet.navigate("profile", {"any": "..."});

openNFTDetail()

The openNFTDetail function facilitates the navigation to the NFT detail screen within the wallet SDK.

Parameters:

tokenId (String): The unique identifier of the NFT for which the detail screen should be opened.

Usage:

// Example: Open the NFT detail screen for a specific token.
await vatomWallet.openNFTDetail("abc123");

logOut()

The logOut function initiates the log-out process in the wallet SDK by sending a message to trigger the log-out action.

Usage:

// Example: Initiate the log-out process.
await vatomWallet.logOut();

openCommunity()

The openCommunity function facilitates the opening of a community within the wallet SDK. It sends a message to the wallet SDK to navigate to a specific community, and optionally to a specific room within that community.

Parameters:

communityId (String): The unique identifier of the community to be opened.

roomId (String, optional): The unique identifier of the room within the community to navigate to.

Usage:

// Example: Open a community without specifying a room.
await vatomWallet.openCommunity("communityId");

// Example: Open a specific room within a community.
await vatomWallet.openCommunity("communityId", roomId: "roomId");