Page Comparison

...

Code Block
yarn add @react-native-async-storage/async-storage

or

Code Block
npm i @react-native-async-storage/async-storage

Install package.

Code Block
yarn add react-native-related-digital

or

Code Block
npm i react-native-related-digital

...

Create a Firebase project and register your app. Download google-services.json file and place it in android/app folder.
Add below line to your android/build.gradle file's both repositories sections. If you are going to do Huawei integration, add the agconnect-services.json file to the same location.

Code Block
mavenCentral() maven { url 'http://developer.huawei.com/repo/' allowInsecureProtocol = true }

Add below lines to your android/build.gradle file's dependencies section.

Code Block
classpath 'com.google.gms:google-services:4.3.314' classpath 'com.huawei.agconnect:agcp:1.46.15.300'

Change your minSdkVersion to 19 to 21.
Change your compileSdkVersion and targetSdkVersion to 32.
Add below lines to your android/app/build.gradle file's bottom.

...

Add Empty.swift file to your project as the sdk contains Swift code and xcode requires at least one empty swift file in each target.
Add NSUserTrackingUsageDescription to your Info.plist file to be able to use AdvertisingTrackingID on iOS 14 and later. If you don't want to use it, set isIDFAEnabled to false among the initRelatedDigital parameters.
If you have any issues while building the app due to _swift_getFunctionReplacement or any swift related errors, try editing your project's (not target) Library Search Paths and remove $(TOOLCHAIN_DIR)/usr/lib/swift-5.0/$(PLATFORM_NAME) line.

If you are going to use in app notifications feature, add below lines to your project target's Build Phases->Copy Bundle Resources section. Select Create folder references when prompted.

Code Block

Pods/VisilabsIOS/Sources/TargetingAction/InAppNotification/Views/VisilabsMiniNotificationViewController.xib
Pods/VisilabsIOS/Sources/TargetingAction/InAppNotification/Views/VisilabsFullNotificationViewController.xib
Pods/VisilabsIOS/Sources/TargetingAction/sideBar/sideBarView.xib

To enable rich notification capabilites like showing image or video;

Add Notification Service Extension target to your project and name it RelatedDigitalNotificationService. Change this service's target iOS version to 10.0. Then change newly added NotificationService.m file contents with the following: (Don't forget to enter your app name instead of APP_ALIAS)

Code Block

language	objective-c

#import "NotificationService.h"
#import "RelatedDigitalNotificationService.h"

@interface NotificationService ()

@property (nonatomic, strong) void (^contentHandler)(UNNotificationContent *contentToDeliver);
@property (nonatomic, strong) UNMutableNotificationContent *bestAttemptContent;

@end

@implementation NotificationService

- (void)didReceiveNotificationRequest:(UNNotificationRequest *)request withContentHandler:(void (^)(UNNotificationContent * _Nonnull))contentHandler {
    self.contentHandler = contentHandler;
    self.bestAttemptContent = [request.content mutableCopy];
    
  [RelatedDigitalNotificationService didReceiveNotificationRequest:@"APP_ALIAS" withBestAttemptContent:self.bestAttemptContent withContentHandler:self.contentHandler];
}

- (void)serviceExtensionTimeWillExpire {
    // Called just before the extension will be terminated by the system.
    // Use this as an opportunity to deliver your "best attempt" at modified content, otherwise the original push payload will be used.
  [RelatedDigitalNotificationService didReceiveNotificationRequest:@"APP_ALIAS" withBestAttemptContent:self.bestAttemptContent withContentHandler:self.contentHandler];
}

@end

Add below lines to your Podfile's root level.

Code Block

target 'RelatedDigitalNotificationService' do
  pod 'react-native-related-digital', :path => '../node_modules/react-native-related-digital'
  
  use_native_modules!
end

# Post Install processing for RelatedDigitalNotificationService causing errors
def notification_service_post_install(installer)
  installer.pods_project.targets.each do |target|
    target.build_configurations.each do |config|
      config.build_settings['APPLICATION_EXTENSION_API_ONLY'] = 'NO'
    end
  end
end

Modify Podfile and have the following in main target section.

Code Block
post_install do \|installer\| notification_service_post_install(installer) # Other post install function calls end

