Merge pull request #331 from canopas/improve-pagespeed-score

Refactor: Mixpanel: event cleanup
canopas · Feb 24, 2023 · 2fa7e0d · 2fa7e0d
2 parents c7afbb1 + 02044b3
commit 2fa7e0d
Show file tree

Hide file tree

Showing 10 changed files with 58 additions and 50 deletions.
diff --git a/vue-frontend/index.html b/vue-frontend/index.html
@@ -14,23 +14,43 @@
 -->
 
 <html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <meta name="viewport" content="width=device-width,initial-scale=1.0" />
-    <!--tele-ports-->
-    <meta name="author" content="canopas" />
-    <!-- deafult browsers -->
-    <link rel="icon" href="/favicon.ico" />
-    <!-- all apple touch devices -->
-    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
-    <!-- modern browsers -->
-    <link rel="icon" href="/favicon.svg" type="image/svg+xml" />
-    <!--preload-links-->
-  </head>
+<head>
+  <meta charset="utf-8" />
+  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+  <meta name="viewport" content="width=device-width,initial-scale=1.0" />
+  <!--tele-ports-->
+  <meta name="author" content="canopas" />
+  <!-- deafult browsers -->
+  <link rel="icon" href="/favicon.ico" />
+  <!-- all apple touch devices -->
+  <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
+  <!-- modern browsers -->
+  <link rel="icon" href="/favicon.svg" type="image/svg+xml" />
+  <!--preload-links-->
+  <!-- Meta Pixel Code -->
+  <script>
+    !function (f, b, e, v, n, t, s) {
+      if (f.fbq) return; n = f.fbq = function () {
+        n.callMethod ?
+          n.callMethod.apply(n, arguments) : n.queue.push(arguments)
+      };
+      if (!f._fbq) f._fbq = n; n.push = n; n.loaded = !0; n.version = '2.0';
+      n.queue = []; t = b.createElement(e); t.async = !0;
+      t.src = v; s = b.getElementsByTagName(e)[0];
+      s.parentNode.insertBefore(t, s)
+    }(window, document, 'script',
+      'https://connect.facebook.net/en_US/fbevents.js');
+    fbq('init', '2456283197868635');
+    fbq('track', 'PageView');
+  </script>
+  <noscript><img height="1" width="1" style="display:none"
+      src="https://www.facebook.com/tr?id=2456283197868635&ev=PageView&noscript=1" /></noscript>
+  <!-- End Meta Pixel Code -->
+</head>
 
