react-native-daro 1.0.15 → 1.0.16

package/src/InterstitialAd.ts

@@ -1,9 +1,9 @@
-import { NativeModules } from 'react-native';
 import {
   addEventListener,
   removeEventListener,
   AdEventEmitter,
 } from './EventEmitter';
+import NativeDaroModule from './NativeDaroModule';
 import type {
   AdDisplayFailedInfo,
   AdInfo,
@@ -11,8 +11,6 @@ import type {
 } from './types/AdInfo';
 import { AdEventType, type AdEventPayloadMap } from './types/AdEvent';
 
-const { DaroMModule } = NativeModules;
-
 const {
   ON_INTERSTITIAL_LOADED_EVENT,
   ON_INTERSTITIAL_LOAD_FAILED_EVENT,
@@ -21,7 +19,7 @@ const {
   ON_INTERSTITIAL_AD_FAILED_TO_DISPLAY_EVENT,
   ON_INTERSTITIAL_HIDDEN_EVENT,
   ON_INTERSTITIAL_AD_IMPRESSION_RECORDED,
-} = DaroMModule.getConstants();
+} = NativeDaroModule.getConstants();
 
 const NATIVE_EVENT_BY_TYPE: Record<AdEventType, string> = {
   [AdEventType.LOADED]: ON_INTERSTITIAL_LOADED_EVENT,
@@ -51,15 +49,15 @@ export class InterstitialAd {
   }
 
   isAdReady(): Promise<boolean> {
-    return DaroMModule.isInterstitialReady(this.requestId, this.adUnitId);
+    return NativeDaroModule.isInterstitialReady(this.requestId, this.adUnitId);
   }
 
   load(): void {
-    DaroMModule.loadInterstitial(this.requestId, this.adUnitId);
+    NativeDaroModule.loadInterstitial(this.requestId, this.adUnitId);
   }
 
   show(): void {
-    DaroMModule.showInterstitial(this.requestId, this.adUnitId);
+    NativeDaroModule.showInterstitial(this.requestId, this.adUnitId);
   }
 
   addAdEventListener<T extends AdEventType>(
@@ -109,19 +107,19 @@ export class InterstitialAd {
   /** @deprecated `InterstitialAd.createForAdRequest(adUnitId)` 인스턴스의 `isAdReady()`를 사용하세요. */
   static isAdReady(adUnitId: string): Promise<boolean> {
     const requestId = InterstitialAd._getLegacyRequestId(adUnitId);
-    return DaroMModule.isInterstitialReady(requestId, adUnitId);
+    return NativeDaroModule.isInterstitialReady(requestId, adUnitId);
   }
 
   /** @deprecated `InterstitialAd.createForAdRequest(adUnitId)` 인스턴스의 `load()`를 사용하세요. */
   static loadAd(adUnitId: string): void {
     const requestId = InterstitialAd._getLegacyRequestId(adUnitId);
-    DaroMModule.loadInterstitial(requestId, adUnitId);
+    NativeDaroModule.loadInterstitial(requestId, adUnitId);
   }
 
   /** @deprecated `InterstitialAd.createForAdRequest(adUnitId)` 인스턴스의 `show()`를 사용하세요. */
   static showAd(adUnitId: string): void {
     const requestId = InterstitialAd._getLegacyRequestId(adUnitId);
-    DaroMModule.showInterstitial(requestId, adUnitId);
+    NativeDaroModule.showInterstitial(requestId, adUnitId);
   }
 
   /** @deprecated `addAdEventListener(AdEventType.LOADED, ...)`를 인스턴스에서 사용하세요. */

package/src/LightPopupAd.ts

@@ -1,9 +1,10 @@
-import { NativeModules, processColor, type ColorValue } from 'react-native';
+import { processColor, type ColorValue } from 'react-native';
 import {
   addEventListener,
   removeEventListener,
   AdEventEmitter,
 } from './EventEmitter';
+import NativeDaroModule from './NativeDaroModule';
 import type {
   AdDisplayFailedInfo,
   AdInfo,
@@ -12,8 +13,6 @@ import type {
 import type { LightPopupAdConfiguration } from './types/LightPopupAd';
 import { AdEventType, type AdEventPayloadMap } from './types/AdEvent';
 
-const { DaroMModule } = NativeModules;
-
 const {
   ON_LIGHTPOPUP_LOADED_EVENT,
   ON_LIGHTPOPUP_LOAD_FAILED_EVENT,
@@ -22,7 +21,7 @@ const {
   ON_LIGHTPOPUP_AD_FAILED_TO_DISPLAY_EVENT,
   ON_LIGHTPOPUP_HIDDEN_EVENT,
   ON_LIGHTPOPUP_AD_IMPRESSION_RECORDED,
-} = DaroMModule.getConstants();
+} = NativeDaroModule.getConstants();
 
 const NATIVE_EVENT_BY_TYPE: Record<AdEventType, string> = {
   [AdEventType.LOADED]: ON_LIGHTPOPUP_LOADED_EVENT,
@@ -103,19 +102,19 @@ export class LightPopupAd {
   }
 
   isAdReady(): Promise<boolean> {
-    return DaroMModule.isLightPopupReady(this.requestId, this.adUnitId);
+    return NativeDaroModule.isLightPopupReady(this.requestId, this.adUnitId);
   }
 
   load(): void {
-    DaroMModule.loadLightPopup(this.requestId, this.adUnitId);
+    NativeDaroModule.loadLightPopup(this.requestId, this.adUnitId);
   }
 
   show(): void {
-    DaroMModule.showLightPopup(this.requestId, this.adUnitId);
+    NativeDaroModule.showLightPopup(this.requestId, this.adUnitId);
   }
 
   setConfiguration(configuration: LightPopupAdConfiguration): void {
-    DaroMModule.setLightPopupAdConfiguration(
+    NativeDaroModule.setLightPopupAdConfiguration(
       this.requestId,
       this.adUnitId,
       normalizeConfiguration(configuration)
@@ -167,19 +166,19 @@ export class LightPopupAd {
   /** @deprecated `LightPopupAd.createForAdRequest(adUnitId)` 인스턴스의 `isAdReady()`를 사용하세요. */
   static isAdReady(adUnitId: string): Promise<boolean> {
     const requestId = LightPopupAd._getLegacyRequestId(adUnitId);
-    return DaroMModule.isLightPopupReady(requestId, adUnitId);
+    return NativeDaroModule.isLightPopupReady(requestId, adUnitId);
   }
 
   /** @deprecated `LightPopupAd.createForAdRequest(adUnitId)` 인스턴스의 `load()`를 사용하세요. */
   static loadAd(adUnitId: string): void {
     const requestId = LightPopupAd._getLegacyRequestId(adUnitId);
-    DaroMModule.loadLightPopup(requestId, adUnitId);
+    NativeDaroModule.loadLightPopup(requestId, adUnitId);
   }
 
   /** @deprecated `LightPopupAd.createForAdRequest(adUnitId)` 인스턴스의 `show()`를 사용하세요. */
   static showAd(adUnitId: string): void {
     const requestId = LightPopupAd._getLegacyRequestId(adUnitId);
-    DaroMModule.showLightPopup(requestId, adUnitId);
+    NativeDaroModule.showLightPopup(requestId, adUnitId);
   }
 
   /** @deprecated 인스턴스의 `setConfiguration()`을 사용하세요. */
@@ -188,7 +187,7 @@ export class LightPopupAd {
     configuration: LightPopupAdConfiguration
   ): void {
     const requestId = LightPopupAd._getLegacyRequestId(adUnitId);
-    DaroMModule.setLightPopupAdConfiguration(
+    NativeDaroModule.setLightPopupAdConfiguration(
       requestId,
       adUnitId,
       normalizeConfiguration(configuration)

package/src/NativeDaroModule.ts

@@ -0,0 +1,91 @@
+import type { TurboModule } from 'react-native';
+import { TurboModuleRegistry } from 'react-native';
+import type {
+  Double,
+  UnsafeObject,
+} from 'react-native/Libraries/Types/CodegenTypes';
+
+export type DaroModuleConstants = {
+  ON_INTERSTITIAL_LOADED_EVENT: string;
+  ON_INTERSTITIAL_LOAD_FAILED_EVENT: string;
+  ON_INTERSTITIAL_CLICKED_EVENT: string;
+  ON_INTERSTITIAL_DISPLAYED_EVENT: string;
+  ON_INTERSTITIAL_AD_FAILED_TO_DISPLAY_EVENT: string;
+  ON_INTERSTITIAL_HIDDEN_EVENT: string;
+  ON_INTERSTITIAL_AD_IMPRESSION_RECORDED: string;
+
+  ON_REWARDED_AD_LOADED_EVENT: string;
+  ON_REWARDED_AD_LOAD_FAILED_EVENT: string;
+  ON_REWARDED_AD_CLICKED_EVENT: string;
+  ON_REWARDED_AD_DISPLAYED_EVENT: string;
+  ON_REWARDED_AD_FAILED_TO_DISPLAY_EVENT: string;
+  ON_REWARDED_AD_HIDDEN_EVENT: string;
+  ON_REWARDED_AD_RECEIVED_REWARD_EVENT: string;
+  ON_REWARDED_AD_IMPRESSION_RECORDED: string;
+
+  ON_APPOPEN_AD_LOADED_EVENT: string;
+  ON_APPOPEN_AD_LOAD_FAILED_EVENT: string;
+  ON_APPOPEN_AD_CLICKED_EVENT: string;
+  ON_APPOPEN_AD_DISPLAYED_EVENT: string;
+  ON_APPOPEN_AD_FAILED_TO_DISPLAY_EVENT: string;
+  ON_APPOPEN_AD_HIDDEN_EVENT: string;
+  ON_APPOPEN_AD_IMPRESSION_RECORDED: string;
+
+  ON_LIGHTPOPUP_LOADED_EVENT: string;
+  ON_LIGHTPOPUP_LOAD_FAILED_EVENT: string;
+  ON_LIGHTPOPUP_CLICKED_EVENT: string;
+  ON_LIGHTPOPUP_DISPLAYED_EVENT: string;
+  ON_LIGHTPOPUP_AD_FAILED_TO_DISPLAY_EVENT: string;
+  ON_LIGHTPOPUP_HIDDEN_EVENT: string;
+  ON_LIGHTPOPUP_AD_IMPRESSION_RECORDED: string;
+
+  BANNER_AD_FORMAT_LABEL: string;
+  MREC_AD_FORMAT_LABEL: string;
+  UNKNOWN_AD_FORMAT_LABEL?: string;
+};
+
+export interface Spec extends TurboModule {
+  getConstants: () => DaroModuleConstants;
+  addListener: (eventName: string) => void;
+  removeListeners: (count: number) => void;
+
+  isInitialized: () => Promise<boolean>;
+  initializeSdk: () => Promise<void>;
+  setUserId: (userId: string) => Promise<void>;
+  showMediationDebugger: () => Promise<void>;
+
+  isInterstitialReady: (
+    requestId: Double,
+    adUnitId: string
+  ) => Promise<boolean>;
+  loadInterstitial: (requestId: Double, adUnitId: string) => Promise<void>;
+  showInterstitial: (requestId: Double, adUnitId: string) => Promise<void>;
+
+  isRewardedAdReady: (requestId: Double, adUnitId: string) => Promise<boolean>;
+  loadRewardedAd: (requestId: Double, adUnitId: string) => Promise<void>;
+  showRewardedAd: (
+    requestId: Double,
+    adUnitId: string,
+    customData?: string | null
+  ) => Promise<void>;
+
+  isAppOpenAdReady: (requestId: Double, adUnitId: string) => Promise<boolean>;
+  loadAppOpenAd: (requestId: Double, adUnitId: string) => Promise<void>;
+  showAppOpenAd: (
+    requestId: Double,
+    adUnitId: string,
+    placement?: string | null,
+    customData?: string | null
+  ) => Promise<void>;
+
+  isLightPopupReady: (requestId: Double, adUnitId: string) => Promise<boolean>;
+  loadLightPopup: (requestId: Double, adUnitId: string) => Promise<void>;
+  showLightPopup: (requestId: Double, adUnitId: string) => Promise<void>;
+  setLightPopupAdConfiguration: (
+    requestId: Double,
+    adUnitId: string,
+    configuration: UnsafeObject
+  ) => Promise<void>;
+}
+
+export default TurboModuleRegistry.getEnforcing<Spec>('DaroMModule');

package/src/RewardedAd.ts

@@ -1,9 +1,9 @@
-import { NativeModules } from 'react-native';
 import {
   addEventListener,
   removeEventListener,
   AdEventEmitter,
 } from './EventEmitter';
+import NativeDaroModule from './NativeDaroModule';
 import type {
   AdDisplayFailedInfo,
   AdInfo,
@@ -16,8 +16,6 @@ import {
   type RewardedAdEventPayloadMap,
 } from './types/AdEvent';
 
-const { DaroMModule } = NativeModules;
-
 const {
   ON_REWARDED_AD_LOADED_EVENT,
   ON_REWARDED_AD_LOAD_FAILED_EVENT,
@@ -27,7 +25,7 @@ const {
   ON_REWARDED_AD_HIDDEN_EVENT,
   ON_REWARDED_AD_RECEIVED_REWARD_EVENT,
   ON_REWARDED_AD_IMPRESSION_RECORDED,
-} = DaroMModule.getConstants();
+} = NativeDaroModule.getConstants();
 
 const NATIVE_EVENT_BY_TYPE: Record<AdEventType | RewardedAdEventType, string> =
   {
@@ -59,15 +57,15 @@ export class RewardedAd {
   }
 
   isAdReady(): Promise<boolean> {
-    return DaroMModule.isRewardedAdReady(this.requestId, this.adUnitId);
+    return NativeDaroModule.isRewardedAdReady(this.requestId, this.adUnitId);
   }
 
   load(): void {
-    DaroMModule.loadRewardedAd(this.requestId, this.adUnitId);
+    NativeDaroModule.loadRewardedAd(this.requestId, this.adUnitId);
   }
 
   show(customData?: string | null): void {
-    DaroMModule.showRewardedAd(
+    NativeDaroModule.showRewardedAd(
       this.requestId,
       this.adUnitId,
       customData ?? null
@@ -119,19 +117,19 @@ export class RewardedAd {
   /** @deprecated `RewardedAd.createForAdRequest(adUnitId)` 인스턴스의 `isAdReady()`를 사용하세요. */
   static isAdReady(adUnitId: string): Promise<boolean> {
     const requestId = RewardedAd._getLegacyRequestId(adUnitId);
-    return DaroMModule.isRewardedAdReady(requestId, adUnitId);
+    return NativeDaroModule.isRewardedAdReady(requestId, adUnitId);
   }
 
   /** @deprecated `RewardedAd.createForAdRequest(adUnitId)` 인스턴스의 `load()`를 사용하세요. */
   static loadAd(adUnitId: string): void {
     const requestId = RewardedAd._getLegacyRequestId(adUnitId);
-    DaroMModule.loadRewardedAd(requestId, adUnitId);
+    NativeDaroModule.loadRewardedAd(requestId, adUnitId);
   }
 
   /** @deprecated `RewardedAd.createForAdRequest(adUnitId)` 인스턴스의 `show()`를 사용하세요. */
   static showAd(adUnitId: string, customData?: string | null): void {
     const requestId = RewardedAd._getLegacyRequestId(adUnitId);
-    DaroMModule.showRewardedAd(requestId, adUnitId, customData ?? null);
+    NativeDaroModule.showRewardedAd(requestId, adUnitId, customData ?? null);
   }
 
   /** @deprecated `addAdEventListener(AdEventType.LOADED, ...)`를 인스턴스에서 사용하세요. */

package/src/codegen-env.d.ts

@@ -0,0 +1,45 @@
+declare module 'react-native/Libraries/Types/CodegenTypes' {
+  import type { NativeSyntheticEvent } from 'react-native';
+
+  export type DirectEventHandler<
+    T,
+    PaperName extends string | never = never,
+  > = [PaperName] extends [never]
+    ? (event: NativeSyntheticEvent<T>) => void | Promise<void>
+    : (event: NativeSyntheticEvent<T>) => void | Promise<void>;
+  export type Int32 = number;
+  export type Double = number;
+  export type UnsafeObject = object;
+  export type UnsafeMixed = unknown;
+  export type WithDefault<Type, Value> = Type | (Value & never);
+}
+
+declare module 'react-native/Libraries/Utilities/codegenNativeCommands' {
+  export interface Options<T extends string> {
+    readonly supportedCommands: ReadonlyArray<T>;
+  }
+
+  function codegenNativeCommands<T extends object>(
+    options: Options<keyof T extends string ? keyof T : never>
+  ): T;
+
+  export default codegenNativeCommands;
+}
+
+declare module 'react-native/Libraries/Utilities/codegenNativeComponent' {
+  import type { HostComponent } from 'react-native';
+
+  export interface Options {
+    readonly interfaceOnly?: boolean | undefined;
+    readonly paperComponentName?: string | undefined;
+    readonly paperComponentNameDeprecated?: string | undefined;
+    readonly excludedPlatforms?: ReadonlyArray<'iOS' | 'android'> | undefined;
+  }
+
+  function codegenNativeComponent<Props extends object>(
+    componentName: string,
+    options?: Options
+  ): HostComponent<Props>;
+
+  export default codegenNativeComponent;
+}

package/src/hooks/useInterstitialAd.ts

@@ -0,0 +1,117 @@
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { InterstitialAd } from '../InterstitialAd';
+import { AdEventType } from '../types/AdEvent';
+import type {
+  AdDisplayFailedInfo,
+  AdInfo,
+  AdLoadFailedInfo,
+} from '../types/AdInfo';
+
+export type UseInterstitialAdOptions = {
+  onLoaded?: (adInfo: AdInfo) => void;
+  onLoadFailed?: (error: AdLoadFailedInfo) => void;
+  onClicked?: (adInfo: AdInfo) => void;
+  onDisplayed?: (adInfo: AdInfo) => void;
+  onFailedToDisplay?: (error: AdDisplayFailedInfo) => void;
+  onHidden?: (adInfo: AdInfo) => void;
+  onImpressionRecorded?: (adInfo: AdInfo) => void;
+};
+
+export type UseInterstitialAdResult = {
+  isLoaded: boolean;
+  isLoading: boolean;
+  load: () => void;
+  show: () => void;
+  isAdReady: () => Promise<boolean>;
+};
+
+export function useInterstitialAd(
+  adUnitId: string | null,
+  options: UseInterstitialAdOptions = {}
+): UseInterstitialAdResult {
+  const adRef = useRef<InterstitialAd | null>(null);
+  const optionsRef = useRef(options);
+  optionsRef.current = options;
+  const [state, setState] = useState({
+    isLoaded: false,
+    isLoading: false,
+  });
+
+  const load = useCallback(() => {
+    if (!adUnitId) {
+      return;
+    }
+
+    const ad = adRef.current;
+    if (!ad) {
+      return;
+    }
+
+    setState({ isLoaded: false, isLoading: true });
+    ad.load();
+  }, [adUnitId]);
+
+  const show = useCallback(() => {
+    adRef.current?.show();
+  }, []);
+
+  const isAdReady = useCallback(async () => {
+    const isLoaded = (await adRef.current?.isAdReady()) ?? false;
+    setState((prevState) => ({ ...prevState, isLoaded }));
+    return isLoaded;
+  }, []);
+
+  useEffect(() => {
+    adRef.current?.removeAllListeners();
+    adRef.current = null;
+    setState({ isLoaded: false, isLoading: false });
+
+    if (!adUnitId) {
+      return;
+    }
+
+    const ad = InterstitialAd.createForAdRequest(adUnitId);
+    adRef.current = ad;
+
+    ad.addAdEventListener(AdEventType.LOADED, (info) => {
+      setState({ isLoaded: true, isLoading: false });
+      optionsRef.current.onLoaded?.(info);
+    });
+    ad.addAdEventListener(AdEventType.LOAD_FAILED, (error) => {
+      setState({ isLoaded: false, isLoading: false });
+      optionsRef.current.onLoadFailed?.(error);
+    });
+    ad.addAdEventListener(AdEventType.DISPLAYED, (info) => {
+      setState((prevState) => ({ ...prevState, isLoaded: false }));
+      optionsRef.current.onDisplayed?.(info);
+    });
+    ad.addAdEventListener(AdEventType.FAILED_TO_DISPLAY, (error) => {
+      setState({ isLoaded: false, isLoading: false });
+      optionsRef.current.onFailedToDisplay?.(error);
+    });
+    ad.addAdEventListener(AdEventType.HIDDEN, (info) => {
+      setState((prevState) => ({ ...prevState, isLoaded: false }));
+      optionsRef.current.onHidden?.(info);
+    });
+    ad.addAdEventListener(AdEventType.CLICKED, (info) => {
+      optionsRef.current.onClicked?.(info);
+    });
+    ad.addAdEventListener(AdEventType.IMPRESSION_RECORDED, (info) => {
+      optionsRef.current.onImpressionRecorded?.(info);
+    });
+
+    return () => {
+      ad.removeAllListeners();
+      if (adRef.current === ad) {
+        adRef.current = null;
+      }
+    };
+  }, [adUnitId]);
+
+  return {
+    ...state,
+    load,
+    show,
+    isAdReady,
+  };
+}

package/src/hooks/useLightPopupAd.ts

@@ -0,0 +1,132 @@
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { LightPopupAd } from '../LightPopupAd';
+import { AdEventType } from '../types/AdEvent';
+import type {
+  AdDisplayFailedInfo,
+  AdInfo,
+  AdLoadFailedInfo,
+} from '../types/AdInfo';
+import type { LightPopupAdConfiguration } from '../types/LightPopupAd';
+
+export type UseLightPopupAdOptions = {
+  onLoaded?: (adInfo: AdInfo) => void;
+  onLoadFailed?: (error: AdLoadFailedInfo) => void;
+  onClicked?: (adInfo: AdInfo) => void;
+  onDisplayed?: (adInfo: AdInfo) => void;
+  onFailedToDisplay?: (error: AdDisplayFailedInfo) => void;
+  onHidden?: (adInfo: AdInfo) => void;
+  onImpressionRecorded?: (adInfo: AdInfo) => void;
+};
+
+export type UseLightPopupAdLoadOptions = {
+  configuration?: LightPopupAdConfiguration;
+};
+
+export type UseLightPopupAdResult = {
+  isLoaded: boolean;
+  isLoading: boolean;
+  load: (options?: UseLightPopupAdLoadOptions) => void;
+  show: () => void;
+  isAdReady: () => Promise<boolean>;
+};
+
+export function useLightPopupAd(
+  adUnitId: string | null,
+  options: UseLightPopupAdOptions = {}
+): UseLightPopupAdResult {
+  const adRef = useRef<LightPopupAd | null>(null);
+  const optionsRef = useRef(options);
+  optionsRef.current = options;
+  const [state, setState] = useState({
+    isLoaded: false,
+    isLoading: false,
+  });
+
+  const createAd = useCallback(() => {
+    if (!adUnitId) {
+      return null;
+    }
+
+    adRef.current?.removeAllListeners();
+
+    const ad = LightPopupAd.createForAdRequest(adUnitId);
+    adRef.current = ad;
+
+    ad.addAdEventListener(AdEventType.LOADED, (info) => {
+      setState({ isLoaded: true, isLoading: false });
+      optionsRef.current.onLoaded?.(info);
+    });
+    ad.addAdEventListener(AdEventType.LOAD_FAILED, (error) => {
+      setState({ isLoaded: false, isLoading: false });
+      optionsRef.current.onLoadFailed?.(error);
+    });
+    ad.addAdEventListener(AdEventType.DISPLAYED, (info) => {
+      setState((prevState) => ({ ...prevState, isLoaded: false }));
+      optionsRef.current.onDisplayed?.(info);
+    });
+    ad.addAdEventListener(AdEventType.FAILED_TO_DISPLAY, (error) => {
+      setState({ isLoaded: false, isLoading: false });
+      optionsRef.current.onFailedToDisplay?.(error);
+    });
+    ad.addAdEventListener(AdEventType.HIDDEN, (info) => {
+      setState((prevState) => ({ ...prevState, isLoaded: false }));
+      optionsRef.current.onHidden?.(info);
+    });
+    ad.addAdEventListener(AdEventType.CLICKED, (info) => {
+      optionsRef.current.onClicked?.(info);
+    });
+    ad.addAdEventListener(AdEventType.IMPRESSION_RECORDED, (info) => {
+      optionsRef.current.onImpressionRecorded?.(info);
+    });
+
+    return ad;
+  }, [adUnitId]);
+
+  const load = useCallback(
+    (loadOptions?: UseLightPopupAdLoadOptions) => {
+      const ad = createAd();
+      if (!ad) {
+        return;
+      }
+
+      setState({ isLoaded: false, isLoading: true });
+
+      if (loadOptions?.configuration) {
+        ad.setConfiguration(loadOptions.configuration);
+      }
+
+      ad.load();
+    },
+    [createAd]
+  );
+
+  const show = useCallback(() => {
+    adRef.current?.show();
+  }, []);
+
+  const isAdReady = useCallback(async () => {
+    const isLoaded = (await adRef.current?.isAdReady()) ?? false;
+    setState((prevState) => ({ ...prevState, isLoaded }));
+    return isLoaded;
+  }, []);
+
+  useEffect(() => {
+    adRef.current?.removeAllListeners();
+    adRef.current = null;
+    setState({ isLoaded: false, isLoading: false });
+  }, [adUnitId]);
+
+  useEffect(() => {
+    return () => {
+      adRef.current?.removeAllListeners();
+      adRef.current = null;
+    };
+  }, []);
+
+  return {
+    ...state,
+    load,
+    show,
+    isAdReady,
+  };
+}