@devboldly/react-use-google-analytics-embed-api - npm Package Compare versions

Comparing version 0.0.13 to 0.0.14

dist/hooks/useGoogleAnalyticsEmbedApi.js

@@ -14,22 +14,31 @@ "use strict";
 var scriptRequestedKey = 'scriptRequested';
+var gapiAnalyticsReadyKey = 'gapiAnalyticsReady';
 exports.useGoogleAnalyticsEmbedApi = function () {
     var _a = React.useState(undefined), error = _a[0], setError = _a[1];
-    var _b = react_use_window_global_1.useWindowGlobal(globalNamespace, 'analyticsReady', false), readyLoading = _b[0], ready = _b[1], setReady = _b[2];
-    var _c = react_use_window_global_1.useWindowGlobal(globalNamespace, 'gapi', undefined), gapi = _c[1], setGapi = _c[2];
+    var _b = React.useState(false), hookReady = _b[0], setHookReady = _b[1];
+    var _c = React.useState(undefined), gapi = _c[0], setGapi = _c[1];
+    var _d = react_use_window_global_1.useWindowGlobal(globalNamespace, gapiAnalyticsReadyKey, false), scriptReadyLoading = _d[0], scriptReady = _d[1], setScriptReady = _d[2];
     React.useEffect(function () {
+        if (typeof window !== 'undefined' && !hookReady && !scriptReadyLoading && scriptReady) {
+            var win = window;
+            // If the api script is already loaded and ready, set the hook's ready state to true
+            // and grab the API from window.
+            setGapi(win.gapi);
+            setHookReady(true);
+        }
+    }, [scriptReadyLoading, scriptReady, hookReady]);
+    React.useEffect(function () {
+        var aborted = false;
         try {
-            if (typeof window !== 'undefined' && !readyLoading) {
+            // If the script isn't ready yet...
+            if (typeof window !== 'undefined' && !scriptReadyLoading && !scriptReady) {
                 var win_1 = window;
-                if (ready && typeof gapi === 'undefined') {
-                    // If it's already been loaded into window, set ready to true and set the api.
-                    // We only want to load once.
-                    setGapi(win_1.gapi);
-                }
-                else if (!win_1[globalNamespace][scriptRequestedKey]) {
-                    // This prevents the script from being loaded more than once.
+                // Only load the script once.
+                if (!win_1[globalNamespace][scriptRequestedKey]) {
+                    // We set this directly to prevent a rerender
                     win_1[globalNamespace][scriptRequestedKey] = true;
-                    // Call the code from Google to load the API globally.
+                    // Call the code from Google to load the API into window.
                     loadGoogleApi();
                     // At this point, gapi has been partially loaded into window.
-                    // We're still loading analytics. Google adds a notifier
+                    // We're still loading analytics. Google adds an emitter
                     // called ready() that will fire when it's fully loaded.
@@ -39,4 +48,8 @@ if (win_1.gapi && win_1.gapi.analytics && win_1.gapi.analytics.ready) {
                             // At this point, we can use the Analytics Embed API!
-                            setGapi(win_1.gapi);
-                            setReady(true);
+                            win_1[globalNamespace][gapiAnalyticsReadyKey] = true;
+                            if (!aborted) {
+                                setGapi(win_1.gapi);
+                                // Broadcast to all global value subscribers
+                                setScriptReady(true);
+                            }
                         });
@@ -53,4 +66,7 @@ }
         }
-    }, [setGapi, error, setReady, ready, gapi, readyLoading]);
-    return { ready: !!ready, gapi: gapi, error: error };
+        return function () {
+            aborted = true;
+        };
+    }, [scriptReadyLoading, scriptReady, setScriptReady]);
+    return { ready: hookReady, gapi: gapi, error: error };
 };
@@ -57,0 +73,0 @@ /**

package.json

 {
   "name": "@devboldly/react-use-google-analytics-embed-api",
-  "version": "0.0.13",
+  "version": "0.0.14",
   "author": "Dev Boldly <[e-mail]>",
@@ -30,3 +30,3 @@ "description": "React hook to async load the Google Analytics Embed API.",
   "dependencies": {
-    "@devboldly/react-use-window-global": "0.0.8"
+    "@devboldly/react-use-window-global": "0.0.9"
   },
@@ -33,0 +33,0 @@ "peerDependencies": {

No alert changes

Improved metrics

Total package byte prevSize

78877

increased by0.9%

Lines of code

1785

increased by0.9%

Dependency changes

• + Added@devboldly/react-use-window-global@0.0.9(transitive)

• - Removed@devboldly/react-use-window-global@0.0.8(transitive)

• Updated@devboldly/react-use-window-global@0.0.9