-  <body>
-    <!--app-store--><div id="app"><!--app-html--></div>
-    <script type="module" src="/src/entry-client.js"></script>
-  </body>
-</html>
+<body>
+  <!--app-store--><div id="app"><!--app-html--></div>
+  <script type="module" src="/src/entry-client.js"></script>
+</body>
+
+</html>
diff --git a/vue-frontend/src/components/contact/ContactFormFooter.vue b/vue-frontend/src/components/contact/ContactFormFooter.vue
@@ -374,7 +374,7 @@ export default {
       );
     },
     submitForm() {
-      this.mixpanel.track("tap_home_form_submission");
+      this.mixpanel.track("tap_footer_form_submission");
       if (!this.validateForm()) {
         this.disableInput = true;
         this.showLoader = true;

diff --git a/vue-frontend/src/components/error404/index.vue b/vue-frontend/src/components/error404/index.vue
@@ -72,7 +72,7 @@ export default {
   },
   inject: ["mixpanel"],
   mounted() {
-    this.mixpanel.track("view_page_404");
+    this.mixpanel.track("view_404_page");
   },
 };
 </script>
diff --git a/vue-frontend/src/components/home-new/PortfolioPageCTASection.vue b/vue-frontend/src/components/home-new/PortfolioPageCTASection.vue
@@ -41,7 +41,7 @@
           <router-link
             class="tw-flex tw-items-center tw-mx-auto lg:tw-mx-0 tw-w-max tw-rounded-full tw-p-3 tw-text-center tw-font-normal tw-text-[1rem] tw-leading-[1.1875rem] md:tw-text-[1.09375rem] md:tw-leading-[1.3125rem] xl:tw-text-[1.1875rem] xl:tw-leading-[1.4375rem] tw-font-inter-medium !tw-tracking-[0] gradient-btn hover:tw-text-white active:tw-scale-[0.98]"
             to="/contact"
-            @click.native="mixpanel.track('tap_home_portfolio_cta')"
+            @click.native="mixpanel.track('tap_portfolio_page_cta')"
           >
             <span class="tw-text-white tw-font-inter-semibold"
               >Talk to our experts</span

diff --git a/vue-frontend/src/components/jobs/CareerView.vue b/vue-frontend/src/components/jobs/CareerView.vue
@@ -195,15 +195,10 @@ export default {
     expandListItem(id, index) {
       if (this.previousIndex == id && this.openList) {
         this.openList = false;
-
-        if (this.mixpanel.__loaded) {
-          this.mixpanel.track("tap_job_collapse");
-        }
+        this.mixpanel.track("tap_job_collapse");
       } else {
         this.openList = true;
-        if (this.mixpanel.__loaded) {
-          this.mixpanel.track("tap_job_expand");
-        }
+        this.mixpanel.track("tap_job_expand");
       }
 
       this.currentIndex = id;

diff --git a/vue-frontend/src/components/partials/NewFooter.vue b/vue-frontend/src/components/partials/NewFooter.vue
@@ -26,6 +26,7 @@
               <font-awesome-icon
                 class="fab tw-w-[20px] tw-h-[20px] md:tw-w-[32px] md:tw-h-[32px] tw-pt-[5px]"
                 :icon="icon.icon"
+                @click.native="mixpanel.track(icon.event)"
               />
             </a>
           </li>
@@ -67,36 +68,37 @@ export default {
         {
           url: Config.FACEBOOK_URL,
           icon: faFacebookF,
-          event: "tap_home_facebook",
+          event: "tap_footer_facebook",
         },
         {
           url: Config.INSTAGRAM_URL,
           icon: faInstagram,
-          event: "tap_home_instagram",
+          event: "tap_footer_instagram",
         },
         {
           url: Config.TWITTER_URL,
           icon: faTwitter,
-          event: "tap_home_twitter",
+          event: "tap_footer_twitter",
         },
         {
           url: Config.BLOG_URL,
           icon: faMediumM,
-          event: "tap_home_medium",
+          event: "tap_footer_medium",
         },
         {
           url: Config.LINKEDIN_URL,
           icon: faLinkedinIn,
-          event: "tap_home_linkedin",
+          event: "tap_footer_linkedin",
         },
         {
           url: Config.YOUTUBE_URL,
           icon: faYoutube,
-          event: "tap_home_youtube",
+          event: "tap_footer_youtube",
         },
       ],
     };
   },
+  inject: ["mixpanel"],
   components: {
     FontAwesomeIcon,
   },

diff --git a/vue-frontend/src/components/partials/NewHeader.vue b/vue-frontend/src/components/partials/NewHeader.vue
@@ -47,7 +47,7 @@
                 <router-link
                   v-if="!navbar.target"
                   :to="navbar.url"
-                  @click.native="mixpanel.track(event)"
+                  @click.native="mixpanel.track(navbar.event)"
                   :class="[
                     navbar.className
                       ? navbar.className

diff --git a/vue-frontend/src/pages/jobs/[id].vue b/vue-frontend/src/pages/jobs/[id].vue
@@ -148,9 +148,7 @@ export default {
   inject: ["mixpanel"],
   mounted() {
     this.setCareerDetails();
-    if (this.mixpanel.__loaded) {
-      this.mixpanel.track("view_jobs_by_id_page");
-    }
+    this.mixpanel.track("view_jobs_by_id_page");
   },
   methods: {
     ...mapActions(useJobDetailStore, ["loadJob"]),

diff --git a/vue-frontend/src/pages/jobs/apply/[id].vue b/vue-frontend/src/pages/jobs/apply/[id].vue
@@ -448,9 +448,7 @@ export default {
     recaptchaScript.setAttribute("defer", "true");
     document.head.appendChild(recaptchaScript);
     this.setCareerDetails();
-    if (this.mixpanel.__loaded) {
-      this.mixpanel.track("view_page_job_apply");
-    }
+    this.mixpanel.track("view_apply_job_page");
   },
   computed: {
     ...mapState(useJobDetailStore, {
@@ -473,9 +471,7 @@ export default {
           });
         } else {
           this.showErrorMessagePopup = true;
-          if (this.mixpanel.__loaded) {
-            this.mixpanel.track("job_apply_failed");
-          }
+          this.mixpanel.track("job_apply_failed");
         }
       } else {
         this.setMetaProperties();
@@ -593,9 +589,7 @@ export default {
                   this.isLoad = false;
                   this.showLoader = false;
                   this.showSuccessMessagePopup = true;
-                  if (this.mixpanel.__loaded) {
-                    this.mixpanel.track("job_apply_success");
-                  }
+                  this.mixpanel.track("job_apply_success");
                   setTimeout(() => {
                     this.$router.push("/jobs");
                   }, 3500);

diff --git a/vue-frontend/src/pages/portfolio/index.vue b/vue-frontend/src/pages/portfolio/index.vue
@@ -20,7 +20,6 @@
 import Header from "@/components/partials/NewHeader.vue";
 import { useMeta } from "vue-meta";
 import config from "@/config.js";
-import { elementInViewPort } from "@/utils.js";
 import CaseStudy from "@/components/home-new/CaseStudy.vue";
 import UserReview from "@/components/home/UserReview.vue";
 import CTASection from "@/components/home-new/CTASection.vue";
@@ -58,7 +57,7 @@ export default {
   },
   inject: ["mixpanel"],
   mounted() {
-    this.mixpanel.track("view_page_portfolio_list");
+    this.mixpanel.track("view_portfolio_page");
   },
 };
 </script>