Configure Push Notifications

This covers the initial setup required to enable push notifications for your application using Firebase and configuring platform-specific settings for iOS and Android.

Follow these steps to get started with push notifications:

1. Register your application on Firebase. To register, refer to this guide.
2. Download the google-services.json file for Android and the GoogleService-Info.plist file for iOS from your Firebase project. Do not make any code changes suggested by Firebase at this stage.

Configuring push notifications for Android

Follow these steps to configure push notifications for your Android project:

1. Add the google-services.json file you downloaded from Firebase to the android/app folder in your project.
2. Add the Google services plugin to your project's settings file.
   1. If your app uses android/settings.gradle.kts (Kotlin), add the following plugin:
      Kotlin

      plugins {
          // ... other plugins
          id("com.google.gms.google-services") version "4.4.2" apply false
      }
      

   2. If your app uses android/settings.gradle (Groovy), add the following plugin block:
      Groovy

      plugins {
          // ... other plugins
          id 'com.google.gms.google-services' version '4.4.2' apply false
      }
      

3. Apply the Google services plugin in your app-level build file.
   1. If your app uses android/settings.gradle.kts (Kotlin), add the following plugin:
      Kotlin

      plugins {
          // ... other plugins
          id("com.google.gms.google-services")
      }
      

   2. If your app uses android/settings.gradle (Groovy), add the following plugin block:
      Groovy

      plugins {
          // ... other plugins
          id 'com.google.gms.google-services'
      }
      

4. Add a colors.xml resource file in the android/app/src/main/res/values folder if one does not already exist. Add the following color resource within the <resources> tag:
   XML

   <color name="hydra_notification_color">#FF03DAC5</color>
   

5. Add a small icon file named hydra_notification_small_icon to the android/app/src/main/res/drawable folder. This icon is used in the notification drawer. The file can be in XML, PNG, or JPG format.

Configuring push notifications for iOS

Follow these steps to configure push notifications for your iOS project:

1. Add the GoogleService-Info.plist file you downloaded from Firebase to your iOS project using Xcode.
2. Ensure you have added the Push Notification capability for your app identifier on the Apple Developer website.
3. In your Xcode project settings for your application target, add the following capabilities under Signing & Capabilities:
   • Push Notification
   • Background Modes, with Background fetch and Remote notifications enabled.

     📘

     Note

     It is mandatory to set up rich notifications for push notifications to function correctly on iOS. Refer to the instructions under Configure rich notifications for iOS for detailed steps.

Configuring rich notifications for iOS

Follow these steps to configure rich push notifications for your iOS project.

1. Go to your project settings in Xcode and add a new target and select Notification Service Extension from the available templates. This adds a Notification Service Extension to your project.

   

2. When configuring the new target, Xcode will append the ProductName of your main target to its bundle identifier to create the bundle identifier for this extension. You must add this extension bundle identifier on the Apple Developer website.

3. Add the App Groups capability in Signing & Capabilities for both your main application target and the new extension target. You will need to create and add a group in both targets. The group name must follow the format group.<runner_target_bundle_id>.hydra, where <runner_target_bundle_id> is replaced with the actual bundle identifier of your main application target. This App group also needs to be added on the Apple Developer website for both app identifiers.

4. In your ios/Podfile, add extension_pods within the target block for your new extension target, as shown here:

   Ruby

   target "HydraRichNotification" do
       use_frameworks!
   
       extension_pods # Add this line
   end
   

5. Install the pods again by opening your terminal, changing the current working directory to your project's ios folder, and running the command:

   Shell

   pod install
   

📘

Note

If Swift Package Manager is enabled for your project, skip steps 4 and 5 and proceed to step 6.

7. Replace the entire code content in your NotificationService.swift file with the following code:

   Swift

   import UserNotifications
   import HydraPushNotificationServiceExtension
   
   class NotificationService: UNNotificationServiceExtension {
       let service:HydraRemoteNotificationService = .init()
   
       override func didReceive(_ request: UNNotificationRequest, withContentHandler contentHandler: @escaping (UNNotificationContent) -> Void) {
           service.didReceive(request, withContentHandler: contentHandler)
       }
   
       override func serviceExtensionTimeWillExpire() {
           service.serviceExtensionTimeWillExpire()
       }
   }