Merge pull request #1418 from thematters/fix/firebase

fix(tracking): overwrite default `page_referrer`
thematters · Aug 10, 2020 · 2565e37 · 2565e37
2 parents 8b82c0a + 7077d1a
commit 2565e37
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 5 deletions.
diff --git a/src/common/utils/analytics.ts b/src/common/utils/analytics.ts
@@ -18,7 +18,7 @@ export const analytics = {
 
 type EventArgs =
   | [] // identify user
-  | ['page_view'] // pageview
+  | ['page_view', PageViewProp] // pageview
   | ['pull_to_refresh']
   | ['click_feed', ClickFeedProp]
   | ['click_button', ClickButtonProp]
@@ -28,6 +28,10 @@ type EventArgs =
   | ['view_add_credit_dialog', ViewDialogProp]
   | ['view_donation_dialog', ViewDialogProp]
 
+interface PageViewProp {
+  page_referrer: string
+}
+
 type ClickFeedProp =
   | ArticleFeedProp
   | CommentFeedProp

diff --git a/src/components/Analytics/PageViewTracker/index.tsx b/src/components/Analytics/PageViewTracker/index.tsx
@@ -1,12 +1,13 @@
 import Router from 'next/router'
-import { useContext, useEffect } from 'react'
+import { useContext, useEffect, useRef } from 'react'
 
 import { ViewerContext } from '~/components'
 
 import { analytics } from '~/common/utils'
 
 const PageViewTracker = () => {
   const viewer = useContext(ViewerContext)
+  const referrer = useRef('')
 
   // first load
   useEffect(() => {
@@ -16,6 +17,7 @@ const PageViewTracker = () => {
 
     analytics.identifyUser()
     analytics.trackPage()
+    referrer.current = window.location.pathname
   }, [viewer.privateFetched])
 
   // subsequent changes
@@ -25,7 +27,8 @@ const PageViewTracker = () => {
         return
       }
 
-      analytics.trackPage()
+      analytics.trackPage('page_view', { page_referrer: referrer.current })
+      referrer.current = window.location.pathname
     }
 
     Router.events.on('routeChangeComplete', trackPage)

diff --git a/src/components/Analytics/index.ts b/src/components/Analytics/index.ts
@@ -1,4 +1,5 @@
 import gql from 'graphql-tag'
+import _get from 'lodash/get'
 
 import { ANALYTIC_TYPES, ANALYTICS, GA_TRACKING_ID } from '~/common/enums'
 import { deferTry } from '~/common/utils'
@@ -37,11 +38,16 @@ const handleAnalytics = ({
     // GA & firebase tracking
     if (type === ANALYTIC_TYPES.PAGE) {
       const path = window.location.pathname
+      const referrer = _get(args[1], 'page_referrer')
+
       window.gtag('config', GA_TRACKING_ID, {
         page_location: path,
+        page_referrer: referrer,
       })
 
-      window.firebaseAnalytics.logEvent('page_view')
+      window.firebaseAnalytics.logEvent('page_view', {
+        page_referrer: referrer,
+      })
     } else {
       window.firebaseAnalytics.logEvent(args[0], args[1])
     }

diff --git a/src/components/Layout/SideNav/index.tsx b/src/components/Layout/SideNav/index.tsx
@@ -106,7 +106,7 @@ const SideNav = () => {
             placement="right-start"
             appendTo={process.browser ? document.body : undefined}
             offset={[-24, 24]}
-            zIndex={Z_INDEX.OVER_GLOBAL_HEADER}
+            zIndex={Z_INDEX.OVER_STICKY_TABS}
             onShown={hidePopperOnClick}
           >
             <NavListItem