added title to pageview / fixed duplicates (#917)

* 👾 added title to pageview / fixed duplicates * 👾 added pss tracking in component update
dpla · Jul 23, 2018 · e9e421a · e9e421a
1 parent 1127581
commit e9e421a
Show file tree

Hide file tree

Showing 7 changed files with 29 additions and 12 deletions.
diff --git a/components/ExhibitionsComponents/Exhibition/Details/index.js b/components/ExhibitionsComponents/Exhibition/Details/index.js
@@ -15,7 +15,6 @@ class Details extends React.Component {
   // Google Analytics tracking for exhibit home view event
   componentDidMount() {
     this.trackEvent();
-    Router.onRouteChangeComplete = url => this.trackEvent();
   }
 
   trackEvent() {

diff --git a/components/ItemComponents/Content/index.js b/components/ItemComponents/Content/index.js
@@ -16,7 +16,6 @@ class Content extends React.Component {
   componentDidMount() {
     this.trackItemView();
     this.bindClickThroughEvent();
-    Router.onRouteChangeComplete = url => this.trackItemView();
   }
 
   trackItemView() {

diff --git a/components/MainLayout/components/MinimalLayout/index.js b/components/MainLayout/components/MinimalLayout/index.js
@@ -8,7 +8,7 @@ import SkipToContent from "shared/SkipToContent";
 import PageHeader from "../PageHeader";
 
 import * as gtag from "lib/gtag";
-import { getFullPath } from "lib";
+import { getFullPath, getCurrentFullUrl } from "lib";
 
 import { SITE_ENV } from "constants/env";
 
@@ -21,9 +21,14 @@ class MinimalLayout extends React.Component {
 
   trackPageview() {
     const fullPath = getFullPath();
+    const fullUrl = getCurrentFullUrl();
 
     if (fullPath !== this.lastTrackedPath) {
-      gtag.pageview(fullPath);
+      gtag.pageview({
+        path: fullPath,
+        url: fullUrl,
+        title: this.props.pageTitle
+      });
       this.lastTrackedPath = fullPath;
     }
   }

diff --git a/components/MainLayout/index.js b/components/MainLayout/index.js
@@ -1,7 +1,7 @@
 import React from "react";
 import Router from "next/router";
-
 import Helmet from "react-helmet";
+
 import DPLAHead from "components/DPLAHead";
 import SkipToContent from "shared/SkipToContent";
 import SmallScreenHeader from "./components/SmallScreenHeader";
@@ -10,22 +10,26 @@ import PageHeader from "./components/PageHeader";
 import Footer from "./components/Footer";
 
 import * as gtag from "lib/gtag";
-import { getFullPath } from "lib";
+import { getFullPath, getCurrentFullUrl } from "lib";
 
 import { SITE_ENV } from "constants/env";
 
 class MainLayout extends React.Component {
   // Google Analytics tracking for MainLayout-using pages
   componentDidMount() {
-    this.trackPageview();
     Router.onRouteChangeComplete = url => this.trackPageview();
   }
 
   trackPageview() {
     const fullPath = getFullPath();
+    const fullUrl = getCurrentFullUrl();
 
     if (fullPath !== this.lastTrackedPath) {
-      gtag.pageview(fullPath);
+      gtag.pageview({
+        path: fullPath,
+        url: fullUrl,
+        title: this.props.pageTitle
+      });
       this.lastTrackedPath = fullPath;
     }
   }

diff --git a/components/PrimarySourceSetsComponents/Source/components/ContentAndMetadata/index.js b/components/PrimarySourceSetsComponents/Source/components/ContentAndMetadata/index.js
@@ -89,7 +89,10 @@ class ContentAndMetadata extends React.Component {
     // now collapse it
     this.setState({ isOpen: false });
     this.trackSourceView();
-    Router.onRouteChangeComplete = url => this.trackSourceView();
+  }
+
+  componentDidUpdate() {
+    this.trackSourceView();
   }
 
   componentWillReceiveProps() {

diff --git a/lib/gtag.js b/lib/gtag.js
@@ -1,9 +1,11 @@
 import { gaTrackingId } from "constants/env";
 
 // https://developers.google.com/analytics/devguides/collection/gtagjs/pages
-export const pageview = url => {
+export const pageview = ({ url, path, title }) => {
   window.gtag("config", gaTrackingId, {
-    page_location: url
+    page_location: url,
+    page_path: path,
+    page_title: title
   });
 };
 

diff --git a/pages/exhibitions/exhibition/section/subsection.js b/pages/exhibitions/exhibition/section/subsection.js
@@ -37,9 +37,14 @@ class Subsection extends React.Component {
 
   trackPageview() {
     const fullPath = getFullPath();
+    const fullUrl = getCurrentFullUrl();
 
     if (fullPath !== this.lastTrackedPath) {
-      gtag.pageview(fullPath);
+      gtag.pageview({
+        path: fullPath,
+        url: fullUrl,
+        title: this.props.section.title
+      });
       this.lastTrackedPath = fullPath;
     }
   }