Android React Native SDK Quick Start

This guide describes how to integrate Detection and Response services into your Android React Native application. It helps you set up the Mosaic SDK wrapper for React Native, enabling you to enhance your mobile applications' security with Detective and Response services.

How it works

The flow starts with the user navigating to your application (1). The SDK gets initialized and starts streaming telemetry to Mosaic (2). When a user performs an action, for example, clicks a login button (3), the SDK triggers an event (4) and obtains an action token (5) which you should pass to the backend (6). Having received an action token, the application backend uses it to fetch recommendation from Mosaic (7 & 8) and instructs the client to act accordingly (9) in order to complete the login procedure (10). As a last step, your server can report the action result back to Mosaic and set the user (11).

Step 1: Get client credentials

Client credentials are used to identify your app and generate access tokens for authorizing Mosaic requests. To obtain them, you'll need to create an application in the Admin Portal (if you don’t have one yet).

  1. From Applications , click Add application .
  2. Add the friendly application name to display in the Admin Portal.
  3. Add a client display name, and your website URL as a redirect URI (e.g., https://your-domain.com ).
    Note

    These fields are required for all Mosaic apps, but won’t be used for Detection and Response.

  4. Click Add to create your application. This will automatically generate your client credentials.

Step 2: Install the wrapper

Install the Mosaic SDK wrapper for React Native:

Copy
Copied
npm install react-native-ts-accountprotection

Step 3: Configure the wrapper

Update build.gradle

In your app/build.gradle file, add the following under repositories:

Copy
Copied
repositories {
  google()
  maven {
    url 'https://transmit.jfrog.io/artifactory/transmit-security-gradle-release-local/'
  }
}

Then, add the following under dependencies:

Copy
Copied
dependencies {
  implementation "com.ts.sdk:accountprotection:2.1.+"
}

Update strings.xml

Update your strings.xml file by adding the following:

Copy
Copied
<resources>
    <!-- Mosaic Credentials -->
    <string name="transmit_security_client_id">"CLIENT_ID"</string>
    <string name="transmit_security_base_url">https://api.transmitsecurity.io/</string>
</resources>
Note

Configure the SDK to work with a different cluster by setting by setting `the base URL to https://api.eu.transmitsecurity.io (for EU) or https://api.ca.transmitsecurity.io for (CA).

Step 4: Initialize the SDK

Open your MainApplication.kt file in your React Native Android project, and add:

Copy
Copied
class Application : Application() {
  override fun onCreate() {
    super.onCreate()
    TSAccountProtection.initializeSDK(this.applicationContext) // initialize the SDK
    // ...
  }
}

Step 5: Use the React Native wrapper

The example below demonstrates triggering a login event from a login button, setting and clearing a user.

  • triggerActionEvent() receives an action type and returns a response that includes the actionToken . To obtain risk recommendations for sensitive actions, your application should report these actions. To do this, add the code below to relevant user interactions (such as the Login button click event handler). The wrapper allows reporting on events with specific action types. Replace [ACTION_TYPE] with the appropriate action type from our list of actions .
Copy
Copied
private handleTriggerActionLoginExample = async () => {
  const triggerActionResponse = await TSAccountProtectionSDKModule.triggerAction(
    TSAccountProtectionSDK.TSAction.login,
    {
      correlationId: "CORRELATION_ID",
      claimUserId: "CLAIM_USER_ID",
      referenceUserId: "REFERENCE_USER_ID",
      transactionData: undefined
    }
  )
  const actionToken = triggerActionResponse.actionToken;
  console.log("Action Token: ", actionToken); // Use the action token to invoke the recommendation API.
}
  • setAuthenticatedUser() sets the user context for all subsequent events in the mobile session (or until the user is explicitly cleared). It should be set only after you've fully authenticated the user (including, for example, any 2FA that was required). For the complete list of action types, see our recommendations page.
    Copy
    Copied
    await TSAccountProtectionSDKModule.setUserId(username);
  • clearUser() clears the user context for all subsequent events in the mobile session.
    Copy
    Copied
    await TSAccountProtectionSDKModule.clearUser();

Step 6: Fetch recommendations

You can fetch recommendations for the reported action using the Recommendation API. This is the same API that's also used for mobile integrations.

Mosaic APIs are authorized using an OAuth access token so you'll need to fetch a token using your client credentials (from Step 1). The token should target the following resource: https://risk.identity.security. To do this, send the following request:

Copy
Copied
  const { access_token } = await fetch(
    `https://api.transmitsecurity.io/oidc/token`,
    {
      method: 'POST',
      headers: {
        'Content-Type': 'application/x-www-form-urlencoded'
      },
      body: new URLSearchParams({
        grant_type: client_credentials,
        client_id: [CLIENT_ID],
        client_secret: [CLIENT_SECRET],
        resource: 'https://risk.identity.security'
      })
    }
  );

From your backend, invoke the Recommendation API by sending a request like the one below. The [ACCESS_TOKEN] is the authorization token you obtained using your client credentials and [ACTION_TOKEN] is the actionToken received in Step 5.

Copy
Copied
const query = new URLSearchParams({
  action_token: '[ACTION_TOKEN]',
}).toString();

const resp = await fetch(
  `https://api.transmitsecurity.io/risk/v1/recommendation?${query}`,
  {
    method: 'GET',
    headers: {
      Authorization: 'Bearer [ACCESS_TOKEN]',
    },
  }
);