clevertap-react-native 3.9.0 → 4.0.0

package/.claude/worktrees/ecstatic-goldberg/clevertap-react-native.podspec

@@ -0,0 +1,37 @@
+require 'json'
+
+package = JSON.parse(File.read(File.join(__dir__, 'package.json')))
+
+Pod::Spec.new do |s|
+  s.name           = package['name']
+  s.version        = package['version']
+  s.summary        = package['description']
+  s.license        = package['license']
+  s.author         = package['author']
+  s.homepage       = package['homepage']
+  s.source         = { :git => 'https://github.com/CleverTap/clevertap-react-native.git', :tag => s.version }
+
+  s.requires_arc   = true
+  s.module_name    = 'CleverTapReact' 
+  s.platform       = :ios, '9.0'
+
+  s.preserve_paths = 'LICENSE.md', 'README.md', 'package.json', 'index.js'
+  s.source_files   = 'ios/CleverTapReact/*.{h,m,mm}'
+
+  if respond_to?(:install_modules_dependencies, true)
+    install_modules_dependencies(s)
+  else
+    s.dependency 'React-Core'
+  end
+
+  s.dependency 'CleverTap-iOS-SDK', '7.4.2'
+
+  if ENV['RCT_NEW_ARCH_ENABLED'] == '1' then
+    s.pod_target_xcconfig = {
+      'DEFINES_MODULE' => 'YES',
+      'GCC_PREPROCESSOR_DEFINITIONS' => '$(inherited) COCOAPODS=1 RCT_NEW_ARCH_ENABLED=1',
+      "HEADER_SEARCH_PATHS" => "\"$(PODS_ROOT)/boost\"",
+      "CLANG_CXX_LANGUAGE_STANDARD" => "c++17"
+    }
+  end
+end

package/.claude/worktrees/ecstatic-goldberg/docs/CustomCodeTemplates.md

