Bulbsharesdk NPM

BulbshareSDK

React Native wrapper for native Bulbshare SDK libraries (iOS, Android).

Requirements

node (v15.14.0)
npm (v7.7.6)
react-native (v6.4.0)

Install

# add dependency
npm install bulbsharesdk

Android

Open AndroidManifest.xml from the android folder and add the following lines:

In the manifest tag

xmlns:tools="http://schemas.android.com/tools"

In the application tag

tools:replace="android:theme,android:allowBackup"

In the activity tag

android:exported="true"

Sample AndroidManifest.xml:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    package="com.bulbshare.sdkdamacdemo">

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

    <application
      android:name=".MainApplication"
      android:label="@string/app_name"
      android:icon="@mipmap/ic_launcher"
      android:roundIcon="@mipmap/ic_launcher_round"
      android:allowBackup="false"
      android:theme="@style/AppTheme"
      tools:replace="android:theme,android:allowBackup">
      <activity
        android:name=".MainActivity"
        android:label="@string/app_name"
        android:configChanges="keyboard|keyboardHidden|orientation|screenSize|uiMode"
        android:launchMode="singleTask"
        android:windowSoftInputMode="adjustResize"
        android:exported="true">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
      </activity>
    </application>
</manifest>

Open app level build.gradle file and add this line under the android section:

packagingOptions.pickFirst("lib/*/libc++_shared.so")

Sample app build.gradle:

...
android {
    ndkVersion rootProject.ext.ndkVersion

    compileSdkVersion rootProject.ext.compileSdkVersion

    defaultConfig {
        applicationId "com.bulbshare.sdkdamacdemo"
        minSdkVersion rootProject.ext.minSdkVersion
        targetSdkVersion rootProject.ext.targetSdkVersion
        versionCode 1
        versionName "1.0"
    }
    packagingOptions.pickFirst("lib/*/libc++_shared.so")
    splits {
        abi {
            reset()
            enable enableSeparateBuildPerCPUArchitecture
            universalApk false  // If true, also generate a universal APK
            include "armeabi-v7a", "x86", "arm64-v8a", "x86_64"
        }
    }
    ...
}
...

Open project level build.gradle file and add this lines under the repositories section:

maven { url "https://plugins.gradle.org/m2/" }
maven {
    url "https://bulbshare.jfrog.io/artifactory/bulbshare-sdk"
    credentials {
        username = "..."
        password = "..."
    }
}

Sample project build.gradle:

...
allprojects {
    repositories {
        maven {
            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
            url("$rootDir/../node_modules/react-native/android")
        }
        maven {
            // Android JSC is installed from npm
            url("$rootDir/../node_modules/jsc-android/dist")
        }
        mavenCentral {
            // We dont want to fetch react-native from Maven Central as there are
            // older versions over there.
            content {
                excludeGroup "com.facebook.react"
            }
        }
        maven { url "https://plugins.gradle.org/m2/" }
        maven {
            url "https://bulbshare.jfrog.io/artifactory/bulbshare-sdk"
            credentials {
                username = "..."
                password = "..."
            }
        }

        google()
        maven { url 'https://www.jitpack.io' }
    }
}
...

iOS

Make sure your project supports CocoaPods

Open .xcworkspace in Xcode

Edit Pod file and add

    source 'https://kerencic@bitbucket.org/kerencic/sdkbulbsharepodspecs.git'
    use_frameworks!
    pod 'BulbshareSDK', '~> 0.1.4'

Sample Pod file

    require_relative '../node_modules/react-native/scripts/react_native_pods'
    require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
    source 'https://github.com/CocoaPods/Specs.git'

    source 'https://bitbucket.org/bulbshare/podspecs/podspecs.git'

    platform :ios, '12.1'

    target 'BulbshareSDKDamacDemo' do
    config = use_native_modules!

    use_react_native!(
        :path => config[:reactNativePath],
        # to enable hermes on iOS, change `false` to `true` and then install pods
        :hermes_enabled => false
    )
    use_frameworks!
    pod 'BulbshareSDK', '~> 0.1.4'

    target 'BulbshareSDKDamacDemoTests' do
        inherit! :complete
        # Pods for testing
    end

    # Enables Flipper.
    #
    # Note that if you have use_frameworks! enabled, Flipper will not work and
    # you should disable the next line.
    #use_flipper!()

    post_install do |installer|
        react_native_post_install(installer)
        __apply_Xcode_12_5_M1_post_install_workaround(installer)
        installer.pods_project.targets.each do |target|
        target.build_configurations.each do |config|
            config.build_settings['IPHONEOS_DEPLOYMENT_TARGET'] = '12.1'
            config.build_settings['BUILD_LIBRARY_FOR_DISTRIBUTION'] = 'YES'
        end
        end
    end
    end

Open /ios folder in Terminal and run

   pod install

Drag-drop BulbshareSDK.swift and BulbshareSDK.m files into the project. You can find the files in our example project.

An alert will ask you to "configure an Objective-C bridging header". Select "Create Bridging Header".

Update just created *-Bridging-Header.h file by adding

    #import <React/RCTBridgeModule.h>

Usage

Run the project

# library release
npx run release

BulbshareSDK client usage

Add dependency

import { Platform, NativeModules } from 'react-native';
import { BulbshareSDK, BulbshareConfig, BulbshareUser, BulbshareColors } from 'bulbsharesdk';

SDK Initialization

const module = Platform.OS === 'ios' ? NativeModules.BulbshareSDK : NativeModules.BulbshareSDKAndroid;
const bulbshareSdk = new BulbshareSDK(module, Platform.OS);

const config = new BulbshareConfig({
  WlaId: '...',
  APIKey: '...',
  googleKey: '...',
  fbKey: '...',
  twitterKey: '...',
  twitterSecret: '...',
  primaryThemeColor: '...',
  secThemeColor: '...',
  profileTabColor: '...',
});
bulbshareSdk.initialize(config);

User authentication

const user = new BulbshareUser({
  identifier: '{DAMAC-UNIQUE-IDENTIFIER-0001}',
  email: '...',
  accessToken: '...',
  firstName: '...',
  lastName: '...',
  gender: BulbshareUser.MALE, // BulbshareUser.FEMALE
  birthday: '01/31/2022', // optional format mm/dd/yyyy
  country: 'United Arab Emirates', // optional
  userProperties: null // optional js object (nesting not supported)
});
const result = await bulbshareSdk.connect(user); // success or failure

Open screens

// main feed
bulbshareSdk.openFeed();
// brief intro page
bulbshareSdk.openBrief('[brief ref]');
// survey brief submit
bulbshareSdk.openSurveySubmit('[brief ref]');
// open brief submit
bulbshareSdk.openBulbshareSubmit('[brief ref]');
// open my profile
bulbshareSdk.openMyProfile();
// open rewards screen
bulbshareSdk.openRewards();

Push notification handler

// call handler with payload received by push notification
bulbshareSdk.handlePushNotification(payload);

Additional methods

// user logout
bulbshareSdk.logout();
// initialize network manager (logging http requests)
bulbshareSdk.initNetworkManager({
    ...
    logging: true,
    ...
});
// save access token
const onTokenReceive = (token, userref, deviceref) => {
    // save token here
};
bulbshareSdk.connect(BulbshareUser, onTokenReceive);
// initialize image loader (image cache)
bulbshareSdk.initImageLoader({
    ...
    diskCacheSize: 100 * 1024 * 102,
    ...
});