Skip to content

Dashboard Users Guide

Estimated time to read: 13 minutes

Before integrating a Web3 app with the Arcana Auth SDK, developers must use the Arcana Developer Dashboard to configure social login and tailor the wallet user experience for signing blockchain transactions.

Prerequisites

Logging into Arcana Developer Dashboard requires an account with a supported social login provider or an email for passwordless access.

  • Google
  • GitHub
  • Twitch
  • Discord

Login

Visit https://dashboard.arcana.network and log in using one of the available options.

Welcome screen
Developer Dashboard Login Page

Aggregate Login

The Arcana Developer Dashboard protocol combines multiple login identities from social providers into single Arcana account. This means developers can log into the Arcana Developer Dashboard with any supported login provider. They will still access the same Arcana developer account and app settings.

Register Application

After logging into the dashboard, you’ll see the Manage Apps screen. Each registered app appears as a card.

Manage Apps
Manage Apps

To register the app, create a new app entry by clicking on the Create New App wizard.

Register by Creating New App
Register by Creating New App

Provide the following inputs to register the app:

  • App name
  • Chain Type: EVM, Solana, MultiversX, Near
  • Default Blockchain
  • Wallet UI Mode

Add a unique name for the app. It can be edited later. After registration, a unique Client ID is associated with each app name. This Client ID does not change if the app name is edited later.

All emails related to a registered app billing or user login will mention the latest app name as displayed in the dashboard. Once an app is deleted, the Client ID is no longer valid. Creating a new app with the same name and registering it with Arcana will result in a new Client ID associated with the app.

Edit App Name

Click on the pen icon next to the app name. Click Enter in the editable text field to save the changes.

During registration, developers must choose between EVM chains or non-EVM chains supported by the app. The pre-configured chain list in the Arcana wallet will display only the configured chains.

Non-EVM Chains

When registering an app through Arcana Developer Dashboard, the choice of chain type (EVM, Solana, MultiversX, Near) is final. App developers can't change it later. They can switch the default chain within the same type. For example, a Solana app on Testnet can switch to Solana Mainnet or Solana Dev but not to MultiversX or an EVM chain.

Based on your chain type selection, you will see a list of supported chains. Choose one as the default. This default chain will appear as the current, active chain in the Arcana wallet when the user logs into the app integrated with the Arcana Auth SDK.

The wallet UI mode setting allows the developers to choose whether they want to use the default, built-in Arcana wallet UI or build a custom wallet UI for the app users.

One Time Setting

The Custom Wallet UI option selected during app registration is a one-time setting. Once selected, the app cannot use the built-in Arcana wallet UI at all. Developers must create a custom wallet UI and plug in the requisite Web3 wallet operations.

Global Keyspace Not Supported

If the Custom Wallet UI option is selected during app registration, the app is assigned app-specific keys by default. The app configuration does not have the option to configure global keyspace.

View Wallet UI Mode

Once specified during app-registration, the Wallet UI mode setting can be viewed later via the Configure > Arcana Wallet settings section in the app configuration profile.

Wallet UI Mode Setting Ref
Wallet UI Mode Setting

After providing all the required inputs, click Create to register the app.

Register dApp
Register dApp

The app is registered, and a unique Client ID is assigned. By default, every newly registered app is associated with a Testnet configuration profile.

New app dashboard
New App Dashboard

Settings Overview

Click Configure in the LHS navigation pane of the Arcana Developer Dashboard to view the following configuration categories:

config details
Auth Settings

The Branding settings control the look and feel of the embedded Arcana wallet displayed in an app's context.

  • Upload Logo
  • Wallet Theme

See how to configure branding for details.

Branding
Branding Settings

The Social Auth settings manage the user onboarding experience and control which social login providers are available for app login.

  • Social Auth
  • Identity Access Managers
  • Custom Auth

Developers can enable one or more providers for app login. Passwordless login is automatically enabled for all registered apps. See how to configure authentication providers, for details.

Redirect URI

The Redirect URI field in the Social Auth section of the dashboard lists an auto-generated URL. This URL value is used as input when configuring the social login providers.

Social Auth
Social Auth Settings

The Chain Management settings control which chains will be displayed as the default active chain in the wallet from the list of pre-configured chains available out of the box for apps that integrate with the Arcana Auth SDK.

Chain Management Settings
Chain Management Settings

  • Add Chains
  • Edit Chains
  • Set Default Chain


Set Default Chain
Set Default Chain

For details, see how to manage chains.

The Arcana wallet settings display whether the app is registered using the built-in, default wallet UI or a custom UI. It also allows for domain restriction whereby the Arcana wallet can be loaded successfully within an app's context.

  • Wallet Domain
  • Wallet UI

