Installation Guide

This guide will walk you through the process of installing the Upshot React Native SDK in your project.

Using npm

1. Install the package:

npm install react-native-upshotsdk

Using Yarn

1. Install the package:

yarn add react-native-upshotsdk

Platform-specific Setup

iOS Setup

1. Navigate to your iOS folder and install pods:

cd ios && pod install

2. Add required permissions to Info.plist:

   The app requires access to the device’s camera and photo library to enable image-sharing features in In-App Messages (IAM) and Badges.

<key>NSLocationWhenInUseUsageDescription</key>
<string>This app uses location to provide location-based features</string>
<key>NSCameraUsageDescription</key>
<string>This app uses camera for enhanced features</string>
<key>NSPhotoLibraryUsageDescription</key>
<string>This app uses photo library for enhanced features</string>

3. Configure Background Modes (if needed):

<key>UIBackgroundModes</key>
<array>
    <string>remote-notification</string>
    <string>background-fetch</string>
</array>

4. Add push notification capability (if needed):
   • Enable Push Notifications in Xcode project settings
   • Add your APNs certificate or configure APNs key

Android Setup

1. Upshot SDK dependencies:

   dependencies {
      implementation 'com.github.Upshot-AI:upshot-android-sdk:v1.8.0x'
   }

2. Required dependencies:

   dependencies {
      implementation "com.squareup.duktape:duktape-android:1.1.0"
      implementation 'androidx.appcompat:appcompat:1.6.1'
      implementation 'androidx.core:core:1.13.1'
   
      implementation "androidx.work:work-runtime:2.7.1"
      implementation 'androidx.cardview:cardview:1.0.0'
      implementation 'androidx.recyclerview:recyclerview:1.3.2'
      implementation 'androidx.swiperefreshlayout:swiperefreshlayout:1.0.0'
      implementation 'androidx.constraintlayout:constraintlayout:2.1.4'
   
      implementation("com.github.bumptech.glide:glide:4.9.0")
      annotationProcessor "com.github.bumptech.glide:compiler:4.9.0"
   
   }

3. Add permissions to AndroidManifest.xml:

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

<!-- For push notifications -->
<uses-permission android:name="android.permission.POST_NOTIFICATIONS"/>

4. Add Firebase configuration (if using push notifications):

   • Place google-services.json in android/app/
   • Add to your project-level android/build.gradle:

dependencies {
    classpath 'com.google.gms:google-services:4.3.10'
}

• Add Firebase dependencies to android/app/build.gradle:

dependencies {
    implementation 'com.google.firebase:firebase-messaging:23.0.0'
    implementation 'com.google.firebase:firebase-analytics:21.0.0'
}

• Apply google-services plugin at the end of android/app/build.gradle:

apply plugin: 'com.google.gms.google-services'

5. Add Image/Text Share Permissions in AndroidManifest.xml:

<application>
<provider
android:name="androidx.core.content.FileProvider"
android:authorities="bundleIdentifier.share.fileprovider"
android:exported="false"
android:grantUriPermissions="true">
<meta-data
android:name="android.support.FILE_PROVIDER_PATHS"
android:resource="@xml/bk_filepath" />
</provider>
</application>

//To fetch Installed apps in Custom Share Intent.
<uses-permission android:name="andro id.permission.QUERY_ALL_PACKAGES" />
<queries>
<intent>
<action android:name="android.intent.action.VIEW" />
<data android:scheme="http" />
</intent>
<intent>
<action android:name="android.media.action.IMAGE_CAPTURE" />
</intent>
<intent>
<android:name="android.intent.action.GET_CONTENT" />
<data android:mimeType="image/*" />
</intent>
<intent>
<android:name="android.intent.action.PICK" />
<data android:mimeType="image/*" />
</intent>
<intent>
<android.intent.action.CHOOSER />
<data android:mimeType="image/*" />
</intent>
<intent>
<android.intent.action.SEND />
<data android:mimeType="image/*" />
</intent>
</queries>

6. Extend UpshotApplication class:

   • Application class should extend with UpshotApplication.
   • import com.upshotreactlibrary.UpshotApplication; in MainApplication.java class.

7. Extend UpshotActivity class:

   • MainActivity class should extend with UpshotActivity.
   • import com.upshotreactlibrary.UpshotActivity; in MainActivity.java class.

Post-Installation Setup

1. Import the SDK in your React Native application:

import Upshot from "react-native-upshotsdk";
import Upshot, {
  UpshotActivityType,
  UpshotGender,
} from "react-native-upshotsdk";

Troubleshooting

Common Issues

iOS Build Issues:

• Clean build folder: cd ios && rm -rf build && cd ..
• Reinstall pods: cd ios && pod deintegrate && pod install
• Check iOS deployment target (minimum iOS 12.0)

Android Build Issues:

• Clean gradle cache: cd android && ./gradlew clean
• Check Android SDK and build tools versions
• Verify google-services.json is in correct location

React Native Issues:

• Reset Metro cache: npx react-native start --reset-cache
• Check React Native version compatibility
• Verify package installation: npm ls react-native-upshotsdk

Next Steps

• Initialize the SDK
• Setup Push Notifications