@folklore/ads 0.0.61 → 0.0.63

package/dist/cjs.js

@@ -209,6 +209,7 @@ class AdSlot extends EventEmitter__default["default"] {
     this.displayed = false;
     this.renderEvent = null;
     this.destroyed = true;
+    this.emit('destroy', this);
   }
   getElementId() {
     return this.elementId;
@@ -286,6 +287,7 @@ class AdsManager extends EventEmitter__default["default"] {
   //     return newId;
   // }
 
+  static ID_PREFIX = 'div-gpt-ad-';
   static getArticleTargeting(article) {
     if (article === null) {
       return null;
@@ -359,7 +361,7 @@ class AdsManager extends EventEmitter__default["default"] {
     // const newId = `div-gpt-ad-${new Date().getTime()}-${Math.round(
     //     Math.random() * (Math.random() * 1000),
     // )}-${this.index}`;
-    const newId = `div-gpt-ad-${this.index}`;
+    const newId = `${AdsManager.ID_PREFIX}${this.index}`;
     this.index += 1;
     return newId;
   }
@@ -576,6 +578,7 @@ class AdsManager extends EventEmitter__default["default"] {
         googletag.destroySlots([adSlot]);
       });
     }
+    this.emit('destroy:slot', slot);
   }
   refreshSlot(id) {
     const {
@@ -854,6 +857,7 @@ function useAd(path, size) {
     refreshInterval = null,
     alwaysRender = false,
     onRender = null,
+    onDestroy = null,
     disabled = false,
     disableTracking = false,
     rootMargin = '300px'
@@ -988,6 +992,20 @@ function useAd(path, size) {
     return () => slot.off('render', onSlotRender);
   }, [slot, disabled, setRenderEvent, onRender, track]);
 
+  // Listen to destroy event
+  React.useEffect(() => {
+    if (slot === null) {
+      return () => {};
+    }
+    const onSlotDestroy = destroySlot => {
+      if (onDestroy !== null) {
+        onDestroy(destroySlot);
+      }
+    };
+    slot.on('destroy', onSlotDestroy);
+    return () => slot.off('destroy', onSlotDestroy);
+  }, [slot, onDestroy]);
+
   // Destroy slot
   // useEffect(
   //     () => () => {
@@ -1031,6 +1049,7 @@ const propTypes = {
   emptyClassName: PropTypes__default["default"].string,
   adClassName: PropTypes__default["default"].string,
   onRender: PropTypes__default["default"].func,
+  onDestroy: PropTypes__default["default"].func,
   slotRef: PropTypes__default["default"].oneOfType([PropTypes__default["default"].func, PropTypes__default["default"].object])
 };
 const defaultProps = {
@@ -1049,6 +1068,7 @@ const defaultProps = {
   emptyClassName: null,
   adClassName: null,
   onRender: null,
+  onDestroy: null,
   slotRef: null
 };
 function Ad(_ref) {
@@ -1069,6 +1089,7 @@ function Ad(_ref) {
     emptyClassName,
     adClassName,
     onRender,
+    onDestroy,
     slotRef
   } = _ref;
   const {
@@ -1162,6 +1183,7 @@ function Ad(_ref) {
     refreshInterval: finalAdTargeting.refreshInterval,
     alwaysRender,
     onRender: onAdRender,
+    onDestroy,
     disabled: finalDisabled,
     disableTracking
   });

package/dist/es.js

@@ -191,6 +191,7 @@ class AdSlot extends EventEmitter {
     this.displayed = false;
     this.renderEvent = null;
     this.destroyed = true;
+    this.emit('destroy', this);
   }
   getElementId() {
     return this.elementId;
@@ -268,6 +269,7 @@ class AdsManager extends EventEmitter {
   //     return newId;
   // }
 
+  static ID_PREFIX = 'div-gpt-ad-';
   static getArticleTargeting(article) {
     if (article === null) {
       return null;
@@ -341,7 +343,7 @@ class AdsManager extends EventEmitter {
     // const newId = `div-gpt-ad-${new Date().getTime()}-${Math.round(
     //     Math.random() * (Math.random() * 1000),
     // )}-${this.index}`;
-    const newId = `div-gpt-ad-${this.index}`;
+    const newId = `${AdsManager.ID_PREFIX}${this.index}`;
     this.index += 1;
     return newId;
   }
@@ -558,6 +560,7 @@ class AdsManager extends EventEmitter {
         googletag.destroySlots([adSlot]);
       });
     }
+    this.emit('destroy:slot', slot);
   }
   refreshSlot(id) {
     const {
@@ -836,6 +839,7 @@ function useAd(path, size) {
     refreshInterval = null,
     alwaysRender = false,
     onRender = null,
+    onDestroy = null,
     disabled = false,
     disableTracking = false,
     rootMargin = '300px'
@@ -970,6 +974,20 @@ function useAd(path, size) {
     return () => slot.off('render', onSlotRender);
   }, [slot, disabled, setRenderEvent, onRender, track]);
 
+  // Listen to destroy event
+  useEffect(() => {
+    if (slot === null) {
+      return () => {};
+    }
+    const onSlotDestroy = destroySlot => {
+      if (onDestroy !== null) {
+        onDestroy(destroySlot);
+      }
+    };
+    slot.on('destroy', onSlotDestroy);
+    return () => slot.off('destroy', onSlotDestroy);
+  }, [slot, onDestroy]);
+
   // Destroy slot
   // useEffect(
   //     () => () => {
@@ -1013,6 +1031,7 @@ const propTypes = {
   emptyClassName: PropTypes.string,
   adClassName: PropTypes.string,
   onRender: PropTypes.func,
+  onDestroy: PropTypes.func,
   slotRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
 };
 const defaultProps = {
@@ -1031,6 +1050,7 @@ const defaultProps = {
   emptyClassName: null,
   adClassName: null,
   onRender: null,
+  onDestroy: null,
   slotRef: null
 };
 function Ad(_ref) {
@@ -1051,6 +1071,7 @@ function Ad(_ref) {
     emptyClassName,
     adClassName,
     onRender,
+    onDestroy,
     slotRef
   } = _ref;
   const {
@@ -1144,6 +1165,7 @@ function Ad(_ref) {
     refreshInterval: finalAdTargeting.refreshInterval,
     alwaysRender,
     onRender: onAdRender,
+    onDestroy,
     disabled: finalDisabled,
     disableTracking
   });

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@folklore/ads",
-    "version": "0.0.61",
+    "version": "0.0.63",
     "description": "Ads library",
     "keywords": [
         "javascript",
@@ -50,7 +50,7 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "eec9d8318fc17f4a40396ee05e15bb93a48c40cc",
+    "gitHead": "5758c6b7d203e04862d82991e990b9f806485da3",
     "dependencies": {
         "@folklore/hooks": "^0.0.58",
         "@folklore/tracking": "^0.0.23",