Website: add Segment analytics (#20867)

Related to: https://github.com/fleetdm/confidential/issues/7339

Changes:
- Added a script tag for segment
- Added segment tracking for contact form submissions, signups, and swag
requests.

website/assets/.eslintrc

@@ -49,6 +49,7 @@
     "docsearch": true,
     "Chart": true,
     "gtag": true,
+    "analytics": true,
     // ...etc.
     // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
 

website/assets/js/pages/contact.page.js

@@ -86,6 +86,9 @@ parasails.registerPage('contact', {
       if(typeof window.lintrk !== 'undefined') {
         window.lintrk('track', { conversion_id: 18587089 });// eslint-disable-line camelcase
       }
+      if(typeof analytics !== 'undefined'){
+        analytics.track('fleet_website__contact_forms');
+      }
       // Show the success message.
       this.cloudSuccess = true;
 
@@ -98,6 +101,9 @@ parasails.registerPage('contact', {
       if(typeof window.lintrk !== 'undefined') {
         window.lintrk('track', { conversion_id: 18587089 });// eslint-disable-line camelcase
       }
+      if(typeof analytics !== 'undefined'){
+        analytics.track('fleet_website__contact_forms');
+      }
       if(this.formData.numberOfHosts > 700){
         this.goto(`https://calendly.com/fleetdm/talk-to-us?email=${encodeURIComponent(this.formData.emailAddress)}&name=${encodeURIComponent(this.formData.firstName+' '+this.formData.lastName)}`);
       } else {

website/assets/js/pages/customers/new-license.page.js

@@ -39,7 +39,31 @@ parasails.registerPage('new-license', {
   //  ║  ║╠╣ ║╣ ║  ╚╦╝║  ║  ║╣
   //  ╩═╝╩╚  ╚═╝╚═╝ ╩ ╚═╝╩═╝╚═╝
   beforeMount: function() {
-    //…
+    if(window.location.hash) {
+      if(typeof analytics !== 'undefined') {
+        if(window.location.hash === '#signup') {
+          analytics.identify(this.me.id, {
+            email: this.me.emailAddress,
+            firstName: this.me.firstName,
+            lastName: this.me.lastName,
+            company: this.me.organization,
+            primaryBuyingSituation: this.me.primaryBuyingSituation,
+            psychologicalStage: this.me.psychologicalStage,
+          });
+          analytics.track('fleet_website__sign_up');
+        } else if(window.location.hash === '#login') {
+          analytics.identify(this.me.id, {
+            email: this.me.emailAddress,
+            firstName: this.me.firstName,
+            lastName: this.me.lastName,
+            company: this.me.organization,
+            primaryBuyingSituation: this.me.primaryBuyingSituation,
+            psychologicalStage: this.me.psychologicalStage,
+          });
+        }
+      }
+      window.location.hash = '';
+    }
   },
   mounted: async function() {
 

website/assets/js/pages/docs/basic-documentation.page.js

@@ -229,6 +229,9 @@ parasails.registerPage('basic-documentation', {
       if(typeof window.lintrk !== 'undefined') {
         window.lintrk('track', { conversion_id: 18587105 });// eslint-disable-line camelcase
       }
+      if(typeof analytics !== 'undefined'){
+        analytics.track('fleet_website__swag_request');
+      }
       this.goto('https://kqphpqst851.typeform.com/to/ZfA3sOu0');
     },
 

website/assets/js/pages/entrance/login.page.js

@@ -27,7 +27,7 @@ parasails.registerPage('login', {
     showCustomerLogin: true,
     // For redirecting users coming from the "Get your license" link to the license dispenser.
     registerSlug: '/register',
-    pageToRedirectToAfterLogin: '/start',
+    pageToRedirectToAfterLogin: '/start#login',
   },
 
   //  ╦  ╦╔═╗╔═╗╔═╗╦ ╦╔═╗╦  ╔═╗
@@ -41,7 +41,7 @@ parasails.registerPage('login', {
     // If we're redirecting this user to the license dispenser after they log in, modify the link to the /register page and the pageToRedirectToAfterLogin.
     if(window.location.hash && window.location.hash === '#purchaseLicense'){
       this.registerSlug = '/register#purchaseLicense';
-      this.pageToRedirectToAfterLogin = '/new-license';
+      this.pageToRedirectToAfterLogin = '/new-license#login';
       window.location.hash = '';
     }
   },

website/assets/js/pages/entrance/signup.page.js

@@ -26,7 +26,7 @@ parasails.registerPage('signup', {
     showFullForm: false,
     // For redirecting users coming from the "Get your license" link to the license dispenser.
     loginSlug: '/login',
-    pageToRedirectToAfterRegistration: '/start',
+    pageToRedirectToAfterRegistration: '/start#signup',
     primaryBuyingSituation: undefined
   },
 
@@ -37,7 +37,7 @@ parasails.registerPage('signup', {
     // If we're redirecting this user to the license dispenser after they sign up, modify the link to the login page and the pageToRedirectToAfterRegistration
     if(window.location.hash && window.location.hash === '#purchaseLicense'){
       this.loginSlug = '/login#purchaseLicense';
-      this.pageToRedirectToAfterRegistration = '/new-license';
+      this.pageToRedirectToAfterRegistration = '/new-license#signup';
       window.location.hash = '';
     }
   },

website/assets/js/pages/start.page.js

@@ -87,6 +87,31 @@ parasails.registerPage('start', {
     if(this.primaryBuyingSituation && _.isEmpty(this.formData['what-are-you-using-fleet-for'])){
       this.formData['what-are-you-using-fleet-for'] = {primaryBuyingSituation: this.primaryBuyingSituation};
     }
+    if(window.location.hash) {
+      if(typeof analytics !== 'undefined') {
+        if(window.location.hash === '#signup') {
+          analytics.identify(this.me.id, {
+            email: this.me.emailAddress,
+            firstName: this.me.firstName,
+            lastName: this.me.lastName,
+            company: this.me.organization,
+            primaryBuyingSituation: this.me.primaryBuyingSituation,
+            psychologicalStage: this.me.psychologicalStage,
+          });
+          analytics.track('fleet_website__sign_up');
+        } else if(window.location.hash === '#login') {
+          analytics.identify(this.me.id, {
+            email: this.me.emailAddress,
+            firstName: this.me.firstName,
+            lastName: this.me.lastName,
+            company: this.me.organization,
+            primaryBuyingSituation: this.me.primaryBuyingSituation,
+            psychologicalStage: this.me.psychologicalStage,
+          });
+        }
+      }
+      window.location.hash = '';
+    }
   },
   mounted: async function() {
     //…