From f0467aa15bdbab099048b895ffb7739457b4c82c Mon Sep 17 00:00:00 2001
From: Mohd Zishan <72738005+Zishan-7@users.noreply.github.com>
Date: Wed, 9 Oct 2024 10:07:09 +0530
Subject: [PATCH] Add matomo event tracking (#214)

---
 index.html                  |  7 +++---
 src/onboarding/Register.jsx |  6 +++++
 src/shared/Footer.jsx       | 44 ++++++++++++++++++++++++++++++++-----
 3 files changed, 47 insertions(+), 10 deletions(-)

diff --git a/index.html b/index.html
index 9ee79f8e..6afa726d 100644
--- a/index.html
+++ b/index.html
@@ -81,19 +81,18 @@
     <script src="/src/main.jsx" type="module"></script>
     <script type="text/javascript">
       var _paq = (window._paq = window._paq || []);
-      _paq.push(['disableCookies']);
+      _paq.push(['setDocumentTitle', document.domain + '/' + document.title]);
       _paq.push(['trackPageView']);
       _paq.push(['enableLinkTracking']);
       (function () {
-        var u = '//nethermind.matomo.cloud/';
+        var u = 'https://nethermind.matomo.cloud/';
         _paq.push(['setTrackerUrl', u + 'matomo.php']);
         _paq.push(['setSiteId', '4']);
         var d = document,
           g = d.createElement('script'),
           s = d.getElementsByTagName('script')[0];
-        g.type = 'text/javascript';
         g.async = true;
-        g.src = u + 'matomo.js';
+        g.src = 'https://cdn.matomo.cloud/nethermind.matomo.cloud/matomo.js';
         s.parentNode.insertBefore(g, s);
       })();
     </script>
diff --git a/src/onboarding/Register.jsx b/src/onboarding/Register.jsx
index 87df9dd7..10f232b4 100644
--- a/src/onboarding/Register.jsx
+++ b/src/onboarding/Register.jsx
@@ -26,6 +26,12 @@ export default function Register() {
   const navigate = useNavigate();
 
   const handleSignUp = async data => {
+    window._paq.push([
+      'trackEvent',
+      'Sign Up',
+      'Sign Up button clicked',
+      data.email
+    ]);
     if (!isClerkLoaded) return;
 
     try {
diff --git a/src/shared/Footer.jsx b/src/shared/Footer.jsx
index b437d629..d212c531 100644
--- a/src/shared/Footer.jsx
+++ b/src/shared/Footer.jsx
@@ -18,7 +18,14 @@ export default function Footer() {
         <ul className="flex flex-col gap-2 md:flex-row md:gap-8">
           {mainLinks.map((item, i) => (
             <li className="flex h-6 items-center" key={`footer-main-${i}`}>
-              <Link className="text-xs text-foreground-2" href={item.href}>
+              <Link
+                className="text-xs text-foreground-2"
+                href={item.href}
+                onPress={() =>
+                  item.matomoEventData &&
+                  window._paq.push(['trackEvent', ...item.matomoEventData])
+                }
+              >
                 {item.title}
                 <span className="material-symbols-outlined hidden lg:inline">
                   arrow_right_alt
@@ -33,6 +40,10 @@ export default function Footer() {
               <Link
                 className={`${item.className} text-xs text-foreground-2`}
                 href={item.href}
+                onPress={() =>
+                  item.matomoEventData &&
+                  window._paq.push(['trackEvent', ...item.matomoEventData])
+                }
               >
                 <span className="icon"></span>
                 {item.title}
@@ -57,11 +68,21 @@ export default function Footer() {
 const mainLinks = [
   {
     title: 'Audit smart contract',
-    href: 'https://www.nethermind.io/smart-contract-audits'
+    href: 'https://www.nethermind.io/smart-contract-audits',
+    matomoEventData: [
+      'Contact',
+      'Audit smart contract',
+      'https://www.nethermind.io/smart-contract-audits'
+    ]
   },
   {
     title: 'Nethermind operator',
-    href: 'https://app.eigenlayer.xyz/operator/0x110af279aaffb0d182697d7fc87653838aa5945e'
+    href: 'https://app.eigenlayer.xyz/operator/0x110af279aaffb0d182697d7fc87653838aa5945e',
+    matomoEventData: [
+      'Contact',
+      'Nethermind operator',
+      'https://app.eigenlayer.xyz/operator/0x110af279aaffb0d182697d7fc87653838aa5945e'
+    ]
   },
   {
     title: 'Legal',
@@ -69,7 +90,12 @@ const mainLinks = [
   },
   {
     title: 'API Docs',
-    href: `${import.meta.env.VITE_API_BASE_URL}/swagger`
+    href: `${import.meta.env.VITE_API_BASE_URL}/swagger`,
+    matomoEventData: [
+      'Contact',
+      'API Docs',
+      `${import.meta.env.VITE_API_BASE_URL}/swagger`
+    ]
   }
 ];
 
@@ -77,11 +103,17 @@ const socialLinks = [
   {
     title: 'Follow us',
     className: 'footer-x',
-    href: 'https://x.com/NethermindEth'
+    href: 'https://x.com/NethermindEth',
+    matomoEventData: ['Social Media', 'X', 'https://x.com/NethermindEth']
   },
   {
     title: 'Join us',
     className: 'footer-discord',
-    href: 'https://discord.com/invite/PaCMRFdvWT'
+    href: 'https://discord.com/invite/PaCMRFdvWT',
+    matomoEventData: [
+      'Social Media',
+      'Discord',
+      'https://discord.com/invite/PaCMRFdvWT'
+    ]
   }
 ];