react-native-applovin-max 3.2.2 → 3.3.1

package/src/AppLovinMAXAdView.js

@@ -1,63 +1,71 @@
-import { requireNativeComponent, UIManager, findNodeHandle } from "react-native";
+import { NativeModules, requireNativeComponent, UIManager, findNodeHandle, View, Text, StyleSheet } from "react-native";
 import PropTypes from "prop-types";
 import React from "react";
-import AppLovinMAX from "./index.js";
-
-class AdView extends React.Component {
-
-  static defaultProps = {
-    adaptiveBannerEnabled: true
-  }
-
-  componentDidMount() {
-    this.setAdUnitId(this.props.adUnitId);
-    this.setAdFormat(this.props.adFormat);
-    this.setPlacement(this.props.placement);
-    this.setCustomData(this.props.customData);
-    this.setAdaptiveBannerEnabled(this.props.adaptiveBannerEnabled);
-  }
-
-  componentDidUpdate(prevProps) {
-    // Only call setters for actual changes.
-    if (prevProps.adUnitId !== this.props.adUnitId) {
-      this.setAdUnitId(this.props.adUnitId);
-    }
-
-    if (prevProps.adFormat !== this.props.adFormat) {
-      this.setAdFormat(this.props.adFormat);
-    }
 
-    if (prevProps.placement !== this.props.placement) {
-      this.setPlacement(this.props.placement);
-    }
-
-    if (prevProps.customData !== this.props.customData) {
-      this.setCustomData(this.props.customData);
-    }
+const { AppLovinMAX } = NativeModules;
 
-    if (prevProps.adaptiveBannerEnabled !== this.props.adaptiveBannerEnabled) {
-      this.setAdaptiveBannerEnabled(this.props.adaptiveBannerEnabled);
-    }
-  }
-
-  render() {
-    let { style, ...otherProps } = this.props;
-
-    return <AppLovinMAXAdView
-      // This merges the pub-specified style with ours, but overwrites width/height.
-    style = { Object.assign({}, style, this.sizeForAdFormat(otherProps.adFormat)) } {...otherProps }
-    />;
-  }
-
-  // Helper Functions
+export const AdFormat = {
+  BANNER: "banner",
+  MREC: "mrec",
+};
 
-  sizeForAdFormat(adFormat) {
-    if (adFormat === AppLovinMAX.AdFormat.BANNER) {
+export const AdViewPosition = {
+  TOP_CENTER: "top_center",
+  TOP_LEFT: "top_left",
+  TOP_RIGHT: "top_right",
+  CENTERED: "centered",
+  CENTER_LEFT: "center_left",
+  CENTER_RIGHT: "center_right",
+  BOTTOM_LEFT: "bottom_left",
+  BOTTOM_CENTER: "bottom_center",
+  BOTTOM_RIGHT: "bottom_right",
+};
 
-      var width = AppLovinMAX.isTablet() ? 728 : 320;
-      var height;
+/**
+ * Returns AdView when AppLovinMax has been initialized or returns a black empty View as 
+ * a placeholder of AdView when AppLovinMax has not been initialized.  
+ *
+ * The purpose of this AdView wrapper is for the application not to access AdView 
+ * before the completion of the AppLovinMax initialization. 
+ *
+ * Note: this does not re-render itself when the status of the AppLovinMax initialization
+ * has changed so that the black view may stay even after the completion of 
+ * the AppLovinMax initialization.
+ */
+const AdViewWrapper = (props) => {
+  const {style, ...rest} = props;
+  return (
+    AppLovinMAX.isInitialized() ?
+      <AdView {...style} {...rest}/>
+    :
+      <View style={[styles.container, style]} {...rest}>
+        {
+          console.warn('[AppLovinSdk] [AppLovinMAX] <AdView/> has been mounted before AppLovin initialization')
+        } 
+      </View>
+  );
+};
 
-      if (this.props.adaptiveBannerEnabled) {
+const styles = StyleSheet.create({
+  container: {
+    flexDirection: 'column',
+    justifyContent: 'flex-end',
+    alignItems: 'center',
+    backgroundColor: 'black',
+    borderColor: 'whitesmoke',
+    borderWidth: 1,
+  },
+});
+
+const AdView = (props) => {
+  const {style, ...otherProps} = props;
+
+  const sizeForAdFormat = () => {
+    if (props.adFormat === AdFormat.BANNER) {
+      let width = AppLovinMAX.isTablet() ? 728 : 320;
+      let height;
+
+      if (props.adaptiveBannerEnabled) {
         height = AppLovinMAX.getAdaptiveBannerHeightForWidth(-1);
       } else {
         height = AppLovinMAX.isTablet() ? 90 : 50;
@@ -67,70 +75,15 @@ class AdView extends React.Component {
     } else {
       return { width: 300, height: 250 }
     }
-  }
-
-  setAdUnitId(adUnitId) {
-    UIManager.dispatchViewManagerCommand(
-      findNodeHandle(this),
-      Platform.OS === 'android' ? "setAdUnitId" : UIManager.getViewManagerConfig("AppLovinMAXAdView").Commands.setAdUnitId,
-      [adUnitId]
-    );
-  }
-
-  setAdFormat(adFormatStr) {
-    UIManager.dispatchViewManagerCommand(
-      findNodeHandle(this),
-      Platform.OS === 'android' ? "setAdFormat" : UIManager.getViewManagerConfig("AppLovinMAXAdView").Commands.setAdFormat,
-      [adFormatStr]
-    );
-  }
-
-  setPlacement(placement) {
-    var adUnitId = this.props.adUnitId;
-    var adFormat = this.props.adFormat;
-
-    // If the ad unit id or ad format are unset, we can't set the placement.
-    if (adUnitId == null || adFormat == null) return;
-
-    UIManager.dispatchViewManagerCommand(
-        findNodeHandle(this),
-        Platform.OS === 'android' ? "setPlacement" : UIManager.getViewManagerConfig("AppLovinMAXAdView").Commands.setPlacement,
-        [placement]
-    );
-  }
-
-  setCustomData(customData) {
-    var adUnitId = this.props.adUnitId;
-    var adFormat = this.props.adFormat;
-
-    // If the ad unit id or ad format are unset, we can't set the customData.
-    if (adUnitId == null || adFormat == null) return;
-
-    UIManager.dispatchViewManagerCommand(
-        findNodeHandle(this),
-        Platform.OS === 'android' ? "setCustomData" : UIManager.getViewManagerConfig("AppLovinMAXAdView").Commands.setCustomData,
-        [customData]
-    );
-  }
-
-  setAdaptiveBannerEnabled(enabled) {
-    var adUnitId = this.props.adUnitId;
-    var adFormat = this.props.adFormat;
-
-    // If the ad unit id or ad format are unset, we can't set the value
-    if (adUnitId == null || adFormat == null) return;
-
-    if (adFormat === AppLovinMAX.AdFormat.BANNER) {
-      if (enabled === true || enabled === false) {
-        UIManager.dispatchViewManagerCommand(
-            findNodeHandle(this),
-            Platform.OS === 'android' ? "setAdaptiveBannerEnabled" : UIManager.getViewManagerConfig("AppLovinMAXAdView").Commands.setAdaptiveBannerEnabled,
-            [enabled ? "true" : "false"]
-        );
-      }
-    }
-  }
-}
+  };
+
+  return (
+    <AppLovinMAXAdView
+      style={[sizeForAdFormat(), style]}
+      {...otherProps }
+    />
+  );
+};
 
 AdView.propTypes = {
   /**
@@ -157,9 +110,21 @@ AdView.propTypes = {
    * A boolean value representing whether or not to enable adaptive banners. Note that adaptive banners are enabled by default as of v2.3.0.
    */
   adaptiveBannerEnabled: PropTypes.bool,
+
+  /**
+   * A boolean value representing whether or not to enable auto-refresh. Note that auto-refresh is enabled by default.
+   */
+  autoRefresh: PropTypes.bool,
 };
 
+// Defiens default values for the props.
+AdView.defaultProps = {
+  adaptiveBannerEnabled: true,
+  autoRefresh: true,
+};
+
+
 // requireNativeComponent automatically resolves 'AppLovinMAXAdView' to 'AppLovinMAXAdViewManager'
-var AppLovinMAXAdView = requireNativeComponent("AppLovinMAXAdView", AdView);
+const AppLovinMAXAdView = requireNativeComponent("AppLovinMAXAdView", AdView);
 
-export default AdView;
+export default AdViewWrapper;

package/src/TargetingData.js

@@ -1,4 +1,6 @@
-import AppLovinMAX from "./index.js";
+import { NativeModules } from "react-native";
+
+const { AppLovinMAX } = NativeModules;
 
 const AdContentRating = {
   None:               0,

package/src/index.js

@@ -1,11 +1,10 @@
 import { NativeModules, NativeEventEmitter } from "react-native";
-import AdView from "./AppLovinMAXAdView";
+import AdView, { AdFormat, AdViewPosition } from "./AppLovinMAXAdView";
 import { TargetingData as targetingData, AdContentRating, UserGender } from "./TargetingData";
-import { UserSegment as userSegment } from "./UserSegment";
 
 const { AppLovinMAX } = NativeModules;
 
-const VERSION = "3.2.2";
+const VERSION = "3.3.1";
 
 /**
  * This enum represents whether or not the consent dialog should be shown for this user.
@@ -28,25 +27,6 @@ const ConsentDialogState = {
   DOES_NOT_APPLY: 2,
 };
 
-const AdFormat = {
-  BANNER: "banner",
-  MREC: "mrec",
-};
-
-const AdViewPosition = {
-  TOP_CENTER: "top_center",
-  TOP_LEFT: "top_left",
-  TOP_RIGHT: "top_right",
-  CENTERED: "centered",
-  CENTER_LEFT: "center_left",
-  CENTER_RIGHT: "center_right",
-  BOTTOM_LEFT: "bottom_left",
-  BOTTOM_CENTER: "bottom_center",
-  BOTTOM_RIGHT: "bottom_right",
-};
-
-// const AdView = AppLovinMAXAdView;
-
 const emitter = new NativeEventEmitter(AppLovinMAX);
 const subscriptions = {};
 
@@ -104,7 +84,6 @@ const showRewardedAd = (adUnitId, ...args) => {
 export default {
   ...AppLovinMAX,
   AdView,
-  userSegment,
   targetingData,
   AdContentRating,
   UserGender,

package/src/UserSegment.js

@@ -1,12 +0,0 @@
-import AppLovinMAX from "./index.js";
-
-let UserSegment = {
-
-  set name(value) {
-    AppLovinMAX.setUserSegment(value);
-  },
-};
-
-export {
-  UserSegment,
-};