Add Empty.swift file to your RelatedDigitalNotificationService target as the sdk contains Swift code and xcode requires at least one empty swift file in each target.
Make sure your deployment target is ios 10.
Code Block
platform :ios, '10.0'
Execute pod install then run.

To enable push notification carousel;

Add Notification Content Extension target to your project and name it RelatedDigitalNotificationContent. Change this service's target iOS version to 11.0. Remove newly added files under RelatedDigitalNotificationContent except Info.plist. Then add EMNotificationViewController.swift file with the following content.

Code Block

language	swift

import UIKit
import UserNotifications
import UserNotificationsUI
import Euromsg

@objc(EMNotificationViewController)
class EMNotificationViewController: UIViewController, UNNotificationContentExtension {
    
    let carouselView = EMNotificationCarousel.initView()
    var completion: ((_ url: URL?, _ bestAttemptContent: UNMutableNotificationContent?) -> Void)?
    
    var notificationRequestIdentifier = ""
    
    func didReceive(_ notification: UNNotification) {
        notificationRequestIdentifier = notification.request.identifier
        Euromsg.configure(appAlias: "APP_ALIAS", launchOptions: nil, enableLog: true)
        carouselView.didReceive(notification)
    }
    func didReceive(_ response: UNNotificationResponse, completionHandler completion: @escaping (UNNotificationContentExtensionResponseOption) -> Void) {
        carouselView.didReceive(response, completionHandler: completion)

    }
    override func loadView() {
        completion = { [weak self] url, bestAttemptContent in
            if let identifier = self?.notificationRequestIdentifier {
                UNUserNotificationCenter.current().removeDeliveredNotifications(withIdentifiers: [identifier])
                UNUserNotificationCenter.current().getDeliveredNotifications(completionHandler: { notifications in
                    bestAttemptContent?.badge =  NSNumber(value: notifications.count)
                })
            }
            if let url = url {
                if #available(iOSApplicationExtension 12.0, *) {
                    self?.extensionContext?.dismissNotificationContentExtension()
                }
                self?.extensionContext?.open(url)
            } else {
                if #available(iOSApplicationExtension 12.0, *) {
                    self?.extensionContext?.performNotificationDefaultAction()
                }
            }
        }
        carouselView.completion = completion
        carouselView.delegate = self
        self.view = carouselView
    }
}

/**
 Add if you want to track which carousel element has been selected
 */
extension EMNotificationViewController: CarouselDelegate {
    
    func selectedItem(_ element: EMMessage.Element) {
        // Add your work...
        print("Selected element is => \(element)")
    }
    
}

Add or replace the following lines in newly added RelatedDigitalNotificationContent/Info.plist

Code Block

<key>NSExtension</key>
<dict>
  <key>NSExtensionAttributes</key>
  <dict>
    <key>UNNotificationExtensionUserInteractionEnabled</key>
    <true/>
    <key>UNNotificationExtensionDefaultContentHidden</key>
    <false/>
    <key>UNNotificationExtensionCategory</key>
    <string>carousel</string>
    <key>UNNotificationExtensionInitialContentSizeRatio</key>
    <real>1</real>
  </dict>
  <key>NSExtensionPrincipalClass</key>
  <string>RelatedDigitalNotificationContent.EMNotificationViewController</string>
  <key>NSExtensionPointIdentifier</key>
  <string>com.apple.usernotifications.content-extension</string>
</dict>

Add below lines to your Podfile's root level.

Code Block
target 'RelatedDigitalNotificationContent' do use_native_modules! pod 'Euromsg', '>= 2.0.0' end

In Xcode, select RelatedDigitalNotificationContent target and add below files to Build Phases->Copy Bundle Resources section. Select Create folder references when prompted.
Code Block
Pods/Euromsg/Sources/Euromsg/Classes/EMNotificationCarousel/CarouselCell.xib Pods/Euromsg/Sources/Euromsg/Classes/EMNotificationCarousel/EMNotificationCarousel.xib
Make sure your deployment target is ios 10.
Code Block
platform :ios, '10.0'
Execute pod install then run.

App Groups

Enable App Groups Capability for your targets. App Groups allow your app to execute code when a notification is recieved, even if your app is not active. This is required for Related Digital's analytics features and to store and access notification payloads of the last 30 days.

...

Versions Compared

Old Version 7

New Version Current

Key