clevertap-react-native 0.9.3 → 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (75) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/README.md +5 -0
  3. package/android/.gradle/6.1.1/executionHistory/executionHistory.bin +0 -0
  4. package/android/.gradle/6.1.1/executionHistory/executionHistory.lock +0 -0
  5. package/android/.gradle/6.1.1/fileChanges/last-build.bin +0 -0
  6. package/android/.gradle/6.1.1/fileContent/fileContent.lock +0 -0
  7. package/android/.gradle/6.1.1/fileHashes/fileHashes.bin +0 -0
  8. package/android/.gradle/6.1.1/fileHashes/fileHashes.lock +0 -0
  9. package/android/.gradle/6.1.1/fileHashes/resourceHashesCache.bin +0 -0
  10. package/android/.gradle/6.1.1/gc.properties +0 -0
  11. package/android/.gradle/6.1.1/javaCompile/classAnalysis.bin +0 -0
  12. package/android/.gradle/6.1.1/javaCompile/jarAnalysis.bin +0 -0
  13. package/android/.gradle/6.1.1/javaCompile/javaCompile.lock +0 -0
  14. package/android/.gradle/6.1.1/javaCompile/taskHistory.bin +0 -0
  15. package/android/.gradle/buildOutputCleanup/buildOutputCleanup.lock +0 -0
  16. package/android/.gradle/buildOutputCleanup/cache.properties +2 -0
  17. package/android/.gradle/buildOutputCleanup/outputFiles.bin +0 -0
  18. package/android/.gradle/checksums/checksums.lock +0 -0
  19. package/android/.gradle/checksums/md5-checksums.bin +0 -0
  20. package/android/.gradle/checksums/sha1-checksums.bin +0 -0
  21. package/android/.gradle/vcs-1/gc.properties +0 -0
  22. package/android/build/generated/source/buildConfig/debug/com/clevertap/react/BuildConfig.java +12 -0
  23. package/android/build/intermediates/aapt_friendly_merged_manifests/debug/aapt/AndroidManifest.xml +14 -0
  24. package/android/build/intermediates/aapt_friendly_merged_manifests/debug/aapt/output.json +27 -0
  25. package/android/build/intermediates/aar_main_jar/debug/classes.jar +0 -0
  26. package/android/build/intermediates/annotation_processor_list/debug/annotationProcessors.json +1 -0
  27. package/android/build/intermediates/annotations_typedef_file/debug/typedefs.txt +0 -0
  28. package/android/build/intermediates/compile_only_not_namespaced_r_class_jar/debug/R.jar +0 -0
  29. package/android/build/intermediates/compile_symbol_list/debug/R.txt +5732 -0
  30. package/android/build/intermediates/incremental/debug-mergeJavaRes/merge-state +0 -0
  31. package/android/build/intermediates/incremental/debug-mergeNativeLibs/merge-state +0 -0
  32. package/android/build/intermediates/incremental/mergeDebugJniLibFolders/merger.xml +2 -0
  33. package/android/build/intermediates/incremental/mergeDebugShaders/merger.xml +2 -0
  34. package/android/build/intermediates/incremental/packageDebugAssets/merger.xml +2 -0
  35. package/android/build/intermediates/incremental/packageDebugResources/compile-file-map.properties +1 -0
  36. package/android/build/intermediates/incremental/packageDebugResources/merger.xml +2 -0
  37. package/android/build/intermediates/javac/debug/classes/com/clevertap/react/BuildConfig.class +0 -0
  38. package/android/build/intermediates/javac/debug/classes/com/clevertap/react/CleverTapApplication$1$1.class +0 -0
  39. package/android/build/intermediates/javac/debug/classes/com/clevertap/react/CleverTapApplication$1.class +0 -0
  40. package/android/build/intermediates/javac/debug/classes/com/clevertap/react/CleverTapApplication.class +0 -0
  41. package/android/build/intermediates/javac/debug/classes/com/clevertap/react/CleverTapModule$1.class +0 -0
  42. package/android/build/intermediates/javac/debug/classes/com/clevertap/react/CleverTapModule$2.class +0 -0
  43. package/android/build/intermediates/javac/debug/classes/com/clevertap/react/CleverTapModule$ErrorMessages.class +0 -0
  44. package/android/build/intermediates/javac/debug/classes/com/clevertap/react/CleverTapModule$InBoxMessages.class +0 -0
  45. package/android/build/intermediates/javac/debug/classes/com/clevertap/react/CleverTapModule.class +0 -0
  46. package/android/build/intermediates/javac/debug/classes/com/clevertap/react/CleverTapPackage.class +0 -0
  47. package/android/build/intermediates/javac/debug/classes/com/clevertap/react/CleverTapUtils.class +0 -0
  48. package/android/build/intermediates/library_manifest/debug/AndroidManifest.xml +14 -0
  49. package/android/build/intermediates/local_only_symbol_list/debug/R-def.txt +2 -0
  50. package/android/build/intermediates/manifest_merge_blame_file/debug/manifest-merger-blame-debug-report.txt +17 -0
  51. package/android/build/intermediates/merged_java_res/debug/out.jar +0 -0
  52. package/android/build/intermediates/merged_manifests/debug/output.json +27 -0
  53. package/android/build/intermediates/symbol_list_with_package_name/debug/package-aware-r.txt +3965 -0
  54. package/android/build/outputs/aar/android-debug.aar +0 -0
  55. package/android/build/outputs/logs/manifest-merger-debug-report.txt +39 -0
  56. package/android/build.gradle +7 -7
  57. package/android/local.properties +2 -2
  58. package/android/src/main/java/com/clevertap/react/CleverTapModule.java +240 -12
  59. package/clevertap-react-native.podspec +1 -1
  60. package/docs/iospushtemplates.md +449 -0
  61. package/docs/pushprimer.md +97 -0
  62. package/docs/usage.md +4 -0
  63. package/index.d.ts +51 -4
  64. package/index.js +41 -4
  65. package/ios/CleverTapReact/CleverTapReact.h +2 -0
  66. package/ios/CleverTapReact/CleverTapReact.m +204 -63
  67. package/ios/CleverTapReact/CleverTapReactEventEmitter.h +0 -1
  68. package/ios/CleverTapReact/CleverTapReactEventEmitter.m +6 -3
  69. package/ios/CleverTapReact/CleverTapReactManager.h +3 -0
  70. package/ios/CleverTapReact/CleverTapReactManager.m +23 -11
  71. package/package.json +1 -1
  72. package/static/Finder.png +0 -0
  73. package/static/GenerateSpecs.png +0 -0
  74. package/static/NotificationContent.png +0 -0
  75. package/static/NotificationContentTarget.png +0 -0