See wallet UI configuration for details.

Social Login
Wallet Settings

The login session management settings display whether the app is configured to use persistent or non-persistent session (default) type.

For the persistent session, the developers can view and update the specified time for which the authenticated user login session is persisted (in minutes). Once a user closes the browser and reopens within this specified period, the user is automatically logged in. Learn more...

Session Management
Session Management

Not available for Custom Wallet UI

Apps that are registered with the Custom Wallet UI option are not allowed to configure keyspace settings. By default, such apps can only use the app-specific keys.

The following Keyspace settings control whether the wallet address for the user remains the same across all the apps that are integrated with the Arcana Auth SDK or are unique for each app.

  • App-Specific Keys (default)
  • Global Keys

Learn more about App-specific and global keys and how to set up keyspace.

Keyspace options
Keyspace: Global/App-Specific Keys

Enable gasless transactions through the Arcana wallet or third-party wallets through the following gasless configuration settings.

  • Add Gas Tank
  • Deposit/Withdraw Gas Tank Funds
  • Enable/Pause Gas Tank
  • Whitelist app operations

Account Abstraction: SCW Account

Gasless transactions require enabling SCW user accounts or 'gasless accounts' that are different from the typical EOA user accounts.

See how to configure gasless transactions for details.

Set up Gas Tanks
Gasless Settings

Save the configuration settings to make sure the setting changes take effect.

Save Config Settings
Save Configuration Updates

Manage Configuration Profiles

Each registered app is displayed in the 'Manage Apps' dashboard. By default, a Testnet configuration profile is associated with each app. For Mainnet deployment, a new Mainnet profile must be created. Both Testnet and Mainnet configuration profiles are maintained separately. Each profile is associated with a unique Client ID.

Use the LHS navigation menu and click Configure to view the Testnet/Mainnet configuration settings for the app.

App Configuration Settings
App Configuration Settings

Testnet

To view or edit the Testnet configuration settings, click on the application card displayed in the 'Manage Apps' dashboard screen and then select 'Testnet' in the dropdown on the top right of the application settings page.

Testnet Client ID
Testnet Client ID

Mainnet

Click on the app card displayed in the 'Manage Apps' screen to view the application usage metrics page. Refer to the dropdown on the top right. By default, it will display the Testnet configuration profile for the registered app. To create a 'Mainnet' configuration profile, choose 'Mainnet' in the dropdown.

Select Testnet/Mainnet Settings
Select Testnet/Mainnet Settings

On selecting 'Mainnet' for the first time, a pop-up screen is displayed with two options to create the 'Mainnet' configuration profile:

  • Copy Testnet Profile
  • Create a new Mainnet Profile.
Switch to Mainnet Settings
Switch to Mainnet Settings

Use one of these options to create the 'Mainnet' profile. A new Client ID is assigned to the Mainnet configuration profile. To deploy the app on Mainnet, this new Client ID must be updated in the integration code. Learn more...

Update Redirect URIs

After creating the 'Mainnet' profile, developers must also update the social login provider 'Redirect URI' settings via the respective provider developer consoles or dashboards.

Copy the 'Redirect URI' displayed for the 'Mainnet' profile and update this value in the social login provider's developer console. For e.g., for Google, update the Redirect URI in the Google Developer Console. Learn more...

Example: Copying Google Profile

If Google is enabled in your app's 'Testnet' profile, then during the configuration of the social login provider through the Google Developer console, the Testnet redirect URI was added. Copy the 'Mainnet' profile redirect URI value from the Arcana Developer Dashboard and update them in the Google Console OAuth settings.

Make sure that you add the 'Mainnet' redirect URI value for the other social login providers that are enabled in the 'Testnet' profile. This is required for enabling your app to use the Arcana Mainnet.

The figure below shows how the 'redirect URI' is different from the Testnet Settings where Google and Twitch were configured and the 'Testnet' profile was copied to create a 'Mainnet' profile.

Mainnet Redirect URI
Mainnet Reddirect URI

Switch Profiles

When both Testnet and Mainnet configuration profiles are associated with the registered app, you can switch profiles from the Manage Apps page of the dashboard or from within the app usage dashboard page.

Switch to Testnet/Mainnet Profile
Switch to Testnet/Mainnet Profile
  • Manage Apps Page: Select the app card and click on the Testnet or Mainnet buttons displayed on the app card to switch to the respective configuration profile.

  • App Usage Page: On the top right side, you will see a dropdown displaying Testnet/Mainnet profile. Click on the respective configuration profile to switch to it and view profile settings.

Switch to Testnet
Switch to Testnet

Switch Application

To switch viewing configuration settings from one application configuration profile screen to another, click on the dropdown next to the application name in the LHS navigation. You will see other registered applications in your account. Select another app name in the dropdown to switch to viewing its configuration settings.

