From e93df49cf9e5783fbd7c974f6c4775b8c721412d Mon Sep 17 00:00:00 2001
From: Roshaan Siddiqui <siddiqui.roshaan@gmail.com>
Date: Thu, 13 Jul 2023 11:44:11 -0500
Subject: [PATCH 1/2] fix: wait for rudderstack to load before sending initial
 page event

---
 src/hooks/usePageAnalytics.ts | 12 +++++++++++-
 src/utils/rudder-analytics.ts |  2 ++
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/hooks/usePageAnalytics.ts b/src/hooks/usePageAnalytics.ts
index 612771b56..5eb01da20 100644
--- a/src/hooks/usePageAnalytics.ts
+++ b/src/hooks/usePageAnalytics.ts
@@ -8,6 +8,16 @@ export function usePageAnalytics() {
   const { asPath } = router;
   useEffect(() => {
     const justPath = asPath.split('?')[0];
-    recordPageView(justPath);
+    // wait for analytics library to initilize on initial page load before sending event
+    if (window.analyticsInitialized) {
+      recordPageView(justPath);
+    } else {
+      const checkInterval = setInterval(() => {
+        if (window.analyticsInitialized) {
+          recordPageView(justPath);
+          clearInterval(checkInterval);
+        }
+      }, 100);
+    }
   }, [asPath]);
 }
diff --git a/src/utils/rudder-analytics.ts b/src/utils/rudder-analytics.ts
index ff69c5fff..2e2436ea3 100644
--- a/src/utils/rudder-analytics.ts
+++ b/src/utils/rudder-analytics.ts
@@ -14,6 +14,7 @@ let anonymousUserIdCreatedAt = '';
 declare global {
   interface Window {
     rudderanalytics: Analytics | undefined;
+    analyticsInitialized: boolean;
   }
 }
 
@@ -62,6 +63,7 @@ export async function init() {
     window.rudderanalytics.load(rudderAnalyticsKey, analyticsUrl);
     rudderAnalytics = window.rudderanalytics;
     if (rudderAnalytics) rudderAnalytics.setAnonymousId(getAnonymousId());
+    window.analyticsInitialized = true;
   } catch (e) {
     console.error(e);
   }

From 0075fc231d0d24662b3137b76e1a604ebcf62448 Mon Sep 17 00:00:00 2001
From: Roshaan Siddiqui <siddiqui.roshaan@gmail.com>
Date: Thu, 13 Jul 2023 12:07:10 -0500
Subject: [PATCH 2/2] feat: simpler approach -> pending events queue

---
 src/hooks/usePageAnalytics.ts | 12 +-----------
 src/utils/rudder-analytics.ts | 14 +++++++++++---
 2 files changed, 12 insertions(+), 14 deletions(-)

diff --git a/src/hooks/usePageAnalytics.ts b/src/hooks/usePageAnalytics.ts
index 5eb01da20..612771b56 100644
--- a/src/hooks/usePageAnalytics.ts
+++ b/src/hooks/usePageAnalytics.ts
@@ -8,16 +8,6 @@ export function usePageAnalytics() {
   const { asPath } = router;
   useEffect(() => {
     const justPath = asPath.split('?')[0];
-    // wait for analytics library to initilize on initial page load before sending event
-    if (window.analyticsInitialized) {
-      recordPageView(justPath);
-    } else {
-      const checkInterval = setInterval(() => {
-        if (window.analyticsInitialized) {
-          recordPageView(justPath);
-          clearInterval(checkInterval);
-        }
-      }, 100);
-    }
+    recordPageView(justPath);
   }, [asPath]);
 }
diff --git a/src/utils/rudder-analytics.ts b/src/utils/rudder-analytics.ts
index 2e2436ea3..f7fcddeed 100644
--- a/src/utils/rudder-analytics.ts
+++ b/src/utils/rudder-analytics.ts
@@ -10,11 +10,11 @@ let rudderAnalytics: Analytics | null = null;
 let anonymousUserId = '';
 let hashId = '';
 let anonymousUserIdCreatedAt = '';
+let pendingEvents: any = [];
 
 declare global {
   interface Window {
     rudderanalytics: Analytics | undefined;
-    analyticsInitialized: boolean;
   }
 }
 
@@ -63,7 +63,10 @@ export async function init() {
     window.rudderanalytics.load(rudderAnalyticsKey, analyticsUrl);
     rudderAnalytics = window.rudderanalytics;
     if (rudderAnalytics) rudderAnalytics.setAnonymousId(getAnonymousId());
-    window.analyticsInitialized = true;
+    for (const event of pendingEvents) {
+      event();
+    }
+    pendingEvents = []; 
   } catch (e) {
     console.error(e);
   }
@@ -80,7 +83,12 @@ function filterURL(url: string) {
 }
 
 export function recordPageView(pageName: string) {
-  if (!rudderAnalytics) return;
+  if (!rudderAnalytics) {
+    pendingEvents.push(() => {
+      recordPageView(pageName)
+    })
+    return;
+  }
   try {
     rudderAnalytics.page('category', pageName, {
       hashId: localStorage.getItem('hashId'),