feat(GoogleAnalytics): Added gtag events for button clicks

techno-tim · Oct 9, 2021 · 962742c · 962742c
1 parent bece421
commit 962742c
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 0 deletions.
diff --git a/src/analytics/google.js b/src/analytics/google.js
@@ -0,0 +1,7 @@
+export function trackEvent(action, category, label, value) {
+  window.gtag('event', action, {
+    event_category: category,
+    event_label: label,
+    value: value,
+  });
+}
diff --git a/src/components/Button/Button.js b/src/components/Button/Button.js
@@ -1,16 +1,25 @@
 import React, { memo } from 'react';
 import { string } from 'prop-types';
+import { trackEvent } from '../../analytics/google';
+import { runtimeConfig } from '../../config';
 
 function Button(props) {
   const { name, href, displayName, logo } = props;
 
+  const handleClick = () => {
+    if (runtimeConfig?.GA_TRACKING_ID) {
+      trackEvent('click', 'social', name, 1);
+    }
+  };
+
   return (
     <>
       <a
         className={`button button-${name}`}
         href={href}
         target="_blank"
         rel="noopener noreferrer"
+        onClick={handleClick}
       >
         {logo && (
           <img className="icon" src={logo} alt={`${displayName} logo`} />
@@ -29,4 +38,5 @@ Button.propType = {
   srcSet: string,
   alt: string.isRequired,
   href: string,
+  name: string,
 };