Quickstart

1. Minimum Requirements

• React Native: 0.71.6
• Node 14 or newer
• Ruby 2.7.6
• iOS: 12.4
• Android: 5.0 (API 21)

2. SDK Integration

The first step in integrating with your app is to install the Tapjoy React Native Plugin. We support NPM and Yarn.

NPM

npm install tapjoy-react-native-sdk

Yarn

yarn add tapjoy-react-native-sdk

You can then import Tapjoy into your application to use the plugin:

import {Tapjoy, TJPlacement} from 'tapjoy-react-native-sdk'

Add App Permissions (for Android)

The ACCESS_WIFI_STATE permission can optionally be included in your manifest:

<manifest ...>
  ...
  <uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>
  ...
</manifest>

3. Connect to Tapjoy

The connect call is how we initialise the Tapjoy SDK. You should do this as soon as possible after your app launches

try {
    let sdkKey = Platform.OS === 'ios' ? 'ios-sdk-key' : 'android-sdk-key'
    let flags: object = {TJC_OPTION_USER_ID: 'userId'};
    await Tapjoy.connect(sdkKey, flags);
} catch (error: any) {
    let errorString = `Tapjoy SDK failed to connect. code: ${error.code}, message: ${error.message}`;
} 

As of SDK v13.4.0 There is also a connectWarning callback you can listen for. This will fire when there is a non-blocking issue during connect, connectSuccess will also fire after. Currently this feature will only detect issues with UserId when sent in ConnectFlags.

import {
  NativeEventEmitter,
  NativeModules,
} from 'react-native';

const TJ = NativeModules.TapjoyReactNativeSdk;
      const TapjoyEmitter = new NativeEventEmitter(TJ);
      const TapjoyEventType = 'Tapjoy';
      const subscription = TapjoyEmitter.addListener(
        TapjoyEventType,
        (event: TapjoyEvent) => {
          if (event.name === TJConnect.TJC_CONNECT_WARNING) {
            subscription.remove();
            setStatusLabelText(
              `Tapjoy SDK connected with Warning: ErrorCode: ${event.code} ${event.message} `
            );
          }
        }
      );

Once you have finished configuing Tapjoy you can build and run your application.

Congratulations! You now have Tapjoy working in your application.

Max User Level

You can tell Tapjoy how many levels there are in your game. You can set this value before or after calling connect.

Tapjoy.setMaxLevel(10); 

User Segment

You can identify users as part of a segment by calling setUserSegment. This can be set before or after calling connect.

Tapjoy.setUserSegment(TJSegment.VIP);
Tapjoy.setUserSegment(TJSegment.Payer);
Tapjoy.setUserSegment(TJSegment.NonPayer);
Tapjoy.setUserSegment(TJSegment.Unknown);

4. Request App Tracking Transparency authorization

If your application is designed to use App Tracking Transparency, to display the dialog to request permission for accessing the IDFA, update your Info.plist by including the NSUserTrackingUsageDescription key along with a custom message to describe this permission to use IDFA in your application.

Next install the react-native-tracking-transparency package:

yarn add react-native-tracking-transparency

Import the library, and then show the permission dialog:

import {
    getTrackingStatus,
    requestTrackingPermission,
} from 'react-native-tracking-transparency';

...

let trackingStatus = await getTrackingStatus();
if (trackingStatus === 'authorized' || trackingStatus === 'unavailable') {
    await Tapjoy.connect(sdkKey, flags);
}else{
    trackingStatus = await requestTrackingPermission();
    await Tapjoy.connect(sdkKey, flags);
}