@@ -0,0 +1,449 @@
1
+ # iOS Push Templates integration with React Native
2
+
3
+ CleverTap Push Templates SDK helps you engage with your users using fancy push notification templates built specifically to work with [CleverTap](https://eu1.dashboard.clevertap.com/login.html).
4
+
5
+ # Table of contents
6
+
7
+ - [Installation](#installation)
8
+ - [Dashboard Usage](#dashboard-usage)
9
+ - [Template Types](#template-types)
10
+ - [Template Keys](#template-keys)
11
+
12
+ # Installation
13
+
14
+ [(Back to top)](#table-of-contents)
15
+ - Add Notification Content Extension (Push Templates) in a React Native iOS Project
16
+ Notification Content Extension is an app extension that provides a custom interface when a user previews your notification in the notification center. To enable the functionality of CleverTap iOS Push templates, we need this extension in the project which act as subclass to our CTNotificationContent framework.
17
+
18
+ Open Example.xcodeproj (or your app’s .xcodeproj file) in the ios folder of React Native project. Go to File > New > Target… and search with the name “Notification Content Extension“
19
+
20
+ ![NotificationContentTarget](https://github.com/CleverTap/clevertap-react-native/blob/task/SDK-2395-RN-pushtemplates-support/static/NotificationContentTarget.png)
21
+
22
+ Add “Notification Content“ as target name.
23
+
24
+ ![NotificationContent](https://github.com/CleverTap/clevertap-react-native/blob/task/SDK-2395-RN-pushtemplates-support/static/NotificationContent.png)
25
+
26
+ Refer to https://github.com/CleverTap/CTNotificationContent#-setup for setting up Notification Content target so that it imports CTNotificationContent framework in the code. Make sure to add the necessary key-values in the Info.plist file of NotificationContent target so that it recognises the identifier of the incoming notification.
27
+
28
+ Alternatively, go to finder and replace newly created NotificationContent (or your content extension) folder with the NotificationContent folder in CTNotificationContent Example project repository.
29
+
30
+ ![Finder](https://github.com/CleverTap/clevertap-react-native/blob/task/SDK-2395-RN-pushtemplates-support/static/Finder.png)
31
+
32
+ Add the following to a file named Podfile in the ios directory of your project.
33
+ ```
34
+ use_frameworks!
35
+ target 'NotificationContent' do
36
+ pod 'CTNotificationContent'
37
+ end
38
+ ```
39
+
40
+ The final Podfile should look something like this:
41
+ ```
42
+ require_relative '../node_modules/react-native/scripts/react_native_pods'
43
+ require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
44
+
45
+ platform :ios, '10.0'
46
+
47
+ use_frameworks!
48
+ target 'NotificationContent' do
49
+ pod 'CTNotificationContent'
50
+ end
51
+
52
+ target 'Example' do
53
+
54
+ config = use_native_modules!
55
+
56
+ use_react_native!(:path => config["reactNativePath"])
57
+
58
+ pod 'RNReanimated', :path => '../node_modules/react-native-reanimated'
59
+ pod 'RNGestureHandler', :path => '../node_modules/react-native-gesture-handler'
60
+
61
+ post_install do |installer|
62
+ react_native_post_install(installer)
63
+ # Apple Silicon builds require a library path tweak for Swift library discovery or "symbol not found" for swift things
64
+ installer.aggregate_targets.each do |aggregate_target|
65
+ aggregate_target.user_project.native_targets.each do |target|
66
+ target.build_configurations.each do |config|
67
+ config.build_settings['LIBRARY_SEARCH_PATHS'] = ['$(SDKROOT)/usr/lib/swift', '$(inherited)']
68
+ end
69
+ end
70
+ aggregate_target.user_project.save
71
+ end
72
+ end
73
+ end
74
+ ```
75
+ Now run the command pod install again. This will download and configure CTNotificationContent(iOS push templates) in your project.
76
+ ```
77
+ For React Native 0.69 or below you need to change the build phase order so that React Native can use the iOS framework added with the help of podfile
78
+ Please check your React-Native version of the project before proceeding further. Go to package.json file in your project and check react-native key and check for the version.
79
+
80
+ If the react native version of your project is below 0.69 you need to drag the Generate Specs above Headers as explained below.
81
+ ```
82
+ ## For React Native version 0.69 or below:
83
+
84
+ Open Example.xcworkspace (or your app’s .xcworkspace file). Go to the Pods section in Xcode -> select FBReactNativeSpec -> Build Phases -> drag Generate Specs above Headers .
85
+ ![GenerateSpecs](https://github.com/CleverTap/clevertap-react-native/blob/task/SDK-2395-RN-pushtemplates-support/static/GenerateSpecs.png)
86
+
87
+ ## For React Native version 0.70 or above:
88
+
89
+ We must disable "hermes" and "flipper" from the Podfile since we are using use_frameworks and this causes build issues if both of them are enabled.
90
+
91
+ Please observe that hermes_enabled is set from its default true state to false by adding :hermes_enabled => false inside use_react_native! snippet.
92
+ The podfile mentions this in comments:
93
+ ```
94
+ Note that if you have use_frameworks! enabled, Flipper will not work and
95
+ # you should disable the next line.
96
+ ```
97
+ so we have added a # to comment the line
98
+ ```
99
+ :flipper_configuration => FlipperConfiguration.enabled
100
+ ```
101
+ The new Podfile should look like this:
102
+ ```
103
+ require_relative '../node_modules/react-native/scripts/react_native_pods'
104
+ require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
105
+ platform :ios, '12.4'
106
+ install! 'cocoapods', :deterministic_uuids => false
107
+ use_frameworks!
108
+ target 'NotificationContent' do
109
+ pod 'CTNotificationContent'
110
+ end
111
+ target 'reactnativedemo' do
112
+ config = use_native_modules!
113
+ # Flags change depending on the env values.
114
+ flags = get_default_flags()
115
+ use_react_native!(
116
+ :path => config[:reactNativePath],
117
+ # Hermes is now enabled by default. Disable by setting this flag to false.
118
+ # Upcoming versions of React Native may rely on get_default_flags(), but
119
+ # we make it explicit here to aid in the React Native upgrade process.
120
+ :hermes_enabled => false,
121
+ :fabric_enabled => flags[:fabric_enabled],
122
+ # Enables Flipper.
123
+ #
124
+ # Note that if you have use_frameworks! enabled, Flipper will not work and
125
+ # you should disable the next line.
126
+ # :flipper_configuration => FlipperConfiguration.enabled,
127
+ # An absolute path to your application root.
128
+ :app_path => "#{Pod::Config.instance.installation_root}/.."
129
+ )
130
+ post_install do |installer|
131
+ react_native_post_install(
132
+ installer,
133
+ # Set `mac_catalyst_enabled` to `true` in order to apply patches
134
+ # necessary for Mac Catalyst builds
135
+ :mac_catalyst_enabled => false
136
+ )
137
+ __apply_Xcode_12_5_M1_post_install_workaround(installer)
138
+ end
139
+ end
140
+ ```
141
+
142
+ ### Out of the box
143
+
144
+
145
+ # Dashboard Usage
146
+
147
+ [(Back to top)](#table-of-contents)
148
+ While creating a Push Notification campaign on CleverTap, just follow the steps below -
149
+
150
+ 1. On the "WHAT" section pass the desired required values in the "title" and "message" fields (NOTE: These are iOS alert title and body).
151
+ ![Dashboard alert](https://github.com/CleverTap/CTNotificationContent/blob/master/images/dashboard_alert.png)
152
+ 2. Click on "Advanced" and then click on "Rich Media" and select Single or Carousel template.
153
+ ![Dashboard Rich Media](https://github.com/CleverTap/CTNotificationContent/blob/master/images/dashboard_richMedia.png)
154
+ 3. For adding custom key-value pair, add the [template Keys](#template-keys) individually or into one JSON object and use the `pt_json` key to fill in the values.
155
+ ![Dashboard Custom Key individual](https://github.com/CleverTap/CTNotificationContent/blob/master/images/dashboard_customKeysIndividual.png)
156
+ ![Dashboard Custom Key JSON](https://github.com/CleverTap/CTNotificationContent/blob/master/images/dashboard_customKeyValue.png)
157
+ 4. Send a test push and schedule!
158
+
159
+ # Template Types
160
+
161
+ [(Back to top)](#table-of-contents)
162
+
163
+ ## Rich Media
164
+ ### Single Media
165
+ Single media is for basic view with single image.
166
+ ![Single Media](https://github.com/CleverTap/CTNotificationContent/blob/master/images/SingleMedia.png)
167
+
168
+ ### Content Slider
169
+ Content Slider is for image slideshow view where user can add multiple images with different captions, sub-captions, and actions.
170
+
171
+ <img src="https://github.com/CleverTap/CTNotificationContent/blob/master/images/ContentSlider.gif" alt="Content slider" width="450" height="800"/>
172
+
173
+ ## Custom key-value pair
174
+
175
+ ### Basic Template
176
+ Basic Template is the basic push notification received on apps where user can also update text colour, background colour.
177
+
178
+ ![Custom Basic template](https://github.com/CleverTap/CTNotificationContent/blob/master/images/CustomBasicTemplate.png)
179
+
180
+ ### Auto Carousel Template
181
+ Auto carousel is an automatic revolving carousel push notification where user can also update text colour, background colour.
182
+
183
+ <img src="https://github.com/CleverTap/CTNotificationContent/blob/master/images/CustomAutoCarousel.gif" alt="Auto carousel" width="450" height="800"/>
184
+
185
+ ### Manual Carousel Template
186
+ This is the manual version of the carousel. The user can navigate to the next/previous image by clicking on the Next/Back buttons.
187
+ ---
188
+ **NOTE:**
189
+
190
+ For iOS 12 and above, you need to configure your Notification Content target Info.plist to reflect the category identifier you registered: `NSExtension -> NSExtensionAttributes -> UNNotificationExtensionCategory`. In addition, set the `UNNotificationExtensionInitialContentSizeRatio -> 0.1` , `UNNotificationExtensionDefaultContentHidden -> true` and `UNNotificationExtensionUserInteractionEnabled -> 1`.
191
+
192
+ For iOS 11 and below, the previous/next buttons will not work. Please use notification actions with identifiers `action_1` and `action_2` for this purpose.
193
+
194
+ ---
195
+
196
+ <img src="https://github.com/CleverTap/CTNotificationContent/blob/master/images/CustomManualCarousel.gif" alt="Manual carousel" width="450" height="800"/>
197
+
198
+ ### Timer Template
199
+ This template features a live countdown timer. You can even choose to show different title, message, and background image after the timer expires.
200
+
201
+ <img src="https://github.com/CleverTap/CTNotificationContent/blob/master/images/CustomTimerTemplate.gif" alt="Timer template" width="450" height="800"/>
202
+
203
+ ### Zero Bezel Template
204
+
205
+ The Zero Bezel template ensures that the background image covers the entire available surface area of the push notification. All the text is overlayed on the image.
206
+
207
+ ![Zero Bezel template](https://github.com/CleverTap/CTNotificationContent/blob/master/images/ZeroBezel.png)
208
+
209
+ ### Rating Template
210
+
211
+ Rating template lets your users give you feedback.
212
+
213
+ **NOTE:**
214
+
215
+ For iOS 12 and above, you need to configure your Notification Content target Info.plist to reflect the category identifier you registered: `NSExtension -> NSExtensionAttributes -> UNNotificationExtensionCategory`. In addition, set the `UNNotificationExtensionInitialContentSizeRatio -> 0.1` , `UNNotificationExtensionDefaultContentHidden -> true` and `UNNotificationExtensionUserInteractionEnabled -> 1`.
216
+ For iOS 11 and below, it will fallback to a basic template.
217
+
218
+ ---
219
+
220
+ ![Rating](https://github.com/CleverTap/CTNotificationContent/blob/master/images/Rating.gif)
221
+
222
+ ### Product Catalog Template
223
+
224
+ Product catalog template lets you show case different images of a product (or a product catalog) before the user can decide to click on the "BUY NOW" option which can take them directly to the product via deep links. This template has two variants.
225
+
226
+ **NOTE:**
227
+
228
+ For iOS 12 and above, you need to configure your Notification Content target Info.plist to reflect the category identifier you registered: `NSExtension -> NSExtensionAttributes -> UNNotificationExtensionCategory`. In addition, set the `UNNotificationExtensionInitialContentSizeRatio -> 0.1` , `UNNotificationExtensionDefaultContentHidden -> true` and `UNNotificationExtensionUserInteractionEnabled -> 1`.
229
+ For iOS 11 and below, it will fallback to a basic template.
230
+
231
+ ---
232
+
233
+ ### Vertical View
234
+
235
+ ![Product Display](https://github.com/CleverTap/CTNotificationContent/blob/master/images/ProductDisplayVertical.gif)
236
+
237
+ ### Linear View
238
+
239
+ Use the following keys to enable linear view variant of this template.
240
+
241
+ Template Key | Required | Value
242
+ ---:|:---:|:---
243
+ pt_product_display_linear | Optional | `true`
244
+
245
+ ![Product Display](https://github.com/CleverTap/CTNotificationContent/blob/master/images/ProductDisplayLinear.gif)
246
+
247
+ ### WebView Template
248
+
249
+ WebView template lets you load a remote https URL.
250
+
251
+ ![WebView Template](https://github.com/CleverTap/CTNotificationContent/blob/master/images/WebView.gif)
252
+
253
+ **Note:** If any image can't be downloaded, the template falls back to basic template with caption and sub caption only.
254
+
255
+ # Template Keys
256
+
257
+ [(Back to top)](#table-of-contents)
258
+
259
+ ## Rich Media
260
+ ### Content Slider
261
+ Configure your APNS payload:
262
+
263
+ Then, when sending notifications via [APNS](https://developer.apple.com/library/content/documentation/NetworkingInternet/Conceptual/RemoteNotificationsPG/APNSOverview.html):
264
+ - include the mutable-content flag in your payload aps entry (this key must be present in the aps payload or the system will not call your app extension)
265
+ - for the Image Slideshow view, add the `ct_ContentSlider` key with a json object value, see example below, to the payload, outside of the aps entry.
266
+
267
+
268
+
269
+ ```
270
+ {
271
+
272
+ "aps": {
273
+ "alert": {
274
+ "body": "test message",
275
+ "title": "test title",
276
+ },
277
+ "category": "CTNotification",
278
+ "mutable-content": true,
279
+ },
280
+ "ct_ContentSlider": {
281
+ "orientation": "landscape", // landscape assumes 16:9 images, remove to display default square/portrait images
282
+ "showsPaging": true, // optional to display UIPageControl
283
+ "autoPlay": true, // optional to auto play the slideshow
284
+ "autoDismiss": true, // optional to auto dismiss the notification on item actionUrl launch
285
+ "items":[
286
+ {
287
+ "caption": "caption one",
288
+ "subcaption": "subcaption one",
289
+ "imageUrl": "https://s3.amazonaws.com/ct-demo-images/landscape-1.jpg",
290
+ "actionUrl": "com.clevertap.ctcontent.example://item/one"
291
+ },
292
+ {
293
+ "caption": "caption two",
294
+ "subcaption": "subcaption two",
295
+ "imageUrl": "https://s3.amazonaws.com/ct-demo-images/landscape-2.jpg",
296
+ "actionUrl": "com.clevertap.ctcontent.example://item/two"
297
+ }
298
+ ]
299
+ }
300
+ }
301
+ ```
302
+ ## Custom key-value pair
303
+
304
+ ### Basic Template
305
+ Basic Template Keys | Required | Description
306
+ ---:|:---:|:---|
307
+ pt_id | Required | Value - `pt_basic`
308
+ pt_title | Required | Title
309
+ pt_msg | Required | Message
310
+ pt_msg_summary | Required | Message line when Notification is expanded
311
+ pt_bg | Required | Background Color in HEX
312
+ pt_big_img | Optional | Image
313
+ pt_dl1 | Optional | One Deep Link
314
+ pt_title_clr | Optional | Title Color in HEX
315
+ pt_msg_clr | Optional | Message Color in HEX
316
+ pt_json | Optional | Above keys in JSON format
317
+
318
+ ### Auto Carousel Template
319
+
320
+ Auto Carousel Template Keys | Required | Description
321
+ ---:|:---:|:---
322
+ pt_id | Required | Value - `pt_carousel`
323
+ pt_title | Required | Title
324
+ pt_msg | Required | Message
325
+ pt_msg_summary | Optional | Message line when Notification is expanded
326
+ pt_dl1 | Required | Deep Link
327
+ pt_img1 | Required | Image One
328
+ pt_img2 | Required | Image Two
329
+ pt_img3 | Required | Image Three
330
+ pt_bg | Required | Background Color in HEX
331
+ pt_title_clr | Optional | Title Color in HEX
332
+ pt_msg_clr | Optional | Message Color in HEX
333
+ pt_json | Optional | Above keys in JSON format
334
+
335
+ ### Manual Carousel Template
336
+
337
+ Manual Carousel Template Keys | Required | Description
338
+ ---:|:---:|:---
339
+ pt_id | Required | Value - `pt_manual_carousel`
340
+ pt_title | Required | Title
341
+ pt_msg | Required | Message
342
+ pt_msg_summary | Optional | Message line when Notification is expanded
343
+ pt_dl1 | Required | Deep Link One
344
+ pt_img1 | Required | Image One
345
+ pt_img2 | Required | Image Two
346
+ pt_img3 | Required | Image Three
347
+ pt_bg | Required | Background Color in HEX
348
+ pt_title_clr | Optional | Title Color in HEX
349
+ pt_msg_clr | Optional | Message Color in HEX
350
+ pt_json | Optional | Above keys in JSON format
351
+
352
+ ### Timer Template
353
+
354
+ Timer Template Keys | Required | Description
355
+ ---:|:---:|:---
356
+ pt_id | Required | Value - `pt_timer`
357
+ pt_title | Required | Title
358
+ pt_title_alt | Optional | Title to show after timer expires
359
+ pt_msg | Required | Message
360
+ pt_msg_alt | Optional | Message to show after timer expires
361
+ pt_msg_summary | Optional | Message line when Notification is expanded
362
+ pt_dl1 | Required | Deep Link
363
+ pt_big_img | Optional | Image
364
+ pt_big_img_alt | Optional | Image to show when timer expires
365
+ pt_bg | Required | Background Color in HEX
366
+ pt_chrono_title_clr | Optional | Color for timer text in HEX
367
+ pt_timer_threshold | Required | Timer duration in seconds. Will be given higher priority.
368
+ pt_timer_end | Optional | Epoch Timestamp to countdown to (for example, $D_1595871380 or 1595871380). Not needed if pt_timer_threshold is specified.
369
+ pt_title_clr | Optional | Title Color in HEX
370
+ pt_msg_clr | Optional | Message Color in HEX
371
+ pt_json | Optional | Above keys in JSON format
372
+
373
+ ### Zero Bezel Template
374
+
375
+ Zero Bezel Template Keys | Required | Description
376
+ ---:|:---:|:---
377
+ pt_id | Required | Value - `pt_zero_bezel`
378
+ pt_title | Required | Title
379
+ pt_msg | Required | Message
380
+ pt_msg_summary | Optional | Message line when Notification is expanded
381
+ pt_subtitle | Optional | Subtitle
382
+ pt_big_img | Required | Image
383
+ pt_dl1 | Required | Deep Link
384
+ pt_title_clr | Optional | Title Color in HEX
385
+ pt_msg_clr | Optional | Message Color in HEX
386
+ pt_json | Optional | Above keys in JSON format
387
+
388
+ ### Rating Template
389
+
390
+ Rating Template Keys | Required | Description
391
+ ---:|:---:|:---
392
+ pt_id | Required | Value - `pt_rating`
393
+ pt_title | Required | Title
394
+ pt_msg | Required | Message
395
+ pt_big_img | Optional | Image
396
+ pt_msg_summary | Optional | Message line when Notification is expanded
397
+ pt_subtitle | Optional | Subtitle
398
+ pt_default_dl | Required | Default Deep Link for Push Notification
399
+ pt_dl1 | Required | Deep Link for first/all star(s)
400
+ pt_dl2 | Optional | Deep Link for second star
401
+ pt_dl3 | Optional | Deep Link for third star
402
+ pt_dl4 | Optional | Deep Link for fourth star
403
+ pt_dl5 | Optional | Deep Link for fifth star
404
+ pt_bg | Required | Background Color in HEX
405
+ pt_ico | Optional | Large Icon
406
+ pt_title_clr | Optional | Title Color in HEX
407
+ pt_msg_clr | Optional | Message Color in HEX
408
+ pt_json | Optional | Above keys in JSON format
409
+
410
+ ### Product Catalog Template
411
+
412
+ Product Catalog Template Keys | Required | Description
413
+ ---:|:---:|:---
414
+ pt_id | Required | Value - `pt_product_display`
415
+ pt_title | Required | Title
416
+ pt_msg | Required | Message
417
+ pt_subtitle | Optional | Subtitle
418
+ pt_img1 | Required | Image One
419
+ pt_img2 | Required | Image Two
420
+ pt_img3 | Optional | Image Three
421
+ pt_bt1 | Required | Big text for first image
422
+ pt_bt2 | Required | Big text for second image
423
+ pt_bt3 | Required | Big text for third image
424
+ pt_st1 | Required | Small text for first image
425
+ pt_st2 | Required | Small text for second image
426
+ pt_st3 | Required | Small text for third image
427
+ pt_dl1 | Required | Deep Link for first image
428
+ pt_dl2 | Required | Deep Link for second image
429
+ pt_dl3 | Required | Deep Link for third image
430
+ pt_price1 | Required | Price for first image
431
+ pt_price2 | Required | Price for second image
432
+ pt_price3 | Required | Price for third image
433
+ pt_bg | Required | Background Color in HEX
434
+ pt_product_display_action | Required | Action Button Label Text
435
+ pt_product_display_linear | Optional | Linear Layout Template ("true"/"false")
436
+ pt_product_display_action_clr | Required | Action Button Background Color in HEX
437
+ pt_title_clr | Optional | Title Color in HEX
438
+ pt_msg_clr | Optional | Message Color in HEX
439
+ pt_json | Optional | Above keys in JSON format
440
+
441
+ ### WebView Template
442
+
443
+ WebView Template Keys | Required | Description
444
+ ---:|:---:|:---
445
+ pt_id | Required | Value - `pt_web_view`
446
+ pt_dl1 | Required | Deep Link
447
+ pt_url | Required | URL to load
448
+ pt_orientation | Optional | Value - `landscape` or `portrait`
449
+ pt_json | Optional | Above keys in JSON format
@@ -0,0 +1,97 @@
1
+ ## 🔖 Overview
2
+
3
+ Push Primer allows you to enable runtime push permission for sending notifications from an app.
4
+
5
+ Starting with the v0.9.5 release, CleverTap React Native supports Push primer for push notification runtime permission through local in-app.
6
+
7
+ For Push Primer, minimum supported version for iOS platform is 10.0 while android 13 for the android platform.
8
+
9
+ ### Push Primer using Half-Interstitial local In-app
10
+ ```javascript
11
+ let localInApp = {
12
+ inAppType: 'half-interstitial',
13
+ titleText: 'Get Notified',
14
+ messageText:
15
+ 'Please enable notifications on your device to use Push Notifications.',
16
+ followDeviceOrientation: true,
17
+ positiveBtnText: 'Allow',
18
+ negativeBtnText: 'Cancel',
19
+ backgroundColor: '#FFFFFF',
20
+ btnBorderColor: '#0000FF',
21
+ titleTextColor: '#0000FF',
22
+ messageTextColor: '#000000',
23
+ btnTextColor: '#FFFFFF',
24
+ btnBackgroundColor: '#0000FF',
25
+ btnBorderRadius: '2',
26
+ fallbackToSettings: true,
27
+ };
28
+
29
+ CleverTap.promptPushPrimer(localInApp);
30
+ ```
31
+
32
+ ### Push Primer using Alert local In-app
33
+ ```javascript
34
+ CleverTap.promptPushPrimer({
35
+ inAppType: 'alert',
36
+ titleText: 'Get Notified',
37
+ messageText: 'Enable Notification permission',
38
+ followDeviceOrientation: true,
39
+ positiveBtnText: 'Allow',
40
+ negativeBtnText: 'Cancel',
41
+ fallbackToSettings: true,
42
+ });
43
+ ```
44
+
45
+ ### Prompt the Notification Permission Dialog (without push primer)
46
+ It takes boolean as a parameter. If the value passed is true and permission is denied then we fallback to app’s notification settings. If false then we just give the callback saying permission is denied.
47
+
48
+ ```javascript
49
+ CleverTap.promptForPushPermission(true);
50
+ ```
51
+
52
+ ### Get the Push notification permission status
53
+ Returns the status of the push permission in the callback handler.
54
+
55
+ ```javascript
56
+ CleverTap.isPushPermissionGranted((err, res) => {
57
+ console.log('isPushPermissionGranted', res, err);
58
+ });
59
+ ```
60
+
61
+ ### Description of the localInApp Object passed inside the PromptPushPrimer(localInApp) method
62
+
63
+ Key Name| Parameters | Description | Required
64
+ :---:|:---:|:---:|:---
65
+ `inAppType` | "half-interstitial" or "alert" | Accepts only half-interstitial & alert type to display the local in-app | Required
66
+ `titleText` | String | Sets the title of the local in-app | Required
67
+ `messageText` | String | Sets the subtitle of the local in-app | Required
68
+ `followDeviceOrientation` | true or false | If true then the local InApp is shown for both portrait and landscape. If it sets false then local InApp only displays for portrait mode | Required
69
+ `positiveBtnText` | String | Sets the text of the positive button | Required
70
+ `negativeBtnText` | String | Sets the text of the negative button | Required
71
+ `fallbackToSettings` | true or false | If true and the permission is denied then we fallback to app’s notification settings, if it’s false then we just give the callback saying permission is denied. | Optional
72
+ `backgroundColor` | Accepts Hex color as String | Sets the background color of the local in-app | Optional
73
+ `btnBorderColor` | Accepts Hex color as String | Sets the border color of both positive/negative buttons | Optional
74
+ `titleTextColor` | Accepts Hex color as String | Sets the title color of the local in-app | Optional
75
+ `messageTextColor` | Accepts Hex color as String | Sets the sub-title color of the local in-app | Optional
76
+ `btnTextColor` | Accepts Hex color as String | Sets the color of text for both positive/negative buttons | Optional
77
+ `btnBackgroundColor` | Accepts Hex color as String | Sets the background color for both positive/negative buttons | Optional
78
+ `btnBorderRadius` | String | Sets the radius for both positive/negative buttons. Default radius is “2” if not set | Optional
79
+ `fallbackToSettings` | true or false | If the value passed is true then we fallback to app’s notification settings in case permission is denied. If false then we just give the callback saying permission is denied. | Optional
80
+
81
+
82
+ ### Available Callbacks for Push Primer
83
+ Based on notification permission grant/deny, CleverTap React Native SDK provides a callback with the permission status.
84
+ For this You can register the CleverTapPushPermissionResponseReceived callback:
85
+ ```javascript
86
+ CleverTap.addListener(CleverTap.CleverTapPushPermissionResponseReceived, (e)=>{/*consume the event*/})
87
+ ```
88
+
89
+ To unregister the callback use below:
90
+ ```javascript
91
+ CleverTap.removeListener(CleverTap.CleverTapPushPermissionResponseReceived);
92
+ ```
93
+
94
+
95
+
96
+
97
+
package/docs/usage.md CHANGED
@@ -170,6 +170,10 @@ CleverTap.pushInboxNotificationClickedEventForId('Message Id');
170
170
 
171
171
  -----------
172
172
 
173
+ ## Push primer for notification Permission (Android and iOS)
174
+ Follow the [Push Primer integration doc](pushprimer.md).
175
+
176
+ -----------
173
177
  ## Push Notifications
174
178
 
175
179
  #### Creating Notification Channel
package/index.d.ts CHANGED
@@ -171,6 +171,25 @@
171
171
  */
172
172
  export function createNotification(extras: any): void;
173
173
 
174
+ /**
175
+ * Call this method to prompt the hard permission dialog directly, if the push primer is not required.
176
+ * @param showFallbackSettings : {boolean} - Pass true to show an alert dialog which routes to app's notification settings page.
177
+ */
178
+ export function promptForPushPermission(showFallbackSettings: boolean): void;
179
+
180
+ /**
181
+ * Call this method to prompt the push primer flow.
182
+ * @param localInAppConfig : {any} object
183
+ */
184
+ export function promptPushPrimer(localInAppConfig: any): void;
185
+
186
+ /**
187
+ * Returns true/false based on whether push permission is granted or denied.
188
+ *
189
+ * @param {function(err, res)} non-null callback to retrieve the result
190
+ */
191
+ export function isPushPermissionGranted(callback: CallbackString): void;
192
+
174
193
  /*******************
175
194
  * Events
176
195
  ******************/
@@ -610,6 +629,18 @@
610
629
  */
611
630
  export function resumeInAppNotifications(): void;
612
631
 
632
+ /*******************
633
+ * Instances
634
+ ******************/
635
+
636
+ /**
637
+ * Change the native instance of CleverTapAPI by using the instance for
638
+ * specific account. Used by Leanplum RN SDK.
639
+ *
640
+ * @param accountId {string} - The ID of the account to use when switching instance.
641
+ */
642
+ export function setInstanceWithAccountId(accountId: string): void;
643
+
613
644
  /*******************
614
645
  * Developer Options
615
646
  ******************/
@@ -622,7 +653,23 @@
622
653
  type Callback = (err: object, res: object) => void;
623
654
  type CallbackString = (err: object, res: string) => void;
624
655
 
625
- export const FCM : string;
626
- export const XPS : string;
627
- export const BPS : string;
628
- export const HPS : string;
656
+ export const FCM: string;
657
+ export const XPS: string;
658
+ export const BPS: string;
659
+ export const HPS: string;
660
+ export const CleverTapProfileDidInitialize: string;
661
+ export const CleverTapProfileSync: string;
662
+ export const CleverTapInAppNotificationDismissed: string;
663
+ export const CleverTapInAppNotificationShowed: string;
664
+ export const CleverTapInboxDidInitialize: string;
665
+ export const CleverTapInboxMessagesDidUpdate: string;
666
+ export const CleverTapInboxMessageButtonTapped: string;
667
+ export const CleverTapInboxMessageTapped: string;
668
+ export const CleverTapDisplayUnitsLoaded: string;
669
+ export const CleverTapInAppNotificationButtonTapped: string;
670
+ export const CleverTapFeatureFlagsDidUpdate: string;
671
+ export const CleverTapProductConfigDidInitialize: string;
672
+ export const CleverTapProductConfigDidFetch: string;
673
+ export const CleverTapProductConfigDidActivate: string;
674
+ export const CleverTapPushNotificationClicked: string;
675
+ export const CleverTapPushPermissionResponseReceived: string;