@@ -0,0 +1,215 @@
+# Custom Code Templates
+
+CleverTap React Native SDK 3.1.0 and above supports a custom presentation of in-app messages. This allows for utilizing the in-app notifications functionality with custom configuration and presentation logic. Two types of templates can be defined through the SDK: Templates and Functions. Templates can contain action arguments while Functions cannot and Functions can be used as actions while Templates cannot. Functions can be either "visual" or "non-visual". "Visual" functions can contain UI logic and will be part of the [In-App queue](#in-App-queue), while "non-visual" functions will be triggered directly when invoked and should not contain UI logic.
+
+## Creating templates and functions
+Templates consist of a name, type, and arguments (and isVisual for Functions). Type and arguments (and isVisual for Functions) are required and names must be unique across the application. The template definitions are validated for correctness and will throw `CustomTemplateException` when an invalid template is created on launching the application. Those exceptions should generally not be caught and template definitions must be valid to be triggered correctly.
+
+The templates are defined in а JSON format with the following scheme:
+```json
+{
+  "TemplateName": {
+    "type": "template",
+    "arguments": {
+      "Argument1": {
+        "type": "string|number|boolean|file|action|object",
+        "value": "val"
+        },
+      "Argument2": {
+        "type": "object",
+        "value": {
+          "Nested1": {
+            "type": "string|number|boolean|object",
+            "value": "val"
+          },
+          "Nested2": {
+            "type": "string|number|boolean|object",
+            "value": "val"
+          }
+        }
+      }
+    }
+  },
+  "functionName": {
+    "type": "function",
+    "isVisual": true|false,
+    "arguments": {
+      "a": {
+      "type": "string|number|boolean|file|object",
+      "value": "val"
+      }
+    }
+  }
+}
+```
+The JSON definitions should be placed in one or more files in the following locations:
+ - Android: in `assets` directory
+ - iOS: in any directory linked to the project
+
+For a working example, see the Example project: `Example/assets/templates.json` and `Example/android/app/src/main/assets/custom/templates.json`.
+
+Optionally the `react-native-assets` package can be utilized to keep both files in sync.
+
+### Arguments
+An `argument` is a structure that represents the configuration of the custom code templates. It consists of a `type` and a `value`.
+The supported argument types are:
+- Primitives - `boolean`, `number`, and `string`. They must have a default value which would be used if no other value is configured for the notification.
+- `object` - An `Object` where keys are the argument names and values are ```Arguments``` with supported primitive values.
+- `file` - a file argument that will be downloaded when the template is triggered. Files don't have default values.
+- `action` - an action argument that could be a function template or a built-in action like ‘close’ or ‘open url’. Actions don't have default values.
+
+#### Hierarchical arguments
+You can group arguments by either using an `object` argument or indicating the group in the argument's name by using a "." symbol. Both definitions are treated the same. `file` and `action` type arguments can only be added to a group by specifying the group in the argument's name.
+
+The following code snippets define identical arguments:
+```json
+"arguments": {
+    "map": {
+        "type": "object",
+        "value": {
+            "a": {
+                "type": "number",
+                "value": 5
+            },
+            "b": {
+                "type": "number",
+                "value": 6
+            }
+        }
+    }
+}
+```
+and
+```json
+"arguments": {
+    "map.a": {
+        "type": "number",
+        "value": 5
+    },
+    "map.b": {
+        "type": "number",
+        "value": 6
+    }
+}
+```
+
+### Template definition example
+```json
+"Example template": {
+    "type": "template",
+    "arguments": {
+        "boolArg": {
+            "type": "boolean",
+            "value": false
+        },
+        "stringArg": {
+            "type": "string",
+            "value": "Default"
+        },
+        "mapArg": {
+            "type": "object",
+            "value": {
+                "int": {
+                    "type": "number",
+                    "value": 0
+                },
+                "string": {
+                    "type": "string",
+                    "value": "Default"
+                }
+            }
+        },
+        "actionArg": {
+            "type": "action"
+        },
+        "fileArg": {
+            "type": "file"
+        }
+    }
+}
+```
+
+## Registering custom templates
+
+Templates must be registered within the native applications:
+
+### For Android
+Call `CleverTapCustomTemplates.registerCustomTemplates` in your `Application.onCreate` method.
+ - If you are extending `CleverTapApplication` add this line before calling `super.onCreate()`:
+```java
+public class MainApplication extends CleverTapApplication {
+    @Override
+    public void onCreate() {
+        CleverTapCustomTemplates.registerCustomTemplates(this, "templateDefinitionsFileInAssets.json");
+        super.onCreate();
+    }
+}
+```
+ - Otherwise add the line before calling `CleverTapRnAPI.initReactNativeIntegration(this)`:
+```java
+public class MainApplication extends Application {
+    @Override
+    public void onCreate() {
+        ActivityLifecycleCallback.register(this);
+        super.onCreate();
+        CleverTapCustomTemplates.registerCustomTemplates(this, "templateDefinitionsFileInAssets.json");
+        CleverTapRnAPI.initReactNativeIntegration(this);
+    }
+}
+```
+
+### For iOS
+Call `[CleverTapReactCustomTemplates registerCustomTemplates]` in your `AppDelegate.didFinishLaunchingWithOptions` before calling `[CleverTap autoIntegrate]`:
+```objc
+@implementation AppDelegate
+- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
+  [CleverTapReactCustomTemplates registerCustomTemplates:@"templates", nil];
+  [CleverTap autoIntegrate];
+  [[CleverTapReactManager sharedInstance] applicationDidLaunchWithOptions:launchOptions];
+
+  return [super application:application didFinishLaunchingWithOptions:launchOptions];
+}
+```
+
+## Syncing in-app templates to the dashboard
+
+For the templates to be usable in campaigns they must be synced with the dashboard. When all templates and functions are defined and registered in the SDK, they can be synced by calling `CleverTap.syncCustomTemplates()` or `CleverTap.syncCustomTemplatesInProd()` in your React application. The syncing can only be done in debug builds and with an SDK user marked as a "test user". We recommend only calling this function while developing the templates and deleting the invocation in release builds.
+
+## Presenting templates
+
+When a custom template is triggered, the corresponding event `CleverTap.CleverTapCustomTemplatePresent` or `CleverTap.CleverTapCustomFunctionPresent` will be raised. Applications with custom templates or functions must subscribe to those events through `CleverTap.addListener` where the event data will be the template's name. When the event handler is invoked, this template will be considered "active" until `CleverTap.customTemplateSetDismissed(templateName)` is called. While a template is "active" the following functions can be used:
+
+- Obtain argument values by using the appropriate `customTemplateGet*Arg(templateName: string, argName: string)` methods.
+- Trigger actions by their name through `CleverTap.customTemplateRunAction(templateName: string, argName: string)`.
+- Set the state of the template invocation. `CleverTap.customTemplateSetPresented(templateName: string)` and `CleverTap.customTemplateSetDismissed(templateName: string)` notify the SDK of the state of the current template invocation. The presented state is when an in-app is displayed to the user and the dismissed state is when the in-app is no longer displayed.
+
+Only one visual template or other InApp message can be displayed at a time by the SDK and no new messages can be shown until the current one is dismissed.
+
+Applications should also subscribe to `CleverTap.CleverTapCustomTemplateClose` which will be raised when a template should be closed (this could occur when an action of type "close" is triggered). Use this listener to remove the UI associated with the template and call `CleverTap.customTemplateSetDismissed(templateName)` to close it.
+
+### Example
+
+```js
+CleverTap.addListener(CleverTap.CleverTapCustomTemplatePresent, templateName => {
+    // show the UI for the template and call customTemplateSetDismissed when it is closed
+    showTemplateUi({
+        template: templateName,
+        onClose: ()=> {
+            CleverTap.customTemplateSetDismissed(templateName);
+        }
+    });
+    // call customTemplateSetPresented when the UI has become visible to the user
+   CleverTap.customTemplateSetPresented(templateName);
+});
+
+CleverTap.addListener(CleverTap.CleverTapCustomTemplateClose, templateName => {
+    // close the corresponding UI before calling customTemplateSetDismissed
+    CleverTap.customTemplateSetDismissed(templateName);
+});
+```
+
+### In-App queue
+When an in-app needs to be shown it is added to a queue (depending on its priority) and is displayed when all messages before it have been dismissed. The queue is saved in the storage and kept across app launches to ensure all messages are displayed when possible. The custom code in-apps behave in the same way. They will be triggered once their corresponding notification is the next one in the queue to be shown. However since the control of the dismissal is left to the application's code, the next in-app message will not be displayed until the current code template has called `CleverTap.customTemplateSetDismissed(templateName)`
+
+### File downloading and caching
+File arguments are automatically downloaded and are ready for use when an in-app template is presented. The files are downloaded when a file argument has changed and this file is not already cached. For client-side in-apps, this happens at App Launch and is retried if needed when an in-app should be presented. For server-side in-apps, the file downloading happens only before presenting the in-app. If any of the file arguments of an in-app fails to be downloaded, the whole in-app is skipped and the custom template will not be triggered.

package/.claude/worktrees/ecstatic-goldberg/docs/Variables.md

@@ -0,0 +1,191 @@
+# Overview
+You can define variables using the CleverTap React Native SDK. When you define a variable in your code, you can sync them to the CleverTap Dashboard via the provided SDK methods.
+
+# Supported Variable Types
+
+Currently, CleverTap SDK supports the following variable types:
+
+- String
+- boolean
+- JSON Object
+- number
+
+# Define Variables
+
+Variables can be defined using the `defineVariables` method. You must provide the names and default values of the variables using a JSON Object. 
+
+```javascript
+let variables = {
+              'reactnative_var_string': 'reactnative_var_string_value',
+              'reactnative_var_map': {
+                'reactnative_var_map_string': 'reactnative_var_map_value'
+              },
+              'reactnative_var_int': 6,
+              'reactnative_var_float': 6.9,
+              'reactnative_var_boolean': true
+            };
+CleverTap.defineVariables(variables);
+```
+
+# Define File Variables
+
+CleverTap React Native SDK supports file types for variables from version `3.1.0`. Supported file types include but are not limited to images (jpg, jpeg, png, gif), text files, and PDFs.
+
+```javascript
+CleverTap.defineFileVariable("fileVariable");
+```
+
+# Setup Callbacks
+
+CleverTap React Native SDK provides several callbacks for the developer to receive feedback from the SDK. You can use them as per your requirement, using all of them is not mandatory. They are as follows:
+
+- Status of fetch variables request
+- `onVariablesChanged`
+- `onValueChanged`
+
+From version `3.1.0` onwards, the following callbacks are also supported:
+
+- `onOneTimeVariablesChanged`
+- `onVariablesChangedAndNoDownloadsPending`
+- `onceVariablesChangedAndNoDownloadsPending`
+- `onFileValueChanged`
+
+## Status of Variables Fetch Request
+
+This method provides a boolean flag to ensure that the variables are successfully fetched from the server.
+
+```javascript
+CleverTap.fetchVariables((err, success) => {
+    console.log('fetchVariables result: ', success);
+});
+```
+
+## `onVariablesChanged`
+
+This callback is invoked when variables are initialized with values fetched from the server. It is called each time new values are fetched.
+
+```javascript
+CleverTap.onVariablesChanged((variables) => {
+    console.log('onVariablesChanged: ', variables);
+});
+```
+
+## `onOneTimeVariablesChanged`
+
+This callback is invoked once when variables are initialized with a value or changed with a new server value. Callback is triggered only once on app start, or when added if server values are already received
+
+```javascript
+ CleverTap.onOneTimeVariablesChanged((variables) => {
+    console.log('onOneTimeVariablesChanged: ', variables);
+});
+```
+
+## `onValueChanged`
+
+This callback is invoked when the value of the variable changes. You must provide the name of the variable whose value needs to be observed.
+
+```javascript
+CleverTap.onValueChanged('reactnative_var_string', (variable) => {
+    console.log('onValueChanged: ', variable);
+});
+```
+
+## `onVariablesChangedAndNoDownloadsPending`
+
+This callback is invoked when variable values are changed and the files associated with it are downloaded and ready to be used. Callback is triggered each time new values are fetched and downloaded.
+
+```javascript
+CleverTap.onVariablesChangedAndNoDownloadsPending((variables) => {
+    console.log('onVariablesChangedAndNoDownloadsPending', variables);
+});
+```
+
+## `onceVariablesChangedAndNoDownloadsPending`
+
+This callback is invoked only once when variable values are changed and the files associated with it are downloaded and ready to be used. Callback is triggered only once for when new values are fetched and downloaded 
+
+```javascript
+CleverTap.onceVariablesChangedAndNoDownloadsPending((variables) => {
+    console.log('onceVariablesChangedAndNoDownloadsPending', variables);
+});
+```
+
+## `onFileValueChanged`
+
+This callback is registered per file variable. It is called when the file associated with the file variable is downloaded and ready to be used.
+
+```javascript
+CleverTap.onFileValueChanged('fileVariable', (variable) => {
+    console.log('onFileValueChanged: ', variable);
+});
+```
+
+# Sync Defined Variables
+
+After defining your variables in the code, you must send/sync variables to the server. To do so, the app must be in DEBUG mode and mark a particular CleverTap user profile as a test profile from the CleverTap dashboard. [Learn how to mark a profile as **Test Profile**](https://developer.clevertap.com/docs/concepts-user-profiles#mark-a-user-profile-as-a-test-profile)
+
+After marking the profile as a test profile, you must sync the app variables in DEBUG mode:
+
+```javascript
+// 1. Define CleverTap variables 
+// …
+// 2. Add variables/values changed callbacks
+// …
+
+// 3. Sync CleverTap Variables from DEBUG mode/builds
+CleverTap.syncVariables();
+```
+
+> 📘 Key Points to Remember
+> 
+> - In a scenario where there is already a draft created by another user profile in the dashboard, the sync call will fail to avoid overriding important changes made by someone else. In this case, Publish or Dismiss the existing draft before you proceed with syncing variables again. However, you can override a draft you created via the sync method previously to optimize the integration experience.
+> - You can receive the following console logs from the CleverTap SDK:
+>   - Variables synced successfully.
+>   - Unauthorized access from a non-test profile. Please mark this profile as a test profile from the CleverTap dashboard.
+
+# Fetch Variables During a Session
+
+You can fetch the updated values for your CleverTap variables from the server during a session. If variables have changed, the appropriate callbacks will be fired. The provided callback provides a boolean flag that indicates if the fetch call was successful. The callback is fired regardless of whether the variables have changed or not.
+
+```javascript
+ CleverTap.fetchVariables((err, success) => {
+    console.log('fetchVariables result: ', success);
+});
+```
+
+# Use Fetched Variables Values
+
+This process involves the following two major steps:
+
+1. Fetch variable values.
+2. Access variable values.
+
+## Fetch Variable Values
+
+Variables are updated automatically when server values are received. If you want to receive feedback when a specific variable is updated, use the individual callback:
+
+```javascript
+CleverTap.onValueChanged('reactnative_var_string', (variable) => {
+    console.log('onValueChanged: ', variable);
+});
+```
+
+## Access Variable Values
+
+You can access these fetched values in the following two ways:
+
+### Getting all variables
+
+```javascript
+CleverTap.getVariables((err, variables) => {
+    console.log('getVariables: ', variables, err);
+});
+```
+
+### Getting a specific variable
+
+```javascript
+CleverTap.getVariable('reactnative_var_string', (err, variable) => {
+    console.log(`variable value for key \'reactnative_var_string\': ${variable}`);
+});
+```

package/.claude/worktrees/ecstatic-goldberg/docs/callbackPayloadFormat.md

@@ -0,0 +1,26 @@
+##  🔖 Overview
+
+This document demonstrates the changes in the payload formats along with the platform affected. These changes make the payload consistent across Android and iOS platform from v1.1.0. 
+
+Refer [Sample App](https://github.com/CleverTap/clevertap-react-native/blob/master/Example/App.js) for examples on how to access the payload. 
+
+| Callback                                | Platform affected | Old Payload Format               | New Payload Format                                      | Remarks                                                                                                                                                                      |
+| --------------------------------------- | ----------------- | -------------------------------- | ------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| CleverTapInAppNotificationButtonTapped  | iOS               | { "customExtras": {} }           | {}                                                      | Removed \`customExtras\` key                                                                                                                                                 |
+| CleverTapInAppNotificationDismissed     | iOS               | { "actionExtras": {} }           | { "extras": {}, "actionExtras": {} }                    | Started passing an empty Object to \`extras\` key when found null                                                                                                            |
+| CleverTapInAppNotificationShowed        | Android           | { "data": '{}' }                 | { "data": {} }                                          | Removed stringified JSON with plain JSON format to access payload without JSON parsing                                                                                       |
+| CleverTapPushNotificationClicked        | iOS               | { "customExtras": {} }           | {}                                                      | Removed \`customExtras\` key                                                                                                                                                 |
+| CleverTapPushPermissionResponseReceived | iOS               | { "isPermissionGranted": false } | { "accepted": false }                                   | Renamed \`isPersmissionGranted\` key to \`accepted\`                                                                                                                         |
+| CleverTapInboxDidInitialize             | iOS               | undefined                        | {}                                                      | Passed an empty Object when found null                                                                                                                                       |
+| CleverTapInboxMessagesDidUpdate         | iOS               | undefined                        | {}                                                      | Passed an empty Object when found null                                                                                                                                       |
+| CleverTapInboxMessageTapped             | Both              | { "data": '{}' }                 | { "data": {}, "contentPageIndex": 0, "buttonIndex": 1 } | \- Replaced stringified JSON with plain JSON format to access the \`data\` key without JSON parsing<br>\- Added \`contentPageIndex\` and \`buttonIndex\` keys to the payload |
+| CleverTapDisplayUnitsLoaded             | Android           | { "displayUnits": [ '{}' ] }     | { "displayUnits": [ {} ] }                              | Removed stringified JSON with plain JSON format to access payload without JSON parsing                                                                                       |
+| CleverTapFeatureFlagsDidUpdate          | iOS               | undefined                        | {}                                                      | Passed an empty Object when found null                                                                                                                                       |
+| CleverTapProductConfigDidInitialize     | iOS               | undefined                        | {}                                                      | Passed an empty Object when found null                                                                                                                                       |
+| CleverTapProductConfigDidFetch          | iOS               | undefined                        | {}                                                      | Passed an empty Object when found null                                                                                                                                       |
+| CleverTapProductConfigDidActivate       | iOS               | undefined                        | {}                                                      | Passed an empty Object when found null                                                                                                                                       |
+| getAllInboxMessages                     | Android           | [ '{}' , '{}' ]                  | [ {}, {} ]                                              | Removed stringified JSON with plain JSON format to access payload without JSON parsing                                                                                       |
+| getUnreadInboxMessages                  | Android           | [ '{}' , '{}' ]                  | [ {}, {} ]                                              | Removed stringified JSON with plain JSON format to access payload without JSON parsing                                                                                       |
+| getInboxMessageForId                    | Android           | "{}"                             | {}                                                      | Removed stringified JSON with plain JSON format to access payload without JSON parsing                                                                                       |
+| getAllDisplayUnits                      | Android           | [ '{}' , '{}' ]                  | [ {}, {} ]                                              | Removed stringified JSON with plain JSON format to access payload without JSON parsing                                                                                       |
+| getDisplayUnitForId                     | Android           | "{}"                             | {}                                                      | Removed stringified JSON with plain JSON format to access payload without JSON parsing                                                                                       |

package/.claude/worktrees/ecstatic-goldberg/docs/install.md

@@ -0,0 +1,162 @@
+## Installing CleverTap React Native
+
+1. `npm install --save clevertap-react-native`
+
+     Link CleverTap for React Native 0.59 or below & Not Using Cocoapods
+
+2. `react-native link clevertap-react-native` **or** [follow the manual linking instructions below](install.md#manual-linking).
+
+    **Note:**
+    
+    1. For React Native 0.60 or above linking is not required. Read more [here](https://github.com/react-native-community/cli/blob/master/docs/autolinking.md).
+    
+    2. To disable auto-linking in Android, Add a react-native.config.js to the project root (where the package.json is) to exempt CleverTap package from auto linking:
+    
+    ```
+    module.exports = {
+	dependencies: {
+   	 	'clevertap-react-native': {
+   	  	 platforms: {
+     	  	 ios: null,
+      	  	 android: null,
+     	       },
+   	     },
+  	   },
+	};
+    ```
+    
+  
+  ## Steps for iOS ##
+  
+
+### iOS with podspec
+- Add `pod 'clevertap-react-native', :path => '../node_modules/clevertap-react-native'` as a dependency in your ios/Podfile.
+
+For your iOS, add the following to your Podfile:
+
+```
+target 'YOUR_TARGET_NAME' do  
+    use_frameworks!
+    pod 'clevertap-react-native', :path => '../node_modules/clevertap-react-native'
+end
+```
+
+- Run `pod install` from your ios directory.
+
+### iOS without podspec
+- Add `pod 'CleverTap-iOS-SDK'` as a dependency in your ios/Podfile.
+- `cd ios; pod install --repo-update`
+- Note that after pod install, open your project using **[MyProject].xcworkspace** instead of the original .xcodeproj.
+
+### Troubleshooting  
+
+If you're on RN 0.60 or your project configuration doesn't allow to add `use_frameworks!` in the podfile, alternatively, you can add `use_modular_headers!` to enable the stricter search paths and module map generation for all of your pods, or you can add `:modular_headers => true` to a single pod declaration to enable for only that pod.
+
+
+## Steps for Android ##
+
+
+- Add the clevertap-android-sdk and firebase-messaging (if you wish to support push notifications) packages in your `android/app/build.gradle`file.
+```gradle
+dependencies {
+	...
+	//androidx
+    implementation 'androidx.core:core:1.3.0'
+    implementation 'androidx.appcompat:appcompat:1.3.1'       //Mandatory for App Inbox
+    implementation 'androidx.fragment:fragment:1.3.6'         //Mandatory for InApp
+    implementation 'androidx.recyclerview:recyclerview:1.2.1' //Mandatory for App Inbox
+    implementation 'androidx.viewpager:viewpager:1.0.0'       //Mandatory for App Inbox
+    implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.1.0"
+
+    //com.android
+    implementation 'com.android.installreferrer:installreferrer:2.2' //Mandatory for React Native SDK v0.3.9+
+    implementation 'com.android.support:multidex:1.0.3'
+
+    //react-native  libs
+    implementation "com.facebook.react:react-native:+"
+
+    //com.google
+    implementation 'com.google.android.gms:play-services-base:17.6.0'
+    implementation 'com.google.firebase:firebase-messaging:21.0.0'
+    implementation 'com.google.android.material:material:1.4.0'          //Mandatory for App Inbox
+    implementation 'com.google.android.exoplayer:exoplayer:2.19.1'      //Optional for Audio/Video
+    implementation 'com.google.android.exoplayer:exoplayer-hls:2.19.1'  //Optional for Audio/Video
+    implementation 'com.google.android.exoplayer:exoplayer-ui:2.19.1'   //Optional for Audio/Video
+    //implementation 'com.google.android.gms:play-services-ads:19.0.1'
+
+
+    //clevertap
+    implementation 'com.clevertap.android:clevertap-android-sdk:7.4.1'
+
+
+    // other libs
+	implementation 'com.github.bumptech.glide:glide:4.12.0' //Mandatory for App Inbox
+	
+    //Note - ExoPlayer/AndroidX Media3 dependencies are optional but all 3 are required for Audio/Video Inbox and InApp Messages
+}
+```
+
+### Migrating from `Exoplayer` to `AndroidX Media3` (Optional)
+
+Clevertap ReactNative SDK supports `AndroidX Media3` from `v3.0.0+` to replace the deprecated `ExoPlayer` libraries. For migration change the following dependencies.
+
+|         Old Dependency | New Dependency      |
+|-----------------------:|:--------------------|
+|     `com.google.android.exoplayer:exoplayer:2.19.1` | `androidx.media3:media3-exoplayer:1.1.1`     |
+| `com.google.android.exoplayer:exoplayer-hls:2.19.1` | `androidx.media3:media3-exoplayer-hls:1.1.1` |
+|  `com.google.android.exoplayer:exoplayer-ui:2.19.1` | `androidx.media3:media3-ui:1.1.1`  |
+
+
+## Manual Linking
+
+#### iOS:
+- Drag and Drop node_modules/clevertap-react-native/ios/CleverTapReact.xcodeproj into the Libraries folder of your project in XCode ([see Step 1 here](http://facebook.github.io/react-native/docs/linking-libraries-ios.html#manual-linking)).
+
+- Drag and Drop the libCleverTapReact.a product in CleverTapReact.xcodeproj into your project's target's "Link Binary With Libraries" section ([see Step 2 here](http://facebook.github.io/react-native/docs/linking-libraries-ios.html#manual-linking)).
+
+- Add a Header Search Path pointing to `$(SRCROOT)/../node_modules/clevertap-react-native/ios` ([see Step 3 here](http://facebook.github.io/react-native/docs/linking-libraries-ios.html#manual-linking)).
+
+#### Android:
+android/settings.gradle
+
+```gradle
+include ':clevertap-react-native'
+project(':clevertap-react-native').projectDir = new File(settingsDir, '../node_modules/clevertap-react-native/android')
+```
+android/app/build.gradle
+```gradle
+dependencies {
+    ...
+    implementation project(':clevertap-react-native')
+}
+```
+
+### Troubleshooting
+#### Upgrading to clevertap-react-native v3.3.0
+
+To use `clevertap-react-native v3.3.0`, it is recommended to upgrade to **React Native v0.74+**.
+
+If you insist on using an older version of React Native, consider the following possible resolutions for common issues:
+
+##### For ReactNative v0.73
+**Error:** `Compiled with an incompatible version of Kotlin`
+
+**Resolution:** Force the Kotlin version in your root `build.gradle`:
+```gradle
+dependencies {
+  ....
+  classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:2.0.0"
+
+  // NOTE: Do not place your application dependencies here; they belong
+  // in the individual module build.gradle files
+}
+```
+
+##### For ReactNative v0.71 or v0.72
+**Error:** `java.lang.NullPointerException: Cannot invoke "String.length()" because "<parameter1>" is null`
+
+**Reference:** https://issuetracker.google.com/issues/342522142
+
+**Resolution:** Either upgrade to `AGP 8.0.0+` or use a specific version of D8/R8 compiler as recommended in [this comment](https://issuetracker.google.com/issues/342522142#comment8) 
+
+Now move on to [integrating the SDK](./integration.md).