The last entry in the dropdown is 'Manage Apps'. You can click it to browse the 'Manage Apps' landing page with app cards layout view. Switch to another app by clicking on the app card.

Switch Application
Switch Application

Configure Session Type

Choose between persistent and non-persistent session types to manage whether the user must re-login to the app after closing the browser or they are automatically logged in within a specified window of time.

In the Manage Apps screen, select the app card, and click on the configuration profile to view setting details. You will see the app configuration settings dashboard screen. In the LHS navigation, select Configure > Session Management settings.

Session Type
Session Management

You can view and change the session type or the Require login after time setting later as well. Apps that require the user to be immediately logged out automatically, if they close the browser window without explicitly logging out, should choose the default Non-Persistent setting.

Persistent Session

When selecting the persistent session type, specify the 'Require log in after` value. This setting is not required for non-persistent sessions. The specified time determines how long the session persists, allowing users to close and reopen the browser without needing to log in again.

Session Type
Session Management

Configure Keyspace

There are two keyspace options: App-specific and Global Keys.

App-specific keyspace is the default.

Mainnet Keyspace Options
Keyspace Options

Monitor Usage

Developers can monitor their registered application usage statistics via the Arcana Developer Dashboard. The Manage Apps screen displays the account-level usage metrics for all the applications registered in the developer account. Click on the app card to drill down into the application-specific usage details.

Account Usage Metrics

The Manage Apps screen displays Monthly Active Users (MAU) for the developer account. This is an aggregate score across all the applications that are registered for a developer account and configured to use the Arcana Mainnet. Any application using the 'Testnet' is not billed and not included in the overall account usage statistic.

App Usage Metrics
App Usage Metrics

An-caution

The billing data is only applicable for Mainnet usage and will be made available in the forthcoming releases.

Usage per Application

Arcana maintains per-application usage statistics separately for both the 'Testnet' and 'Mainnet' configuration profiles.

In the Manage Apps dashboard screen, all registered applications are listed as cards. Each application card displays the 'Total Users' statistic. This refers to the total monthly active application users that are utilizing the Arcana Testnet/Mainnet. To view per application usage details, click on the app card and select 'Testnet' or 'Mainnet' profile to see the following statistics:

  • Number of logged-in users

Use the 'Daily' and 'Monthly' tabs to see the respective usage statistics.

Daily/Monthly Usage
Daily/Monthly Usage

Use the dropdown in the top right of the application dashboard screen to select Testnet/Mainnet usage details.

Testnet/Mainnet Usage Statistics
Testnet/Mainnet Usage Statistics

Billing

Arcana tracks the Mainnet app usage in terms of MAU for every developer account. At the end of every month, an invoice is generated. The chargeable amount against the invoice is auto-deducted using the payment method configured by the developer in their profile section.

To begin using the Arcana Auth SDK, the app developers don't need to update the profile details including the billing information. Once the apps consume the free tier of Arcana Mainnet usage, the developer must provide the billing details via the profile section of the Arcana Developer Dashboard. Otherwise, the registered apps will be suspended and users will not be allowed to log in to any app that is registered using the developer account.

For details on current pricing and free tier limits, contact our Arcana support.

Payment Method Setup

Click on the user icon on the top right of the Arcana Developer Dashboard screen. Select Profile in the dropdown.

Payment Method Setup
Payment Method Setup

You will see the developer's Arcana account profile details. The developer account name and public identifier (email) are automatically retrieved based on the account used to log into the Arcana Developer Dashboard.

Developers are required to update the following profile details and then click Save.

  • Organization
  • Billing Address Details
  • Payment Method
Billing Details
Billing Details

Payment Method

By default, the 'Payment Method' section is disabled. It is enabled once the billing address details are configured.

View Invoices

Click on the user icon on the top right of the Arcana Developer Dashboard screen. Select Invoices in the dropdown.

View Invoices
View Invoices

On the Invoices page, you will see the details of the current pending dues, followed by the billing history of previous invoices that can be downloaded for reference.

Invoice Details
Invoice Details

View Billing Notifications

Click the bell icon to view all notifications for the developer account. Check the billing notifications list for details.

Billing Notifications
Billing Notifications

Configure Non-EVM Chains

Use the dashboard to enable non-EVM chains in your Web3 apps.

Delete Application

To de-register an application, delete the entry in the 'Manage Apps' screen of the Arcana Developer Dashboard.

Dashboard: Manage Apps
Dashboard: Manage Apps

Select the application you wish to de-register and click on the delete icon. Confirm delete action.

Delete/De-Register App
Delete/De-register App

See Also


Last update: September 4, 2024 by shaloo, shaloo