App Open Ads

App open ads appear when users bring your app to the foreground, providing a monetization opportunity during app launches.

Each ad format uses a Zone ID to identify the ad placement. Zone IDs are configured in the Empower dashboard.

Note: All ad status listeners are optional. The SDK handles ad loading and display automatically. Use listeners only if you need to track ad states for analytics, UI updates, or custom logic.

---

Quick Start

import {
  loadAppOpenAd,
  showAppOpen,
  addEventListener,
  EmpowerAdsEvents,
  AdStatus,
} from '@empower-nokta/react-native-mobile-ads';
const ZONE_ID = { android: 'ANDROID_ZONE_ID', ios: 'IOS_ZONE_ID' };
// Preload the app open ad
loadAppOpenAd(ZONE_ID);
// Show when ad is ready
const unsubscribe = addEventListener(
  EmpowerAdsEvents.APP_OPEN_STATUS,
  (event) => {
    if (event.status === AdStatus.READY) {
      showAppOpen(ZONE_ID);
    }
  }
);

---

Loading App Open Ads

import { loadAppOpenAd } from '@empower-nokta/react-native-mobile-ads';
// With a single zone ID
loadAppOpenAd('YOUR_ZONE_ID');
// With per-platform zone IDs
loadAppOpenAd({ android: 'ANDROID_ZONE_ID', ios: 'IOS_ZONE_ID' });

The function returns a Promise<boolean> that resolves to true when the ad starts loading.

---

Showing App Open Ads

import { showAppOpen } from '@empower-nokta/react-native-mobile-ads';
showAppOpen('YOUR_ZONE_ID')
  .then((shown) => {
    if (!shown) {
      console.log('App Open ad not ready');
    }
  })
  .catch((err) => {
    console.log('Failed to show App Open ad:', err);
  });

---

Listening to App Open Status (Optional)

import {
  addEventListener,
  EmpowerAdsEvents,
  AdStatus,
  loadAppOpenAd,
} from '@empower-nokta/react-native-mobile-ads';
const ZONE_ID = 'YOUR_ZONE_ID';
const unsubscribe = addEventListener(
  EmpowerAdsEvents.APP_OPEN_STATUS,
  (event) => {
    switch (event.status) {
      case AdStatus.READY:
        // Ad is ready to show
        break;
      case AdStatus.FAILED:
        // Ad failed to load
        break;
      case AdStatus.SHOWN:
        // Ad is being displayed
        break;
      case AdStatus.SKIPPED:
        // User dismissed the ad
        break;
      case AdStatus.USED:
        // Ad was shown and closed — reload for next time
        loadAppOpenAd(ZONE_ID);
        break;
    }
  }
);
// Clean up
unsubscribe();

---

Complete Example

Show the app open ad on cold start only (once per session):

import React, { useEffect } from 'react';
import { Platform } from 'react-native';
import {
  init,
  loadAppOpenAd,
  showAppOpen,
  addEventListener,
  EmpowerAdsEvents,
  AdStatus,
} from '@empower-nokta/react-native-mobile-ads';
const ZONE_ID = { android: 'ANDROID_ZONE_ID', ios: 'IOS_ZONE_ID' };
// Module-level flag to prevent showing more than once
let appOpenShown = false;
export default function App() {
  useEffect(() => {
    const appId = Platform.select({
      android: 'your_android_app_identifier',
      ios: 'your_ios_app_identifier',
    });
    init({ appAdIdentifier: appId });
    // Preload
    loadAppOpenAd(ZONE_ID);
    // Show once when ready
    const unsubscribe = addEventListener(
      EmpowerAdsEvents.APP_OPEN_STATUS,
      (event) => {
        if (event.status === AdStatus.READY && !appOpenShown) {
          appOpenShown = true;
          showAppOpen(ZONE_ID);
        }
      }
    );
    return () => unsubscribe();
  }, []);
  return (
    // Your app content
  );
}

Show on Foreground Return

To show the ad when users return to the app (similar to native ProcessLifecycleOwner on Android or SceneDelegate on iOS), use React Native's AppState:

import React, { useEffect, useRef } from 'react';
import { AppState } from 'react-native';
import {
  loadAppOpenAd,
  showAppOpen,
  addEventListener,
  EmpowerAdsEvents,
  AdStatus,
} from '@empower-nokta/react-native-mobile-ads';
const ZONE_ID = 'YOUR_ZONE_ID';
const MIN_BACKGROUND_SECONDS = 30;
export default function AppOpenHandler() {
  const appState = useRef(AppState.currentState);
  const backgroundTime = useRef(null);
  const isAdReady = useRef(false);
  useEffect(() => {
    // Preload
    loadAppOpenAd(ZONE_ID);
    // Track readiness
    const unsubStatus = addEventListener(
      EmpowerAdsEvents.APP_OPEN_STATUS,
      (event) => {
        isAdReady.current = event.status === AdStatus.READY;
        if (event.status === AdStatus.USED) {
          loadAppOpenAd(ZONE_ID); // Reload for next time
        }
      }
    );
    // Listen for foreground return
    const subscription = AppState.addEventListener('change', (nextState) => {
      if (appState.current === 'active' && nextState.match(/inactive|background/)) {
        backgroundTime.current = Date.now();
      }
      if (appState.current.match(/inactive|background/) && nextState === 'active') {
        const elapsed = (Date.now() - (backgroundTime.current || 0)) / 1000;
        if (elapsed >= MIN_BACKGROUND_SECONDS && isAdReady.current) {
          showAppOpen(ZONE_ID);
        }
      }
      appState.current = nextState;
    });
    return () => {
      unsubStatus();
      subscription.remove();
    };
  }, []);
  return null; // Render nothing — this is a logic-only component
}

---

Best Practices

• Cold starts — Show on fresh app launches for highest impact
• Don't show on every return — Only show after meaningful background time (30+ seconds)
• Respect user experience — Don't interrupt critical user flows (checkout, onboarding, etc.)
• Always preload — Call loadAppOpenAd after showing to prepare for next time
• Don't block app launch — Let content load first on cold start
• Once per session — Consider using a module-level flag to limit to one display per cold start

---

Ad Status Reference

Status	Description
INITIALIZING	Ad is loading
READY	Ad is loaded and ready to display
FAILED	Ad failed to load
SHOWN	Ad is being displayed
SKIPPED	User dismissed the ad
USED	Ad was shown and closed