React Native SDK

This is for:

Developer

In this article, we’ll walk you through the steps to install and use React Native SDK for CMH.

Tip

Check out Coveo Qubit React Native SDK on Github. This public repository provides the code to be installed and is the best place to keep up with the releases.

Getting started

The React Native SDK allows you to integrate event tracking and lookup into iOS and Android mobile apps built with React Native.

Note

To make use of this SDK, contact your Customer Success representative.

Installing the SDK

  1. $ npm install qubit-sdk-react-native --save or $ yarn add qubit-sdk-react-native

  2. Navigate to your /ios directory and run pod install to ensure the QubitSDK CocoaPod is installed. Android should require no further installation.

  3. If you’re using React Native < 0.60, you must link the library: $ react-native link qubit-sdk-react-native

Using the SDK

Import the whole library in your javascript files:

import QubitSDK from 'qubit-sdk-react-native';

Initialize the SDK:

QubitSDK.start("qubit");

Send the first event:

QubitSDK.sendEvent("ecView", { "type": "button", "value": "click" });

API documentation

start

Initialization of the SDK. It should be called as early as possible after application start, only once, and before any other interaction with the API.

Parameters

Parameter Type Description

trackingId

string

Tracking Id (identifier of application/company etc

logLevel

string

Level of logs produced by native SDK (optional):

- SILENT

- ERROR

- WARN(default)

- INFO

- DEBUG

- VERBOSE

Example

QubitSDK.start("qubit", "DEBUG");

  • Returns void None

sendEvent

Sends event to the server.

Parameters

Parameter Type Description

eventType

string

Type of event (for example, ecView)

eventBody

object

Javascript map of any structure

Example

QubitSDK.sendEvent("ecView", { "type": "button", "value": "click" });

  • Returns void None

enable

Enables or disables receiving events.

Parameters

Parameter Type Description

value

boolean

true - Receive eventsfalse - Do not receive events

Examples

QubitSDK.enable(false);

  • Returns void None

getTrackingId

Returns trackingId. Use for debug purposes.

Example

async () => {
 const trackingId = await QubitSDK.getTrackingId();
 ...
}

getDeviceId

Returns deviceId established by the SDK. Use for debug purposes.

Example

async () => {
 const deviceId = await QubitSDK.getDeviceId();
 ...
}

getLookupData

Returns current Lookup Data. Used for debug purposes.

Example

async () => {
 const lookupData = await QubitSDK.getLookupData();
 ...
}

{ viewNumber: 10,
 sessionNumber: 4,
 lastViewTs: 1863218003,
 ipLocation:
  { regionCode: '36004',
    region: 'unknown',
    longitude: 19.9612,
    latitude: 50.0495,
    countryCode: 'PL',
    country: 'poland',
    cityCode: '1803',
    city: 'krakow',
    areaCode: 'unknown',
    area: 'unknown' },
 ipAddress: '93.180.179.112',
 firstViewTs: 1696635454
}

  • Returns Promise<string>. Promise with object. Although it returns Promise, it returns a value only if SDK has these information at the moment of the function call.

getExperiences

Returns list of Experiences.

Parameters

Parameter Type Description

experienceIds

array<number>

List of experiences Ids. When array is empty, returns all experiences

variation

number

The experience variation to return (Optional)

preview

boolean

The iteration to return (Optional):true - Return the latest unpublished iteration for each experiencefalse - Return the latest published iteration for each experience

ignoreSegments

boolean

What to return in the payload (Optional):true - Return payloads for all experiences regardless of the segment specification of the experiencefalse - Return payloads for all experiences taking account of the segment specification of the experience

Example

async () => {
 const experiences = await QubitSDK.getExperiences([], 0, false, false);
 experiences.forEach(e => e.shown());
 ...
}

{ variation: 852190,
   payload: {},
   isControl: false,
   id: 143640,
   callback: 'https://sse.qubit.com/v1/callback?data=igKAeyJFeHBlcmllbmNlSWQiOjE0MzY0MCwiSXRlcmF0aW9uARUsMzc2MDY3LCJWYXJpFRUUODUyNzc0HRUUTWFzdGVyATAQODUyMTkBRXBzQ29udHJvbCI6ZmFsc2UsIlRyYWZmaWNBbGxvYwVKTCI6MC40NzUsIlByb2JhYmlsaXR5ARRQODI1NjI2MTk0NTgyNDQ5MSwiUGlkVhkAGFRlbXBsYXQFvwxudWxsBWZMY2tpbmdJZCI6Im1pcXVpZG8iLCIBjQhleHQFFkQ4MmFjYzNiY2FiYmNhYzM2In0='
 },
{ variation: 855620,
   payload: { show_share: false,
     show_sale_banner: false,
     sale_banner: 'https://dd6zx4ibq538k.cloudfront.net/static/images/5010/626263d0b3d3230f4062da1e0d1395ad_1300_554.jpeg',
    free_shipping: 'Shipping is free for you!' },
   isControl: false,
   id: 144119,
   callback: 'https://sse.qubit.com/v1/callback?data=jAKAeyJFeHBlcmllbmNlSWQiOjE0NDExOSwiSXRlcmF0aW9uARUsNDUyOTEwLCJWYXJpFRUYMTAxMDcyMh0WFE1hc3RlcgExmDg1NTYyMCwiSXNDb250cm9sIjpmYWxzZSwiVHJhZmZpY0FsbG9jYQFgSCI6MC4yNSwiUHJvYmFiaWxpdHkBE2A0ODAwMTM4OTg0MjEwNjM3MywiUGlkIjowThoAGFRlbXBsYXQFwQxudWxsBWdMY2tpbmdJZCI6Im1pcXVpZG8iLCIBjghleHQFFkQ4MmFjYzNiY2FiYmNhYzM2In0='
 },
{ variation: 972984,
   payload: {},
   isControl: true,
   id: 160862,
   callback: 'https://sse.qubit.com/v1/callback?data=iQKAeyJFeHBlcmllbmNlSWQiOjE2MDg2MiwiSXRlcmF0aW9uARUsNDM0NjIzLCJWYXJpFRUUOTcyOTg0HRUUTWFzdGVyATARG3BJc0NvbnRyb2wiOnRydWUsIlRyYWZmaWNBbGxvYwVJRCI6MC41LCJQcm9iYWJpbGl0eQESVDAzNjQzMTAyMTQ3MTU5ODkyLCJQaWRaGgAYVGVtcGxhdAW-DG51bGwFZhBja2luZwGLKCJtaXF1aWRvIiwiAYwIZXh0BRZEODJhY2MzYmNhYmJjYWMzNiJ9'
 }
]

  • Returns Promise<array<Experience>>. Promise with an array of Experience objects.

Compatibility

Coveo Qubit SDK React Native is compatible with React Native 0.58 and higher.