1. Home
  2. /Developer
  3. /SDK Integrations
  4. /React Native
  5. /Live Activities for the React Native Module

Live Activities for the React Native Module

Integrate Live Activities into your React Native app to display real-time updates on the iOS Lock Screen and Dynamic Island. AXP

For information about Live Activities, including overview, use cases, and how to send Live Activities via the Push API, see iOS Live Activities.

App setup

Using the AirshipPluginExtender, make a call to LiveActivityManager.shared.setup to configure any Live Activities for the app. Call configurator.register for each Live Activity type that your application defines and include a block on how to parse the name of the activity that you will use to track on Airship. This name will be used to send updates through APNS.

import Foundation
import AirshipKit
import AirshipFrameworkProxy
import ActivityKit

// This class header is required to be automatically picked up by the Airship plugin:
@objc(AirshipPluginExtender)
public class AirshipPluginExtender: NSObject, AirshipPluginExtenderProtocol {
  
  public static func onAirshipReady() {
   
   if #available(iOS 16.1, *) {
      // Will throw if called more than once
      try? LiveActivityManager.shared.setup { configurator in

        // Call for each Live Activity type
        await configurator.register(forType: Activity<SportsActivityAttributes>.self) { attributes in
          // Track this property as the Airship name for updates
          attributes.gameID
        }
      }
    }

    // other setup

  }
}
 Important

If you are using Expo, you must copy-paste your exact ActivityAttributes struct into your AirshipPluginExtender.swift so the compiler can find a definition in order to register the Live Activity.

Starting Live Activities

For any Live Activities configured, you can start a new one using the start method:

Airship.iOS.liveActivityManager.start({
  attributesType: 'SportsActivityAttributes',
  content: {
    state: {
      status: 'Game Pending',
    },
    relevanceScore: 0.0,
  },
  attributes: {
    gameID: 'sports-game-123',
  },
});

Updating Live Activities

To update, use update, but you will need the activity ID.

const activities = await Airship.iOS.liveActivityManager.listAll();
const activity = activities.find(
  (activity) => activity.attributes.gameID === 'sports-game-123'
);
if (activity) {
  Airship.iOS.liveActivityManager.update({
    activityId: activity.id,
    content: {
      state: {
        status: "Game starting!"
      }
      relevanceScore: 0.0,
    },
  });
}

Ending Live Activities

To end is similar to update. Use end with the activity ID:

const activities = await Airship.iOS.liveActivityManager.listAll();
const activity = activities.find(
  (activity) => activity.attributes.gameID === 'sports-game-123'
);
if (activity) {
  Airship.iOS.liveActivityManager.end({
    activityId: activity.id,
    dismissalPolicy: {
        type: "default"
    }
  });
}