React Native

Installation

Create a sample project

$ npx react-native init SampleProject

Add Rollee Connect SDK

$ npm install --save @getrollee/connect-react-native-sdk

# iOS only
$ cd ios && pod install

Usage

The RolleeConnect component is a view that you can integrate into your app's flow. The CONFIG and optional callback handlers are passed in as props.

import RolleeConnect from "@getrollee/connect-react-native-sdk";
.
.
.
<RolleeConnect config={CONFIG} onCompleted={onCompleted} onClose={onClose} />

Configuration

You should be provided by apiKey, partnerName and partnerIUUID from Rollee and those fields are mandatory.

The setup parameters are optional.

▫️ The minimum configuration for setting up RolleeConnect component:

const CONFIG = {
  apiKey: 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx',
  partnerName: 'my_company_slug',
  partnerUUID: 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx',
};

▫️ The optional configuration for setting up RolleeConnect component:

const CONFIG = {
  apiKey: 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx',
  partnerName: 'my_company_slug',
  partnerUUID: 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx',
  userUUID: 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx',
  setup: {
    production: false,
    introScreenSkip: false,
    introScreenTitle: 'Roll the Rollee',
    ctaTextColor: 'white',
    ctaBackgroundColor: 'red',
    partnerLogoUrl:
      'https://somedomain.com/your_logo.png',
  },
};

Testing SDK in the Sandbox

To be able to test SDK in Sandbox mode, you should provide a setup parameter named production and set it to false.

setup: {
  production: false
}

Setup Parameters Descriptions

ParamDescription
productionBoolean - parameter for switching between sandbox and production env
introScreenSkipBoolean - with this parameter set as true you can skip the first screen and load directly a Terms screen
introScreenTitleString - Change intro screen title sentence
ctaTextColorString - Changing CTA button “Get started” text color
ctaBackgroundColorString - Changing CTA button “Get started” background color
partnerLogoUrlString - Change header logo image with proper URL of image

Changelog

v0.1.0

  • bug fixes

v0.0.9

  • updated React Native version to 0.68.2

v0.0.8

  • Added "datasource" param for pre-selecting data source and skip "Search" screen

v0.0.7

  • Fixed form view on software keyboard opened

v0.0.6

  • Added new callback "onClose" when user confirm closing the Rollee Connect process.

v0.0.5

  • Added support for providing userUUID to match one session
  • added userUUID in "completed" callback
  • other fixes

Did this page help you?