To use Capillary Engagement platform on React Native application, you need to set up the React Native Wrapper using the Native Hydra Android and iOS SDKs.

Prerequisites

Before you start the integration, ensure you have the following prerequisites met:

• Register your application with the Capillary apps team by providing the following:

  • Bundle Id for your iOS app
  • ApplicationId for your Android app
  • App signature (SHA256) from your Android app signing report
    After registering with the Capillary apps team, you will be provided the Account ID, base URL (End point), and SSL public key.

• Obtain access to the necessary GitHub repositories. You need access to the following repositories:

  • react-native-hydra-lib

  • hydra-sdk-ios-packages

  • hydra-sdk-android-maven

    If you have a registered Capillary email address:

• Raise a JIRA ticket to the ACM team for access to the required GitHub repositories. After gaining access, generate a PAT and save it, along with your GitHub username, for later use in this setup.

• You can use a single token to access all three packages: React Native (RN), Android, and iOS.

  If you do not have a registered Capillary email address:

  • The team will provide you with a GitHub username and two tokens —one for iOS and one for Android. These tokens are required when setting up React Native.
    • Clone the main branch of the react-native-hydra-lib repository. Obtain the following files from the cloned repository:

      • .env.template

      • .npmrc.template

      • .yarnrc.yml.template

      • HydraConfig.plist

      • Hydra-config.json

      • Get the Account ID, base URL (End point), SSL public key and Remote log level from the remote configuration tool (CMS tool).

      • Using Firebase Remote Config: Initializers for iOS and Android are provided to fetch these parameters from the Firebase Remote Config. If you choose this method, add the following four parameters in the Firebase console:

      • hydra_account_id

      • hydra_base_url

      • hydra_ssl_public_key

      • hydra_remote_log_level

    📘

    Note

    If you use a multi-Hydra account setup, set the most common default values in the keys above. For the remaining Hydra accounts, define new keys. If you have three Hydra accounts for the India, USA, and Europe regions, you can set up one of these key pairs in the default keys. For the other two regions, create a similar set of four keys on Firebase remote config.

    For example, to set up keys for India, you might define the following:
    ind_hydra_account_id ind_hydra_base_url ind_hydra_ssl_public_key ind_hydra_remote_log_level

    You will need to provide these values when you want to configure a custom Hydra account.

  • Using other CMS tools: If you prefer a different CMS tool, you must use alternative initializers in iOS and Android. Refer to the Setup for iOS and Setup for Android documentation for details on initializers.
  • Optional
    Clone the examples demonstrating how to use the package in projects with different React Native versions and architectures from the following branches of the react-native-hydra-lib repository.
    • example_rn72_new_arch
    • example_rn72_old_arch
    • example_rn74_old_arch
    • example_rn75_old_arch
    • example_rn76_new_arch
    • example_rn77_new_arch

    Demo App

  We have also create a Sample React native application to demonstrate how to integrate these packages in the React Native application, please contact Capillary support team to get the access