Fix #8396 Multiple webanalytics events send per single page load (#8402)

* Fix Multiple webanalytics events send per single page load #8396

* Add comments

* Do not throw error for collect API

openmetadata-ui/src/main/resources/ui/src/router/AppRouter.tsx

@@ -102,9 +102,17 @@ const AppRouter = () => {
     ) : null;
 
   useEffect(() => {
-    // track page view on route change
+    const { pathname } = location;
-    analytics.page();
+
-  }, [location]);
+    /**
+     * Ignore the slash path because we are treating my data as
+     * default path.
+     */
+    if (pathname !== '/') {
+      // track page view on route change
+      analytics.page();
+    }
+  }, [location.pathname]);
 
   return loading ? (
     <Loader />

openmetadata-ui/src/main/resources/ui/src/utils/WebAnalyticsUtils.ts

@@ -12,7 +12,6 @@
  */
 
 import Analytics, { AnalyticsInstance } from 'analytics';
-import { AxiosError } from 'axios';
 import { postPageView } from '../axiosAPIs/WebAnalyticsAPI';
 import { WebPageData } from '../components/WebAnalytics/WebAnalytics.interface';
 import { PageViewEvent } from '../generated/analytics/pageViewEvent';
@@ -20,7 +19,6 @@ import {
   WebAnalyticEventData,
   WebAnalyticEventType,
 } from '../generated/analytics/webAnalyticEventData';
-import { showErrorToast } from './ToastUtils';
 
 /**
  * Check if url is valid or not and return the pathname
@@ -64,10 +62,7 @@ export const trackPageView = async (pageData: WebPageData, userId: string) => {
   const { payload } = pageData;
 
   const { location, navigator, performance, document } = window;
-  const { hostname, pathname } = location;
+  const { hostname } = location;
-
-  // store the current path reference
-  let currentPathRef = pathname;
 
   const pageLoadTime = getPageLoadTime(performance);
 
@@ -75,43 +70,33 @@ export const trackPageView = async (pageData: WebPageData, userId: string) => {
 
   const referrer = properties.referrer ?? document.referrer;
 
-  const previousPathRef = getReferrerPath(referrer);
-
   // timestamp for the current event
   const timestamp = meta.ts;
 
   if (userId) {
-    /**
+    const pageViewEvent: PageViewEvent = {
-     *  Check if the previous path and current path is not matching
+      fullUrl: properties.url,
-     *  then only collect the data
+      url: properties.path,
-     */
+      hostname,
-    if (currentPathRef !== previousPathRef) {
+      language: navigator.language,
-      currentPathRef = previousPathRef;
+      screenSize: `${properties.width}x${properties.height}`,
+      userId,
+      sessionId: anonymousId,
+      referrer,
+      pageLoadTime,
+    };
 
-      const pageViewEvent: PageViewEvent = {
+    const webAnalyticEventData: WebAnalyticEventData = {
-        fullUrl: properties.url,
+      eventType: WebAnalyticEventType.PageView,
-        url: properties.path,
+      eventData: pageViewEvent,
-        hostname,
+      timestamp,
-        language: navigator.language,
+    };
-        screenSize: `${properties.width}x${properties.height}`,
-        userId,
-        sessionId: anonymousId,
-        referrer,
-        pageLoadTime,
-      };
 
-      const webAnalyticEventData: WebAnalyticEventData = {
+    try {
-        eventType: WebAnalyticEventType.PageView,
+      // collect the page event
-        eventData: pageViewEvent,
+      await postPageView(webAnalyticEventData);
-        timestamp,
+    } catch (_error) {
-      };
+      // handle page view error
-
-      try {
-        // collect the page event
-        await postPageView(webAnalyticEventData);
-      } catch (error) {
-        showErrorToast(error as AxiosError);
-      }
     }
   }
 };